@bezdenegsvarkinet/ui-library 0.2.1 → 0.3.0

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
Files changed (13) hide show
  1. package/dist/index.cjs +104 -0
  2. package/dist/index.cjs.map +1 -0
  3. package/dist/index.css +91 -0
  4. package/dist/index.css.map +1 -0
  5. package/dist/index.d.cts +37 -0
  6. package/dist/index.d.ts +37 -14
  7. package/dist/index.js +37 -3240
  8. package/dist/index.js.map +1 -1
  9. package/package.json +7 -6
  10. package/dist/index.mjs +0 -3280
  11. package/dist/index.mjs.map +0 -1
  12. package/dist/ui-library.css +0 -715
  13. package/dist/vite.svg +0 -1
package/dist/index.cjs ADDED
@@ -0,0 +1,104 @@
1
+ 'use client'
2
+ "use strict";
3
+ var __defProp = Object.defineProperty;
4
+ var __getOwnPropDesc = Object.getOwnPropertyDescriptor;
5
+ var __getOwnPropNames = Object.getOwnPropertyNames;
6
+ var __hasOwnProp = Object.prototype.hasOwnProperty;
7
+ var __export = (target, all) => {
8
+ for (var name in all)
9
+ __defProp(target, name, { get: all[name], enumerable: true });
10
+ };
11
+ var __copyProps = (to, from, except, desc) => {
12
+ if (from && typeof from === "object" || typeof from === "function") {
13
+ for (let key of __getOwnPropNames(from))
14
+ if (!__hasOwnProp.call(to, key) && key !== except)
15
+ __defProp(to, key, { get: () => from[key], enumerable: !(desc = __getOwnPropDesc(from, key)) || desc.enumerable });
16
+ }
17
+ return to;
18
+ };
19
+ var __toCommonJS = (mod) => __copyProps(__defProp({}, "__esModule", { value: true }), mod);
20
+
21
+ // src/index.ts
22
+ var index_exports = {};
23
+ __export(index_exports, {
24
+ Button: () => Button,
25
+ Typography: () => Typography
26
+ });
27
+ module.exports = __toCommonJS(index_exports);
28
+
29
+ // src/stories/button/button.tsx
30
+ var import_class_variance_authority2 = require("class-variance-authority");
31
+
32
+ // src/lib/utils.ts
33
+ var import_clsx = require("clsx");
34
+ var import_tailwind_merge = require("tailwind-merge");
35
+ function cn(...inputs) {
36
+ return (0, import_tailwind_merge.twMerge)((0, import_clsx.clsx)(inputs));
37
+ }
38
+
39
+ // src/stories/typography/typography.tsx
40
+ var import_class_variance_authority = require("class-variance-authority");
41
+
42
+ // src/stories/typography/typography-sizes.ts
43
+ var typographySizes = {
44
+ "button/m/16": "text-[16px] font-medium",
45
+ "button/m/14": "text-[14px] font-medium"
46
+ };
47
+
48
+ // src/stories/typography/typography.tsx
49
+ var import_jsx_runtime = require("react/jsx-runtime");
50
+ var typographyVariants = (0, import_class_variance_authority.cva)("transition-all duration-300 leading-[100%]", {
51
+ variants: {
52
+ size: {
53
+ ...typographySizes
54
+ }
55
+ },
56
+ defaultVariants: {
57
+ size: "button/m/16"
58
+ }
59
+ });
60
+ var Typography = ({ children, tag = "p", size, className, ...props }) => {
61
+ const Tag = tag;
62
+ return /* @__PURE__ */ (0, import_jsx_runtime.jsx)(Tag, { ...props, className: cn(typographyVariants({ size, className })), children });
63
+ };
64
+
65
+ // src/stories/button/button-bgs.ts
66
+ var buttonBgs = {
67
+ primary: "bg-blue-500 text-white hover:bg-blue-600",
68
+ secondary: "bg-gray-200 text-gray-800 hover:bg-gray-300",
69
+ outline: "bg-transparent border-2 border-blue-500 text-blue-500 hover:bg-blue-50"
70
+ };
71
+
72
+ // src/stories/button/button-sizes.ts
73
+ var buttonSizes = {
74
+ "32": "h-[32px]",
75
+ "40": "h-[40px]",
76
+ "48": "h-[48px]",
77
+ "56": "h-[56px]"
78
+ };
79
+
80
+ // src/stories/button/button.tsx
81
+ var import_jsx_runtime2 = require("react/jsx-runtime");
82
+ var buttonVariants = (0, import_class_variance_authority2.cva)("transition-all duration-300 py-2 px-4 rounded-[8px] leading-[100%]", {
83
+ variants: {
84
+ bg: {
85
+ ...buttonBgs
86
+ },
87
+ size: {
88
+ ...buttonSizes
89
+ }
90
+ },
91
+ defaultVariants: {
92
+ bg: "primary",
93
+ size: "32"
94
+ }
95
+ });
96
+ var Button = ({ children, bg, size, className, asChild = false, ...props }) => {
97
+ return /* @__PURE__ */ (0, import_jsx_runtime2.jsx)("button", { ...props, className: cn(buttonVariants({ bg, size, className })), children: asChild ? /* @__PURE__ */ (0, import_jsx_runtime2.jsx)(Typography, { children }) : children });
98
+ };
99
+ // Annotate the CommonJS export names for ESM import in node:
100
+ 0 && (module.exports = {
101
+ Button,
102
+ Typography
103
+ });
104
+ //# sourceMappingURL=index.cjs.map
package/dist/index.cjs.map ADDED
@@ -0,0 +1 @@
1
+ {"version":3,"sources":["../src/index.ts","../src/stories/button/button.tsx","../src/lib/utils.ts","../src/stories/typography/typography.tsx","../src/stories/typography/typography-sizes.ts","../src/stories/button/button-bgs.ts","../src/stories/button/button-sizes.ts"],"sourcesContent":["// Экспортируем только компоненты, не stories и не CSS\nexport { Button } from './stories/button/button'\nexport { Typography } from './stories/typography/typography'\n\nexport type { IButtonProps } from './stories/button/button'\nexport type { ITypographyProps } from './stories/typography/typography'\n\n// Импортируем CSS с Tailwind (он попадёт в сборку)\nimport './index.css'","'use client'\n\nimport { FC } from 'react'\nimport { cva, VariantProps } from 'class-variance-authority'\nimport { cn } from '../../lib/utils'\nimport { Typography } from '../typography/typography'\nimport { buttonBgs } from './button-bgs'\nimport { buttonSizes } from './button-sizes'\n\nconst buttonVariants = cva('transition-all duration-300 py-2 px-4 rounded-[8px] leading-[100%]', {\n\tvariants: {\n\t\tbg: {\n\t\t\t...buttonBgs,\n\t\t},\n\t\tsize: {\n\t\t\t...buttonSizes,\n\t\t},\n\t},\n\tdefaultVariants: {\n\t\tbg: 'primary',\n\t\tsize: '32',\n\t},\n})\n\nexport interface IButtonProps\n\textends React.ButtonHTMLAttributes<HTMLButtonElement>, VariantProps<typeof buttonVariants> {\n\t/** Контент кнопки (текст или иконки) */\n\tchildren: React.ReactNode\n\t/**\n\t * Если true, оборачивает children в компонент Typography для единообразия.\n\t * По умолчанию false.\n\t */\n\tasChild?: boolean\n}\n\n/**\n * Компонент Button используется для интерактивных элементов действия.\n * Поддерживает различные варианты оформления (bg) и размеры (size).\n *\n * @example\n * <Button bg=\"primary\" size=\"40\">Нажми меня</Button>\n */\nexport const Button: FC<IButtonProps> = ({ children, bg, size, className, asChild = false, ...props }) => {\n\treturn (\n\t\t<button {...props} className={cn(buttonVariants({ bg, size, className }))}>\n\t\t\t{asChild ? <Typography>{children}</Typography> : children}\n\t\t</button>\n\t)\n}","import { clsx, type ClassValue } from \"clsx\"\nimport { twMerge } from \"tailwind-merge\"\n\nexport function cn(...inputs: ClassValue[]) {\n return twMerge(clsx(inputs))\n}\n","'use client'\n\nimport { FC } from 'react'\nimport { cn } from '../../lib/utils'\nimport { cva, VariantProps } from 'class-variance-authority'\nimport { typographySizes } from '../typography/typography-sizes'\n\nconst typographyVariants = cva('transition-all duration-300 leading-[100%]', {\n\tvariants: {\n\t\tsize: {\n\t\t\t...typographySizes,\n\t\t},\n\t},\n\tdefaultVariants: {\n\t\tsize: 'button/m/16',\n\t},\n})\n\ntype TTag = 'p' | 'span'\n\nexport interface ITypographyProps\n\textends React.HTMLAttributes<HTMLParagraphElement>, VariantProps<typeof typographyVariants> {\n\tchildren: React.ReactNode\n\ttag?: TTag\n}\n\nexport const Typography: FC<ITypographyProps> = ({ children, tag = 'p', size, className, ...props }) => {\n\tconst Tag = tag\n\n\treturn (\n\t\t<Tag {...props} className={cn(typographyVariants({ size, className }))}>\n\t\t\t{children}\n\t\t</Tag>\n\t)\n}","export const typographySizes = {\n\t'button/m/16': 'text-[16px] font-medium',\n\t'button/m/14': 'text-[14px] font-medium',\n}\n\nexport type TTypographySizes = keyof typeof typographySizes","export const buttonBgs = {\n\tprimary: 'bg-blue-500 text-white hover:bg-blue-600',\n\tsecondary: 'bg-gray-200 text-gray-800 hover:bg-gray-300',\n\toutline: 'bg-transparent border-2 border-blue-500 text-blue-500 hover:bg-blue-50',\n}","export const buttonSizes = {\n\t'32': 'h-[32px]',\n\t'40': 'h-[40px]',\n\t'48': 'h-[48px]',\n\t'56': 'h-[56px]',\n}"],"mappings":";;;;;;;;;;;;;;;;;;;;;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;;;ACGA,IAAAA,mCAAkC;;;ACHlC,kBAAsC;AACtC,4BAAwB;AAEjB,SAAS,MAAM,QAAsB;AAC1C,aAAO,mCAAQ,kBAAK,MAAM,CAAC;AAC7B;;;ACDA,sCAAkC;;;ACJ3B,IAAM,kBAAkB;AAAA,EAC9B,eAAe;AAAA,EACf,eAAe;AAChB;;;AD2BE;AAvBF,IAAM,yBAAqB,qCAAI,8CAA8C;AAAA,EAC5E,UAAU;AAAA,IACT,MAAM;AAAA,MACL,GAAG;AAAA,IACJ;AAAA,EACD;AAAA,EACA,iBAAiB;AAAA,IAChB,MAAM;AAAA,EACP;AACD,CAAC;AAUM,IAAM,aAAmC,CAAC,EAAE,UAAU,MAAM,KAAK,MAAM,WAAW,GAAG,MAAM,MAAM;AACvG,QAAM,MAAM;AAEZ,SACC,4CAAC,OAAK,GAAG,OAAO,WAAW,GAAG,mBAAmB,EAAE,MAAM,UAAU,CAAC,CAAC,GACnE,UACF;AAEF;;;AElCO,IAAM,YAAY;AAAA,EACxB,SAAS;AAAA,EACT,WAAW;AAAA,EACX,SAAS;AACV;;;ACJO,IAAM,cAAc;AAAA,EAC1B,MAAM;AAAA,EACN,MAAM;AAAA,EACN,MAAM;AAAA,EACN,MAAM;AACP;;;ALwCc,IAAAC,sBAAA;AApCd,IAAM,qBAAiB,sCAAI,sEAAsE;AAAA,EAChG,UAAU;AAAA,IACT,IAAI;AAAA,MACH,GAAG;AAAA,IACJ;AAAA,IACA,MAAM;AAAA,MACL,GAAG;AAAA,IACJ;AAAA,EACD;AAAA,EACA,iBAAiB;AAAA,IAChB,IAAI;AAAA,IACJ,MAAM;AAAA,EACP;AACD,CAAC;AAoBM,IAAM,SAA2B,CAAC,EAAE,UAAU,IAAI,MAAM,WAAW,UAAU,OAAO,GAAG,MAAM,MAAM;AACzG,SACC,6CAAC,YAAQ,GAAG,OAAO,WAAW,GAAG,eAAe,EAAE,IAAI,MAAM,UAAU,CAAC,CAAC,GACtE,oBAAU,6CAAC,cAAY,UAAS,IAAgB,UAClD;AAEF;","names":["import_class_variance_authority","import_jsx_runtime"]}
package/dist/index.css ADDED
@@ -0,0 +1,91 @@
1
+ @import "tailwindcss";
2
+ @import "tw-animate-css";
3
+ @import "shadcn/tailwind.css";
4
+
5
+ /* src/index.css */
6
+ @custom-variant dark (&:is(.dark *));
7
+ :root {
8
+ --color-primary: #3b82f6;
9
+ --color-secondary: #64748b;
10
+ --font-base:
11
+ system-ui,
12
+ Avenir,
13
+ Helvetica,
14
+ Arial,
15
+ sans-serif;
16
+ --radius: 0.625rem;
17
+ --background: oklch(1 0 0);
18
+ --foreground: oklch(0.145 0 0);
19
+ --card: oklch(1 0 0);
20
+ --card-foreground: oklch(0.145 0 0);
21
+ --popover: oklch(1 0 0);
22
+ --popover-foreground: oklch(0.145 0 0);
23
+ --primary: oklch(0.205 0 0);
24
+ --primary-foreground: oklch(0.985 0 0);
25
+ --secondary: oklch(0.97 0 0);
26
+ --secondary-foreground: oklch(0.205 0 0);
27
+ --muted: oklch(0.97 0 0);
28
+ --muted-foreground: oklch(0.556 0 0);
29
+ --accent: oklch(0.97 0 0);
30
+ --accent-foreground: oklch(0.205 0 0);
31
+ --destructive: oklch(0.577 0.245 27.325);
32
+ --border: oklch(0.922 0 0);
33
+ --input: oklch(0.922 0 0);
34
+ --ring: oklch(0.708 0 0);
35
+ --chart-1: oklch(0.646 0.222 41.116);
36
+ --chart-2: oklch(0.6 0.118 184.704);
37
+ --chart-3: oklch(0.398 0.07 227.392);
38
+ --chart-4: oklch(0.828 0.189 84.429);
39
+ --chart-5: oklch(0.769 0.188 70.08);
40
+ --sidebar: oklch(0.985 0 0);
41
+ --sidebar-foreground: oklch(0.145 0 0);
42
+ --sidebar-primary: oklch(0.205 0 0);
43
+ --sidebar-primary-foreground: oklch(0.985 0 0);
44
+ --sidebar-accent: oklch(0.97 0 0);
45
+ --sidebar-accent-foreground: oklch(0.205 0 0);
46
+ --sidebar-border: oklch(0.922 0 0);
47
+ --sidebar-ring: oklch(0.708 0 0);
48
+ }
49
+ @theme inline { --radius-sm: calc(var(--radius) - 4px); --radius-md: calc(var(--radius) - 2px); --radius-lg: var(--radius); --radius-xl: calc(var(--radius) + 4px); --radius-2xl: calc(var(--radius) + 8px); --radius-3xl: calc(var(--radius) + 12px); --radius-4xl: calc(var(--radius) + 16px); --color-background: var(--background); --color-foreground: var(--foreground); --color-card: var(--card); --color-card-foreground: var(--card-foreground); --color-popover: var(--popover); --color-popover-foreground: var(--popover-foreground); --color-primary: var(--primary); --color-primary-foreground: var(--primary-foreground); --color-secondary: var(--secondary); --color-secondary-foreground: var(--secondary-foreground); --color-muted: var(--muted); --color-muted-foreground: var(--muted-foreground); --color-accent: var(--accent); --color-accent-foreground: var(--accent-foreground); --color-destructive: var(--destructive); --color-border: var(--border); --color-input: var(--input); --color-ring: var(--ring); --color-chart-1: var(--chart-1); --color-chart-2: var(--chart-2); --color-chart-3: var(--chart-3); --color-chart-4: var(--chart-4); --color-chart-5: var(--chart-5); --color-sidebar: var(--sidebar); --color-sidebar-foreground: var(--sidebar-foreground); --color-sidebar-primary: var(--sidebar-primary); --color-sidebar-primary-foreground: var(--sidebar-primary-foreground); --color-sidebar-accent: var(--sidebar-accent); --color-sidebar-accent-foreground: var(--sidebar-accent-foreground); --color-sidebar-border: var(--sidebar-border); --color-sidebar-ring: var(--sidebar-ring); }
50
+ .dark {
51
+ --background: oklch(0.145 0 0);
52
+ --foreground: oklch(0.985 0 0);
53
+ --card: oklch(0.205 0 0);
54
+ --card-foreground: oklch(0.985 0 0);
55
+ --popover: oklch(0.205 0 0);
56
+ --popover-foreground: oklch(0.985 0 0);
57
+ --primary: oklch(0.922 0 0);
58
+ --primary-foreground: oklch(0.205 0 0);
59
+ --secondary: oklch(0.269 0 0);
60
+ --secondary-foreground: oklch(0.985 0 0);
61
+ --muted: oklch(0.269 0 0);
62
+ --muted-foreground: oklch(0.708 0 0);
63
+ --accent: oklch(0.269 0 0);
64
+ --accent-foreground: oklch(0.985 0 0);
65
+ --destructive: oklch(0.704 0.191 22.216);
66
+ --border: oklch(1 0 0 / 10%);
67
+ --input: oklch(1 0 0 / 15%);
68
+ --ring: oklch(0.556 0 0);
69
+ --chart-1: oklch(0.488 0.243 264.376);
70
+ --chart-2: oklch(0.696 0.17 162.48);
71
+ --chart-3: oklch(0.769 0.188 70.08);
72
+ --chart-4: oklch(0.627 0.265 303.9);
73
+ --chart-5: oklch(0.645 0.246 16.439);
74
+ --sidebar: oklch(0.205 0 0);
75
+ --sidebar-foreground: oklch(0.985 0 0);
76
+ --sidebar-primary: oklch(0.488 0.243 264.376);
77
+ --sidebar-primary-foreground: oklch(0.985 0 0);
78
+ --sidebar-accent: oklch(0.269 0 0);
79
+ --sidebar-accent-foreground: oklch(0.985 0 0);
80
+ --sidebar-border: oklch(1 0 0 / 10%);
81
+ --sidebar-ring: oklch(0.556 0 0);
82
+ }
83
+ @layer base {
84
+ * {
85
+ @apply border-border outline-ring/50;
86
+ }
87
+ body {
88
+ @apply bg-background text-foreground;
89
+ }
90
+ }
91
+ /*# sourceMappingURL=index.css.map */
package/dist/index.css.map ADDED
@@ -0,0 +1 @@
1
+ {"version":3,"sources":["../src/index.css"],"sourcesContent":["@import \"tailwindcss\";\n@import \"tw-animate-css\";\n@import \"shadcn/tailwind.css\";\n\n@custom-variant dark (&:is(.dark *));\n\n:root {\n --color-primary: #3b82f6;\n --color-secondary: #64748b;\n --font-base: system-ui, Avenir, Helvetica, Arial, sans-serif;\n --radius: 0.625rem;\n --background: oklch(1 0 0);\n --foreground: oklch(0.145 0 0);\n --card: oklch(1 0 0);\n --card-foreground: oklch(0.145 0 0);\n --popover: oklch(1 0 0);\n --popover-foreground: oklch(0.145 0 0);\n --primary: oklch(0.205 0 0);\n --primary-foreground: oklch(0.985 0 0);\n --secondary: oklch(0.97 0 0);\n --secondary-foreground: oklch(0.205 0 0);\n --muted: oklch(0.97 0 0);\n --muted-foreground: oklch(0.556 0 0);\n --accent: oklch(0.97 0 0);\n --accent-foreground: oklch(0.205 0 0);\n --destructive: oklch(0.577 0.245 27.325);\n --border: oklch(0.922 0 0);\n --input: oklch(0.922 0 0);\n --ring: oklch(0.708 0 0);\n --chart-1: oklch(0.646 0.222 41.116);\n --chart-2: oklch(0.6 0.118 184.704);\n --chart-3: oklch(0.398 0.07 227.392);\n --chart-4: oklch(0.828 0.189 84.429);\n --chart-5: oklch(0.769 0.188 70.08);\n --sidebar: oklch(0.985 0 0);\n --sidebar-foreground: oklch(0.145 0 0);\n --sidebar-primary: oklch(0.205 0 0);\n --sidebar-primary-foreground: oklch(0.985 0 0);\n --sidebar-accent: oklch(0.97 0 0);\n --sidebar-accent-foreground: oklch(0.205 0 0);\n --sidebar-border: oklch(0.922 0 0);\n --sidebar-ring: oklch(0.708 0 0);\n}\n\n@theme inline {\n --radius-sm: calc(var(--radius) - 4px);\n --radius-md: calc(var(--radius) - 2px);\n --radius-lg: var(--radius);\n --radius-xl: calc(var(--radius) + 4px);\n --radius-2xl: calc(var(--radius) + 8px);\n --radius-3xl: calc(var(--radius) + 12px);\n --radius-4xl: calc(var(--radius) + 16px);\n --color-background: var(--background);\n --color-foreground: var(--foreground);\n --color-card: var(--card);\n --color-card-foreground: var(--card-foreground);\n --color-popover: var(--popover);\n --color-popover-foreground: var(--popover-foreground);\n --color-primary: var(--primary);\n --color-primary-foreground: var(--primary-foreground);\n --color-secondary: var(--secondary);\n --color-secondary-foreground: var(--secondary-foreground);\n --color-muted: var(--muted);\n --color-muted-foreground: var(--muted-foreground);\n --color-accent: var(--accent);\n --color-accent-foreground: var(--accent-foreground);\n --color-destructive: var(--destructive);\n --color-border: var(--border);\n --color-input: var(--input);\n --color-ring: var(--ring);\n --color-chart-1: var(--chart-1);\n --color-chart-2: var(--chart-2);\n --color-chart-3: var(--chart-3);\n --color-chart-4: var(--chart-4);\n --color-chart-5: var(--chart-5);\n --color-sidebar: var(--sidebar);\n --color-sidebar-foreground: var(--sidebar-foreground);\n --color-sidebar-primary: var(--sidebar-primary);\n --color-sidebar-primary-foreground: var(--sidebar-primary-foreground);\n --color-sidebar-accent: var(--sidebar-accent);\n --color-sidebar-accent-foreground: var(--sidebar-accent-foreground);\n --color-sidebar-border: var(--sidebar-border);\n --color-sidebar-ring: var(--sidebar-ring);\n}\n\n.dark {\n --background: oklch(0.145 0 0);\n --foreground: oklch(0.985 0 0);\n --card: oklch(0.205 0 0);\n --card-foreground: oklch(0.985 0 0);\n --popover: oklch(0.205 0 0);\n --popover-foreground: oklch(0.985 0 0);\n --primary: oklch(0.922 0 0);\n --primary-foreground: oklch(0.205 0 0);\n --secondary: oklch(0.269 0 0);\n --secondary-foreground: oklch(0.985 0 0);\n --muted: oklch(0.269 0 0);\n --muted-foreground: oklch(0.708 0 0);\n --accent: oklch(0.269 0 0);\n --accent-foreground: oklch(0.985 0 0);\n --destructive: oklch(0.704 0.191 22.216);\n --border: oklch(1 0 0 / 10%);\n --input: oklch(1 0 0 / 15%);\n --ring: oklch(0.556 0 0);\n --chart-1: oklch(0.488 0.243 264.376);\n --chart-2: oklch(0.696 0.17 162.48);\n --chart-3: oklch(0.769 0.188 70.08);\n --chart-4: oklch(0.627 0.265 303.9);\n --chart-5: oklch(0.645 0.246 16.439);\n --sidebar: oklch(0.205 0 0);\n --sidebar-foreground: oklch(0.985 0 0);\n --sidebar-primary: oklch(0.488 0.243 264.376);\n --sidebar-primary-foreground: oklch(0.985 0 0);\n --sidebar-accent: oklch(0.269 0 0);\n --sidebar-accent-foreground: oklch(0.985 0 0);\n --sidebar-border: oklch(1 0 0 / 10%);\n --sidebar-ring: oklch(0.556 0 0);\n}\n\n@layer base {\n * {\n @apply border-border outline-ring/50;\n }\n body {\n @apply bg-background text-foreground;\n }\n}"],"mappings":"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","names":[]}
package/dist/index.d.cts ADDED
@@ -0,0 +1,37 @@
1
+ import * as class_variance_authority_types from 'class-variance-authority/types';
2
+ import { FC } from 'react';
3
+ import { VariantProps } from 'class-variance-authority';
4
+
5
+ declare const buttonVariants: (props?: ({
6
+ bg?: "primary" | "secondary" | "outline" | null | undefined;
7
+ size?: "32" | "40" | "48" | "56" | null | undefined;
8
+ } & class_variance_authority_types.ClassProp) | undefined) => string;
9
+ interface IButtonProps extends React.ButtonHTMLAttributes<HTMLButtonElement>, VariantProps<typeof buttonVariants> {
10
+ /** Контент кнопки (текст или иконки) */
11
+ children: React.ReactNode;
12
+ /**
13
+ * Если true, оборачивает children в компонент Typography для единообразия.
14
+ * По умолчанию false.
15
+ */
16
+ asChild?: boolean;
17
+ }
18
+ /**
19
+ * Компонент Button используется для интерактивных элементов действия.
20
+ * Поддерживает различные варианты оформления (bg) и размеры (size).
21
+ *
22
+ * @example
23
+ * <Button bg="primary" size="40">Нажми меня</Button>
24
+ */
25
+ declare const Button: FC<IButtonProps>;
26
+
27
+ declare const typographyVariants: (props?: ({
28
+ size?: "button/m/16" | "button/m/14" | null | undefined;
29
+ } & class_variance_authority_types.ClassProp) | undefined) => string;
30
+ type TTag = 'p' | 'span';
31
+ interface ITypographyProps extends React.HTMLAttributes<HTMLParagraphElement>, VariantProps<typeof typographyVariants> {
32
+ children: React.ReactNode;
33
+ tag?: TTag;
34
+ }
35
+ declare const Typography: FC<ITypographyProps>;
36
+
37
+ export { Button, type IButtonProps, type ITypographyProps, Typography };
package/dist/index.d.ts CHANGED
@@ -1,14 +1,37 @@
1
- import { Button } from './stories/button/button';
2
- import { IButtonProps } from './stories/button/button';
3
- import { ITypographyProps } from './stories/typography/typography';
4
- import { Typography } from './stories/typography/typography';
5
-
6
- export { Button }
7
-
8
- export { IButtonProps }
9
-
10
- export { ITypographyProps }
11
-
12
- export { Typography }
13
-
14
- export { }
1
+ import * as class_variance_authority_types from 'class-variance-authority/types';
2
+ import { FC } from 'react';
3
+ import { VariantProps } from 'class-variance-authority';
4
+
5
+ declare const buttonVariants: (props?: ({
6
+ bg?: "primary" | "secondary" | "outline" | null | undefined;
7
+ size?: "32" | "40" | "48" | "56" | null | undefined;
8
+ } & class_variance_authority_types.ClassProp) | undefined) => string;
9
+ interface IButtonProps extends React.ButtonHTMLAttributes<HTMLButtonElement>, VariantProps<typeof buttonVariants> {
10
+ /** Контент кнопки (текст или иконки) */
11
+ children: React.ReactNode;
12
+ /**
13
+ * Если true, оборачивает children в компонент Typography для единообразия.
14
+ * По умолчанию false.
15
+ */
16
+ asChild?: boolean;
17
+ }
18
+ /**
19
+ * Компонент Button используется для интерактивных элементов действия.
20
+ * Поддерживает различные варианты оформления (bg) и размеры (size).
21
+ *
22
+ * @example
23
+ * <Button bg="primary" size="40">Нажми меня</Button>
24
+ */
25
+ declare const Button: FC<IButtonProps>;
26
+
27
+ declare const typographyVariants: (props?: ({
28
+ size?: "button/m/16" | "button/m/14" | null | undefined;
29
+ } & class_variance_authority_types.ClassProp) | undefined) => string;
30
+ type TTag = 'p' | 'span';
31
+ interface ITypographyProps extends React.HTMLAttributes<HTMLParagraphElement>, VariantProps<typeof typographyVariants> {
32
+ children: React.ReactNode;
33
+ tag?: TTag;
34
+ }
35
+ declare const Typography: FC<ITypographyProps>;
36
+
37
+ export { Button, type IButtonProps, type ITypographyProps, Typography };