@ryuzaki13/react-foundation-ui 0.1.0

package/dist/check-box/stories/CheckBox.stories.d.ts

@@ -0,0 +1,58 @@
+import { StoryObj } from "@storybook/react-vite";
+import { CheckBox } from "../CheckBox";
+declare const meta: {
+    title: string;
+    component: typeof CheckBox;
+    args: {
+        value: false;
+        onChange: () => void;
+    };
+    parameters: {
+        atomicCanvas: boolean;
+        layout: string;
+    };
+    tags: string[];
+    argTypes: {
+        label: {
+            description: string;
+            control: "text";
+        };
+        description: {
+            description: string;
+            control: "text";
+        };
+        placeholder: {
+            description: string;
+            control: "text";
+        };
+        value: {
+            description: string;
+            control: "boolean";
+        };
+        onChange: {
+            description: string;
+            control: false;
+        };
+        disabled: {
+            description: string;
+            control: "boolean";
+        };
+        size: {
+            description: string;
+            control: "select";
+            options: string[];
+        };
+        tone: {
+            description: string;
+            control: "inline-radio";
+            options: string[];
+        };
+    };
+};
+export default meta;
+type Story = StoryObj<typeof meta>;
+export declare const Controlled: Story;
+export declare const Tones: Story;
+export declare const Sizes: Story;
+export declare const Disabled: Story;
+//# sourceMappingURL=CheckBox.stories.d.ts.map

package/dist/check-box/stories/CheckBox.stories.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"CheckBox.stories.d.ts","sourceRoot":"","sources":["../../../src/check-box/stories/CheckBox.stories.tsx"],"names":[],"mappings":"AAEA,OAAO,EAAQ,QAAQ,EAAE,MAAM,uBAAuB,CAAC;AAEvD,OAAO,EAAE,QAAQ,EAAE,MAAM,aAAa,CAAC;AAEvC,QAAA,MAAM,IAAI;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;CAgDuB,CAAC;AAElC,eAAe,IAAI,CAAC;AACpB,KAAK,KAAK,GAAG,QAAQ,CAAC,OAAO,IAAI,CAAC,CAAC;AAEnC,eAAO,MAAM,UAAU,EAAE,KAaxB,CAAC;AAEF,eAAO,MAAM,KAAK,EAAE,KAwBnB,CAAC;AAEF,eAAO,MAAM,KAAK,EAAE,KAwBnB,CAAC;AAEF,eAAO,MAAM,QAAQ,EAAE,KAQtB,CAAC"}

package/dist/check-box/stories/CheckBox.stories.js

@@ -0,0 +1,150 @@
+import { t as e } from "../../chunks/CheckBox-Cck5w1Ud.js";
+import { jsx as t } from "react/jsx-runtime";
+import { useState as n } from "react";
+//#region src/check-box/stories/CheckBox.stories.tsx
+var r = {
+	title: "Shared/UI/CheckBox",
+	component: e,
+	args: {
+		value: !1,
+		onChange: () => {}
+	},
+	parameters: {
+		atomicCanvas: !0,
+		layout: "padded"
+	},
+	tags: ["autodocs"],
+	argTypes: {
+		label: {
+			description: "Текст основной подписи чекбокса.",
+			control: "text"
+		},
+		description: {
+			description: "Дополнительное описание под элементом.",
+			control: "text"
+		},
+		placeholder: {
+			description: "Текст подписи, если `label` не задан.",
+			control: "text"
+		},
+		value: {
+			description: "Текущее состояние чекбокса.",
+			control: "boolean"
+		},
+		onChange: {
+			description: "Вызывается при изменении состояния.",
+			control: !1
+		},
+		disabled: {
+			description: "Блокирует взаимодействие с элементом.",
+			control: "boolean"
+		},
+		size: {
+			description: "Размер визуального контрола и текста.",
+			control: "select",
+			options: [
+				"xs",
+				"sm",
+				"md",
+				"lg",
+				"xl"
+			]
+		},
+		tone: {
+			description: "Семантический тон чекбокса.",
+			control: "inline-radio",
+			options: [
+				"neutral",
+				"error",
+				"warning",
+				"success",
+				"info"
+			]
+		}
+	}
+}, i = {
+	render: (r) => {
+		let [i, a] = n(r.value ?? !1);
+		return /* @__PURE__ */ t(e, {
+			...r,
+			value: i,
+			onChange: a
+		});
+	},
+	args: {
+		label: "Принимать условия",
+		description: "Подтверждение условий использования сервиса.",
+		value: !1,
+		size: "md",
+		disabled: !1,
+		tone: "neutral"
+	}
+}, a = { render: () => {
+	let [r, i] = n({
+		neutral: !0,
+		info: !0,
+		success: !0,
+		warning: !0,
+		error: !0
+	});
+	return /* @__PURE__ */ t("div", {
+		style: {
+			display: "grid",
+			gap: 12
+		},
+		children: [
+			"neutral",
+			"info",
+			"success",
+			"warning",
+			"error"
+		].map((n) => /* @__PURE__ */ t(e, {
+			tone: n,
+			label: `Тон ${n}`,
+			value: r[n],
+			onChange: (e) => i((t) => ({
+				...t,
+				[n]: e
+			}))
+		}, n))
+	});
+} }, o = { render: () => {
+	let [r, i] = n({
+		xs: !1,
+		sm: !0,
+		md: !1,
+		lg: !0,
+		xl: !1
+	});
+	return /* @__PURE__ */ t("div", {
+		style: {
+			display: "grid",
+			gap: 12
+		},
+		children: [
+			"xs",
+			"sm",
+			"md",
+			"lg",
+			"xl"
+		].map((n) => /* @__PURE__ */ t(e, {
+			size: n,
+			label: `Размер ${n}`,
+			value: r[n],
+			onChange: (e) => i((t) => ({
+				...t,
+				[n]: e
+			}))
+		}, n))
+	});
+} }, s = { args: {
+	label: "Недоступный чекбокс",
+	description: "Изменение недоступно из-за прав доступа.",
+	value: !0,
+	disabled: !0,
+	tone: "neutral"
+} };
+//#endregion
+export { i as Controlled, s as Disabled, o as Sizes, a as Tones, r as default };
+
+//# sourceMappingURL=CheckBox.stories.js.map

package/dist/check-box/stories/CheckBox.stories.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"CheckBox.stories.js","names":[],"sources":["../../../src/check-box/stories/CheckBox.stories.tsx"],"sourcesContent":["import { useState } from \"react\";\n\nimport { Meta, StoryObj } from \"@storybook/react-vite\";\n\nimport { CheckBox } from \"../CheckBox\";\n\nconst meta = {\n\ttitle: \"Shared/UI/CheckBox\",\n\tcomponent: CheckBox,\n\targs: {\n\t\tvalue: false,\n\t\tonChange: () => {}\n\t},\n\tparameters: {\n\t\tatomicCanvas: true,\n\t\tlayout: \"padded\"\n\t},\n\ttags: [\"autodocs\"],\n\targTypes: {\n\t\tlabel: {\n\t\t\tdescription: \"Текст основной подписи чекбокса.\",\n\t\t\tcontrol: \"text\"\n\t\t},\n\t\tdescription: {\n\t\t\tdescription: \"Дополнительное описание под элементом.\",\n\t\t\tcontrol: \"text\"\n\t\t},\n\t\tplaceholder: {\n\t\t\tdescription: \"Текст подписи, если `label` не задан.\",\n\t\t\tcontrol: \"text\"\n\t\t},\n\t\tvalue: {\n\t\t\tdescription: \"Текущее состояние чекбокса.\",\n\t\t\tcontrol: \"boolean\"\n\t\t},\n\t\tonChange: {\n\t\t\tdescription: \"Вызывается при изменении состояния.\",\n\t\t\tcontrol: false\n\t\t},\n\t\tdisabled: {\n\t\t\tdescription: \"Блокирует взаимодействие с элементом.\",\n\t\t\tcontrol: \"boolean\"\n\t\t},\n\t\tsize: {\n\t\t\tdescription: \"Размер визуального контрола и текста.\",\n\t\t\tcontrol: \"select\",\n\t\t\toptions: [\"xs\", \"sm\", \"md\", \"lg\", \"xl\"]\n\t\t},\n\t\ttone: {\n\t\t\tdescription: \"Семантический тон чекбокса.\",\n\t\t\tcontrol: \"inline-radio\",\n\t\t\toptions: [\"neutral\", \"error\", \"warning\", \"success\", \"info\"]\n\t\t}\n\t}\n} satisfies Meta<typeof CheckBox>;\n\nexport default meta;\ntype Story = StoryObj<typeof meta>;\n\nexport const Controlled: Story = {\n\trender: (args) => {\n\t\tconst [value, setValue] = useState(args.value ?? false);\n\t\treturn <CheckBox {...args} value={value} onChange={setValue} />;\n\t},\n\targs: {\n\t\tlabel: \"Принимать условия\",\n\t\tdescription: \"Подтверждение условий использования сервиса.\",\n\t\tvalue: false,\n\t\tsize: \"md\",\n\t\tdisabled: false,\n\t\ttone: \"neutral\"\n\t}\n};\n\nexport const Tones: Story = {\n\trender: () => {\n\t\tconst [values, setValues] = useState<Record<string, boolean>>({\n\t\t\tneutral: true,\n\t\t\tinfo: true,\n\t\t\tsuccess: true,\n\t\t\twarning: true,\n\t\t\terror: true\n\t\t});\n\n\t\treturn (\n\t\t\t<div style={{ display: \"grid\", gap: 12 }}>\n\t\t\t\t{([\"neutral\", \"info\", \"success\", \"warning\", \"error\"] as const).map((tone) => (\n\t\t\t\t\t<CheckBox\n\t\t\t\t\t\tkey={tone}\n\t\t\t\t\t\ttone={tone}\n\t\t\t\t\t\tlabel={`Тон ${tone}`}\n\t\t\t\t\t\tvalue={values[tone]}\n\t\t\t\t\t\tonChange={(next) => setValues((prev) => ({ ...prev, [tone]: next }))}\n\t\t\t\t\t/>\n\t\t\t\t))}\n\t\t\t</div>\n\t\t);\n\t}\n};\n\nexport const Sizes: Story = {\n\trender: () => {\n\t\tconst [values, setValues] = useState<Record<string, boolean>>({\n\t\t\txs: false,\n\t\t\tsm: true,\n\t\t\tmd: false,\n\t\t\tlg: true,\n\t\t\txl: false\n\t\t});\n\n\t\treturn (\n\t\t\t<div style={{ display: \"grid\", gap: 12 }}>\n\t\t\t\t{([\"xs\", \"sm\", \"md\", \"lg\", \"xl\"] as const).map((size) => (\n\t\t\t\t\t<CheckBox\n\t\t\t\t\t\tkey={size}\n\t\t\t\t\t\tsize={size}\n\t\t\t\t\t\tlabel={`Размер ${size}`}\n\t\t\t\t\t\tvalue={values[size]}\n\t\t\t\t\t\tonChange={(next) => setValues((prev) => ({ ...prev, [size]: next }))}\n\t\t\t\t\t/>\n\t\t\t\t))}\n\t\t\t</div>\n\t\t);\n\t}\n};\n\nexport const Disabled: Story = {\n\targs: {\n\t\tlabel: \"Недоступный чекбокс\",\n\t\tdescription: \"Изменение недоступно из-за прав доступа.\",\n\t\tvalue: true,\n\t\tdisabled: true,\n\t\ttone: \"neutral\"\n\t}\n};\n"],"mappings":";;;;AAMA,IAAM,IAAO;CACZ,OAAO;CACP,WAAW;CACX,MAAM;EACL,OAAO;EACP,gBAAgB,CAAC;CAClB;CACA,YAAY;EACX,cAAc;EACd,QAAQ;CACT;CACA,MAAM,CAAC,UAAU;CACjB,UAAU;EACT,OAAO;GACN,aAAa;GACb,SAAS;EACV;EACA,aAAa;GACZ,aAAa;GACb,SAAS;EACV;EACA,aAAa;GACZ,aAAa;GACb,SAAS;EACV;EACA,OAAO;GACN,aAAa;GACb,SAAS;EACV;EACA,UAAU;GACT,aAAa;GACb,SAAS;EACV;EACA,UAAU;GACT,aAAa;GACb,SAAS;EACV;EACA,MAAM;GACL,aAAa;GACb,SAAS;GACT,SAAS;IAAC;IAAM;IAAM;IAAM;IAAM;GAAI;EACvC;EACA,MAAM;GACL,aAAa;GACb,SAAS;GACT,SAAS;IAAC;IAAW;IAAS;IAAW;IAAW;GAAM;EAC3D;CACD;AACD,GAKa,IAAoB;CAChC,SAAS,MAAS;EACjB,IAAM,CAAC,GAAO,KAAY,EAAS,EAAK,SAAS,EAAK;EACtD,OAAO,kBAAC,GAAD;GAAU,GAAI;GAAa;GAAO,UAAU;EAAW,CAAA;CAC/D;CACA,MAAM;EACL,OAAO;EACP,aAAa;EACb,OAAO;EACP,MAAM;EACN,UAAU;EACV,MAAM;CACP;AACD,GAEa,IAAe,EAC3B,cAAc;CACb,IAAM,CAAC,GAAQ,KAAa,EAAkC;EAC7D,SAAS;EACT,MAAM;EACN,SAAS;EACT,SAAS;EACT,OAAO;CACR,CAAC;CAED,OACC,kBAAC,OAAD;EAAK,OAAO;GAAE,SAAS;GAAQ,KAAK;EAAG;YACpC;GAAC;GAAW;GAAQ;GAAW;GAAW;EAAO,CAAC,CAAW,KAAK,MACnE,kBAAC,GAAD;GAEO;GACN,OAAO,OAAO;GACd,OAAO,EAAO;GACd,WAAW,MAAS,GAAW,OAAU;IAAE,GAAG;KAAO,IAAO;GAAK,EAAE;EACnE,GALK,CAKL,CACD;CACG,CAAA;AAEP,EACD,GAEa,IAAe,EAC3B,cAAc;CACb,IAAM,CAAC,GAAQ,KAAa,EAAkC;EAC7D,IAAI;EACJ,IAAI;EACJ,IAAI;EACJ,IAAI;EACJ,IAAI;CACL,CAAC;CAED,OACC,kBAAC,OAAD;EAAK,OAAO;GAAE,SAAS;GAAQ,KAAK;EAAG;YACpC;GAAC;GAAM;GAAM;GAAM;GAAM;EAAI,CAAC,CAAW,KAAK,MAC/C,kBAAC,GAAD;GAEO;GACN,OAAO,UAAU;GACjB,OAAO,EAAO;GACd,WAAW,MAAS,GAAW,OAAU;IAAE,GAAG;KAAO,IAAO;GAAK,EAAE;EACnE,GALK,CAKL,CACD;CACG,CAAA;AAEP,EACD,GAEa,IAAkB,EAC9B,MAAM;CACL,OAAO;CACP,aAAa;CACb,OAAO;CACP,UAAU;CACV,MAAM;AACP,EACD"}

package/dist/chunks/BadgeList-DHW_Ktr3.js

@@ -0,0 +1,65 @@
+import { TextOverflow as e } from "../text/index.js";
+import { n as t, r as n, t as r } from "./uiClasses-BNjBunnY.js";
+import { i } from "./Flex-DbBdq336.js";
+import { XIcon as a } from "lucide-react";
+import { cn as o } from "@ryuzaki13/react-foundation-lib/utils";
+import { jsx as s, jsxs as c } from "react/jsx-runtime";
+import { Children as l, Fragment as u } from "react";
+var d = {
+	badge: "qBtmnH",
+	passive: "p-HsHY",
+	sizeXs: "u9tQAE",
+	sizeSm: "FRScRz",
+	sizeMd: "W13uQO",
+	sizeLg: "_3IRcM9",
+	sizeXl: "R3ybI7",
+	content: "DdWAaC",
+	removeButton: "_5cXBQF"
+}, f = {
+	xs: d.sizeXs,
+	sm: d.sizeSm,
+	md: d.sizeMd,
+	lg: d.sizeLg,
+	xl: d.sizeXl
+};
+function p({ children: i, size: l = "sm", tone: u, appearance: p, className: m, onRemove: h }) {
+	let g = u ?? "neutral", _ = n({
+		tone: u,
+		appearance: p,
+		fallbackTone: g,
+		fallbackAppearance: g === "neutral" ? "outline" : "solid"
+	});
+	return /* @__PURE__ */ c("div", {
+		className: o(d.badge, f[l], t(_.tone), r(_.appearance), !h && d.passive, m),
+		children: [/* @__PURE__ */ s(e, {
+			maxChar: 25,
+			placement: "top",
+			block: !0,
+			textWrapProps: { className: d.content },
+			children: String(i)
+		}), h && /* @__PURE__ */ s("button", {
+			type: "button",
+			onClick: h,
+			className: d.removeButton,
+			"aria-label": "Удалить бейдж",
+			"data-ui": "badge-remove-button",
+			"data-action": "remove-badge",
+			children: /* @__PURE__ */ s(a, {})
+		})]
+	});
+}
+//#endregion
+//#region src/badge/BadgeList.tsx
+function m({ children: e }) {
+	return /* @__PURE__ */ s(i, {
+		inline: !0,
+		wrap: !0,
+		gap: "sm",
+		align: "baseline",
+		children: l.map(e, (e, t) => /* @__PURE__ */ s(u, { children: e }, t))
+	});
+}
+//#endregion
+export { p as n, m as t };
+
+//# sourceMappingURL=BadgeList-DHW_Ktr3.js.map

package/dist/chunks/BadgeList-DHW_Ktr3.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"BadgeList-DHW_Ktr3.js","names":[],"sources":["../../src/badge/Badge.module.scss","../../src/badge/Badge.tsx","../../src/badge/BadgeList.tsx"],"sourcesContent":["@use \"@/styles/mixins\" as *;\n\n.badge {\n\t@include ui-static-surface;\n\n\tdisplay: inline-flex;\n\talign-items: center;\n\tgap: var(--space-xs);\n\tmax-width: 100%;\n\tpadding: 0 var(--space-xs);\n\n\tfont-weight: 500;\n\tfont-variation-settings: \"wght\" 500;\n\tvertical-align: middle;\n}\n\n.passive {\n\tpointer-events: none;\n\tuser-select: none;\n}\n\n.sizeXs {\n\tfont-size: var(--font-size-xs);\n}\n\n.sizeSm {\n\tfont-size: var(--font-size-sm);\n}\n\n.sizeMd {\n\tfont-size: var(--font-size-md);\n}\n\n.sizeLg {\n\tfont-size: var(--font-size-lg);\n}\n\n.sizeXl {\n\tfont-size: var(--font-size-xl);\n}\n\n.content {\n\tmin-width: 0;\n}\n\n.removeButton {\n\tdisplay: inline-flex;\n\talign-items: center;\n\tjustify-content: center;\n\tflex-shrink: 0;\n\twidth: 1.25em;\n\theight: 1.25em;\n\tpadding: 0;\n\tborder: none;\n\tborder-radius: var(--radius-xs);\n\tbackground: transparent;\n\tcolor: inherit;\n\ttransition:\n\t\tcolor var(--transition-fast) ease,\n\t\tbackground-color var(--transition-fast) ease,\n\t\tscale var(--transition-fast) ease;\n\n\t&:hover {\n\t\tbackground-color: var(--status-error-soft);\n\t\tcolor: var(--status-error-text);\n\t\tscale: 1.1;\n\t}\n\n\t&:focus-visible {\n\t\t@include focusVisible;\n\t}\n\n\tsvg {\n\t\tdisplay: block;\n\t}\n}\n","import { XIcon } from \"lucide-react\";\n\nimport { cn } from \"@ryuzaki13/react-foundation-lib/utils\";\n\nimport { TextOverflow } from \"../text\";\nimport { getUiAppearanceClassName, getUiToneClassName, resolveUiScheme } from \"../uiClasses\";\n\nimport styles from \"./Badge.module.scss\";\n\nimport type { UiAppearance, UiSize, UiTone } from \"../types\";\n\ntype BadgeSize = UiSize;\ntype BadgeAppearance = UiAppearance;\n\ntype BadgeProps = {\n\tchildren: string | number;\n\tsize?: BadgeSize;\n\ttone?: UiTone;\n\tappearance?: BadgeAppearance;\n\tclassName?: string;\n\tonRemove?: () => void;\n};\n\nconst sizeClasses: Record<BadgeSize, string> = {\n\txs: styles.sizeXs,\n\tsm: styles.sizeSm,\n\tmd: styles.sizeMd,\n\tlg: styles.sizeLg,\n\txl: styles.sizeXl\n};\n\n/**\n * Компактный индикатор для статусов, категорий и коротких служебных меток.\n */\nexport function Badge({ children, size = \"sm\", tone, appearance, className, onRemove }: BadgeProps) {\n\tconst fallbackTone = tone ?? \"neutral\";\n\tconst fallbackAppearance = fallbackTone !== \"neutral\" ? \"solid\" : \"outline\";\n\tconst scheme = resolveUiScheme({\n\t\ttone,\n\t\tappearance,\n\t\tfallbackTone,\n\t\tfallbackAppearance\n\t});\n\n\treturn (\n\t\t<div\n\t\t\tclassName={cn(\n\t\t\t\tstyles.badge,\n\t\t\t\tsizeClasses[size],\n\t\t\t\tgetUiToneClassName(scheme.tone),\n\t\t\t\tgetUiAppearanceClassName(scheme.appearance),\n\t\t\t\t!onRemove && styles.passive,\n\t\t\t\tclassName\n\t\t\t)}>\n\t\t\t<TextOverflow maxChar={25} placement=\"top\" block textWrapProps={{ className: styles.content }}>\n\t\t\t\t{String(children)}\n\t\t\t</TextOverflow>\n\t\t\t{onRemove && (\n\t\t\t\t<button\n\t\t\t\t\ttype=\"button\"\n\t\t\t\t\tonClick={onRemove}\n\t\t\t\t\tclassName={styles.removeButton}\n\t\t\t\t\taria-label=\"Удалить бейдж\"\n\t\t\t\t\tdata-ui=\"badge-remove-button\"\n\t\t\t\t\tdata-action=\"remove-badge\">\n\t\t\t\t\t<XIcon />\n\t\t\t\t</button>\n\t\t\t)}\n\t\t</div>\n\t);\n}\n","import { Children, Fragment, ReactElement } from \"react\";\n\nimport { FlexContainer } from \"../flex\";\n\nimport { Badge } from \"./Badge\";\n\ninterface BadgeListProps {\n\tchildren: ReactElement<typeof Badge | null | undefined | false>[];\n}\n\n/**\n * Контейнер для группы `Badge`, который выстраивает элементы в единый список с предсказуемыми отступами. Используется для компактного вывода набора меток или фильтров.\n */\nexport function BadgeList({ children }: BadgeListProps) {\n\treturn (\n\t\t<FlexContainer inline wrap gap=\"sm\" align=\"baseline\">\n\t\t\t{Children.map(children, (badge, index) => (\n\t\t\t\t<Fragment key={index}>{badge}</Fragment>\n\t\t\t))}\n\t\t</FlexContainer>\n\t);\n}\n"],"mappings":";;;;;;;;;;;;;;;;;GCuBM,IAAyC;CAC9C,IAAI,EAAO;CACX,IAAI,EAAO;CACX,IAAI,EAAO;CACX,IAAI,EAAO;CACX,IAAI,EAAO;AACZ;AAKA,SAAgB,EAAM,EAAE,aAAU,UAAO,MAAM,SAAM,eAAY,cAAW,eAAwB;CACnG,IAAM,IAAe,KAAQ,WAEvB,IAAS,EAAgB;EAC9B;EACA;EACA;EACA,oBAL0B,MAAiB,YAAsB,YAAV;CAMxD,CAAC;CAED,OACC,kBAAC,OAAD;EACC,WAAW,EACV,EAAO,OACP,EAAY,IACZ,EAAmB,EAAO,IAAI,GAC9B,EAAyB,EAAO,UAAU,GAC1C,CAAC,KAAY,EAAO,SACpB,CACD;YARD,CASC,kBAAC,GAAD;GAAc,SAAS;GAAI,WAAU;GAAM,OAAA;GAAM,eAAe,EAAE,WAAW,EAAO,QAAQ;aAC1F,OAAO,CAAQ;EACH,CAAA,GACb,KACA,kBAAC,UAAD;GACC,MAAK;GACL,SAAS;GACT,WAAW,EAAO;GAClB,cAAW;GACX,WAAQ;GACR,eAAY;aACZ,kBAAC,GAAD,CAAQ,CAAA;EACD,CAAA,CAEL;;AAEP;;;ACzDA,SAAgB,EAAU,EAAE,eAA4B;CACvD,OACC,kBAAC,GAAD;EAAe,QAAA;EAAO,MAAA;EAAK,KAAI;EAAK,OAAM;YACxC,EAAS,IAAI,IAAW,GAAO,MAC/B,kBAAC,GAAD,EAAA,UAAuB,EAAgB,GAAxB,CAAwB,CACvC;CACa,CAAA;AAEjB"}

package/dist/chunks/Button-BZ_b-Kin.js

@@ -0,0 +1,55 @@
+import { n as e } from "./popover-C79P5bm2.js";
+import { t } from "./ui.module-BisoTevy.js";
+import { n, r, t as i } from "./uiClasses-BNjBunnY.js";
+import { cn as a } from "@ryuzaki13/react-foundation-lib/utils";
+import { Fragment as o, jsx as s, jsxs as c } from "react/jsx-runtime";
+import { Children as l, forwardRef as u } from "react";
+var d = {
+	button: "wLOHwj",
+	iconOnly: "lFsM-Y",
+	buttonInner: "LPob63",
+	buttonIcon: "tsaGtv"
+}, f = u(function({ children: u, disabled: f, className: p, icon: m, iconEnd: h, title: g, variant: _, tone: v, appearance: y, type: b = "button", "aria-label": x, ...S }, C) {
+	let w = l.count(u) > 0, T = !!m && !w, E = r({
+		variant: _,
+		tone: v,
+		appearance: y,
+		fallbackAppearance: v && v !== "neutral" ? "solid" : "outline"
+	}), D = T ? x ?? g : x, O = /* @__PURE__ */ s("button", {
+		...S,
+		ref: C,
+		type: b,
+		disabled: f,
+		"aria-label": D,
+		className: a(t.uiElement, t.uiInputControl, d.button, n(E.tone), i(E.appearance), T ? d.iconOnly : "", "textNoWrap", p ?? ""),
+		children: /* @__PURE__ */ c("span", {
+			className: d.buttonInner,
+			children: [
+				m && !h && /* @__PURE__ */ s("span", {
+					"aria-hidden": "true",
+					className: d.buttonIcon,
+					children: m
+				}),
+				w && /* @__PURE__ */ s("span", {
+					className: "flexEllipsis",
+					children: u
+				}),
+				m && h && /* @__PURE__ */ s("span", {
+					"aria-hidden": "true",
+					className: d.buttonIcon,
+					children: m
+				})
+			]
+		})
+	});
+	return g ? /* @__PURE__ */ s(e, {
+		placement: "bottom",
+		tooltip: !0,
+		content: /* @__PURE__ */ s(o, { children: g }),
+		children: O
+	}) : O;
+});
+//#endregion
+export { f as t };
+
+//# sourceMappingURL=Button-BZ_b-Kin.js.map

package/dist/chunks/Button-BZ_b-Kin.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"Button-BZ_b-Kin.js","names":[],"sources":["../../src/button/Button.module.scss","../../src/button/Button.tsx"],"sourcesContent":[".button {\n\tpadding: 0 var(--space-md);\n\tuser-select: none;\n\n\ttransform-style: preserve-3d;\n\tperspective: 1000px;\n\n\t&.iconOnly {\n\t\tpadding: 0;\n\t\taspect-ratio: 1;\n\t}\n\n\t&:active {\n\t\ttransition: none;\n\t\ttransform: perspective(1000px) translateZ(-2em);\n\t}\n}\n\n.buttonInner {\n\twidth: 100%;\n\theight: 100%;\n\tdisplay: flex;\n\talign-items: center;\n\tjustify-content: center;\n\tgap: var(--space-sm);\n}\n\n.buttonIcon {\n\twidth: 1.25em;\n\theight: 1.25em;\n}\n","import React, { Children, forwardRef } from \"react\";\n\nimport { cn } from \"@ryuzaki13/react-foundation-lib/utils\";\n\nimport { FloatingPopover } from \"../popover\";\nimport uiStyles from \"../ui.module.scss\";\nimport { getUiAppearanceClassName, getUiToneClassName, resolveUiScheme } from \"../uiClasses\";\n\nimport styles from \"./Button.module.scss\";\n\nimport type { UiAppearance, UiTone, UiVariant } from \"../types\";\n\nexport interface ButtonProps extends Omit<React.ButtonHTMLAttributes<HTMLButtonElement>, \"type\"> {\n\tvariant?: UiVariant;\n\ttone?: UiTone;\n\tappearance?: UiAppearance;\n\ticon?: React.ReactNode;\n\ticonEnd?: boolean;\n\n\t/**\n\t * По умолчанию делаем безопасное поведение в формах.\n\t */\n\ttype?: \"button\" | \"submit\" | \"reset\";\n}\n\n/**\n * Базовая кнопка дизайн-системы для пользовательских действий.\n * Поддерживает состояния, tone + appearance, иконки и безопасный `type=\"button\"` по умолчанию.\n */\nexport const Button = forwardRef<HTMLButtonElement, ButtonProps>(function Button(\n\t{ children, disabled, className, icon, iconEnd, title, variant, tone, appearance, type = \"button\", \"aria-label\": ariaLabel, ...props },\n\tref\n) {\n\tconst hasChildren = Children.count(children) > 0;\n\tconst iconOnly = !!icon && !hasChildren;\n\tconst fallbackAppearance = tone && tone !== \"neutral\" ? \"solid\" : \"outline\";\n\tconst scheme = resolveUiScheme({ variant, tone, appearance, fallbackAppearance });\n\n\t// Если кнопка только с иконкой, нужен aria-label или title.\n\tconst computedAriaLabel = iconOnly ? (ariaLabel ?? title) : ariaLabel;\n\n\tconst button = (\n\t\t<button\n\t\t\t{...props}\n\t\t\tref={ref}\n\t\t\ttype={type}\n\t\t\tdisabled={disabled}\n\t\t\taria-label={computedAriaLabel}\n\t\t\tclassName={cn(\n\t\t\t\tuiStyles.uiElement,\n\t\t\t\tuiStyles.uiInputControl,\n\t\t\t\tstyles.button,\n\t\t\t\tgetUiToneClassName(scheme.tone),\n\t\t\t\tgetUiAppearanceClassName(scheme.appearance),\n\t\t\t\ticonOnly ? styles.iconOnly : \"\",\n\t\t\t\t\"textNoWrap\",\n\t\t\t\tclassName ?? \"\"\n\t\t\t)}>\n\t\t\t<span className={styles.buttonInner}>\n\t\t\t\t{icon && !iconEnd && (\n\t\t\t\t\t<span aria-hidden=\"true\" className={styles.buttonIcon}>\n\t\t\t\t\t\t{icon}\n\t\t\t\t\t</span>\n\t\t\t\t)}\n\n\t\t\t\t{hasChildren && <span className=\"flexEllipsis\">{children}</span>}\n\n\t\t\t\t{icon && iconEnd && (\n\t\t\t\t\t<span aria-hidden=\"true\" className={styles.buttonIcon}>\n\t\t\t\t\t\t{icon}\n\t\t\t\t\t</span>\n\t\t\t\t)}\n\t\t\t</span>\n\t\t</button>\n\t);\n\n\tif (!title) return button;\n\n\treturn (\n\t\t<FloatingPopover placement=\"bottom\" tooltip content={<>{title}</>}>\n\t\t\t{button}\n\t\t</FloatingPopover>\n\t);\n});\n"],"mappings":";;;;;;;;;;;GC6Ba,IAAS,EAA2C,SAChE,EAAE,aAAU,aAAU,cAAW,SAAM,YAAS,UAAO,YAAS,SAAM,eAAY,UAAO,UAAU,cAAc,GAAW,GAAG,KAC/H,GACC;CACD,IAAM,IAAc,EAAS,MAAM,CAAQ,IAAI,GACzC,IAAW,CAAC,CAAC,KAAQ,CAAC,GAEtB,IAAS,EAAgB;EAAE;EAAS;EAAM;EAAY,oBADjC,KAAQ,MAAS,YAAY,UAAU;CACa,CAAC,GAG1E,IAAoB,IAAY,KAAa,IAAS,GAEtD,IACL,kBAAC,UAAD;EACC,GAAI;EACC;EACC;EACI;EACV,cAAY;EACZ,WAAW,EACV,EAAS,WACT,EAAS,gBACT,EAAO,QACP,EAAmB,EAAO,IAAI,GAC9B,EAAyB,EAAO,UAAU,GAC1C,IAAW,EAAO,WAAW,IAC7B,cACA,KAAa,EACd;YACA,kBAAC,QAAD;GAAM,WAAW,EAAO;aAAxB;IACE,KAAQ,CAAC,KACT,kBAAC,QAAD;KAAM,eAAY;KAAO,WAAW,EAAO;eACzC;IACI,CAAA;IAGN,KAAe,kBAAC,QAAD;KAAM,WAAU;KAAgB;IAAe,CAAA;IAE9D,KAAQ,KACR,kBAAC,QAAD;KAAM,eAAY;KAAO,WAAW,EAAO;eACzC;IACI,CAAA;GAEF;;CACC,CAAA;CAKT,OAFK,IAGJ,kBAAC,GAAD;EAAiB,WAAU;EAAS,SAAA;EAAQ,SAAS,kBAAA,GAAA,EAAA,UAAG,EAAQ,CAAA;YAC9D;CACe,CAAA,IALC;AAOpB,CAAC"}