"use strict";

import React, { memo } from 'react';
import { Platform, StyleSheet, View } from 'react-native';
import { useTheme } from "../theme/use-theme.js";
import { Text } from "../typography/index.js";
import { borderRadius } from "../styles/tokens.js";
import { jsx as _jsx } from "react/jsx-runtime";
const SIZE_CONFIG = {
  sm: {
    minWidth: 18,
    height: 18,
    fontSize: 11,
    paddingHorizontal: 4
  },
  md: {
    minWidth: 22,
    height: 22,
    fontSize: 12,
    paddingHorizontal: 6
  }
};

/**
 * A small keyboard-key chip. Bordered, monospace via the Bloom mono font
 * token, themed for light/dark. Used to surface shortcuts (e.g. `⌘K`,
 * `Esc`) inside menus, command palettes and tooltips.
 */
const KbdComponent = function Kbd({
  children,
  size = 'md',
  style,
  textStyle,
  testID
}) {
  const theme = useTheme();
  const cfg = SIZE_CONFIG[size];
  const monoFamily = Platform.OS === 'web' ? {
    fontFamily: 'var(--bloom-font-mono)'
  } : {
    fontFamily: 'Geist Mono'
  };
  return /*#__PURE__*/_jsx(View, {
    testID: testID,
    style: [styles.container, {
      minWidth: cfg.minWidth,
      height: cfg.height,
      paddingHorizontal: cfg.paddingHorizontal,
      backgroundColor: theme.colors.backgroundSecondary,
      borderColor: theme.colors.border
    }, style],
    children: /*#__PURE__*/_jsx(Text, {
      numberOfLines: 1,
      style: [monoFamily, {
        fontSize: cfg.fontSize,
        lineHeight: cfg.height,
        color: theme.colors.textSecondary,
        textAlign: 'center'
      }, textStyle],
      children: children
    })
  });
};
const styles = StyleSheet.create({
  container: {
    borderWidth: 1,
    borderRadius: borderRadius.xs,
    alignItems: 'center',
    justifyContent: 'center'
  }
});
export const Kbd = /*#__PURE__*/memo(KbdComponent);
Kbd.displayName = 'Kbd';
//# sourceMappingURL=Kbd.js.map