@bacon-pos/ui 0.5.0 → 0.6.0

package/lib/module/components/Select/Select.js

@@ -0,0 +1,244 @@
+"use strict";
+
+import { useState } from 'react';
+import { Pressable, View } from 'react-native';
+import { useTheme } from "../../theme/index.js";
+import { Dropdown } from "../Dropdown/Dropdown.js";
+import { Icon } from "../Icon/Icon.js";
+import { Menu } from "../Menu/Menu.js";
+import { Text } from "../Text/Text.js";
+
+/** Width of the focus ring, in px (Figma "Focus" effect: spread 6). */
+import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
+const FOCUS_RING_SPREAD = 6;
+const FOCUS_RING_ALPHA = 0.15;
+
+/** Convert a `#RRGGBB` (or `#RGB`) token to an `rgba()` string at the given alpha. */
+function hexToRgba(hex, alpha) {
+  const h = hex.replace('#', '');
+  const full = h.length === 3 ? h.replace(/./g, c => c + c) : h;
+  const r = parseInt(full.slice(0, 2), 16);
+  const g = parseInt(full.slice(2, 4), 16);
+  const b = parseInt(full.slice(4, 6), 16);
+  return `rgba(${r}, ${g}, ${b}, ${alpha})`;
+}
+const SIZES = {
+  md: {
+    height: 48,
+    gap: 8,
+    iconSize: 20,
+    textVariant: 'bodyMedium'
+  },
+  lg: {
+    height: 58,
+    gap: 10,
+    iconSize: 24,
+    textVariant: 'bodyLarge'
+  }
+};
+
+/** An option in a `Select`. */
+
+/**
+ * Select — a form field that opens a `Dropdown` of options. The field mirrors
+ * `Input` (pill, label, helper/error, lime focus ring, red error ring); it is
+ * not editable — pressing it opens the menu, which matches the field width. The
+ * current option is marked with a check. With `multiple`, rows become checkboxes,
+ * the value is an array, and the menu stays open while picking.
+ */
+export function Select({
+  options,
+  multiple = false,
+  value,
+  defaultValue,
+  onChange,
+  label,
+  helperText,
+  error,
+  placeholder = 'Select option',
+  leftIcon,
+  size = 'lg',
+  width,
+  fullWidth = true,
+  disabled = false,
+  renderValue,
+  matchTriggerWidth = true,
+  menuWidth,
+  maxHeight,
+  anchorOrigin = {
+    vertical: 'bottom',
+    horizontal: 'left'
+  },
+  menuOrigin = {
+    vertical: 'top',
+    horizontal: 'left'
+  },
+  offset = 8,
+  autoFit = true,
+  insets,
+  closeOnSelect,
+  style
+}) {
+  const theme = useTheme();
+  const sizeConfig = SIZES[size];
+  const isControlled = value !== undefined;
+  const [internal, setInternal] = useState(defaultValue ?? (multiple ? [] : undefined));
+  const current = isControlled ? value : internal;
+  const selectedKeys = multiple ? current ?? [] : current != null ? [current] : [];
+  const commit = next => {
+    if (!isControlled) setInternal(next);
+    onChange?.(next);
+  };
+  const selectSingle = key => commit(key);
+  const toggleMulti = key => {
+    const set = new Set(selectedKeys);
+    if (set.has(key)) set.delete(key);else set.add(key);
+    commit([...set]);
+  };
+  const selectedOptions = options.filter(o => selectedKeys.includes(o.key));
+  const isEmpty = selectedOptions.length === 0;
+  const displayText = renderValue ? renderValue(selectedOptions) : isEmpty ? placeholder : selectedOptions.map(o => o.label).join(', ');
+  const hasError = Boolean(error);
+  const message = typeof error === 'string' ? error : helperText;
+  const rows = options.map(o => ({
+    key: o.key,
+    label: o.label,
+    disabled: o.disabled,
+    leading: o.icon ? {
+      kind: 'icon',
+      name: o.icon
+    } : undefined,
+    trailing: multiple ? {
+      kind: 'checkbox',
+      checked: selectedKeys.includes(o.key),
+      onChange: () => toggleMulti(o.key)
+    } : selectedKeys.includes(o.key) ? {
+      kind: 'icon',
+      name: 'check',
+      color: theme.colors.feedback.success
+    } : undefined
+  }));
+  const shouldClose = closeOnSelect ?? !multiple;
+  const iconBox = {
+    width: sizeConfig.iconSize,
+    height: sizeConfig.iconSize,
+    alignItems: 'center',
+    justifyContent: 'center'
+  };
+  const containerWidth = width != null ? {
+    width,
+    alignSelf: 'flex-start'
+  } : fullWidth ? {
+    alignSelf: 'stretch'
+  } : {
+    alignSelf: 'flex-start'
+  };
+  return /*#__PURE__*/_jsxs(View, {
+    style: [containerWidth, style],
+    children: [label ? /*#__PURE__*/_jsx(Text, {
+      variant: "bodySmall",
+      color: "secondary",
+      style: {
+        marginBottom: 4,
+        marginLeft: 8
+      },
+      children: label
+    }) : null, /*#__PURE__*/_jsx(Menu, {
+      anchorOrigin: anchorOrigin,
+      menuOrigin: menuOrigin,
+      offset: offset,
+      autoFit: autoFit,
+      insets: insets,
+      triggerStyle: {
+        alignSelf: 'stretch'
+      },
+      renderTrigger: ({
+        open,
+        toggle
+      }) => {
+        const showRing = open && !disabled;
+        const borderColor = disabled ? theme.colors.disabled.border : hasError ? theme.colors.feedback.error : open ? theme.colors.border.focus : theme.colors.border.default;
+        const ringColor = hasError ? theme.colors.feedback.error : theme.colors.border.focus;
+        const boxShadow = showRing ? [{
+          offsetX: 0,
+          offsetY: 0,
+          blurRadius: 0,
+          spreadDistance: FOCUS_RING_SPREAD,
+          color: hexToRgba(ringColor, FOCUS_RING_ALPHA)
+        }] : undefined;
+        return /*#__PURE__*/_jsxs(Pressable, {
+          onPress: toggle,
+          disabled: disabled,
+          accessibilityRole: "button",
+          accessibilityState: {
+            expanded: open,
+            disabled
+          },
+          accessibilityLabel: label ?? placeholder,
+          style: {
+            flexDirection: 'row',
+            alignItems: 'center',
+            gap: sizeConfig.gap,
+            height: sizeConfig.height,
+            paddingHorizontal: 16,
+            borderWidth: 1,
+            borderColor,
+            borderRadius: theme.radii.pill,
+            backgroundColor: disabled ? theme.colors.disabled.background : theme.colors.background.default,
+            boxShadow
+          },
+          children: [leftIcon ? /*#__PURE__*/_jsx(View, {
+            style: iconBox,
+            children: /*#__PURE__*/_jsx(Icon, {
+              name: leftIcon,
+              size: sizeConfig.iconSize,
+              color: disabled ? theme.colors.disabled.foreground : 'secondary'
+            })
+          }) : null, /*#__PURE__*/_jsx(Text, {
+            variant: sizeConfig.textVariant,
+            color: disabled ? 'tertiary' : isEmpty ? 'tertiary' : 'primary',
+            numberOfLines: 1,
+            style: {
+              flex: 1,
+              minWidth: 0
+            },
+            children: displayText
+          }), /*#__PURE__*/_jsx(View, {
+            style: [iconBox, {
+              transform: [{
+                rotate: open ? '180deg' : '0deg'
+              }]
+            }],
+            children: /*#__PURE__*/_jsx(Icon, {
+              name: "chevron-down",
+              size: sizeConfig.iconSize,
+              color: disabled ? theme.colors.disabled.foreground : 'secondary'
+            })
+          })]
+        });
+      },
+      children: ({
+        close,
+        triggerWidth,
+        maxHeight: autoMaxHeight
+      }) => /*#__PURE__*/_jsx(Dropdown, {
+        options: rows,
+        width: matchTriggerWidth ? triggerWidth : menuWidth,
+        maxHeight: maxHeight ?? autoMaxHeight,
+        onSelect: multiple ? undefined : key => {
+          selectSingle(key);
+          if (shouldClose) close();
+        }
+      })
+    }), message ? /*#__PURE__*/_jsx(Text, {
+      variant: "bodySmall",
+      color: hasError ? theme.colors.feedback.error : 'tertiary',
+      style: {
+        marginTop: 8,
+        marginLeft: 8
+      },
+      children: message
+    }) : null]
+  });
+}
+//# sourceMappingURL=Select.js.map

package/lib/module/components/Select/Select.js.map

@@ -0,0 +1 @@
+{"version":3,"names":["useState","Pressable","View","useTheme","Dropdown","Icon","Menu","Text","jsx","_jsx","jsxs","_jsxs","FOCUS_RING_SPREAD","FOCUS_RING_ALPHA","hexToRgba","hex","alpha","h","replace","full","length","c","r","parseInt","slice","g","b","SIZES","md","height","gap","iconSize","textVariant","lg","Select","options","multiple","value","defaultValue","onChange","label","helperText","error","placeholder","leftIcon","size","width","fullWidth","disabled","renderValue","matchTriggerWidth","menuWidth","maxHeight","anchorOrigin","vertical","horizontal","menuOrigin","offset","autoFit","insets","closeOnSelect","style","theme","sizeConfig","isControlled","undefined","internal","setInternal","current","selectedKeys","commit","next","selectSingle","key","toggleMulti","set","Set","has","delete","add","selectedOptions","filter","o","includes","isEmpty","displayText","map","join","hasError","Boolean","message","rows","leading","icon","kind","name","trailing","checked","color","colors","feedback","success","shouldClose","iconBox","alignItems","justifyContent","containerWidth","alignSelf","children","variant","marginBottom","marginLeft","triggerStyle","renderTrigger","open","toggle","showRing","borderColor","border","focus","default","ringColor","boxShadow","offsetX","offsetY","blurRadius","spreadDistance","onPress","accessibilityRole","accessibilityState","expanded","accessibilityLabel","flexDirection","paddingHorizontal","borderWidth","borderRadius","radii","pill","backgroundColor","background","foreground","numberOfLines","flex","minWidth","transform","rotate","close","triggerWidth","autoMaxHeight","onSelect","marginTop"],"sourceRoot":"..\\..\\..\\..\\src","sources":["components/Select/Select.tsx"],"mappings":"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","ignoreList":[]}

package/lib/module/components/Select/Select.stories.js

@@ -0,0 +1,217 @@
+"use strict";
+
+import { useState } from 'react';
+import { View } from 'react-native';
+import { Select } from "./Select.js";
+import { Button } from "../Button/Button.js";
+import { Dialog } from "../Dialog/Dialog.js";
+import { Text } from "../Text/Text.js";
+import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
+const meta = {
+  title: 'Components/Select',
+  component: Select
+};
+export default meta;
+const OPTIONS = [{
+  key: 'dine-in',
+  label: 'Dine in',
+  icon: 'dish'
+}, {
+  key: 'take-out',
+  label: 'Take out',
+  icon: 'shopping-bag'
+}, {
+  key: 'delivery',
+  label: 'Delivery',
+  icon: 'truck-delivery'
+}, {
+  key: 'pickup',
+  label: 'Pickup',
+  icon: 'shopping-bag'
+}];
+function Frame({
+  children
+}) {
+  // Height gives the open menu room in the Storybook canvas.
+  return /*#__PURE__*/_jsx(View, {
+    style: {
+      padding: 24,
+      width: 360,
+      height: 420
+    },
+    children: children
+  });
+}
+
+/** Default field (matches Figma "Default"). */
+export const Default = {
+  render: () => /*#__PURE__*/_jsx(Frame, {
+    children: /*#__PURE__*/_jsx(Select, {
+      options: OPTIONS,
+      label: "Label",
+      helperText: "Helper text",
+      leftIcon: "shopping-bag",
+      onChange: () => {}
+    })
+  })
+};
+
+/** Single select — the current option is marked with a check. */
+export const SingleSelect = {
+  render: () => {
+    const [value, setValue] = useState('dine-in');
+    return /*#__PURE__*/_jsxs(Frame, {
+      children: [/*#__PURE__*/_jsx(Select, {
+        options: OPTIONS,
+        label: "Order type",
+        helperText: "Helper text",
+        leftIcon: "shopping-bag",
+        value: value,
+        onChange: setValue
+      }), /*#__PURE__*/_jsxs(Text, {
+        variant: "caption",
+        color: "secondary",
+        style: {
+          marginTop: 12
+        },
+        children: ["value: ", String(value)]
+      })]
+    });
+  }
+};
+
+/** Multi select — rows become checkboxes; the menu stays open while picking. */
+export const MultiSelect = {
+  render: () => {
+    const [value, setValue] = useState(['dine-in', 'delivery']);
+    return /*#__PURE__*/_jsxs(Frame, {
+      children: [/*#__PURE__*/_jsx(Select, {
+        options: OPTIONS,
+        multiple: true,
+        label: "Order types",
+        helperText: "Choose one or more",
+        value: value,
+        onChange: setValue
+      }), /*#__PURE__*/_jsxs(Text, {
+        variant: "caption",
+        color: "secondary",
+        style: {
+          marginTop: 12
+        },
+        children: ["value: ", Array.isArray(value) ? value.join(', ') : value]
+      })]
+    });
+  }
+};
+
+/** Error state — red border, red ring on open, red helper text. */
+export const Error = {
+  render: () => /*#__PURE__*/_jsx(Frame, {
+    children: /*#__PURE__*/_jsx(Select, {
+      options: OPTIONS,
+      label: "Order type",
+      error: "Please choose an option",
+      leftIcon: "shopping-bag",
+      onChange: () => {}
+    })
+  })
+};
+
+/** Disabled. */
+export const Disabled = {
+  render: () => /*#__PURE__*/_jsx(Frame, {
+    children: /*#__PURE__*/_jsx(Select, {
+      options: OPTIONS,
+      label: "Label",
+      helperText: "Helper text",
+      leftIcon: "shopping-bag",
+      disabled: true,
+      defaultValue: "dine-in"
+    })
+  })
+};
+
+/** Long list — the menu scrolls past maxHeight. */
+export const Scrollable = {
+  render: () => {
+    const many = Array.from({
+      length: 20
+    }).map((_, i) => ({
+      key: String(i),
+      label: `Option ${i + 1}`
+    }));
+    return /*#__PURE__*/_jsx(Frame, {
+      children: /*#__PURE__*/_jsx(Select, {
+        options: many,
+        label: "Pick one",
+        maxHeight: 260,
+        onChange: () => {}
+      })
+    });
+  }
+};
+
+/** Fixed menu width instead of matching the field. */
+export const FixedMenuWidth = {
+  render: () => /*#__PURE__*/_jsx(Frame, {
+    children: /*#__PURE__*/_jsx(Select, {
+      options: OPTIONS,
+      label: "Order type",
+      matchTriggerWidth: false,
+      menuWidth: 300,
+      onChange: () => {}
+    })
+  })
+};
+
+/** Fixed field width (default is full width, the Figma behavior). */
+export const CustomWidth = {
+  render: () => /*#__PURE__*/_jsx(Frame, {
+    children: /*#__PURE__*/_jsx(Select, {
+      options: OPTIONS,
+      label: "Order type",
+      width: 260,
+      leftIcon: "shopping-bag",
+      onChange: () => {}
+    })
+  })
+};
+
+/**
+ * Inside a Dialog — the two modals coexist: the menu positions over the dialog,
+ * tapping outside the menu closes only the menu (not the dialog), and back closes
+ * the menu first.
+ */
+export const InsideDialog = {
+  render: () => {
+    const [open, setOpen] = useState(false);
+    const [value, setValue] = useState('dine-in');
+    return /*#__PURE__*/_jsxs(View, {
+      style: {
+        padding: 24
+      },
+      children: [/*#__PURE__*/_jsx(Button, {
+        label: "Open dialog",
+        onPress: () => setOpen(true)
+      }), /*#__PURE__*/_jsx(Dialog, {
+        visible: open,
+        onClose: () => setOpen(false),
+        title: "Order details",
+        subtitle: "Pick the order type",
+        cancel: {},
+        actions: [{
+          label: 'Save',
+          onPress: () => setOpen(false)
+        }],
+        children: /*#__PURE__*/_jsx(Select, {
+          options: OPTIONS,
+          label: "Order type",
+          leftIcon: "shopping-bag",
+          value: value,
+          onChange: setValue
+        })
+      })]
+    });
+  }
+};
+//# sourceMappingURL=Select.stories.js.map

package/lib/module/components/Select/Select.stories.js.map

@@ -0,0 +1 @@
+{"version":3,"names":["useState","View","Select","Button","Dialog","Text","jsx","_jsx","jsxs","_jsxs","meta","title","component","OPTIONS","key","label","icon","Frame","children","style","padding","width","height","Default","render","options","helperText","leftIcon","onChange","SingleSelect","value","setValue","variant","color","marginTop","String","MultiSelect","multiple","Array","isArray","join","Error","error","Disabled","disabled","defaultValue","Scrollable","many","from","length","map","_","i","maxHeight","FixedMenuWidth","matchTriggerWidth","menuWidth","CustomWidth","InsideDialog","open","setOpen","onPress","visible","onClose","subtitle","cancel","actions"],"sourceRoot":"..\\..\\..\\..\\src","sources":["components/Select/Select.stories.tsx"],"mappings":"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","ignoreList":[]}

package/lib/module/components/Select/Select.test.js

@@ -0,0 +1,165 @@
+"use strict";
+
+import { useState } from 'react';
+import { render, fireEvent, screen } from '@testing-library/react-native';
+import { ThemeProvider } from "../../theme/index.js";
+import { Select } from "./Select.js";
+import { Dialog } from "../Dialog/Dialog.js";
+import { jsx as _jsx } from "react/jsx-runtime";
+function wrap(ui) {
+  return render(/*#__PURE__*/_jsx(ThemeProvider, {
+    children: ui
+  }));
+}
+const OPTIONS = [{
+  key: 'dine-in',
+  label: 'Dine in'
+}, {
+  key: 'take-out',
+  label: 'Take out'
+}, {
+  key: 'delivery',
+  label: 'Delivery'
+}];
+describe('Select (single)', () => {
+  it('shows the placeholder when empty', () => {
+    wrap(/*#__PURE__*/_jsx(Select, {
+      options: OPTIONS,
+      placeholder: "Select option"
+    }));
+    expect(screen.getByText('Select option')).toBeTruthy();
+  });
+  it('shows the selected label', () => {
+    wrap(/*#__PURE__*/_jsx(Select, {
+      options: OPTIONS,
+      value: "take-out"
+    }));
+    expect(screen.getByText('Take out')).toBeTruthy();
+  });
+  it('opens, selects an option, calls onChange and closes', () => {
+    const onChange = jest.fn();
+    wrap(/*#__PURE__*/_jsx(Select, {
+      options: OPTIONS,
+      placeholder: "Select option",
+      onChange: onChange
+    }));
+    fireEvent.press(screen.getByText('Select option'));
+    fireEvent.press(screen.getByText('Delivery'));
+    expect(onChange).toHaveBeenCalledWith('delivery');
+    // Menu closed → the other option is gone.
+    expect(screen.queryByText('Take out')).toBeNull();
+  });
+  it('renders the error message', () => {
+    wrap(/*#__PURE__*/_jsx(Select, {
+      options: OPTIONS,
+      error: "Required"
+    }));
+    expect(screen.getByText('Required')).toBeTruthy();
+  });
+  it('does not open when disabled', () => {
+    wrap(/*#__PURE__*/_jsx(Select, {
+      options: OPTIONS,
+      placeholder: "Select option",
+      disabled: true
+    }));
+    fireEvent.press(screen.getByText('Select option'));
+    expect(screen.queryByText('Delivery')).toBeNull();
+  });
+});
+describe('Select (multiple)', () => {
+  function MultiControlled() {
+    const [value, setValue] = useState([]);
+    return /*#__PURE__*/_jsx(Select, {
+      options: OPTIONS,
+      multiple: true,
+      value: value,
+      onChange: setValue,
+      placeholder: "Pick"
+    });
+  }
+  it('adds keys to the array and stays open', () => {
+    const onChange = jest.fn();
+    wrap(/*#__PURE__*/_jsx(Select, {
+      options: OPTIONS,
+      multiple: true,
+      value: [],
+      onChange: onChange,
+      placeholder: "Pick"
+    }));
+    fireEvent.press(screen.getByText('Pick'));
+    fireEvent.press(screen.getByText('Dine in'));
+    expect(onChange).toHaveBeenCalledWith(['dine-in']);
+    // Still open — other rows remain visible.
+    expect(screen.getByText('Delivery')).toBeTruthy();
+  });
+  it('toggles selected keys off', () => {
+    const onChange = jest.fn();
+    wrap(/*#__PURE__*/_jsx(Select, {
+      options: OPTIONS,
+      multiple: true,
+      value: ['dine-in'],
+      onChange: onChange,
+      placeholder: "Pick"
+    }));
+    // Before opening, only the trigger shows "Dine in".
+    fireEvent.press(screen.getByText('Dine in')); // opens the menu
+    // Now there are two: trigger + row. Press the row (last).
+    const matches = screen.getAllByText('Dine in');
+    fireEvent.press(matches[matches.length - 1]);
+    expect(onChange).toHaveBeenCalledWith([]);
+  });
+  it('joins multiple labels in the trigger', () => {
+    wrap(/*#__PURE__*/_jsx(Select, {
+      options: OPTIONS,
+      multiple: true,
+      value: ['dine-in', 'delivery']
+    }));
+    expect(screen.getByText('Dine in, Delivery')).toBeTruthy();
+  });
+  it('reflects new picks (controlled loop)', () => {
+    wrap(/*#__PURE__*/_jsx(MultiControlled, {}));
+    fireEvent.press(screen.getByText('Pick'));
+    fireEvent.press(screen.getByText('Take out'));
+    // Menu stays open, so the label now appears on both the trigger and the row.
+    expect(screen.getAllByText('Take out').length).toBe(2);
+  });
+});
+describe('Select inside Dialog', () => {
+  function DialogWithSelect() {
+    const [value, setValue] = useState('dine-in');
+    return /*#__PURE__*/_jsx(Dialog, {
+      visible: true,
+      onClose: () => {},
+      title: "Order",
+      actions: [{
+        label: 'Save'
+      }],
+      children: /*#__PURE__*/_jsx(Select, {
+        options: OPTIONS,
+        label: "Order type",
+        value: value,
+        onChange: setValue
+      })
+    });
+  }
+  it('opens the select menu over the dialog without closing it', () => {
+    wrap(/*#__PURE__*/_jsx(DialogWithSelect, {}));
+    // Dialog is visible.
+    expect(screen.getByText('Order')).toBeTruthy();
+    // Open the select (trigger shows "Dine in").
+    fireEvent.press(screen.getByText('Dine in'));
+    // Menu rows appear...
+    expect(screen.getByText('Delivery')).toBeTruthy();
+    // ...and the dialog is still there.
+    expect(screen.getByText('Order')).toBeTruthy();
+  });
+  it('selecting in the menu updates the field and keeps the dialog open', () => {
+    wrap(/*#__PURE__*/_jsx(DialogWithSelect, {}));
+    fireEvent.press(screen.getByText('Dine in'));
+    fireEvent.press(screen.getByText('Delivery'));
+    // Field now shows Delivery; dialog title still present.
+    expect(screen.getByText('Delivery')).toBeTruthy();
+    expect(screen.getByText('Order')).toBeTruthy();
+  });
+});
+//# sourceMappingURL=Select.test.js.map

package/lib/module/components/Select/Select.test.js.map

@@ -0,0 +1 @@
+{"version":3,"names":["useState","render","fireEvent","screen","ThemeProvider","Select","Dialog","jsx","_jsx","wrap","ui","children","OPTIONS","key","label","describe","it","options","placeholder","expect","getByText","toBeTruthy","value","onChange","jest","fn","press","toHaveBeenCalledWith","queryByText","toBeNull","error","disabled","MultiControlled","setValue","multiple","matches","getAllByText","length","toBe","DialogWithSelect","visible","onClose","title","actions"],"sourceRoot":"..\\..\\..\\..\\src","sources":["components/Select/Select.test.tsx"],"mappings":"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","ignoreList":[]}

package/lib/module/components/Select/index.js

@@ -0,0 +1,4 @@
+"use strict";
+
+export { Select } from "./Select.js";
+//# sourceMappingURL=index.js.map

package/lib/module/components/Select/index.js.map

@@ -0,0 +1 @@
+{"version":3,"names":["Select"],"sourceRoot":"..\\..\\..\\..\\src","sources":["components/Select/index.ts"],"mappings":";;AAAA,SAASA,MAAM,QAAQ,aAAU","ignoreList":[]}