@de-kit/st-ui 0.1.3 → 0.1.5

package/README.md

@@ -52,19 +52,28 @@ import { IconClose, LogoVisa } from '@de-kit/st-ui/icons';
 <Button size="sm">Маленькая</Button>
 <Button size="lg">Крупная</Button>
 <Button fullWidth>Дальше</Button>
-<Button icon="back">Назад</Button>
-<Button icon="forward">Дальше</Button>
-<Button loading>Сохранение</Button>
+<Button>
+  <IconArrowLeft width={20} height={20} />
+  Назад
+</Button>
+<Button>
+  Дальше
+  <IconArrowRight width={20} height={20} />
+</Button>
+<Button>
+  <IconSpinner className="button__icon--spin" width={20} height={20} />
+  Сохранение
+</Button>
 ```
 
+Иконка — обычный `children`, слева или справа, какой набор нужен. Класс `button__icon--spin` крутит спиннер.
+
 | Prop        | По умолчанию |                                                    |
 | ----------- | ------------ | -------------------------------------------------- |
 | `variant`   | `default`    | `default` заливка, `outline` обводка, `link` текст |
 | `size`      | `md`         | `sm` компактная, `md` обычная, `lg` крупная        |
 | `fullWidth` | `false`      | ширина 100%, не зависит от `size`                  |
 | `href`      | —            | рендер `<a>`, не `<Link>`                          |
-| `icon`      | —            | `back` стрелка слева, `forward` справа             |
-| `loading`   | `false`      | спиннер на месте стрелки, клик не проходит         |
 
 `variant="link"` — это вид кнопки (`font-weight: 400`), не тип элемента. Ссылка — отдельный проп `href`.
 

package/dist/components/button/button.cjs

@@ -1,44 +1,15 @@
-const require_icon_arrow_left = require("../../icons/icon-arrow-left.cjs");
-const require_icon_arrow_right = require("../../icons/icon-arrow-right.cjs");
-const require_icon_spinner = require("../../icons/icon-spinner.cjs");
 const require_cn = require("../../lib/cn.cjs");
 let react = require("react");
-let react_jsx_runtime = require("react/jsx-runtime");
 require("./button.scss");
+let react_jsx_runtime = require("react/jsx-runtime");
 // src/components/button/button.tsx
 const styleKeys = [
 	"variant",
 	"size",
 	"fullWidth",
-	"icon",
-	"loading",
 	"className"
 ];
-const iconSize = {
-	sm: 16,
-	md: 20,
-	lg: 24
-};
-const getClassName = ({ variant = "default", size = "md", fullWidth = false, loading = false, className, disabled }) => require_cn.cn("button", className, `button--${variant}`, `button--${size}`, require_cn.when(fullWidth, "button--full-width"), require_cn.when(disabled, "button--disabled"), require_cn.when(loading, "button--loading"));
-const renderGlyph = (icon, loading, size) => {
-	const px = iconSize[size];
-	if (loading) return /* @__PURE__ */ (0, react_jsx_runtime.jsx)(require_icon_spinner.IconSpinner, {
-		className: "button__icon button__icon--spin",
-		width: px,
-		height: px
-	});
-	if (icon === "back") return /* @__PURE__ */ (0, react_jsx_runtime.jsx)(require_icon_arrow_left.IconArrowLeft, {
-		className: "button__icon",
-		width: px,
-		height: px
-	});
-	if (icon === "forward") return /* @__PURE__ */ (0, react_jsx_runtime.jsx)(require_icon_arrow_right.IconArrowRight, {
-		className: "button__icon",
-		width: px,
-		height: px
-	});
-	return null;
-};
+const getClassName = ({ variant = "default", size = "md", fullWidth = false, className, disabled }) => require_cn.cn("button", className, require_cn.when(variant !== "default", `button--${variant}`), require_cn.when(size !== "md", `button--${size}`), require_cn.when(fullWidth, "button--full-width"), require_cn.when(disabled, "button--disabled"));
 const omitStyleProps = (props) => {
 	const next = {};
 	const skipped = new Set(styleKeys);
@@ -46,40 +17,18 @@ const omitStyleProps = (props) => {
 	return next;
 };
 const Button = (0, react.forwardRef)(function Button(props, ref) {
-	const size = props.size ?? "md";
-	const { icon, loading } = props;
 	const className = getClassName(props);
 	const { children, href, ...domProps } = omitStyleProps(props);
-	const glyph = renderGlyph(icon, loading, size);
-	const before = icon !== "forward";
-	const content = /* @__PURE__ */ (0, react_jsx_runtime.jsxs)(react_jsx_runtime.Fragment, { children: [
-		before ? glyph : null,
-		children,
-		before ? null : glyph
-	] });
-	if (typeof href === "string") {
-		const { onClick, ...anchorProps } = domProps;
-		const handleClick = (event) => {
-			if (loading) {
-				event.preventDefault();
-				return;
-			}
-			onClick?.(event);
-		};
-		return /* @__PURE__ */ (0, react_jsx_runtime.jsx)("a", {
-			ref,
-			href,
-			className,
-			...anchorProps,
-			"aria-busy": loading || void 0,
-			"aria-disabled": loading || void 0,
-			onClick: handleClick,
-			children: content
-		});
-	}
+	if (typeof href === "string") return /* @__PURE__ */ (0, react_jsx_runtime.jsx)("a", {
+		ref,
+		href,
+		className,
+		...domProps,
+		children
+	});
 	const { type = "button", disabled, onClick, ...buttonProps } = domProps;
 	const handleClick = (event) => {
-		if (disabled || loading) return;
+		if (disabled) return;
 		onClick?.(event);
 	};
 	return /* @__PURE__ */ (0, react_jsx_runtime.jsx)("button", {
@@ -87,10 +36,9 @@ const Button = (0, react.forwardRef)(function Button(props, ref) {
 		className,
 		type,
 		disabled,
-		...buttonProps,
-		"aria-busy": loading || void 0,
 		onClick: handleClick,
-		children: content
+		...buttonProps,
+		children
 	});
 });
 exports.Button = Button;

package/dist/components/button/button.cjs.map

@@ -1 +1 @@
-{"version":3,"file":"button.cjs","names":["cn","when","IconSpinner","IconArrowLeft","IconArrowRight","forwardRef"],"sources":["../../../src/components/button/button.tsx"],"sourcesContent":["import {\n  forwardRef,\n  type AnchorHTMLAttributes,\n  type ButtonHTMLAttributes,\n  type MouseEventHandler,\n  type ReactNode,\n  type Ref,\n} from 'react';\n\nimport { IconArrowLeft } from '../../icons/icon-arrow-left';\nimport { IconArrowRight } from '../../icons/icon-arrow-right';\nimport { IconSpinner } from '../../icons/icon-spinner';\nimport { cn, when } from '../../lib/cn';\nimport './button.scss';\n\nexport type ButtonVariant = 'default' | 'outline' | 'link';\nexport type ButtonSize = 'sm' | 'md' | 'lg';\nexport type ButtonIcon = 'back' | 'forward';\n\ninterface ButtonStyleProps {\n  variant?: ButtonVariant;\n  size?: ButtonSize;\n  fullWidth?: boolean;\n  icon?: ButtonIcon;\n  loading?: boolean;\n  className?: string;\n  children?: ReactNode;\n}\n\nexport interface ButtonProps\n  extends ButtonHTMLAttributes<HTMLButtonElement>, ButtonStyleProps {\n  href?: undefined;\n}\n\nexport interface ButtonLinkProps\n  extends\n    Omit<AnchorHTMLAttributes<HTMLAnchorElement>, 'href'>,\n    ButtonStyleProps {\n  href: string;\n}\n\nexport type ButtonComponentProps = ButtonProps | ButtonLinkProps;\n\nconst styleKeys = [\n  'variant',\n  'size',\n  'fullWidth',\n  'icon',\n  'loading',\n  'className',\n] as const;\n\nconst iconSize = {\n  sm: 16,\n  md: 20,\n  lg: 24,\n} as const;\n\nconst getClassName = ({\n  variant = 'default',\n  size = 'md',\n  fullWidth = false,\n  loading = false,\n  className,\n  disabled,\n}: ButtonStyleProps & { disabled?: boolean }) =>\n  cn(\n    'button',\n    className,\n    `button--${variant}`,\n    `button--${size}`,\n    when(fullWidth, 'button--full-width'),\n    when(disabled, 'button--disabled'),\n    when(loading, 'button--loading'),\n  );\n\nconst renderGlyph = (\n  icon: ButtonIcon | undefined,\n  loading: boolean | undefined,\n  size: ButtonSize,\n) => {\n  const px = iconSize[size];\n\n  if (loading) {\n    return (\n      <IconSpinner\n        className=\"button__icon button__icon--spin\"\n        width={px}\n        height={px}\n      />\n    );\n  }\n\n  if (icon === 'back') {\n    return <IconArrowLeft className=\"button__icon\" width={px} height={px} />;\n  }\n\n  if (icon === 'forward') {\n    return <IconArrowRight className=\"button__icon\" width={px} height={px} />;\n  }\n\n  return null;\n};\n\nconst omitStyleProps = <T extends ButtonStyleProps>(\n  props: T,\n): Omit<T, (typeof styleKeys)[number]> => {\n  const next: Record<string, unknown> = {};\n  const skipped = new Set<string>(styleKeys);\n\n  for (const [key, value] of Object.entries(props)) {\n    if (!skipped.has(key)) next[key] = value;\n  }\n\n  return next as Omit<T, (typeof styleKeys)[number]>;\n};\n\nexport const Button = forwardRef<\n  HTMLButtonElement | HTMLAnchorElement,\n  ButtonComponentProps\n>(function Button(props, ref) {\n  const size = props.size ?? 'md';\n  const { icon, loading } = props;\n  const className = getClassName(props);\n  const { children, href, ...domProps } = omitStyleProps(props);\n  const glyph = renderGlyph(icon, loading, size);\n  const before = icon !== 'forward';\n  const content = (\n    <>\n      {before ? glyph : null}\n      {children}\n      {before ? null : glyph}\n    </>\n  );\n\n  if (typeof href === 'string') {\n    const { onClick, ...anchorProps } =\n      domProps as AnchorHTMLAttributes<HTMLAnchorElement>;\n\n    const handleClick: MouseEventHandler<HTMLAnchorElement> = event => {\n      if (loading) {\n        event.preventDefault();\n        return;\n      }\n      onClick?.(event);\n    };\n\n    return (\n      <a\n        ref={ref as Ref<HTMLAnchorElement>}\n        href={href}\n        className={className}\n        {...anchorProps}\n        aria-busy={loading || undefined}\n        aria-disabled={loading || undefined}\n        onClick={handleClick}\n      >\n        {content}\n      </a>\n    );\n  }\n\n  const {\n    type = 'button',\n    disabled,\n    onClick,\n    ...buttonProps\n  } = domProps as ButtonHTMLAttributes<HTMLButtonElement>;\n\n  const handleClick: MouseEventHandler<HTMLButtonElement> = event => {\n    if (disabled || loading) return;\n    onClick?.(event);\n  };\n\n  return (\n    <button\n      ref={ref as Ref<HTMLButtonElement>}\n      className={className}\n      type={type}\n      disabled={disabled}\n      {...buttonProps}\n      aria-busy={loading || undefined}\n      onClick={handleClick}\n    >\n      {content}\n    </button>\n  );\n});\n"],"mappings":";;;;;;;;AA2CA,MAAM,YAAY;CAChB;CACA;CACA;CACA;CACA;CACA;AACF;AAEA,MAAM,WAAW;CACf,IAAI;CACJ,IAAI;CACJ,IAAI;AACN;AAEA,MAAM,gBAAgB,EACpB,UAAU,WACV,OAAO,MACP,YAAY,OACZ,UAAU,OACV,WACA,eAEAA,WAAAA,GACE,UACA,WACA,WAAW,WACX,WAAW,QACXC,WAAAA,KAAK,WAAW,oBAAoB,GACpCA,WAAAA,KAAK,UAAU,kBAAkB,GACjCA,WAAAA,KAAK,SAAS,iBAAiB,CACjC;AAEF,MAAM,eACJ,MACA,SACA,SACG;CACH,MAAM,KAAK,SAAS;CAEpB,IAAI,SACF,OACE,iBAAA,GAAA,kBAAA,IAAA,CAACC,qBAAAA,aAAD;EACE,WAAU;EACV,OAAO;EACP,QAAQ;CACT,CAAA;CAIL,IAAI,SAAS,QACX,OAAO,iBAAA,GAAA,kBAAA,IAAA,CAACC,wBAAAA,eAAD;EAAe,WAAU;EAAe,OAAO;EAAI,QAAQ;CAAK,CAAA;CAGzE,IAAI,SAAS,WACX,OAAO,iBAAA,GAAA,kBAAA,IAAA,CAACC,yBAAAA,gBAAD;EAAgB,WAAU;EAAe,OAAO;EAAI,QAAQ;CAAK,CAAA;CAG1E,OAAO;AACT;AAEA,MAAM,kBACJ,UACwC;CACxC,MAAM,OAAgC,CAAC;CACvC,MAAM,UAAU,IAAI,IAAY,SAAS;CAEzC,KAAK,MAAM,CAAC,KAAK,UAAU,OAAO,QAAQ,KAAK,GAC7C,IAAI,CAAC,QAAQ,IAAI,GAAG,GAAG,KAAK,OAAO;CAGrC,OAAO;AACT;AAEA,MAAa,UAAA,GAASC,MAAAA,WAAAA,CAGpB,SAAS,OAAO,OAAO,KAAK;CAC5B,MAAM,OAAO,MAAM,QAAQ;CAC3B,MAAM,EAAE,MAAM,YAAY;CAC1B,MAAM,YAAY,aAAa,KAAK;CACpC,MAAM,EAAE,UAAU,MAAM,GAAG,aAAa,eAAe,KAAK;CAC5D,MAAM,QAAQ,YAAY,MAAM,SAAS,IAAI;CAC7C,MAAM,SAAS,SAAS;CACxB,MAAM,UACJ,iBAAA,GAAA,kBAAA,KAAA,CAAA,kBAAA,UAAA,EAAA,UAAA;EACG,SAAS,QAAQ;EACjB;EACA,SAAS,OAAO;CACjB,EAAA,CAAA;CAGJ,IAAI,OAAO,SAAS,UAAU;EAC5B,MAAM,EAAE,SAAS,GAAG,gBAClB;EAEF,MAAM,eAAoD,UAAS;GACjE,IAAI,SAAS;IACX,MAAM,eAAe;IACrB;GACF;GACA,UAAU,KAAK;EACjB;EAEA,OACE,iBAAA,GAAA,kBAAA,IAAA,CAAC,KAAD;GACO;GACC;GACK;GACX,GAAI;GACJ,aAAW,WAAW,KAAA;GACtB,iBAAe,WAAW,KAAA;GAC1B,SAAS;GAER,UAAA;EACA,CAAA;CAEP;CAEA,MAAM,EACJ,OAAO,UACP,UACA,SACA,GAAG,gBACD;CAEJ,MAAM,eAAoD,UAAS;EACjE,IAAI,YAAY,SAAS;EACzB,UAAU,KAAK;CACjB;CAEA,OACE,iBAAA,GAAA,kBAAA,IAAA,CAAC,UAAD;EACO;EACM;EACL;EACI;EACV,GAAI;EACJ,aAAW,WAAW,KAAA;EACtB,SAAS;EAER,UAAA;CACK,CAAA;AAEZ,CAAC"}
+{"version":3,"file":"button.cjs","names":["cn","when","forwardRef"],"sources":["../../../src/components/button/button.tsx"],"sourcesContent":["import {\n  forwardRef,\n  type AnchorHTMLAttributes,\n  type ButtonHTMLAttributes,\n  type MouseEventHandler,\n  type ReactNode,\n  type Ref,\n} from 'react';\n\nimport { cn, when } from '../../lib/cn';\nimport './button.scss';\n\nexport type ButtonVariant = 'default' | 'outline' | 'link';\nexport type ButtonSize = 'sm' | 'md' | 'lg';\n\ninterface ButtonStyleProps {\n  variant?: ButtonVariant;\n  size?: ButtonSize;\n  fullWidth?: boolean;\n  className?: string;\n  children?: ReactNode;\n}\n\nexport interface ButtonProps\n  extends ButtonHTMLAttributes<HTMLButtonElement>, ButtonStyleProps {\n  href?: undefined;\n}\n\nexport interface ButtonLinkProps\n  extends\n    Omit<AnchorHTMLAttributes<HTMLAnchorElement>, 'href'>,\n    ButtonStyleProps {\n  href: string;\n}\n\nexport type ButtonComponentProps = ButtonProps | ButtonLinkProps;\n\nconst styleKeys = ['variant', 'size', 'fullWidth', 'className'] as const;\n\nconst getClassName = ({\n  variant = 'default',\n  size = 'md',\n  fullWidth = false,\n  className,\n  disabled,\n}: ButtonStyleProps & { disabled?: boolean }) =>\n  cn(\n    'button',\n    className,\n    when(variant !== 'default', `button--${variant}`),\n    when(size !== 'md', `button--${size}`),\n    when(fullWidth, 'button--full-width'),\n    when(disabled, 'button--disabled'),\n  );\n\nconst omitStyleProps = <T extends ButtonStyleProps>(\n  props: T,\n): Omit<T, (typeof styleKeys)[number]> => {\n  const next: Record<string, unknown> = {};\n  const skipped = new Set<string>(styleKeys);\n\n  for (const [key, value] of Object.entries(props)) {\n    if (!skipped.has(key)) next[key] = value;\n  }\n\n  return next as Omit<T, (typeof styleKeys)[number]>;\n};\n\nexport const Button = forwardRef<\n  HTMLButtonElement | HTMLAnchorElement,\n  ButtonComponentProps\n>(function Button(props, ref) {\n  const className = getClassName(props);\n  const { children, href, ...domProps } = omitStyleProps(props);\n\n  if (typeof href === 'string') {\n    return (\n      <a\n        ref={ref as Ref<HTMLAnchorElement>}\n        href={href}\n        className={className}\n        {...(domProps as AnchorHTMLAttributes<HTMLAnchorElement>)}\n      >\n        {children}\n      </a>\n    );\n  }\n\n  const {\n    type = 'button',\n    disabled,\n    onClick,\n    ...buttonProps\n  } = domProps as ButtonHTMLAttributes<HTMLButtonElement>;\n\n  const handleClick: MouseEventHandler<HTMLButtonElement> = event => {\n    if (disabled) return;\n    onClick?.(event);\n  };\n\n  return (\n    <button\n      ref={ref as Ref<HTMLButtonElement>}\n      className={className}\n      type={type}\n      disabled={disabled}\n      onClick={handleClick}\n      {...buttonProps}\n    >\n      {children}\n    </button>\n  );\n});\n"],"mappings":";;;;;AAqCA,MAAM,YAAY;CAAC;CAAW;CAAQ;CAAa;AAAW;AAE9D,MAAM,gBAAgB,EACpB,UAAU,WACV,OAAO,MACP,YAAY,OACZ,WACA,eAEAA,WAAAA,GACE,UACA,WACAC,WAAAA,KAAK,YAAY,WAAW,WAAW,SAAS,GAChDA,WAAAA,KAAK,SAAS,MAAM,WAAW,MAAM,GACrCA,WAAAA,KAAK,WAAW,oBAAoB,GACpCA,WAAAA,KAAK,UAAU,kBAAkB,CACnC;AAEF,MAAM,kBACJ,UACwC;CACxC,MAAM,OAAgC,CAAC;CACvC,MAAM,UAAU,IAAI,IAAY,SAAS;CAEzC,KAAK,MAAM,CAAC,KAAK,UAAU,OAAO,QAAQ,KAAK,GAC7C,IAAI,CAAC,QAAQ,IAAI,GAAG,GAAG,KAAK,OAAO;CAGrC,OAAO;AACT;AAEA,MAAa,UAAA,GAASC,MAAAA,WAAAA,CAGpB,SAAS,OAAO,OAAO,KAAK;CAC5B,MAAM,YAAY,aAAa,KAAK;CACpC,MAAM,EAAE,UAAU,MAAM,GAAG,aAAa,eAAe,KAAK;CAE5D,IAAI,OAAO,SAAS,UAClB,OACE,iBAAA,GAAA,kBAAA,IAAA,CAAC,KAAD;EACO;EACC;EACK;EACX,GAAK;EAEJ;CACA,CAAA;CAIP,MAAM,EACJ,OAAO,UACP,UACA,SACA,GAAG,gBACD;CAEJ,MAAM,eAAoD,UAAS;EACjE,IAAI,UAAU;EACd,UAAU,KAAK;CACjB;CAEA,OACE,iBAAA,GAAA,kBAAA,IAAA,CAAC,UAAD;EACO;EACM;EACL;EACI;EACV,SAAS;EACT,GAAI;EAEH;CACK,CAAA;AAEZ,CAAC"}

package/dist/components/button/button.d.cts

@@ -1,13 +1,10 @@
 import { AnchorHTMLAttributes, ButtonHTMLAttributes, ReactNode } from "react";
 export type ButtonVariant = 'default' | 'outline' | 'link';
 export type ButtonSize = 'sm' | 'md' | 'lg';
-export type ButtonIcon = 'back' | 'forward';
 interface ButtonStyleProps {
   variant?: ButtonVariant;
   size?: ButtonSize;
   fullWidth?: boolean;
-  icon?: ButtonIcon;
-  loading?: boolean;
   className?: string;
   children?: ReactNode;
 }

package/dist/components/button/button.d.ts

@@ -1,13 +1,10 @@
 import { AnchorHTMLAttributes, ButtonHTMLAttributes, ReactNode } from "react";
 export type ButtonVariant = 'default' | 'outline' | 'link';
 export type ButtonSize = 'sm' | 'md' | 'lg';
-export type ButtonIcon = 'back' | 'forward';
 interface ButtonStyleProps {
   variant?: ButtonVariant;
   size?: ButtonSize;
   fullWidth?: boolean;
-  icon?: ButtonIcon;
-  loading?: boolean;
   className?: string;
   children?: ReactNode;
 }

package/dist/components/button/button.js

@@ -1,44 +1,15 @@
-import { IconArrowLeft } from "../../icons/icon-arrow-left.js";
-import { IconArrowRight } from "../../icons/icon-arrow-right.js";
-import { IconSpinner } from "../../icons/icon-spinner.js";
 import { cn, when } from "../../lib/cn.js";
 import { forwardRef } from "react";
-import { Fragment, jsx, jsxs } from "react/jsx-runtime";
 import "./button.scss";
+import { jsx } from "react/jsx-runtime";
 // src/components/button/button.tsx
 const styleKeys = [
 	"variant",
 	"size",
 	"fullWidth",
-	"icon",
-	"loading",
 	"className"
 ];
-const iconSize = {
-	sm: 16,
-	md: 20,
-	lg: 24
-};
-const getClassName = ({ variant = "default", size = "md", fullWidth = false, loading = false, className, disabled }) => cn("button", className, `button--${variant}`, `button--${size}`, when(fullWidth, "button--full-width"), when(disabled, "button--disabled"), when(loading, "button--loading"));
-const renderGlyph = (icon, loading, size) => {
-	const px = iconSize[size];
-	if (loading) return /* @__PURE__ */ jsx(IconSpinner, {
-		className: "button__icon button__icon--spin",
-		width: px,
-		height: px
-	});
-	if (icon === "back") return /* @__PURE__ */ jsx(IconArrowLeft, {
-		className: "button__icon",
-		width: px,
-		height: px
-	});
-	if (icon === "forward") return /* @__PURE__ */ jsx(IconArrowRight, {
-		className: "button__icon",
-		width: px,
-		height: px
-	});
-	return null;
-};
+const getClassName = ({ variant = "default", size = "md", fullWidth = false, className, disabled }) => cn("button", className, when(variant !== "default", `button--${variant}`), when(size !== "md", `button--${size}`), when(fullWidth, "button--full-width"), when(disabled, "button--disabled"));
 const omitStyleProps = (props) => {
 	const next = {};
 	const skipped = new Set(styleKeys);
@@ -46,40 +17,18 @@ const omitStyleProps = (props) => {
 	return next;
 };
 const Button = forwardRef(function Button(props, ref) {
-	const size = props.size ?? "md";
-	const { icon, loading } = props;
 	const className = getClassName(props);
 	const { children, href, ...domProps } = omitStyleProps(props);
-	const glyph = renderGlyph(icon, loading, size);
-	const before = icon !== "forward";
-	const content = /* @__PURE__ */ jsxs(Fragment, { children: [
-		before ? glyph : null,
-		children,
-		before ? null : glyph
-	] });
-	if (typeof href === "string") {
-		const { onClick, ...anchorProps } = domProps;
-		const handleClick = (event) => {
-			if (loading) {
-				event.preventDefault();
-				return;
-			}
-			onClick?.(event);
-		};
-		return /* @__PURE__ */ jsx("a", {
-			ref,
-			href,
-			className,
-			...anchorProps,
-			"aria-busy": loading || void 0,
-			"aria-disabled": loading || void 0,
-			onClick: handleClick,
-			children: content
-		});
-	}
+	if (typeof href === "string") return /* @__PURE__ */ jsx("a", {
+		ref,
+		href,
+		className,
+		...domProps,
+		children
+	});
 	const { type = "button", disabled, onClick, ...buttonProps } = domProps;
 	const handleClick = (event) => {
-		if (disabled || loading) return;
+		if (disabled) return;
 		onClick?.(event);
 	};
 	return /* @__PURE__ */ jsx("button", {
@@ -87,10 +36,9 @@ const Button = forwardRef(function Button(props, ref) {
 		className,
 		type,
 		disabled,
-		...buttonProps,
-		"aria-busy": loading || void 0,
 		onClick: handleClick,
-		children: content
+		...buttonProps,
+		children
 	});
 });
 export { Button };

package/dist/components/button/button.js.map

@@ -1 +1 @@
-{"version":3,"file":"button.js","names":[],"sources":["../../../src/components/button/button.tsx"],"sourcesContent":["import {\n  forwardRef,\n  type AnchorHTMLAttributes,\n  type ButtonHTMLAttributes,\n  type MouseEventHandler,\n  type ReactNode,\n  type Ref,\n} from 'react';\n\nimport { IconArrowLeft } from '../../icons/icon-arrow-left';\nimport { IconArrowRight } from '../../icons/icon-arrow-right';\nimport { IconSpinner } from '../../icons/icon-spinner';\nimport { cn, when } from '../../lib/cn';\nimport './button.scss';\n\nexport type ButtonVariant = 'default' | 'outline' | 'link';\nexport type ButtonSize = 'sm' | 'md' | 'lg';\nexport type ButtonIcon = 'back' | 'forward';\n\ninterface ButtonStyleProps {\n  variant?: ButtonVariant;\n  size?: ButtonSize;\n  fullWidth?: boolean;\n  icon?: ButtonIcon;\n  loading?: boolean;\n  className?: string;\n  children?: ReactNode;\n}\n\nexport interface ButtonProps\n  extends ButtonHTMLAttributes<HTMLButtonElement>, ButtonStyleProps {\n  href?: undefined;\n}\n\nexport interface ButtonLinkProps\n  extends\n    Omit<AnchorHTMLAttributes<HTMLAnchorElement>, 'href'>,\n    ButtonStyleProps {\n  href: string;\n}\n\nexport type ButtonComponentProps = ButtonProps | ButtonLinkProps;\n\nconst styleKeys = [\n  'variant',\n  'size',\n  'fullWidth',\n  'icon',\n  'loading',\n  'className',\n] as const;\n\nconst iconSize = {\n  sm: 16,\n  md: 20,\n  lg: 24,\n} as const;\n\nconst getClassName = ({\n  variant = 'default',\n  size = 'md',\n  fullWidth = false,\n  loading = false,\n  className,\n  disabled,\n}: ButtonStyleProps & { disabled?: boolean }) =>\n  cn(\n    'button',\n    className,\n    `button--${variant}`,\n    `button--${size}`,\n    when(fullWidth, 'button--full-width'),\n    when(disabled, 'button--disabled'),\n    when(loading, 'button--loading'),\n  );\n\nconst renderGlyph = (\n  icon: ButtonIcon | undefined,\n  loading: boolean | undefined,\n  size: ButtonSize,\n) => {\n  const px = iconSize[size];\n\n  if (loading) {\n    return (\n      <IconSpinner\n        className=\"button__icon button__icon--spin\"\n        width={px}\n        height={px}\n      />\n    );\n  }\n\n  if (icon === 'back') {\n    return <IconArrowLeft className=\"button__icon\" width={px} height={px} />;\n  }\n\n  if (icon === 'forward') {\n    return <IconArrowRight className=\"button__icon\" width={px} height={px} />;\n  }\n\n  return null;\n};\n\nconst omitStyleProps = <T extends ButtonStyleProps>(\n  props: T,\n): Omit<T, (typeof styleKeys)[number]> => {\n  const next: Record<string, unknown> = {};\n  const skipped = new Set<string>(styleKeys);\n\n  for (const [key, value] of Object.entries(props)) {\n    if (!skipped.has(key)) next[key] = value;\n  }\n\n  return next as Omit<T, (typeof styleKeys)[number]>;\n};\n\nexport const Button = forwardRef<\n  HTMLButtonElement | HTMLAnchorElement,\n  ButtonComponentProps\n>(function Button(props, ref) {\n  const size = props.size ?? 'md';\n  const { icon, loading } = props;\n  const className = getClassName(props);\n  const { children, href, ...domProps } = omitStyleProps(props);\n  const glyph = renderGlyph(icon, loading, size);\n  const before = icon !== 'forward';\n  const content = (\n    <>\n      {before ? glyph : null}\n      {children}\n      {before ? null : glyph}\n    </>\n  );\n\n  if (typeof href === 'string') {\n    const { onClick, ...anchorProps } =\n      domProps as AnchorHTMLAttributes<HTMLAnchorElement>;\n\n    const handleClick: MouseEventHandler<HTMLAnchorElement> = event => {\n      if (loading) {\n        event.preventDefault();\n        return;\n      }\n      onClick?.(event);\n    };\n\n    return (\n      <a\n        ref={ref as Ref<HTMLAnchorElement>}\n        href={href}\n        className={className}\n        {...anchorProps}\n        aria-busy={loading || undefined}\n        aria-disabled={loading || undefined}\n        onClick={handleClick}\n      >\n        {content}\n      </a>\n    );\n  }\n\n  const {\n    type = 'button',\n    disabled,\n    onClick,\n    ...buttonProps\n  } = domProps as ButtonHTMLAttributes<HTMLButtonElement>;\n\n  const handleClick: MouseEventHandler<HTMLButtonElement> = event => {\n    if (disabled || loading) return;\n    onClick?.(event);\n  };\n\n  return (\n    <button\n      ref={ref as Ref<HTMLButtonElement>}\n      className={className}\n      type={type}\n      disabled={disabled}\n      {...buttonProps}\n      aria-busy={loading || undefined}\n      onClick={handleClick}\n    >\n      {content}\n    </button>\n  );\n});\n"],"mappings":";;;;;;;;AA2CA,MAAM,YAAY;CAChB;CACA;CACA;CACA;CACA;CACA;AACF;AAEA,MAAM,WAAW;CACf,IAAI;CACJ,IAAI;CACJ,IAAI;AACN;AAEA,MAAM,gBAAgB,EACpB,UAAU,WACV,OAAO,MACP,YAAY,OACZ,UAAU,OACV,WACA,eAEA,GACE,UACA,WACA,WAAW,WACX,WAAW,QACX,KAAK,WAAW,oBAAoB,GACpC,KAAK,UAAU,kBAAkB,GACjC,KAAK,SAAS,iBAAiB,CACjC;AAEF,MAAM,eACJ,MACA,SACA,SACG;CACH,MAAM,KAAK,SAAS;CAEpB,IAAI,SACF,OACE,oBAAC,aAAD;EACE,WAAU;EACV,OAAO;EACP,QAAQ;CACT,CAAA;CAIL,IAAI,SAAS,QACX,OAAO,oBAAC,eAAD;EAAe,WAAU;EAAe,OAAO;EAAI,QAAQ;CAAK,CAAA;CAGzE,IAAI,SAAS,WACX,OAAO,oBAAC,gBAAD;EAAgB,WAAU;EAAe,OAAO;EAAI,QAAQ;CAAK,CAAA;CAG1E,OAAO;AACT;AAEA,MAAM,kBACJ,UACwC;CACxC,MAAM,OAAgC,CAAC;CACvC,MAAM,UAAU,IAAI,IAAY,SAAS;CAEzC,KAAK,MAAM,CAAC,KAAK,UAAU,OAAO,QAAQ,KAAK,GAC7C,IAAI,CAAC,QAAQ,IAAI,GAAG,GAAG,KAAK,OAAO;CAGrC,OAAO;AACT;AAEA,MAAa,SAAS,WAGpB,SAAS,OAAO,OAAO,KAAK;CAC5B,MAAM,OAAO,MAAM,QAAQ;CAC3B,MAAM,EAAE,MAAM,YAAY;CAC1B,MAAM,YAAY,aAAa,KAAK;CACpC,MAAM,EAAE,UAAU,MAAM,GAAG,aAAa,eAAe,KAAK;CAC5D,MAAM,QAAQ,YAAY,MAAM,SAAS,IAAI;CAC7C,MAAM,SAAS,SAAS;CACxB,MAAM,UACJ,qBAAA,UAAA,EAAA,UAAA;EACG,SAAS,QAAQ;EACjB;EACA,SAAS,OAAO;CACjB,EAAA,CAAA;CAGJ,IAAI,OAAO,SAAS,UAAU;EAC5B,MAAM,EAAE,SAAS,GAAG,gBAClB;EAEF,MAAM,eAAoD,UAAS;GACjE,IAAI,SAAS;IACX,MAAM,eAAe;IACrB;GACF;GACA,UAAU,KAAK;EACjB;EAEA,OACE,oBAAC,KAAD;GACO;GACC;GACK;GACX,GAAI;GACJ,aAAW,WAAW,KAAA;GACtB,iBAAe,WAAW,KAAA;GAC1B,SAAS;GAER,UAAA;EACA,CAAA;CAEP;CAEA,MAAM,EACJ,OAAO,UACP,UACA,SACA,GAAG,gBACD;CAEJ,MAAM,eAAoD,UAAS;EACjE,IAAI,YAAY,SAAS;EACzB,UAAU,KAAK;CACjB;CAEA,OACE,oBAAC,UAAD;EACO;EACM;EACL;EACI;EACV,GAAI;EACJ,aAAW,WAAW,KAAA;EACtB,SAAS;EAER,UAAA;CACK,CAAA;AAEZ,CAAC"}
+{"version":3,"file":"button.js","names":[],"sources":["../../../src/components/button/button.tsx"],"sourcesContent":["import {\n  forwardRef,\n  type AnchorHTMLAttributes,\n  type ButtonHTMLAttributes,\n  type MouseEventHandler,\n  type ReactNode,\n  type Ref,\n} from 'react';\n\nimport { cn, when } from '../../lib/cn';\nimport './button.scss';\n\nexport type ButtonVariant = 'default' | 'outline' | 'link';\nexport type ButtonSize = 'sm' | 'md' | 'lg';\n\ninterface ButtonStyleProps {\n  variant?: ButtonVariant;\n  size?: ButtonSize;\n  fullWidth?: boolean;\n  className?: string;\n  children?: ReactNode;\n}\n\nexport interface ButtonProps\n  extends ButtonHTMLAttributes<HTMLButtonElement>, ButtonStyleProps {\n  href?: undefined;\n}\n\nexport interface ButtonLinkProps\n  extends\n    Omit<AnchorHTMLAttributes<HTMLAnchorElement>, 'href'>,\n    ButtonStyleProps {\n  href: string;\n}\n\nexport type ButtonComponentProps = ButtonProps | ButtonLinkProps;\n\nconst styleKeys = ['variant', 'size', 'fullWidth', 'className'] as const;\n\nconst getClassName = ({\n  variant = 'default',\n  size = 'md',\n  fullWidth = false,\n  className,\n  disabled,\n}: ButtonStyleProps & { disabled?: boolean }) =>\n  cn(\n    'button',\n    className,\n    when(variant !== 'default', `button--${variant}`),\n    when(size !== 'md', `button--${size}`),\n    when(fullWidth, 'button--full-width'),\n    when(disabled, 'button--disabled'),\n  );\n\nconst omitStyleProps = <T extends ButtonStyleProps>(\n  props: T,\n): Omit<T, (typeof styleKeys)[number]> => {\n  const next: Record<string, unknown> = {};\n  const skipped = new Set<string>(styleKeys);\n\n  for (const [key, value] of Object.entries(props)) {\n    if (!skipped.has(key)) next[key] = value;\n  }\n\n  return next as Omit<T, (typeof styleKeys)[number]>;\n};\n\nexport const Button = forwardRef<\n  HTMLButtonElement | HTMLAnchorElement,\n  ButtonComponentProps\n>(function Button(props, ref) {\n  const className = getClassName(props);\n  const { children, href, ...domProps } = omitStyleProps(props);\n\n  if (typeof href === 'string') {\n    return (\n      <a\n        ref={ref as Ref<HTMLAnchorElement>}\n        href={href}\n        className={className}\n        {...(domProps as AnchorHTMLAttributes<HTMLAnchorElement>)}\n      >\n        {children}\n      </a>\n    );\n  }\n\n  const {\n    type = 'button',\n    disabled,\n    onClick,\n    ...buttonProps\n  } = domProps as ButtonHTMLAttributes<HTMLButtonElement>;\n\n  const handleClick: MouseEventHandler<HTMLButtonElement> = event => {\n    if (disabled) return;\n    onClick?.(event);\n  };\n\n  return (\n    <button\n      ref={ref as Ref<HTMLButtonElement>}\n      className={className}\n      type={type}\n      disabled={disabled}\n      onClick={handleClick}\n      {...buttonProps}\n    >\n      {children}\n    </button>\n  );\n});\n"],"mappings":";;;;;AAqCA,MAAM,YAAY;CAAC;CAAW;CAAQ;CAAa;AAAW;AAE9D,MAAM,gBAAgB,EACpB,UAAU,WACV,OAAO,MACP,YAAY,OACZ,WACA,eAEA,GACE,UACA,WACA,KAAK,YAAY,WAAW,WAAW,SAAS,GAChD,KAAK,SAAS,MAAM,WAAW,MAAM,GACrC,KAAK,WAAW,oBAAoB,GACpC,KAAK,UAAU,kBAAkB,CACnC;AAEF,MAAM,kBACJ,UACwC;CACxC,MAAM,OAAgC,CAAC;CACvC,MAAM,UAAU,IAAI,IAAY,SAAS;CAEzC,KAAK,MAAM,CAAC,KAAK,UAAU,OAAO,QAAQ,KAAK,GAC7C,IAAI,CAAC,QAAQ,IAAI,GAAG,GAAG,KAAK,OAAO;CAGrC,OAAO;AACT;AAEA,MAAa,SAAS,WAGpB,SAAS,OAAO,OAAO,KAAK;CAC5B,MAAM,YAAY,aAAa,KAAK;CACpC,MAAM,EAAE,UAAU,MAAM,GAAG,aAAa,eAAe,KAAK;CAE5D,IAAI,OAAO,SAAS,UAClB,OACE,oBAAC,KAAD;EACO;EACC;EACK;EACX,GAAK;EAEJ;CACA,CAAA;CAIP,MAAM,EACJ,OAAO,UACP,UACA,SACA,GAAG,gBACD;CAEJ,MAAM,eAAoD,UAAS;EACjE,IAAI,UAAU;EACd,UAAU,KAAK;CACjB;CAEA,OACE,oBAAC,UAAD;EACO;EACM;EACL;EACI;EACV,SAAS;EACT,GAAI;EAEH;CACK,CAAA;AAEZ,CAAC"}

package/dist/components/button/button.scss

@@ -3,7 +3,7 @@
   width: fit-content;
   display: flex;
   align-items: center;
-  padding: 10px 18px;
+  padding: 10px 20px;
   border-radius: 30px;
   font-size: 14px;
   line-height: 20px;
@@ -22,14 +22,14 @@
   &:active {
     background-color: var(--color-neutral-200);
     color: var(--color-neutral-500);
-    fill: var(--color-neutral-500);
+    fill: currentColor;
     border-color: var(--color-neutral-200);
   }
 
   &:disabled {
     background-color: var(--color-neutral-200);
     color: var(--color-neutral-500);
-    fill: var(--color-neutral-500);
+    fill: currentColor;
     border-color: var(--color-neutral-200);
     cursor: default;
     pointer-events: none;
@@ -39,46 +39,25 @@
   &--outline {
     background-color: transparent;
     color: var(--color-black);
-    fill: var(--color-black);
+    fill: currentColor;
     border: 2px solid var(--color-black);
 
     &:disabled {
       background-color: transparent;
-      border: 2px solid var(--color-black);
     }
   }
 
-  &--sm {
-    padding: 6px 12px;
-    font-size: 12px;
-    line-height: 16px;
-  }
-
-  &--lg {
-    padding: 14px 24px;
-    font-size: 16px;
-    line-height: 24px;
-  }
-
-  &--full-width {
-    width: 100%;
-    justify-content: center;
-  }
-
   &--link {
     border: none;
     background-color: transparent;
     color: var(--color-black);
-    fill: var(--color-black);
+    fill: currentColor;
     border-radius: 0;
     padding: 0;
-    font-weight: 400;
 
     &:active,
     &:disabled {
       background-color: transparent;
-      color: rgba(0, 0, 0, 0.5);
-      fill: rgba(0, 0, 0, 0.5);
     }
   }
 
@@ -92,13 +71,26 @@
     user-select: none;
   }
 
-  &--loading {
-    cursor: progress;
+  &--sm {
+    padding: 6px 12px;
+    font-size: 12px;
+    line-height: 16px;
   }
-}
 
-.button__icon {
-  flex-shrink: 0;
+  &--lg {
+    padding: 14px 24px;
+    font-size: 16px;
+    line-height: 24px;
+  }
+
+  &--full-width {
+    width: 100%;
+    justify-content: center;
+  }
+
+  svg {
+    flex-shrink: 0;
+  }
 }
 
 .button__icon--spin {

package/dist/components/button/index.d.cts

@@ -1,2 +1,2 @@
-import { Button, ButtonComponentProps, ButtonIcon, ButtonLinkProps, ButtonProps, ButtonSize, ButtonVariant } from "./button.cjs";
-export { Button, type ButtonComponentProps, type ButtonIcon, type ButtonLinkProps, type ButtonProps, type ButtonSize, type ButtonVariant };
+import { Button, ButtonComponentProps, ButtonLinkProps, ButtonProps, ButtonSize, ButtonVariant } from "./button.cjs";
+export { Button, type ButtonComponentProps, type ButtonLinkProps, type ButtonProps, type ButtonSize, type ButtonVariant };

package/dist/components/button/index.d.ts

@@ -1,2 +1,2 @@
-import { Button, ButtonComponentProps, ButtonIcon, ButtonLinkProps, ButtonProps, ButtonSize, ButtonVariant } from "./button.js";
-export { Button, type ButtonComponentProps, type ButtonIcon, type ButtonLinkProps, type ButtonProps, type ButtonSize, type ButtonVariant };
+import { Button, ButtonComponentProps, ButtonLinkProps, ButtonProps, ButtonSize, ButtonVariant } from "./button.js";
+export { Button, type ButtonComponentProps, type ButtonLinkProps, type ButtonProps, type ButtonSize, type ButtonVariant };

package/dist/icons/icon-pause.cjs

@@ -0,0 +1,14 @@
+const require_svg = require("./svg.cjs");
+let react_jsx_runtime = require("react/jsx-runtime");
+// src/icons/icon-pause.tsx
+const IconPause = (props) => /* @__PURE__ */ (0, react_jsx_runtime.jsx)(require_svg.Svg, {
+	viewBox: "0 0 20 20",
+	width: 20,
+	height: 20,
+	fill: "currentColor",
+	...props,
+	children: /* @__PURE__ */ (0, react_jsx_runtime.jsx)("path", { d: "M7,16L7,16c-0.6,0-1-0.4-1-1V5c0-0.6,0.4-1,1-1h0c0.6,0,1,0.4,1,1v10C8,15.6,7.6,16,7,16z M13,16L13,16c-0.6,0-1-0.4-1-1V5 c0-0.6,0.4-1,1-1h0c0.6,0,1,0.4,1,1v10C14,15.6,13.5,16,13,16z" })
+});
+exports.IconPause = IconPause;
+
+//# sourceMappingURL=icon-pause.cjs.map

package/dist/icons/icon-pause.cjs.map

@@ -0,0 +1 @@
+{"version":3,"file":"icon-pause.cjs","names":["Svg"],"sources":["../../src/icons/icon-pause.tsx"],"sourcesContent":["// Generated by scripts/build-icons.mjs. Do not edit.\nimport { Svg, type IconProps } from './svg';\n\nexport const IconPause = (props: IconProps) => (\n  <Svg\n    viewBox=\"0 0 20 20\"\n    width={20}\n    height={20}\n    fill=\"currentColor\"\n    {...props}\n  >\n    <path d=\"M7,16L7,16c-0.6,0-1-0.4-1-1V5c0-0.6,0.4-1,1-1h0c0.6,0,1,0.4,1,1v10C8,15.6,7.6,16,7,16z M13,16L13,16c-0.6,0-1-0.4-1-1V5 c0-0.6,0.4-1,1-1h0c0.6,0,1,0.4,1,1v10C14,15.6,13.5,16,13,16z\" />\n  </Svg>\n);\n"],"mappings":";;;AAGA,MAAa,aAAa,UACxB,iBAAA,GAAA,kBAAA,IAAA,CAACA,YAAAA,KAAD;CACE,SAAQ;CACR,OAAO;CACP,QAAQ;CACR,MAAK;CACL,GAAI;CAEJ,UAAA,iBAAA,GAAA,kBAAA,IAAA,CAAC,QAAD,EAAM,GAAE,sLAAuL,CAAA;AAC5L,CAAA"}

package/dist/icons/icon-pause.d.cts

@@ -0,0 +1,3 @@
+import { IconProps } from "./svg.cjs";
+export declare const IconPause: (props: IconProps) => import("react").JSX.Element;
+//# sourceMappingURL=icon-pause.d.cts.map

package/dist/icons/icon-pause.d.ts

@@ -0,0 +1,3 @@
+import { IconProps } from "./svg.js";
+export declare const IconPause: (props: IconProps) => import("react").JSX.Element;
+//# sourceMappingURL=icon-pause.d.ts.map

package/dist/icons/icon-pause.js

@@ -0,0 +1,14 @@
+import { Svg } from "./svg.js";
+import { jsx } from "react/jsx-runtime";
+// src/icons/icon-pause.tsx
+const IconPause = (props) => /* @__PURE__ */ jsx(Svg, {
+	viewBox: "0 0 20 20",
+	width: 20,
+	height: 20,
+	fill: "currentColor",
+	...props,
+	children: /* @__PURE__ */ jsx("path", { d: "M7,16L7,16c-0.6,0-1-0.4-1-1V5c0-0.6,0.4-1,1-1h0c0.6,0,1,0.4,1,1v10C8,15.6,7.6,16,7,16z M13,16L13,16c-0.6,0-1-0.4-1-1V5 c0-0.6,0.4-1,1-1h0c0.6,0,1,0.4,1,1v10C14,15.6,13.5,16,13,16z" })
+});
+export { IconPause };
+
+//# sourceMappingURL=icon-pause.js.map

package/dist/icons/icon-pause.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"icon-pause.js","names":[],"sources":["../../src/icons/icon-pause.tsx"],"sourcesContent":["// Generated by scripts/build-icons.mjs. Do not edit.\nimport { Svg, type IconProps } from './svg';\n\nexport const IconPause = (props: IconProps) => (\n  <Svg\n    viewBox=\"0 0 20 20\"\n    width={20}\n    height={20}\n    fill=\"currentColor\"\n    {...props}\n  >\n    <path d=\"M7,16L7,16c-0.6,0-1-0.4-1-1V5c0-0.6,0.4-1,1-1h0c0.6,0,1,0.4,1,1v10C8,15.6,7.6,16,7,16z M13,16L13,16c-0.6,0-1-0.4-1-1V5 c0-0.6,0.4-1,1-1h0c0.6,0,1,0.4,1,1v10C14,15.6,13.5,16,13,16z\" />\n  </Svg>\n);\n"],"mappings":";;;AAGA,MAAa,aAAa,UACxB,oBAAC,KAAD;CACE,SAAQ;CACR,OAAO;CACP,QAAQ;CACR,MAAK;CACL,GAAI;CAEJ,UAAA,oBAAC,QAAD,EAAM,GAAE,sLAAuL,CAAA;AAC5L,CAAA"}

package/dist/icons/index.cjs

@@ -1,11 +1,10 @@
 Object.defineProperty(exports, Symbol.toStringTag, { value: "Module" });
-const require_icon_arrow_left = require("./icon-arrow-left.cjs");
-const require_icon_arrow_right = require("./icon-arrow-right.cjs");
-const require_icon_spinner = require("./icon-spinner.cjs");
 const require_control_mark_checkbox = require("./control-mark-checkbox.cjs");
 const require_control_mark_radiobutton = require("./control-mark-radiobutton.cjs");
 const require_icon_adult = require("./icon-adult.cjs");
 const require_icon_arrow_down = require("./icon-arrow-down.cjs");
+const require_icon_arrow_left = require("./icon-arrow-left.cjs");
+const require_icon_arrow_right = require("./icon-arrow-right.cjs");
 const require_icon_arrow_up = require("./icon-arrow-up.cjs");
 const require_icon_audio = require("./icon-audio.cjs");
 const require_icon_barchart = require("./icon-barchart.cjs");
@@ -68,6 +67,7 @@ const require_icon_multiselect = require("./icon-multiselect.cjs");
 const require_icon_newwindow = require("./icon-newwindow.cjs");
 const require_icon_options = require("./icon-options.cjs");
 const require_icon_ozon = require("./icon-ozon.cjs");
+const require_icon_pause = require("./icon-pause.cjs");
 const require_icon_piechart = require("./icon-piechart.cjs");
 const require_icon_plus = require("./icon-plus.cjs");
 const require_icon_preview = require("./icon-preview.cjs");
@@ -79,6 +79,7 @@ const require_icon_search = require("./icon-search.cjs");
 const require_icon_shield = require("./icon-shield.cjs");
 const require_icon_sms_code = require("./icon-sms-code.cjs");
 const require_icon_sort = require("./icon-sort.cjs");
+const require_icon_spinner = require("./icon-spinner.cjs");
 const require_icon_star = require("./icon-star.cjs");
 const require_icon_switch_off = require("./icon-switch-off.cjs");
 const require_icon_switch_on = require("./icon-switch-on.cjs");
@@ -179,6 +180,7 @@ exports.IconMultiselect = require_icon_multiselect.IconMultiselect;
 exports.IconNewwindow = require_icon_newwindow.IconNewwindow;
 exports.IconOptions = require_icon_options.IconOptions;
 exports.IconOzon = require_icon_ozon.IconOzon;
+exports.IconPause = require_icon_pause.IconPause;
 exports.IconPiechart = require_icon_piechart.IconPiechart;
 exports.IconPlus = require_icon_plus.IconPlus;
 exports.IconPreview = require_icon_preview.IconPreview;

package/dist/icons/index.d.cts

@@ -67,6 +67,7 @@ import { IconMultiselect } from "./icon-multiselect.cjs";
 import { IconNewwindow } from "./icon-newwindow.cjs";
 import { IconOptions } from "./icon-options.cjs";
 import { IconOzon } from "./icon-ozon.cjs";
+import { IconPause } from "./icon-pause.cjs";
 import { IconPiechart } from "./icon-piechart.cjs";
 import { IconPlus } from "./icon-plus.cjs";
 import { IconPreview } from "./icon-preview.cjs";
@@ -111,4 +112,4 @@ import { LogoSplittest } from "./logo-splittest.cjs";
 import { LogoSplittestRu } from "./logo-splittest-ru.cjs";
 import { LogoUnionpay } from "./logo-unionpay.cjs";
 import { LogoVisa } from "./logo-visa.cjs";
-export { ControlMarkCheckbox, ControlMarkRadiobutton, IconAdult, IconArrowDown, IconArrowLeft, IconArrowRight, IconArrowUp, IconAudio, IconBarchart, IconBell, IconBox, IconBurger, IconCalendar, IconCamera, IconCard, IconCart, IconCharmap, IconClaim, IconClaimFull, IconClock, IconClose, IconCode, IconComment, IconConveyor, IconCopy, IconCorrect, IconCrop, IconCross, IconCycle, IconDivide, IconDownload, IconDrop, IconEdit, IconElama, IconEraser, IconFile, IconFolder, IconFunnel, IconGalleryNext, IconGalleryPrev, IconHeart, IconHeartFull, IconImage, IconIndicatorDonut, IconIndicatorDot, IconIndicatorDown, IconIndicatorProgress, IconIndicatorStar, IconIndicatorStarBig, IconIndicatorTick, IconIndicatorUp, IconInfo, IconInstagram, IconKey, IconLabelOzon, IconLabelWildberries, IconLabelYandex, IconLink, IconListOrdered, IconListUnordered, IconLock, IconMagic, IconMail, IconMinus, IconMultiselect, IconNewwindow, IconOptions, IconOzon, IconPiechart, IconPlus, IconPreview, type IconProps, IconRegulator, IconRotate90Ccw, IconScreenBig, IconScreenSmall, IconSearch, IconShield, IconSmsCode, IconSort, IconSpinner, IconStar, IconSwitchOff, IconSwitchOn, IconTable, IconTelegram, IconText, IconTrash, IconTypograph, IconUndo, IconUnite, IconUnlink, IconUpload, IconUser, IconVideo, IconVk, IconYoutube, IllustrationTestBest, IllustrationTestHeatmap, IllustrationTestMultiple, IllustrationTestOne, IllustrationTestOrder, IllustrationTestQuest, IllustrationTestQuestion, IllustrationTestStars, IllustrationTestTournament, LogoMastercard, LogoMir, LogoPaykeeper, LogoSplittest, LogoSplittestRu, LogoUnionpay, LogoVisa };
+export { ControlMarkCheckbox, ControlMarkRadiobutton, IconAdult, IconArrowDown, IconArrowLeft, IconArrowRight, IconArrowUp, IconAudio, IconBarchart, IconBell, IconBox, IconBurger, IconCalendar, IconCamera, IconCard, IconCart, IconCharmap, IconClaim, IconClaimFull, IconClock, IconClose, IconCode, IconComment, IconConveyor, IconCopy, IconCorrect, IconCrop, IconCross, IconCycle, IconDivide, IconDownload, IconDrop, IconEdit, IconElama, IconEraser, IconFile, IconFolder, IconFunnel, IconGalleryNext, IconGalleryPrev, IconHeart, IconHeartFull, IconImage, IconIndicatorDonut, IconIndicatorDot, IconIndicatorDown, IconIndicatorProgress, IconIndicatorStar, IconIndicatorStarBig, IconIndicatorTick, IconIndicatorUp, IconInfo, IconInstagram, IconKey, IconLabelOzon, IconLabelWildberries, IconLabelYandex, IconLink, IconListOrdered, IconListUnordered, IconLock, IconMagic, IconMail, IconMinus, IconMultiselect, IconNewwindow, IconOptions, IconOzon, IconPause, IconPiechart, IconPlus, IconPreview, type IconProps, IconRegulator, IconRotate90Ccw, IconScreenBig, IconScreenSmall, IconSearch, IconShield, IconSmsCode, IconSort, IconSpinner, IconStar, IconSwitchOff, IconSwitchOn, IconTable, IconTelegram, IconText, IconTrash, IconTypograph, IconUndo, IconUnite, IconUnlink, IconUpload, IconUser, IconVideo, IconVk, IconYoutube, IllustrationTestBest, IllustrationTestHeatmap, IllustrationTestMultiple, IllustrationTestOne, IllustrationTestOrder, IllustrationTestQuest, IllustrationTestQuestion, IllustrationTestStars, IllustrationTestTournament, LogoMastercard, LogoMir, LogoPaykeeper, LogoSplittest, LogoSplittestRu, LogoUnionpay, LogoVisa };

package/dist/icons/index.d.ts

@@ -67,6 +67,7 @@ import { IconMultiselect } from "./icon-multiselect.js";
 import { IconNewwindow } from "./icon-newwindow.js";
 import { IconOptions } from "./icon-options.js";
 import { IconOzon } from "./icon-ozon.js";
+import { IconPause } from "./icon-pause.js";
 import { IconPiechart } from "./icon-piechart.js";
 import { IconPlus } from "./icon-plus.js";
 import { IconPreview } from "./icon-preview.js";
@@ -111,4 +112,4 @@ import { LogoSplittest } from "./logo-splittest.js";
 import { LogoSplittestRu } from "./logo-splittest-ru.js";
 import { LogoUnionpay } from "./logo-unionpay.js";
 import { LogoVisa } from "./logo-visa.js";
-export { ControlMarkCheckbox, ControlMarkRadiobutton, IconAdult, IconArrowDown, IconArrowLeft, IconArrowRight, IconArrowUp, IconAudio, IconBarchart, IconBell, IconBox, IconBurger, IconCalendar, IconCamera, IconCard, IconCart, IconCharmap, IconClaim, IconClaimFull, IconClock, IconClose, IconCode, IconComment, IconConveyor, IconCopy, IconCorrect, IconCrop, IconCross, IconCycle, IconDivide, IconDownload, IconDrop, IconEdit, IconElama, IconEraser, IconFile, IconFolder, IconFunnel, IconGalleryNext, IconGalleryPrev, IconHeart, IconHeartFull, IconImage, IconIndicatorDonut, IconIndicatorDot, IconIndicatorDown, IconIndicatorProgress, IconIndicatorStar, IconIndicatorStarBig, IconIndicatorTick, IconIndicatorUp, IconInfo, IconInstagram, IconKey, IconLabelOzon, IconLabelWildberries, IconLabelYandex, IconLink, IconListOrdered, IconListUnordered, IconLock, IconMagic, IconMail, IconMinus, IconMultiselect, IconNewwindow, IconOptions, IconOzon, IconPiechart, IconPlus, IconPreview, type IconProps, IconRegulator, IconRotate90Ccw, IconScreenBig, IconScreenSmall, IconSearch, IconShield, IconSmsCode, IconSort, IconSpinner, IconStar, IconSwitchOff, IconSwitchOn, IconTable, IconTelegram, IconText, IconTrash, IconTypograph, IconUndo, IconUnite, IconUnlink, IconUpload, IconUser, IconVideo, IconVk, IconYoutube, IllustrationTestBest, IllustrationTestHeatmap, IllustrationTestMultiple, IllustrationTestOne, IllustrationTestOrder, IllustrationTestQuest, IllustrationTestQuestion, IllustrationTestStars, IllustrationTestTournament, LogoMastercard, LogoMir, LogoPaykeeper, LogoSplittest, LogoSplittestRu, LogoUnionpay, LogoVisa };
+export { ControlMarkCheckbox, ControlMarkRadiobutton, IconAdult, IconArrowDown, IconArrowLeft, IconArrowRight, IconArrowUp, IconAudio, IconBarchart, IconBell, IconBox, IconBurger, IconCalendar, IconCamera, IconCard, IconCart, IconCharmap, IconClaim, IconClaimFull, IconClock, IconClose, IconCode, IconComment, IconConveyor, IconCopy, IconCorrect, IconCrop, IconCross, IconCycle, IconDivide, IconDownload, IconDrop, IconEdit, IconElama, IconEraser, IconFile, IconFolder, IconFunnel, IconGalleryNext, IconGalleryPrev, IconHeart, IconHeartFull, IconImage, IconIndicatorDonut, IconIndicatorDot, IconIndicatorDown, IconIndicatorProgress, IconIndicatorStar, IconIndicatorStarBig, IconIndicatorTick, IconIndicatorUp, IconInfo, IconInstagram, IconKey, IconLabelOzon, IconLabelWildberries, IconLabelYandex, IconLink, IconListOrdered, IconListUnordered, IconLock, IconMagic, IconMail, IconMinus, IconMultiselect, IconNewwindow, IconOptions, IconOzon, IconPause, IconPiechart, IconPlus, IconPreview, type IconProps, IconRegulator, IconRotate90Ccw, IconScreenBig, IconScreenSmall, IconSearch, IconShield, IconSmsCode, IconSort, IconSpinner, IconStar, IconSwitchOff, IconSwitchOn, IconTable, IconTelegram, IconText, IconTrash, IconTypograph, IconUndo, IconUnite, IconUnlink, IconUpload, IconUser, IconVideo, IconVk, IconYoutube, IllustrationTestBest, IllustrationTestHeatmap, IllustrationTestMultiple, IllustrationTestOne, IllustrationTestOrder, IllustrationTestQuest, IllustrationTestQuestion, IllustrationTestStars, IllustrationTestTournament, LogoMastercard, LogoMir, LogoPaykeeper, LogoSplittest, LogoSplittestRu, LogoUnionpay, LogoVisa };

package/dist/icons/index.js

@@ -1,10 +1,9 @@
-import { IconArrowLeft } from "./icon-arrow-left.js";
-import { IconArrowRight } from "./icon-arrow-right.js";
-import { IconSpinner } from "./icon-spinner.js";
 import { ControlMarkCheckbox } from "./control-mark-checkbox.js";
 import { ControlMarkRadiobutton } from "./control-mark-radiobutton.js";
 import { IconAdult } from "./icon-adult.js";
 import { IconArrowDown } from "./icon-arrow-down.js";
+import { IconArrowLeft } from "./icon-arrow-left.js";
+import { IconArrowRight } from "./icon-arrow-right.js";
 import { IconArrowUp } from "./icon-arrow-up.js";
 import { IconAudio } from "./icon-audio.js";
 import { IconBarchart } from "./icon-barchart.js";
@@ -67,6 +66,7 @@ import { IconMultiselect } from "./icon-multiselect.js";
 import { IconNewwindow } from "./icon-newwindow.js";
 import { IconOptions } from "./icon-options.js";
 import { IconOzon } from "./icon-ozon.js";
+import { IconPause } from "./icon-pause.js";
 import { IconPiechart } from "./icon-piechart.js";
 import { IconPlus } from "./icon-plus.js";
 import { IconPreview } from "./icon-preview.js";
@@ -78,6 +78,7 @@ import { IconSearch } from "./icon-search.js";
 import { IconShield } from "./icon-shield.js";
 import { IconSmsCode } from "./icon-sms-code.js";
 import { IconSort } from "./icon-sort.js";
+import { IconSpinner } from "./icon-spinner.js";
 import { IconStar } from "./icon-star.js";
 import { IconSwitchOff } from "./icon-switch-off.js";
 import { IconSwitchOn } from "./icon-switch-on.js";
@@ -110,4 +111,4 @@ import { LogoSplittest } from "./logo-splittest.js";
 import { LogoSplittestRu } from "./logo-splittest-ru.js";
 import { LogoUnionpay } from "./logo-unionpay.js";
 import { LogoVisa } from "./logo-visa.js";
-export { ControlMarkCheckbox, ControlMarkRadiobutton, IconAdult, IconArrowDown, IconArrowLeft, IconArrowRight, IconArrowUp, IconAudio, IconBarchart, IconBell, IconBox, IconBurger, IconCalendar, IconCamera, IconCard, IconCart, IconCharmap, IconClaim, IconClaimFull, IconClock, IconClose, IconCode, IconComment, IconConveyor, IconCopy, IconCorrect, IconCrop, IconCross, IconCycle, IconDivide, IconDownload, IconDrop, IconEdit, IconElama, IconEraser, IconFile, IconFolder, IconFunnel, IconGalleryNext, IconGalleryPrev, IconHeart, IconHeartFull, IconImage, IconIndicatorDonut, IconIndicatorDot, IconIndicatorDown, IconIndicatorProgress, IconIndicatorStar, IconIndicatorStarBig, IconIndicatorTick, IconIndicatorUp, IconInfo, IconInstagram, IconKey, IconLabelOzon, IconLabelWildberries, IconLabelYandex, IconLink, IconListOrdered, IconListUnordered, IconLock, IconMagic, IconMail, IconMinus, IconMultiselect, IconNewwindow, IconOptions, IconOzon, IconPiechart, IconPlus, IconPreview, IconRegulator, IconRotate90Ccw, IconScreenBig, IconScreenSmall, IconSearch, IconShield, IconSmsCode, IconSort, IconSpinner, IconStar, IconSwitchOff, IconSwitchOn, IconTable, IconTelegram, IconText, IconTrash, IconTypograph, IconUndo, IconUnite, IconUnlink, IconUpload, IconUser, IconVideo, IconVk, IconYoutube, IllustrationTestBest, IllustrationTestHeatmap, IllustrationTestMultiple, IllustrationTestOne, IllustrationTestOrder, IllustrationTestQuest, IllustrationTestQuestion, IllustrationTestStars, IllustrationTestTournament, LogoMastercard, LogoMir, LogoPaykeeper, LogoSplittest, LogoSplittestRu, LogoUnionpay, LogoVisa };
+export { ControlMarkCheckbox, ControlMarkRadiobutton, IconAdult, IconArrowDown, IconArrowLeft, IconArrowRight, IconArrowUp, IconAudio, IconBarchart, IconBell, IconBox, IconBurger, IconCalendar, IconCamera, IconCard, IconCart, IconCharmap, IconClaim, IconClaimFull, IconClock, IconClose, IconCode, IconComment, IconConveyor, IconCopy, IconCorrect, IconCrop, IconCross, IconCycle, IconDivide, IconDownload, IconDrop, IconEdit, IconElama, IconEraser, IconFile, IconFolder, IconFunnel, IconGalleryNext, IconGalleryPrev, IconHeart, IconHeartFull, IconImage, IconIndicatorDonut, IconIndicatorDot, IconIndicatorDown, IconIndicatorProgress, IconIndicatorStar, IconIndicatorStarBig, IconIndicatorTick, IconIndicatorUp, IconInfo, IconInstagram, IconKey, IconLabelOzon, IconLabelWildberries, IconLabelYandex, IconLink, IconListOrdered, IconListUnordered, IconLock, IconMagic, IconMail, IconMinus, IconMultiselect, IconNewwindow, IconOptions, IconOzon, IconPause, IconPiechart, IconPlus, IconPreview, IconRegulator, IconRotate90Ccw, IconScreenBig, IconScreenSmall, IconSearch, IconShield, IconSmsCode, IconSort, IconSpinner, IconStar, IconSwitchOff, IconSwitchOn, IconTable, IconTelegram, IconText, IconTrash, IconTypograph, IconUndo, IconUnite, IconUnlink, IconUpload, IconUser, IconVideo, IconVk, IconYoutube, IllustrationTestBest, IllustrationTestHeatmap, IllustrationTestMultiple, IllustrationTestOne, IllustrationTestOrder, IllustrationTestQuest, IllustrationTestQuestion, IllustrationTestStars, IllustrationTestTournament, LogoMastercard, LogoMir, LogoPaykeeper, LogoSplittest, LogoSplittestRu, LogoUnionpay, LogoVisa };

package/dist/index.d.cts

@@ -1,4 +1,4 @@
-import { Button, ButtonComponentProps, ButtonIcon, ButtonLinkProps, ButtonProps, ButtonSize, ButtonVariant } from "./components/button/button.cjs";
+import { Button, ButtonComponentProps, ButtonLinkProps, ButtonProps, ButtonSize, ButtonVariant } from "./components/button/button.cjs";
 import "./components/button/index.cjs";
 import { CheckboxInput, CheckboxInputProps } from "./components/checkbox/checkbox.cjs";
 import "./components/checkbox/index.cjs";
@@ -10,4 +10,4 @@ import { Spinner, SpinnerPosition, SpinnerProps } from "./components/spinner/spi
 import "./components/spinner/index.cjs";
 import { TextArea, TextAreaProps } from "./components/textarea/textarea.cjs";
 import "./components/textarea/index.cjs";
-export { Button, type ButtonComponentProps, type ButtonIcon, type ButtonLinkProps, type ButtonProps, type ButtonSize, type ButtonVariant, CheckboxInput, type CheckboxInputProps, Input, type InputProps, RadioInput, type RadioInputProps, Spinner, type SpinnerPosition, type SpinnerProps, TextArea, type TextAreaProps };
+export { Button, type ButtonComponentProps, type ButtonLinkProps, type ButtonProps, type ButtonSize, type ButtonVariant, CheckboxInput, type CheckboxInputProps, Input, type InputProps, RadioInput, type RadioInputProps, Spinner, type SpinnerPosition, type SpinnerProps, TextArea, type TextAreaProps };

package/dist/index.d.ts

@@ -1,4 +1,4 @@
-import { Button, ButtonComponentProps, ButtonIcon, ButtonLinkProps, ButtonProps, ButtonSize, ButtonVariant } from "./components/button/button.js";
+import { Button, ButtonComponentProps, ButtonLinkProps, ButtonProps, ButtonSize, ButtonVariant } from "./components/button/button.js";
 import "./components/button/index.js";
 import { CheckboxInput, CheckboxInputProps } from "./components/checkbox/checkbox.js";
 import "./components/checkbox/index.js";
@@ -10,4 +10,4 @@ import { Spinner, SpinnerPosition, SpinnerProps } from "./components/spinner/spi
 import "./components/spinner/index.js";
 import { TextArea, TextAreaProps } from "./components/textarea/textarea.js";
 import "./components/textarea/index.js";
-export { Button, type ButtonComponentProps, type ButtonIcon, type ButtonLinkProps, type ButtonProps, type ButtonSize, type ButtonVariant, CheckboxInput, type CheckboxInputProps, Input, type InputProps, RadioInput, type RadioInputProps, Spinner, type SpinnerPosition, type SpinnerProps, TextArea, type TextAreaProps };
+export { Button, type ButtonComponentProps, type ButtonLinkProps, type ButtonProps, type ButtonSize, type ButtonVariant, CheckboxInput, type CheckboxInputProps, Input, type InputProps, RadioInput, type RadioInputProps, Spinner, type SpinnerPosition, type SpinnerProps, TextArea, type TextAreaProps };

package/dist/styles/mixins.scss

@@ -42,7 +42,8 @@
   border: none;
   border-radius: 5px;
   cursor: pointer;
-  transition: all var(--default-transition-duration) var(--default-transition-timing-function);
+  transition: all var(--default-transition-duration)
+    var(--default-transition-timing-function);
 
   &:disabled {
     background-color: rgba(0, 0, 0, 0.1);
@@ -63,7 +64,8 @@
   box-shadow: 0 0 0 1px rgba(0, 0, 0, 0.1);
   padding: 0 15px;
   font-size: 14px;
-  transition: all var(--default-transition-duration) var(--default-transition-timing-function);
+  transition: all var(--default-transition-duration)
+    var(--default-transition-timing-function);
   background-color: var(--color-white);
   appearance: none;
   outline: none;

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@de-kit/st-ui",
-  "version": "0.1.3",
+  "version": "0.1.5",
   "description": "React-компоненты splittest: глобальный SCSS и токены из основного фронтенда",
   "license": "UNLICENSED",
   "repository": {