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

package/dist/components/Accordion/components/AccordionSingle/AccordionSingle.js

@@ -1,30 +1,45 @@
-import React, { forwardRef, useState } from 'react';
-import cx from 'classnames';
-import { useThemeClassName } from 'src/hooks/useThemeClassName';
-import { noop } from 'src/utils';
-import { AccordionProvider } from '../../Accordion.context';
-import s from '../../Accordion.module.css';
-const DISPLAY_NAME = 'AccordionSingle';
-export const AccordionSingle = forwardRef((props, ref) => {
-    const { className = '', theme, children, value: valueProp, defaultValue: defaultValueProp, onChange = noop, isCollapsible = false, ...rest } = props;
-    const themeClassName = useThemeClassName(theme);
-    const [defaultValue, setDefaultValue] = useState(defaultValueProp);
-    const isControlled = 'value' in props;
-    const value = isControlled ? valueProp : defaultValue;
-    const getCorrectValue = (newValue) => {
-        if (isCollapsible) {
-            return newValue === value ? undefined : newValue;
-        }
-        return newValue;
-    };
-    const handleChange = (newValue) => {
-        const correctValue = getCorrectValue(newValue);
-        if (!isControlled) {
-            setDefaultValue(correctValue);
-        }
-        onChange(correctValue);
-    };
-    return (React.createElement(AccordionProvider, { value: value, defaultValue: defaultValue, onChange: handleChange },
-        React.createElement("div", { ref: ref, className: cx(s.wrapper, themeClassName, className), ...rest }, children)));
-});
-AccordionSingle.displayName = DISPLAY_NAME;
+import { jsx as n } from "react/jsx-runtime";
+import { forwardRef as N, useState as A } from "react";
+import { c as P } from "../../../../index-L8X2o7IH.mjs";
+import { useThemeClassName as S } from "../../../../hooks/useThemeClassName/useThemeClassName.js";
+import { noop as V } from "../../../../utils/noop/noop.js";
+import { AccordionProvider as x } from "../../Accordion.context.js";
+import { s as D } from "../../../../Accordion.module-0NEfElzm.mjs";
+const b = "AccordionSingle", j = N(
+  (o, s) => {
+    const {
+      className: c = "",
+      theme: i,
+      children: m,
+      value: u,
+      defaultValue: d,
+      onChange: f = V,
+      isCollapsible: p = !1,
+      ...h
+    } = o, C = S(i), [r, g] = A(d), t = "value" in o, a = t ? u : r, v = (e) => p && e === a ? void 0 : e;
+    return /* @__PURE__ */ n(
+      x,
+      {
+        value: a,
+        defaultValue: r,
+        onChange: (e) => {
+          const l = v(e);
+          t || g(l), f(l);
+        },
+        children: /* @__PURE__ */ n(
+          "div",
+          {
+            ref: s,
+            className: P(D.wrapper, C, c),
+            ...h,
+            children: m
+          }
+        )
+      }
+    );
+  }
+);
+j.displayName = b;
+export {
+  j as AccordionSingle
+};

package/dist/components/Accordion/components/AccordionSingle/AccordionSingle.props.js

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

package/dist/components/Accordion/components/Item/Item.d.ts

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

package/dist/components/Accordion/components/Item/Item.js

@@ -1,31 +1,59 @@
-import React, { forwardRef } from 'react';
-import cx from 'classnames';
-import ChevronDownIcon from 'src/icons/chevronDown.svg';
-import { useThemeClassName } from 'src/hooks/useThemeClassName';
-import { Text } from '../../../Text/Text';
-import { TextPrimaryTheme } from '../../../Text/Text.themes';
-import { useAccordionContext } from '../../Accordion.context';
-import s from './Item.module.css';
-const DISPLAY_NAME = 'Accordion.Item';
-export const Item = forwardRef((props, ref) => {
-    const { theme, children, value, title, before = null, className = '', ...rest } = props;
-    const themeClassName = useThemeClassName(theme);
-    const { onChange, value: currentValue } = useAccordionContext(DISPLAY_NAME);
-    const handleClick = () => {
-        onChange(value);
-    };
-    const isActive = Array.isArray(currentValue)
-        ? currentValue.includes(value)
-        : currentValue === value;
-    return (React.createElement("div", { ref: ref, className: cx(s.wrapper, {
-            [s.active]: isActive,
-        }, themeClassName, className), ...rest },
-        React.createElement("div", { className: cx(s.header), onClick: handleClick },
-            React.createElement("div", { className: cx(s.header_left) },
-                before && React.createElement("div", { className: cx(s.before_title) }, before),
-                React.createElement(Text, { theme: TextPrimaryTheme, size: "xl", isEllipsis: true }, title)),
-            React.createElement("span", { className: cx(s.chevron_container) },
-                React.createElement(ChevronDownIcon, { className: cx(s.chevron_icon) }))),
-        React.createElement("div", { className: cx(s.content) }, children)));
+import { jsxs as a, jsx as t } from "react/jsx-runtime";
+import * as s from "react";
+import { forwardRef as x } from "react";
+import { c as n } from "../../../../index-L8X2o7IH.mjs";
+import { useThemeClassName as C } from "../../../../hooks/useThemeClassName/useThemeClassName.js";
+import { Text as A } from "../../../Text/Text.js";
+import { TextPrimaryTheme as g } from "../../../Text/Text.themes.js";
+import { useAccordionContext as b } from "../../Accordion.context.js";
+import '../../../../assets/Item3.css';const y = (r) => /* @__PURE__ */ s.createElement("svg", { xmlns: "http://www.w3.org/2000/svg", width: 10, height: 7, fill: "none", ...r }, /* @__PURE__ */ s.createElement("path", { fill: "currentColor", fillRule: "evenodd", d: "M.176.78a.574.574 0 0 1 .857 0L4.96 5.058 8.967.692a.573.573 0 0 1 .857 0 .705.705 0 0 1 0 .933L5.485 6.351a.603.603 0 0 1-.14.114.573.573 0 0 1-.83-.026L.175 1.713a.706.706 0 0 1 0-.933Z", clipRule: "evenodd" })), E = "_wrapper_1l5nn_1", L = "_header_1l5nn_13", R = "_header_left_1l5nn_20", T = "_before_title_1l5nn_27", I = "_chevron_container_1l5nn_34", j = "_chevron_icon_1l5nn_44", k = "_content_1l5nn_48", D = "_active_1l5nn_54", e = {
+  wrapper: E,
+  header: L,
+  header_left: R,
+  before_title: T,
+  chevron_container: I,
+  chevron_icon: j,
+  content: k,
+  active: D
+}, i = "Accordion.Item", M = x((r, _) => {
+  const {
+    theme: m,
+    children: h,
+    value: o,
+    title: d,
+    before: l = null,
+    className: v = "",
+    ...p
+  } = r, f = C(m), { onChange: u, value: c } = b(i), N = () => {
+    u(o);
+  }, w = Array.isArray(c) ? c.includes(o) : c === o;
+  return /* @__PURE__ */ a(
+    "div",
+    {
+      ref: _,
+      className: n(
+        e.wrapper,
+        {
+          [e.active]: w
+        },
+        f,
+        v
+      ),
+      ...p,
+      children: [
+        /* @__PURE__ */ a("div", { className: n(e.header), onClick: N, children: [
+          /* @__PURE__ */ a("div", { className: n(e.header_left), children: [
+            l && /* @__PURE__ */ t("div", { className: n(e.before_title), children: l }),
+            /* @__PURE__ */ t(A, { theme: g, size: "xl", isEllipsis: !0, children: d })
+          ] }),
+          /* @__PURE__ */ t("span", { className: n(e.chevron_container), children: /* @__PURE__ */ t(y, { className: n(e.chevron_icon) }) })
+        ] }),
+        /* @__PURE__ */ t("div", { className: n(e.content), children: h })
+      ]
+    }
+  );
 });
-Item.displayName = DISPLAY_NAME;
+M.displayName = i;
+export {
+  M as Item
+};

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

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

package/dist/components/Accordion/components/Item/Item.themes.js

@@ -1,9 +1,12 @@
-export const AccordionItemTheme = {
-    '--crm-ui-kit-accordion-item-border-radius': 'var(--crm-ui-kit-palette-focus-visible-border-radius)',
-    '--crm-ui-kit-accordion-item-box-shadow': 'var(--crm-ui-kit-palette-accordion-item-box-shadow)',
-    '--crm-ui-kit-accordion-item-background-color': 'var(--crm-ui-kit-palette-background-primary)',
-    '--crm-ui-kit-accordion-item-padding': '12px 12px 12px 22px',
-    '--crm-ui-kit-accordion-item-margin-bottom': '16px',
-    '--crm-ui-kit-accordion-item-chevron-icon-color': 'var(--crm-ui-kit-palette-text-primary)',
-    '--crm-ui-kit-accordion-item-border-color': 'var(--crm-ui-kit-palette-border-primary)',
+const i = {
+  "--crm-ui-kit-accordion-item-border-radius": "var(--crm-ui-kit-palette-focus-visible-border-radius)",
+  "--crm-ui-kit-accordion-item-box-shadow": "var(--crm-ui-kit-palette-accordion-item-box-shadow)",
+  "--crm-ui-kit-accordion-item-background-color": "var(--crm-ui-kit-palette-background-primary)",
+  "--crm-ui-kit-accordion-item-padding": "12px 12px 12px 22px",
+  "--crm-ui-kit-accordion-item-margin-bottom": "16px",
+  "--crm-ui-kit-accordion-item-chevron-icon-color": "var(--crm-ui-kit-palette-text-primary)",
+  "--crm-ui-kit-accordion-item-border-color": "var(--crm-ui-kit-palette-border-primary)"
+};
+export {
+  i as AccordionItemTheme
 };

package/dist/components/Accordion/index.js

@@ -1,3 +1,8 @@
-export { Accordion } from './Accordion';
-export { AccordionTheme } from './Accordion.themes';
-export { AccordionItemTheme, } from './components/Item/Item.themes';
+import { Accordion as e } from "./Accordion.js";
+import { AccordionTheme as m } from "./Accordion.themes.js";
+import { AccordionItemTheme as d } from "./components/Item/Item.themes.js";
+export {
+  e as Accordion,
+  d as AccordionItemTheme,
+  m as AccordionTheme
+};

package/dist/components/BaseInput/BaseInput.d.ts

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

package/dist/components/BaseInput/BaseInput.js

@@ -1,10 +1,35 @@
-import React, { forwardRef } from 'react';
-import cx from 'classnames';
-import s from './BaseInput.module.css';
-export const BaseInput = forwardRef((props, ref) => {
-    const { className = '', isDisabled, isReadonly, isPlaceholderVisibleOnFocus = false, ...rest } = props;
-    return (React.createElement("input", { ref: ref, className: cx(s.input, {
-            [s.placeholder_visible]: isPlaceholderVisibleOnFocus,
-        }, className), disabled: isDisabled, readOnly: isReadonly, ...rest }));
+import { jsx as n } from "react/jsx-runtime";
+import { forwardRef as p } from "react";
+import { c } from "../../index-L8X2o7IH.mjs";
+import '../../assets/BaseInput.css';const d = "_input_x5289_1", _ = "_placeholder_visible_x5289_23", e = {
+  input: d,
+  placeholder_visible: _
+}, m = p((s, i) => {
+  const {
+    className: l = "",
+    isDisabled: a,
+    isReadonly: o,
+    isPlaceholderVisibleOnFocus: r = !1,
+    ...t
+  } = s;
+  return /* @__PURE__ */ n(
+    "input",
+    {
+      ref: i,
+      className: c(
+        e.input,
+        {
+          [e.placeholder_visible]: r
+        },
+        l
+      ),
+      disabled: a,
+      readOnly: o,
+      ...t
+    }
+  );
 });
-BaseInput.displayName = 'BaseInput';
+m.displayName = "BaseInput";
+export {
+  m as BaseInput
+};

package/dist/components/BaseInput/BaseInput.props.js

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

package/dist/components/BaseInput/index.js

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

package/dist/components/Button/Button.d.ts

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

package/dist/components/Button/Button.js

@@ -1,58 +1,94 @@
-import React, { forwardRef, useMemo } from 'react';
-import cx from 'classnames';
-import { useThemeClassName } from 'src/hooks/useThemeClassName';
-import { noop } from 'src/utils';
-import { Spinner } from 'src/components/Spinner';
-import { useShowInvalidAnimation, useShowSuccessfulState } from './hooks';
-import s from './Button.module.css';
-const spinnerThemesMapper = (buttonTheme) => {
-    const defaultTheme = {
-        '--crm-ui-kit-spinner-border-color': buttonTheme['--crm-ui-kit-button-spinner-border-color'],
-        '--crm-ui-kit-spinner-border-width': buttonTheme['--crm-ui-kit-button-spinner-border-width'],
-        '--crm-ui-kit-spinner-circle-size': buttonTheme['--crm-ui-kit-button-spinner-circle-size'],
-        '--crm-ui-kit-spinner-border-style': buttonTheme['--crm-ui-kit-button-spinner-border-style'],
-    };
-    const disabledTheme = {
-        ...defaultTheme,
-        '--crm-ui-kit-spinner-border-color': buttonTheme['--crm-ui-kit-button-spinner-disabled-border-color'],
-    };
-    return { defaultTheme, disabledTheme };
-};
-export const Button = forwardRef((props, ref) => {
-    const { className = '', type = 'button', onClick = noop, theme, isLoading, isDisabled, before, after, children, showInvalidAnimationRef, showSuccessfulStateRef, successfulStateText, isClickableWhileDisabled = false, ...rest } = props;
-    const themeClassName = useThemeClassName(theme);
-    const spinnerThemes = useMemo(() => spinnerThemesMapper(theme), [theme]);
-    const shouldShowInvalidAnimation = useShowInvalidAnimation(showInvalidAnimationRef);
-    const shouldShowSuccessfulState = useShowSuccessfulState(showSuccessfulStateRef);
-    const handleClick = (e) => {
-        if (isLoading) {
-            return;
+import { jsxs as R, jsx as e } from "react/jsx-runtime";
+import T, { forwardRef as A, useMemo as I } from "react";
+import { c as i } from "../../index-L8X2o7IH.mjs";
+import { useThemeClassName as g } from "../../hooks/useThemeClassName/useThemeClassName.js";
+import { noop as j } from "../../utils/noop/noop.js";
+import { Spinner as z } from "../Spinner/Spinner.js";
+import { useShowInvalidAnimation as B } from "./hooks/useShowInvalidAnimation/useShowInvalidAnimation.js";
+import { useShowSuccessfulState as D } from "./hooks/useShowSuccessfulState/useShowSuccessfulState.js";
+import '../../assets/Button.css';const M = "_button_5it8y_17", F = "_disabled_5it8y_43", L = "_content_5it8y_65", W = "_before_5it8y_73", q = "_after_5it8y_78", E = "_spinner_container_5it8y_83", G = "_invalid_5it8y_90", H = "_success_5it8y_95", n = {
+  button: M,
+  disabled: F,
+  content: L,
+  before: W,
+  after: q,
+  spinner_container: E,
+  invalid: G,
+  success: H
+}, J = (t) => {
+  const r = {
+    "--crm-ui-kit-spinner-border-color": t["--crm-ui-kit-button-spinner-border-color"],
+    "--crm-ui-kit-spinner-border-width": t["--crm-ui-kit-button-spinner-border-width"],
+    "--crm-ui-kit-spinner-circle-size": t["--crm-ui-kit-button-spinner-circle-size"],
+    "--crm-ui-kit-spinner-border-style": t["--crm-ui-kit-button-spinner-border-style"]
+  }, o = {
+    ...r,
+    "--crm-ui-kit-spinner-border-color": t["--crm-ui-kit-button-spinner-disabled-border-color"]
+  };
+  return { defaultTheme: r, disabledTheme: o };
+}, K = A((t, r) => {
+  const {
+    className: o = "",
+    type: b = "button",
+    onClick: f = j,
+    theme: c,
+    isLoading: l,
+    isDisabled: a,
+    before: d,
+    after: u,
+    children: _,
+    showInvalidAnimationRef: h,
+    showSuccessfulStateRef: k,
+    successfulStateText: y,
+    isClickableWhileDisabled: S = !1,
+    ...w
+  } = t, N = g(c), m = I(() => J(c), [c]), v = B(
+    h
+  ), p = D(
+    k
+  ), C = (x) => {
+    l || f(x);
+  };
+  let s = null;
+  switch (!0) {
+    case p:
+      s = /* @__PURE__ */ e("span", { children: y || s });
+      break;
+    case l:
+      s = /* @__PURE__ */ e("span", { className: i(n.spinner_container), children: /* @__PURE__ */ e(
+        z,
+        {
+          theme: a ? m.disabledTheme : m.defaultTheme,
+          isCentered: !0
         }
-        onClick(e);
-    };
-    let content = null;
-    switch (true) {
-        case shouldShowSuccessfulState:
-            content = React.createElement("span", null, successfulStateText || content);
-            break;
-        case isLoading:
-            content = (React.createElement("span", { className: cx(s.spinner_container) },
-                React.createElement(Spinner, { theme: isDisabled
-                        ? spinnerThemes.disabledTheme
-                        : spinnerThemes.defaultTheme, isCentered: true })));
-            break;
-        default:
-            content = (React.createElement(React.Fragment, null,
-                before && React.createElement("span", { className: cx(s.before) }, before),
-                React.createElement("span", null, children),
-                after && React.createElement("span", { className: cx(s.after) }, after)));
-            break;
+      ) });
+      break;
+    default:
+      s = /* @__PURE__ */ R(T.Fragment, { children: [
+        d && /* @__PURE__ */ e("span", { className: i(n.before), children: d }),
+        /* @__PURE__ */ e("span", { children: _ }),
+        u && /* @__PURE__ */ e("span", { className: i(n.after), children: u })
+      ] });
+      break;
+  }
+  return /* @__PURE__ */ e(
+    "button",
+    {
+      ...w,
+      ref: r,
+      type: b,
+      onClick: C,
+      className: i(n.button, N, o, {
+        [n.invalid]: v,
+        [n.success]: p,
+        [n.disabled]: a
+      }),
+      disabled: a && !S,
+      children: /* @__PURE__ */ e("span", { className: i(n.content), children: s })
     }
-    return (React.createElement("button", { ...rest, ref: ref, type: type, onClick: handleClick, className: cx(s.button, themeClassName, className, {
-            [s.invalid]: shouldShowInvalidAnimation,
-            [s.success]: shouldShowSuccessfulState,
-            [s.disabled]: isDisabled,
-        }), disabled: isDisabled && !isClickableWhileDisabled },
-        React.createElement("span", { className: cx(s.content) }, content)));
+  );
 });
-Button.displayName = 'Button';
+K.displayName = "Button";
+export {
+  K as Button
+};

package/dist/components/Button/Button.props.d.ts

@@ -1,5 +1,5 @@
-import React from 'react';
-import { type ButtonThemeType } from './Button.themes';
+import { default as React } from 'react';
+import { ButtonThemeType } from './Button.themes';
 type Button = Omit<React.DetailedHTMLProps<React.ButtonHTMLAttributes<HTMLButtonElement>, HTMLButtonElement>, 'disabled'>;
 export interface ButtonProps extends Button {
     /**

package/dist/components/Button/Button.props.js

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

package/dist/components/Button/Button.themes.js

@@ -1,66 +1,68 @@
-const ButtonBaseThemeValues = {
-    '--crm-ui-kit-button-z-index': '1',
-    '--crm-ui-kit-button-height': '36px',
-    '--crm-ui-kit-button-elements-spacing': '4px',
-    '--crm-ui-kit-button-font-size': '14px',
-    '--crm-ui-kit-button-line-height': '14px',
-    '--crm-ui-kit-button-font-weight': 'bold',
-    '--crm-ui-kit-button-sibling-element-spacing': '7px',
-    '--crm-ui-kit-button-disabled-opacity': 'var(--crm-ui-kit-disabled-opacity)',
-    '--crm-ui-kit-button-padding': '0px 10px',
-    '--crm-ui-kit-button-border-width': '1px',
-    '--crm-ui-kit-button-border-style': 'solid',
-    '--crm-ui-kit-button-border-radius': '3px',
-    '--crm-ui-kit-button-hover-border-width': '1px',
-    '--crm-ui-kit-button-hover-border-style': 'solid',
-    '--crm-ui-kit-button-hover-border-radius': '3px',
-    '--crm-ui-kit-button-success-color': 'var(--crm-ui-kit-color-white)',
-    '--crm-ui-kit-button-success-background-color': 'var(--crm-ui-ki-color-mustard-yellow)',
-    '--crm-ui-kit-button-success-hover-background-color': 'var(--crm-ui-kit-color-amber)',
-    '--crm-ui-kit-button-success-border-color': 'var(--crm-ui-kit-color-goldenrod)',
-    '--crm-ui-kit-button-spinner-border-color': 'var(--crm-ui-kit-color-bright-blue)',
-    '--crm-ui-kit-button-spinner-disabled-border-color': 'var(--crm-ui-kit-color-bright-blue)',
-    '--crm-ui-kit-button-spinner-border-width': '2px',
-    '--crm-ui-kit-button-spinner-circle-size': '16px',
-    '--crm-ui-kit-button-spinner-border-style': 'solid',
+const r = {
+  "--crm-ui-kit-button-z-index": "1",
+  "--crm-ui-kit-button-height": "36px",
+  "--crm-ui-kit-button-elements-spacing": "4px",
+  "--crm-ui-kit-button-font-size": "14px",
+  "--crm-ui-kit-button-line-height": "14px",
+  "--crm-ui-kit-button-font-weight": "bold",
+  "--crm-ui-kit-button-sibling-element-spacing": "7px",
+  "--crm-ui-kit-button-disabled-opacity": "var(--crm-ui-kit-disabled-opacity)",
+  "--crm-ui-kit-button-padding": "0px 10px",
+  "--crm-ui-kit-button-border-width": "1px",
+  "--crm-ui-kit-button-border-style": "solid",
+  "--crm-ui-kit-button-border-radius": "3px",
+  "--crm-ui-kit-button-hover-border-width": "1px",
+  "--crm-ui-kit-button-hover-border-style": "solid",
+  "--crm-ui-kit-button-hover-border-radius": "3px",
+  "--crm-ui-kit-button-success-color": "var(--crm-ui-kit-color-white)",
+  "--crm-ui-kit-button-success-background-color": "var(--crm-ui-ki-color-mustard-yellow)",
+  "--crm-ui-kit-button-success-hover-background-color": "var(--crm-ui-kit-color-amber)",
+  "--crm-ui-kit-button-success-border-color": "var(--crm-ui-kit-color-goldenrod)",
+  "--crm-ui-kit-button-spinner-border-color": "var(--crm-ui-kit-color-bright-blue)",
+  "--crm-ui-kit-button-spinner-disabled-border-color": "var(--crm-ui-kit-color-bright-blue)",
+  "--crm-ui-kit-button-spinner-border-width": "2px",
+  "--crm-ui-kit-button-spinner-circle-size": "16px",
+  "--crm-ui-kit-button-spinner-border-style": "solid"
+}, t = {
+  ...r,
+  "--crm-ui-kit-button-color": "var(--crm-ui-kit-palette-text-primary)",
+  "--crm-ui-kit-button-border-color": "var(--crm-ui-kit-palette-border-primary)",
+  "--crm-ui-kit-button-background-color": "var(--crm-ui-kit-palette-background-primary)",
+  "--crm-ui-kit-button-disabled-color": "var(--crm-ui-kit-palette-text-primary)",
+  "--crm-ui-kit-button-disabled-background-color": "var(--crm-ui-kit-palette-background-primary)",
+  "--crm-ui-kit-button-disabled-border-color": "var(--crm-ui-kit-palette-border-primary)",
+  "--crm-ui-kit-button-hover-color": "var(--crm-ui-kit-palette-text-primary)",
+  "--crm-ui-kit-button-hover-background-color": "var(--crm-ui-kit-palette-button-classic-hover-background)",
+  "--crm-ui-kit-button-hover-border-color": "var(--crm-ui-kit-palette-border-primary)"
+}, i = {
+  ...r,
+  "--crm-ui-kit-button-color": "var(--crm-ui-kit-color-white)",
+  "--crm-ui-kit-button-border-color": "var(--crm-ui-kit-color-cerulean-blue)",
+  "--crm-ui-kit-button-disabled-color": "var(--crm-ui-kit-palette-text-primary)",
+  "--crm-ui-kit-button-disabled-background-color": "var(--crm-ui-kit-palette-background-primary)",
+  "--crm-ui-kit-button-disabled-border-color": "var(--crm-ui-kit-palette-border-primary)",
+  "--crm-ui-kit-button-background-color": "var(--crm-ui-kit-palette-active-element-900)",
+  "--crm-ui-kit-button-hover-color": "var(--crm-ui-kit-color-white)",
+  "--crm-ui-kit-button-hover-background-color": "var(--crm-ui-kit-color-azure-blue)",
+  "--crm-ui-kit-button-hover-border-color": "var(--crm-ui-kit-color-cerulean-blue)",
+  "--crm-ui-kit-button-spinner-border-color": "var(--crm-ui-kit-color-white)",
+  "--crm-ui-kit-button-spinner-disabled-border-color": "var(--crm-ui-kit-color-bright-blue)"
+}, o = {
+  ...r,
+  "--crm-ui-kit-button-height": "30px",
+  "--crm-ui-kit-button-color": "var(--crm-ui-kit-palette-text-secondary-light)",
+  "--crm-ui-kit-button-padding": "0px 8px",
+  "--crm-ui-kit-button-border-color": "transparent",
+  "--crm-ui-kit-button-background-color": "inherit",
+  "--crm-ui-kit-button-disabled-color": "var(--crm-ui-kit-palette-text-secondary-light)",
+  "--crm-ui-kit-button-disabled-background-color": "inherit",
+  "--crm-ui-kit-button-disabled-border-color": "transparent",
+  "--crm-ui-kit-button-hover-background-color": "inherit",
+  "--crm-ui-kit-button-hover-border-color": "transparent",
+  "--crm-ui-kit-button-hover-color": "var(--crm-ui-kit-palette-text-secondary-light)"
 };
-export const ButtonNeutralTheme = {
-    ...ButtonBaseThemeValues,
-    '--crm-ui-kit-button-color': 'var(--crm-ui-kit-palette-text-primary)',
-    '--crm-ui-kit-button-border-color': 'var(--crm-ui-kit-palette-border-primary)',
-    '--crm-ui-kit-button-background-color': 'var(--crm-ui-kit-palette-background-primary)',
-    '--crm-ui-kit-button-disabled-color': 'var(--crm-ui-kit-palette-text-primary)',
-    '--crm-ui-kit-button-disabled-background-color': 'var(--crm-ui-kit-palette-background-primary)',
-    '--crm-ui-kit-button-disabled-border-color': 'var(--crm-ui-kit-palette-border-primary)',
-    '--crm-ui-kit-button-hover-color': 'var(--crm-ui-kit-palette-text-primary)',
-    '--crm-ui-kit-button-hover-background-color': 'var(--crm-ui-kit-palette-button-classic-hover-background)',
-    '--crm-ui-kit-button-hover-border-color': 'var(--crm-ui-kit-palette-border-primary)',
-};
-export const ButtonPrimaryTheme = {
-    ...ButtonBaseThemeValues,
-    '--crm-ui-kit-button-color': 'var(--crm-ui-kit-color-white)',
-    '--crm-ui-kit-button-border-color': 'var(--crm-ui-kit-color-cerulean-blue)',
-    '--crm-ui-kit-button-disabled-color': 'var(--crm-ui-kit-palette-text-primary)',
-    '--crm-ui-kit-button-disabled-background-color': 'var(--crm-ui-kit-palette-background-primary)',
-    '--crm-ui-kit-button-disabled-border-color': 'var(--crm-ui-kit-palette-border-primary)',
-    '--crm-ui-kit-button-background-color': 'var(--crm-ui-kit-palette-active-element-900)',
-    '--crm-ui-kit-button-hover-color': 'var(--crm-ui-kit-color-white)',
-    '--crm-ui-kit-button-hover-background-color': 'var(--crm-ui-kit-color-azure-blue)',
-    '--crm-ui-kit-button-hover-border-color': 'var(--crm-ui-kit-color-cerulean-blue)',
-    '--crm-ui-kit-button-spinner-border-color': 'var(--crm-ui-kit-color-white)',
-    '--crm-ui-kit-button-spinner-disabled-border-color': 'var(--crm-ui-kit-color-bright-blue)',
-};
-export const ButtonSecondaryTheme = {
-    ...ButtonBaseThemeValues,
-    '--crm-ui-kit-button-height': '30px',
-    '--crm-ui-kit-button-color': 'var(--crm-ui-kit-palette-text-secondary-light)',
-    '--crm-ui-kit-button-padding': '0px 8px',
-    '--crm-ui-kit-button-border-color': 'transparent',
-    '--crm-ui-kit-button-background-color': 'inherit',
-    '--crm-ui-kit-button-disabled-color': 'var(--crm-ui-kit-palette-text-secondary-light)',
-    '--crm-ui-kit-button-disabled-background-color': 'inherit',
-    '--crm-ui-kit-button-disabled-border-color': 'transparent',
-    '--crm-ui-kit-button-hover-background-color': 'inherit',
-    '--crm-ui-kit-button-hover-border-color': 'transparent',
-    '--crm-ui-kit-button-hover-color': 'var(--crm-ui-kit-palette-text-secondary-light)',
+export {
+  t as ButtonNeutralTheme,
+  i as ButtonPrimaryTheme,
+  o as ButtonSecondaryTheme
 };

package/dist/components/Button/hooks/index.js

@@ -1,2 +1,6 @@
-export { useShowInvalidAnimation } from './useShowInvalidAnimation/useShowInvalidAnimation';
-export { useShowSuccessfulState } from './useShowSuccessfulState/useShowSuccessfulState';
+import { useShowInvalidAnimation as t } from "./useShowInvalidAnimation/useShowInvalidAnimation.js";
+import { useShowSuccessfulState as s } from "./useShowSuccessfulState/useShowSuccessfulState.js";
+export {
+  t as useShowInvalidAnimation,
+  s as useShowSuccessfulState
+};