@kommo-crm/crm-react-ui-kit 1.1.1-beta.3 → 1.1.1-beta.4

package/dist/components/Select/components/Item/Item.js

@@ -1,26 +1,46 @@
-import React, { forwardRef, useCallback } from 'react';
-import cx from 'classnames';
-import { useThemeClassName } from 'src/hooks/useThemeClassName';
-import { noop } from 'src/utils';
-import { useSelectContext } from '../../Select.context';
-import Option from '../Option/Option';
-import s from './Item.module.css';
-const DISPLAY_NAME = 'Select.Item';
-export const Item = forwardRef((props, ref) => {
-    const { item, children, index, className, theme, ...rest } = props;
-    const themeClassName = useThemeClassName(theme);
-    const { value: selected, onChange = noop, onHoveredIndexChange, hoveredIndex, } = useSelectContext(DISPLAY_NAME);
-    const { option, value } = item;
-    const handleClick = useCallback((e) => {
-        e.preventDefault();
-        onHoveredIndexChange(index);
-        onChange(item);
-    }, [onChange, item]);
-    const isSelected = selected?.value === value;
-    const isHovered = hoveredIndex === index;
-    return (React.createElement("li", { ...rest, ref: ref, className: cx(s.item, {
-            [s.selected]: isSelected,
-            [s.hovered]: isHovered,
-        }, className, themeClassName), onClick: handleClick }, children ? children : React.createElement(Option, null, option)));
+import { jsx as r } from "react/jsx-runtime";
+import { forwardRef as b, useCallback as w } from "react";
+import { c as y } from "../../../../index-L8X2o7IH.mjs";
+import { useThemeClassName as S } from "../../../../hooks/useThemeClassName/useThemeClassName.js";
+import { noop as k } from "../../../../utils/noop/noop.js";
+import { useSelectContext as g } from "../../Select.context.js";
+import A from "../Option/Option.js";
+import '../../../../assets/Item.css';const D = "_item_mywsb_1", H = "_selected_mywsb_24", j = "_hovered_mywsb_30", t = {
+  item: D,
+  selected: H,
+  hovered: j
+}, c = "Select.Item", E = b((i, l) => {
+  const { item: e, children: s, index: m, className: a, theme: d, ...h } = i, p = S(d), {
+    value: o,
+    onChange: n = k,
+    onHoveredIndexChange: v,
+    hoveredIndex: f
+  } = g(c), { option: _, value: u } = e, C = w(
+    (I) => {
+      I.preventDefault(), v(m), n(e);
+    },
+    [n, e]
+  ), x = (o == null ? void 0 : o.value) === u, N = f === m;
+  return /* @__PURE__ */ r(
+    "li",
+    {
+      ...h,
+      ref: l,
+      className: y(
+        t.item,
+        {
+          [t.selected]: x,
+          [t.hovered]: N
+        },
+        a,
+        p
+      ),
+      onClick: C,
+      children: s || /* @__PURE__ */ r(A, { children: _ })
+    }
+  );
 });
-Item.displayName = DISPLAY_NAME;
+E.displayName = c;
+export {
+  E as Item
+};

package/dist/components/Select/components/Item/Item.props.js

@@ -1 +1 @@
-export {};
+

package/dist/components/Select/components/Item/Item.theme.js

@@ -1,10 +1,13 @@
-export const SelectItemTheme = {
-    '--crm-ui-kit-select-item-padding': '7px 6px 7px 22px',
-    '--crm-ui-kit-select-item-margin': '0px -11px 0px 0px',
-    '--crm-ui-kit-select-item-font-size': 'var(--crm-ui-kit-base-font-size)',
-    '--crm-ui-kit-select-item-font-weight': '400',
-    '--crm-ui-kit-select-item-selected-background-color': 'var(--crm-ui-kit-palette-background-default)',
-    '--crm-ui-kit-select-item-selected-background': 'var(--crm-ui-kit-icon-check-mark) 8px 14px no-repeat',
-    '--crm-ui-kit-select-item-hovered-background-color': 'var(--crm-ui-kit-palette-background-default)',
-    '--crm-ui-kit-select-item-hover-background-color': 'var(--crm-ui-kit-palette-background-default)',
+const e = {
+  "--crm-ui-kit-select-item-padding": "7px 6px 7px 22px",
+  "--crm-ui-kit-select-item-margin": "0px -11px 0px 0px",
+  "--crm-ui-kit-select-item-font-size": "var(--crm-ui-kit-base-font-size)",
+  "--crm-ui-kit-select-item-font-weight": "400",
+  "--crm-ui-kit-select-item-selected-background-color": "var(--crm-ui-kit-palette-background-default)",
+  "--crm-ui-kit-select-item-selected-background": "var(--crm-ui-kit-icon-check-mark) 8px 14px no-repeat",
+  "--crm-ui-kit-select-item-hovered-background-color": "var(--crm-ui-kit-palette-background-default)",
+  "--crm-ui-kit-select-item-hover-background-color": "var(--crm-ui-kit-palette-background-default)"
+};
+export {
+  e as SelectItemTheme
 };

package/dist/components/Select/components/Item/index.js

@@ -1,2 +1,6 @@
-export { Item } from './Item';
-export { SelectItemTheme } from './Item.theme';
+import { Item as t } from "./Item.js";
+import { SelectItemTheme as r } from "./Item.theme.js";
+export {
+  t as Item,
+  r as SelectItemTheme
+};

package/dist/components/Select/components/List/List.d.ts

@@ -1,4 +1,4 @@
-import React from 'react';
+import { default as React } from 'react';
 import { ListPortalProps } from './List.props';
-export declare const List: React.ForwardRefExoticComponent<import("src/components/List").ListProps & ListPortalProps & React.RefAttributes<HTMLUListElement>>;
+export declare const List: React.ForwardRefExoticComponent<import('../../../List').ListProps & ListPortalProps & React.RefAttributes<HTMLUListElement>>;
 //# sourceMappingURL=List.d.ts.map

package/dist/components/Select/components/List/List.js

@@ -1,57 +1,65 @@
-import React, { forwardRef, useCallback, useEffect, useMemo, useRef, } from 'react';
-import { useOnOutsideClick } from '@kommo-crm/react-hooks';
-import { Portal } from 'src/components/Portal';
-import { List as BaseList } from 'src/components/List';
-import { mergeRefs } from 'src/lib/utils';
-import { noop } from 'src/utils';
-import { useSelectContext } from '../../Select.context';
-const DISPLAY_NAME = 'Select.List';
-const ListPortal = (props) => {
-    const { container, children } = props;
-    return container ? (React.createElement(Portal, { container: container }, children)) : (children);
-};
-export const List = forwardRef((props, ref) => {
-    const { container, children, theme, className } = props;
-    const { isOpened, onOpen, onHoveredIndexChange, onChange = noop, hoveredIndex, value, } = useSelectContext(DISPLAY_NAME);
-    const { items, itemsMap } = useMemo(() => {
-        const map = {};
-        const itemsChildren = React.Children.toArray(children).map((child, index) => {
-            if (React.isValidElement(child)) {
-                map[child.props.item.value] = index;
-                return { ...child.props.item };
-            }
-            return {};
-        });
-        return { items: itemsChildren, itemsMap: map };
-    }, [children]);
-    const listRef = useRef(null);
-    const handleOutsideClick = useCallback(() => {
-        if (isOpened) {
-            onOpen(false);
-        }
-    }, [isOpened]);
-    useOnOutsideClick({
-        ref: listRef,
-        handler: handleOutsideClick,
-    });
-    const handleHoveredIndexChange = (index) => {
-        onHoveredIndexChange(index);
-    };
-    const handleListToggle = useCallback((toggle) => {
-        onOpen(toggle);
-    }, [onOpen]);
-    const handleItemSelect = useCallback((index) => {
-        onChange(items[index]);
-    }, [onChange, items]);
-    useEffect(() => {
-        /**
-         * When opening the list, we transfer focus to it.
-         */
-        if (isOpened) {
-            listRef.current?.focus();
-        }
-    }, [isOpened]);
-    return (React.createElement(ListPortal, { container: container },
-        React.createElement(BaseList, { className: className, ref: mergeRefs(listRef, ref), isOpened: isOpened, theme: theme, onHoveredIndexChange: handleHoveredIndexChange, onToggle: handleListToggle, onSelect: handleItemSelect, hoveredIndex: value ? itemsMap[value.value] : hoveredIndex }, children)));
+import { jsx as c } from "react/jsx-runtime";
+import p, { forwardRef as k, useMemo as A, useRef as E, useCallback as m, useEffect as H } from "react";
+import { u as N, L as P } from "../../../../List-AX0nB9Ji.mjs";
+import { Portal as _ } from "../../../Portal/Portal.js";
+import { mergeRefs as y } from "../../../../lib/utils.js";
+import { noop as T } from "../../../../utils/noop/noop.js";
+import { useSelectContext as b } from "../../Select.context.js";
+const h = "Select.List", j = (r) => {
+  const { container: n, children: o } = r;
+  return n ? /* @__PURE__ */ c(_, { container: n, children: o }) : o;
+}, w = k((r, n) => {
+  const { container: o, children: s, theme: C, className: g } = r, {
+    isOpened: t,
+    onOpen: i,
+    onHoveredIndexChange: v,
+    onChange: d = T,
+    hoveredIndex: x,
+    value: f
+  } = b(h), { items: u, itemsMap: I } = A(() => {
+    const e = {};
+    return { items: p.Children.toArray(s).map(
+      (l, M) => p.isValidElement(l) ? (e[l.props.item.value] = M, { ...l.props.item }) : {}
+    ), itemsMap: e };
+  }, [s]), a = E(null), L = m(() => {
+    t && i(!1);
+  }, [t]);
+  N({
+    ref: a,
+    handler: L
+  });
+  const O = (e) => {
+    v(e);
+  }, R = m(
+    (e) => {
+      i(e);
+    },
+    [i]
+  ), S = m(
+    (e) => {
+      d(u[e]);
+    },
+    [d, u]
+  );
+  return H(() => {
+    var e;
+    t && ((e = a.current) == null || e.focus());
+  }, [t]), /* @__PURE__ */ c(j, { container: o, children: /* @__PURE__ */ c(
+    P,
+    {
+      className: g,
+      ref: y(a, n),
+      isOpened: t,
+      theme: C,
+      onHoveredIndexChange: O,
+      onToggle: R,
+      onSelect: S,
+      hoveredIndex: f ? I[f.value] : x,
+      children: s
+    }
+  ) });
 });
-List.displayName = DISPLAY_NAME;
+w.displayName = h;
+export {
+  w as List
+};

package/dist/components/Select/components/List/List.props.d.ts

@@ -1,5 +1,5 @@
 import { ReactElement } from 'react';
-import { ListProps as BaseListProps } from 'src/components/List';
+import { ListProps as BaseListProps } from '../../../List';
 export type ListPortalProps = {
     /**
      * Select List.

package/dist/components/Select/components/List/List.props.js

@@ -1 +1 @@
-export {};
+

package/dist/components/Select/components/List/index.js

@@ -1 +1,4 @@
-export { List } from './List';
+import { List as t } from "./List.js";
+export {
+  t as List
+};

package/dist/components/Select/components/Option/Option.d.ts

@@ -1,4 +1,4 @@
-import React from 'react';
+import { default as React } from 'react';
 import { OptionProps } from './Option.props';
 declare const Option: React.ForwardRefExoticComponent<OptionProps & React.RefAttributes<HTMLSpanElement>>;
 export default Option;

package/dist/components/Select/components/Option/Option.js

@@ -1,13 +1,16 @@
-import React, { forwardRef } from 'react';
-import cx from 'classnames';
-import { Text } from 'src/components/Text';
-import { OptionTextTheme } from './Option.theme';
-import s from './Option.module.css';
-const DISPLAY_NAME = 'Select.Value';
-const Option = forwardRef((props, ref) => {
-    const { children, className } = props;
-    return (React.createElement("span", { className: cx(s.text, className), ref: ref },
-        React.createElement(Text, { theme: OptionTextTheme, size: "l", isEllipsis: true }, children)));
+import { jsx as t } from "react/jsx-runtime";
+import { forwardRef as m } from "react";
+import { c as i } from "../../../../index-L8X2o7IH.mjs";
+import { Text as a } from "../../../Text/Text.js";
+import "../../../Text/Text.themes.js";
+import { OptionTextTheme as c } from "./Option.theme.js";
+import '../../../../assets/Option.css';const p = "_text_gk4uj_1", l = {
+  text: p
+}, n = "Select.Value", x = m((e, o) => {
+  const { children: r, className: s } = e;
+  return /* @__PURE__ */ t("span", { className: i(l.text, s), ref: o, children: /* @__PURE__ */ t(a, { theme: c, size: "l", isEllipsis: !0, children: r }) });
 });
-Option.displayName = DISPLAY_NAME;
-export default Option;
+x.displayName = n;
+export {
+  x as default
+};

package/dist/components/Select/components/Option/Option.props.js

@@ -1 +1 @@
-export {};
+

package/dist/components/Select/components/Option/Option.theme.d.ts

@@ -1,3 +1,3 @@
-import { TextTheme } from 'src/components/Text';
+import { TextTheme } from '../../../Text';
 export declare const OptionTextTheme: TextTheme;
 //# sourceMappingURL=Option.theme.d.ts.map

package/dist/components/Select/components/Option/Option.theme.js

@@ -1,5 +1,9 @@
-import { TextPrimaryTheme } from 'src/components/Text';
-export const OptionTextTheme = {
-    ...TextPrimaryTheme,
-    '--crm-ui-kit-text-color': 'inherit',
+import "../../../Text/Text.js";
+import { TextPrimaryTheme as t } from "../../../Text/Text.themes.js";
+const i = {
+  ...t,
+  "--crm-ui-kit-text-color": "inherit"
+};
+export {
+  i as OptionTextTheme
 };

package/dist/components/Select/components/Value/Value.d.ts

@@ -1,4 +1,4 @@
-import React from 'react';
+import { default as React } from 'react';
 import { ValueProps } from './Value.props';
 export declare const Value: React.ForwardRefExoticComponent<ValueProps & React.RefAttributes<HTMLDivElement>>;
 //# sourceMappingURL=Value.d.ts.map

package/dist/components/Select/components/Value/Value.js

@@ -1,22 +1,16 @@
-import React, { forwardRef } from 'react';
-import { VisuallyHiddenInput } from 'src/components/VisuallyHiddenInput';
-import { useSelectContext } from '../../Select.context';
-import Option from '../Option/Option';
-const DISPLAY_NAME = 'Select.Value';
-const shouldShowPlaceholder = (value) => {
-    return !value;
-};
-export const Value = forwardRef((props, ref) => {
-    const { className = '', placeholder = '', name, children } = props;
-    const { value } = useSelectContext(DISPLAY_NAME);
-    const getContent = () => {
-        if (children) {
-            return children;
-        }
-        return (React.createElement(Option, { className: className, ref: ref }, shouldShowPlaceholder(value) ? placeholder : value?.option));
-    };
-    return (React.createElement(React.Fragment, null,
-        getContent(),
-        React.createElement(VisuallyHiddenInput, { name: name, type: "hidden", value: value?.value })));
+import { jsxs as m, Fragment as d, jsx as r } from "react/jsx-runtime";
+import { forwardRef as p } from "react";
+import { VisuallyHiddenInput as a } from "../../../VisuallyHiddenInput/VisuallyHiddenInput.js";
+import { useSelectContext as u } from "../../Select.context.js";
+import f from "../Option/Option.js";
+const n = "Select.Value", h = (t) => !t, x = p((t, i) => {
+  const { className: l = "", placeholder: s = "", name: c, children: o } = t, { value: e } = u(n);
+  return /* @__PURE__ */ m(d, { children: [
+    o || /* @__PURE__ */ r(f, { className: l, ref: i, children: h(e) ? s : e == null ? void 0 : e.option }),
+    /* @__PURE__ */ r(a, { name: c, type: "hidden", value: e == null ? void 0 : e.value })
+  ] });
 });
-Value.displayName = DISPLAY_NAME;
+x.displayName = n;
+export {
+  x as Value
+};

package/dist/components/Select/components/Value/Value.props.js

@@ -1 +1 @@
-export {};
+

package/dist/components/Select/index.js

@@ -1,7 +1,20 @@
-export { Select } from './Select';
-export { SelectRootTheme } from './Select.theme';
-export { SelectItemTheme } from './components/Item';
-export { SelectArrowTheme, } from './components/Arrow';
-export { SelectIconTheme } from './components/Icon';
-export { ListTheme as SelectListTheme, } from '../List';
-export { SelectButtonLightTheme, SelectButtonDarkTheme, } from '../SelectButton';
+import { Select as p } from "./Select.js";
+import { SelectRootTheme as h } from "./Select.theme.js";
+import "./components/Item/Item.js";
+import { SelectItemTheme as S } from "./components/Item/Item.theme.js";
+import { SelectArrowTheme as f } from "./components/Arrow/Arrow.theme.js";
+import { SelectIconTheme as i } from "./components/Icon/Icon.theme.js";
+import "../../List-AX0nB9Ji.mjs";
+import { ListTheme as s } from "../List/List.theme.js";
+import "../SelectButton/SelectButton.js";
+import { SelectButtonDarkTheme as a, SelectButtonLightTheme as u } from "../SelectButton/SelectButton.theme.js";
+export {
+  p as Select,
+  f as SelectArrowTheme,
+  a as SelectButtonDarkTheme,
+  u as SelectButtonLightTheme,
+  i as SelectIconTheme,
+  S as SelectItemTheme,
+  s as SelectListTheme,
+  h as SelectRootTheme
+};

package/dist/components/SelectButton/SelectButton.d.ts

@@ -1,4 +1,4 @@
-import React from 'react';
+import { default as React } from 'react';
 import { SelectButtonProps } from './SelectButton.props';
 export declare const SelectButton: React.ForwardRefExoticComponent<SelectButtonProps & React.RefAttributes<HTMLButtonElement>>;
 //# sourceMappingURL=SelectButton.d.ts.map

package/dist/components/SelectButton/SelectButton.js

@@ -1,25 +1,49 @@
-import React, { forwardRef } from 'react';
-import cx from 'classnames';
-import { useThemeClassName } from 'src/hooks/useThemeClassName';
-import { noop } from 'src/utils';
-import s from './SelectButton.module.css';
-const ENTER = 'Enter';
-const SPACEBAR = 'Space';
-export const SelectButton = forwardRef((props, ref) => {
-    const { theme, className, onToggle = noop, isInvalid = false, isDisabled = false, children, ...rest } = props;
-    const themeClassName = useThemeClassName(theme);
-    const handleClick = () => {
-        onToggle();
-    };
-    const handleKeyDown = (e) => {
-        if ([ENTER, SPACEBAR].includes(e.code)) {
-            e.preventDefault();
-            onToggle();
-        }
-    };
-    return (React.createElement("button", { ref: ref, type: "button", className: cx(s.button, themeClassName, {
-            [s.invalid]: isInvalid,
-            [s.disabled]: isDisabled,
-        }, className), disabled: isDisabled, onClick: handleClick, onKeyDown: handleKeyDown, ...rest }, children));
+import { jsx as f } from "react/jsx-runtime";
+import { forwardRef as p } from "react";
+import { c as v } from "../../index-L8X2o7IH.mjs";
+import { useThemeClassName as _ } from "../../hooks/useThemeClassName/useThemeClassName.js";
+import { noop as h } from "../../utils/noop/noop.js";
+import '../../assets/SelectButton.css';const N = "_button_14jv2_1", C = "_invalid_14jv2_34", j = "_disabled_14jv2_39", t = {
+  button: N,
+  invalid: C,
+  disabled: j
+}, y = "Enter", D = "Space", E = p((s, a) => {
+  const {
+    theme: i,
+    className: l,
+    onToggle: e = h,
+    isInvalid: c = !1,
+    isDisabled: o = !1,
+    children: d,
+    ...r
+  } = s, m = _(i), b = () => {
+    e();
+  }, u = (n) => {
+    [y, D].includes(n.code) && (n.preventDefault(), e());
+  };
+  return /* @__PURE__ */ f(
+    "button",
+    {
+      ref: a,
+      type: "button",
+      className: v(
+        t.button,
+        m,
+        {
+          [t.invalid]: c,
+          [t.disabled]: o
+        },
+        l
+      ),
+      disabled: o,
+      onClick: b,
+      onKeyDown: u,
+      ...r,
+      children: d
+    }
+  );
 });
-SelectButton.displayName = 'SelectButton';
+E.displayName = "SelectButton";
+export {
+  E as SelectButton
+};

package/dist/components/SelectButton/SelectButton.props.js

@@ -1 +1 @@
-export {};
+

package/dist/components/SelectButton/SelectButton.theme.js

@@ -1,28 +1,30 @@
-const SelectButtonBaseValues = {
-    '--crm-ui-kit-select-button-border-width': '1px',
-    '--crm-ui-kit-select-button-z-index': '10',
-    '--crm-ui-kit-select-button-height': '36px',
-    '--crm-ui-kit-select-button-width': '100%',
-    '--crm-ui-kit-select-button-background-color': 'var(--crm-ui-kit-palette-background-primary)',
-    '--crm-ui-kit-select-button-error-color': 'var(--crm-ui-kit-color-error)',
-    '--crm-ui-kit-select-button-border-radius': '3px',
-    '--crm-ui-kit-select-button-padding': '0px 7px 0px 9px',
-    '--crm-ui-kit-select-button-disabled-border-color': 'var(--crm-ui-kit-color-grey)',
-    '--crm-ui-kit-select-button-disabled-border-opacity': '0.5',
-    '--crm-ui-kit-select-button-font-size': 'var(--crm-ui-kit-base-font-size)',
-    '--crm-ui-kit-select-button-line-height': '20px',
-    '--crm-ui-kit-select-button-focus-visible-border': '1px solid var(--crm-ui-kit-palette-border-active)',
-    '--crm-ui-kit-select-button-color': 'var(--crm-ui-kit-palette-text-primary)',
+const t = {
+  "--crm-ui-kit-select-button-border-width": "1px",
+  "--crm-ui-kit-select-button-z-index": "10",
+  "--crm-ui-kit-select-button-height": "36px",
+  "--crm-ui-kit-select-button-width": "100%",
+  "--crm-ui-kit-select-button-background-color": "var(--crm-ui-kit-palette-background-primary)",
+  "--crm-ui-kit-select-button-error-color": "var(--crm-ui-kit-color-error)",
+  "--crm-ui-kit-select-button-border-radius": "3px",
+  "--crm-ui-kit-select-button-padding": "0px 7px 0px 9px",
+  "--crm-ui-kit-select-button-disabled-border-color": "var(--crm-ui-kit-color-grey)",
+  "--crm-ui-kit-select-button-disabled-border-opacity": "0.5",
+  "--crm-ui-kit-select-button-font-size": "var(--crm-ui-kit-base-font-size)",
+  "--crm-ui-kit-select-button-line-height": "20px",
+  "--crm-ui-kit-select-button-focus-visible-border": "1px solid var(--crm-ui-kit-palette-border-active)",
+  "--crm-ui-kit-select-button-color": "var(--crm-ui-kit-palette-text-primary)"
+}, r = {
+  ...t,
+  "--crm-ui-kit-select-button-border": "var(--crm-ui-kit-select-button-border-width) solid var(--crm-ui-kit-palette-border-default)",
+  "--crm-ui-kit-select-button-error-border": "var(--crm-ui-kit-select-button-border-width) solid var(--crm-ui-kit-palette-border-error)",
+  "--crm-ui-kit-select-button-disabled-border": "var(--crm-ui-kit-select-button-border-width) solid var(--crm-ui-kit-palette-border-primary)"
+}, e = {
+  ...t,
+  "--crm-ui-kit-select-button-border": "var(--crm-ui-kit-select-button-border-width) solid var(--crm-ui-kit-palette-border-primary)",
+  "--crm-ui-kit-select-button-error-border": "var(--crm-ui-kit-select-button-border-width) solid var(--crm-ui-kit-palette-border-error)",
+  "--crm-ui-kit-select-button-disabled-border": "var(--crm-ui-kit-select-button-border-width) solid var(--crm-ui-kit-palette-border-primary)"
 };
-export const SelectButtonLightTheme = {
-    ...SelectButtonBaseValues,
-    '--crm-ui-kit-select-button-border': 'var(--crm-ui-kit-select-button-border-width) solid var(--crm-ui-kit-palette-border-default)',
-    '--crm-ui-kit-select-button-error-border': 'var(--crm-ui-kit-select-button-border-width) solid var(--crm-ui-kit-palette-border-error)',
-    '--crm-ui-kit-select-button-disabled-border': 'var(--crm-ui-kit-select-button-border-width) solid var(--crm-ui-kit-palette-border-primary)',
-};
-export const SelectButtonDarkTheme = {
-    ...SelectButtonBaseValues,
-    '--crm-ui-kit-select-button-border': 'var(--crm-ui-kit-select-button-border-width) solid var(--crm-ui-kit-palette-border-primary)',
-    '--crm-ui-kit-select-button-error-border': 'var(--crm-ui-kit-select-button-border-width) solid var(--crm-ui-kit-palette-border-error)',
-    '--crm-ui-kit-select-button-disabled-border': 'var(--crm-ui-kit-select-button-border-width) solid var(--crm-ui-kit-palette-border-primary)',
+export {
+  e as SelectButtonDarkTheme,
+  r as SelectButtonLightTheme
 };

package/dist/components/SelectButton/index.js

@@ -1,2 +1,7 @@
-export { SelectButton } from './SelectButton';
-export { SelectButtonLightTheme, SelectButtonDarkTheme, } from './SelectButton.theme';
+import { SelectButton as o } from "./SelectButton.js";
+import { SelectButtonDarkTheme as m, SelectButtonLightTheme as c } from "./SelectButton.theme.js";
+export {
+  o as SelectButton,
+  m as SelectButtonDarkTheme,
+  c as SelectButtonLightTheme
+};

package/dist/components/Spinner/Spinner.d.ts

@@ -1,4 +1,4 @@
-import React from 'react';
+import { default as React } from 'react';
 import { SpinnerProps } from './Spinner.props';
 export declare const Spinner: React.ForwardRefExoticComponent<Omit<SpinnerProps, "ref"> & React.RefAttributes<HTMLSpanElement>>;
 //# sourceMappingURL=Spinner.d.ts.map

package/dist/components/Spinner/Spinner.js

@@ -1,12 +1,29 @@
-import React, { forwardRef } from 'react';
-import cx from 'classnames';
-import { useThemeClassName } from 'src/hooks/useThemeClassName';
-import s from './Spinner.module.css';
-export const Spinner = forwardRef((props, ref) => {
-    const { isCentered = false, className = '', theme, ...rest } = props;
-    const themeClassName = useThemeClassName(theme);
-    return (React.createElement("span", { ref: ref, className: cx(s.spinner, {
-            [s.centered]: isCentered,
-        }, themeClassName, className), ...rest }));
+import { jsx as a } from "react/jsx-runtime";
+import { forwardRef as c } from "react";
+import { c as i } from "../../index-L8X2o7IH.mjs";
+import { useThemeClassName as d } from "../../hooks/useThemeClassName/useThemeClassName.js";
+import '../../assets/Spinner.css';const f = "_spinner_4ps24_11", l = "_centered_4ps24_29", e = {
+  spinner: f,
+  centered: l
+}, _ = c((s, n) => {
+  const { isCentered: r = !1, className: t = "", theme: m, ...o } = s, p = d(m);
+  return /* @__PURE__ */ a(
+    "span",
+    {
+      ref: n,
+      className: i(
+        e.spinner,
+        {
+          [e.centered]: r
+        },
+        p,
+        t
+      ),
+      ...o
+    }
+  );
 });
-Spinner.displayName = 'Spinner';
+_.displayName = "Spinner";
+export {
+  _ as Spinner
+};

package/dist/components/Spinner/Spinner.props.js

@@ -1 +1 @@
-export {};
+