rc-cui 0.0.2 → 0.0.4

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.
package/dist/index.cjs CHANGED
@@ -1 +1,12 @@
1
- var e=Object.create,t=Object.defineProperty,n=Object.getOwnPropertyDescriptor,r=Object.getOwnPropertyNames,i=Object.getPrototypeOf,a=Object.prototype.hasOwnProperty,o=(e,i,o,s)=>{if(i&&typeof i==`object`||typeof i==`function`)for(var c=r(i),l=0,u=c.length,d;l<u;l++)d=c[l],!a.call(e,d)&&d!==o&&t(e,d,{get:(e=>i[e]).bind(null,d),enumerable:!(s=n(i,d))||s.enumerable});return e},s=(n,r,a)=>(a=n==null?{}:e(i(n)),o(r||!n||!n.__esModule?t(a,`default`,{value:n,enumerable:!0}):a,n));require(`react`),require(`react/jsx-runtime`);
1
+ var e=Object.create,t=Object.defineProperty,n=Object.getOwnPropertyDescriptor,r=Object.getOwnPropertyNames,i=Object.getPrototypeOf,a=Object.prototype.hasOwnProperty,o=(e,i,o,s)=>{if(i&&typeof i==`object`||typeof i==`function`)for(var c=r(i),l=0,u=c.length,d;l<u;l++)d=c[l],!a.call(e,d)&&d!==o&&t(e,d,{get:(e=>i[e]).bind(null,d),enumerable:!(s=n(i,d))||s.enumerable});return e},s=(n,r,a)=>(a=n==null?{}:e(i(n)),o(r||!n||!n.__esModule?t(a,`default`,{value:n,enumerable:!0}):a,n));require(`react`);let c=require(`react/jsx-runtime`);function l({variant:e=`primary`,size:t=`md`,leftIcon:n,rightIcon:r,isLoading:i=!1,disabled:a=!1,className:o=``,children:s,...l}){return(0,c.jsxs)(`button`,{className:`
2
+
3
+ inline-flex items-center justify-center rounded-md font-medium
4
+ transition-all duration-200 focus:outline-none focus:ring-2
5
+ focus:ring-offset-2 disabled:opacity-70 disabled:cursor-not-allowed
6
+ shadow-sm hover:shadow-md
7
+
8
+ ${{primary:`bg-blue-600 hover:bg-blue-700 text-white border-transparent`,secondary:`bg-gray-100 hover:bg-gray-200 text-gray-800 border-transparent`,danger:`bg-red-600 hover:bg-red-700 text-white border-transparent`,success:`bg-green-600 hover:bg-green-700 text-white border-transparent`,outline:`bg-transparent hover:bg-gray-100 text-gray-800 border border-gray-400`}[e]}
9
+ ${{sm:`px-3 py-1 text-sm h-8`,md:`px-4 py-2 text-base h-10`,lg:`px-6 py-3 text-lg h-12`}[t]}
10
+ ${o}
11
+ `,disabled:i||a,"aria-disabled":i||a,...l,children:[i&&(0,c.jsxs)(`svg`,{className:`animate-spin -ml-1 mr-2 h-4 w-4 text-current`,xmlns:`http://www.w3.org/2000/svg`,fill:`none`,viewBox:`0 0 24 24`,children:[(0,c.jsx)(`circle`,{className:`opacity-25`,cx:`12`,cy:`12`,r:`10`,stroke:`currentColor`,strokeWidth:`4`}),(0,c.jsx)(`path`,{className:`opacity-75`,fill:`currentColor`,d:`M4 12a8 8 0 018-8V0C5.373 0 0 5.373 0 12h4zm2 5.291A7.962 7.962 0 014 12H0c0 3.042 1.135 5.824 3 7.938l3-2.647z`})]}),!i&&n&&(0,c.jsx)(`span`,{className:`mr-2`,children:n}),s&&(0,c.jsx)(`span`,{className:i?`opacity-0`:``,children:s}),!i&&r&&(0,c.jsx)(`span`,{className:`ml-2`,children:r})]})}exports.Button=l;
12
+ //# sourceMappingURL=index.cjs.map
@@ -0,0 +1 @@
1
+ {"version":3,"file":"index.cjs","names":["variantStyles: Record<ButtonVariant, string>","sizeStyles: Record<ButtonSize, string>"],"sources":["../src/components/Button/Button.tsx"],"sourcesContent":["import React from 'react';\r\n\r\ntype ButtonVariant = 'primary' | 'secondary' | 'danger' | 'success' | 'outline';\r\ntype ButtonSize = 'sm' | 'md' | 'lg';\r\n\r\ninterface ButtonProps extends React.ButtonHTMLAttributes<HTMLButtonElement> {\r\n variant?: ButtonVariant;\r\n size?: ButtonSize;\r\n leftIcon?: React.ReactNode;\r\n rightIcon?: React.ReactNode;\r\n isLoading?: boolean;\r\n className?: string;\r\n children?: React.ReactNode;\r\n}\r\n\r\nexport default function Button({\r\n variant = 'primary',\r\n size = 'md',\r\n leftIcon,\r\n rightIcon,\r\n isLoading = false,\r\n disabled = false,\r\n className = '',\r\n children,\r\n ...props\r\n}: ButtonProps) {\r\n // Стили для разных вариантов кнопок\r\n const variantStyles: Record<ButtonVariant, string> = {\r\n primary: 'bg-blue-600 hover:bg-blue-700 text-white border-transparent',\r\n secondary: 'bg-gray-100 hover:bg-gray-200 text-gray-800 border-transparent',\r\n danger: 'bg-red-600 hover:bg-red-700 text-white border-transparent',\r\n success: 'bg-green-600 hover:bg-green-700 text-white border-transparent',\r\n outline: 'bg-transparent hover:bg-gray-100 text-gray-800 border border-gray-400'\r\n };\r\n\r\n // Стили для разных размеров\r\n const sizeStyles: Record<ButtonSize, string> = {\r\n sm: 'px-3 py-1 text-sm h-8',\r\n md: 'px-4 py-2 text-base h-10',\r\n lg: 'px-6 py-3 text-lg h-12'\r\n };\r\n\r\n // Общие стили для всех кнопок\r\n const baseStyles = `\r\n inline-flex items-center justify-center rounded-md font-medium\r\n transition-all duration-200 focus:outline-none focus:ring-2\r\n focus:ring-offset-2 disabled:opacity-70 disabled:cursor-not-allowed\r\n shadow-sm hover:shadow-md\r\n `;\r\n\r\n // Комбинированные классы\r\n const combinedClassName = `\r\n ${baseStyles}\r\n ${variantStyles[variant]}\r\n ${sizeStyles[size]}\r\n ${className}\r\n `;\r\n\r\n return (\r\n <button\r\n className={combinedClassName}\r\n disabled={isLoading || disabled}\r\n aria-disabled={isLoading || disabled}\r\n {...props}\r\n >\r\n {/* Индикатор загрузки */}\r\n {isLoading && (\r\n <svg\r\n className=\"animate-spin -ml-1 mr-2 h-4 w-4 text-current\"\r\n xmlns=\"http://www.w3.org/2000/svg\"\r\n fill=\"none\"\r\n viewBox=\"0 0 24 24\"\r\n >\r\n <circle\r\n className=\"opacity-25\"\r\n cx=\"12\"\r\n cy=\"12\"\r\n r=\"10\"\r\n stroke=\"currentColor\"\r\n strokeWidth=\"4\"\r\n ></circle>\r\n <path\r\n className=\"opacity-75\"\r\n fill=\"currentColor\"\r\n d=\"M4 12a8 8 0 018-8V0C5.373 0 0 5.373 0 12h4zm2 5.291A7.962 7.962 0 014 12H0c0 3.042 1.135 5.824 3 7.938l3-2.647z\"\r\n ></path>\r\n </svg>\r\n )}\r\n\r\n {/* Левая иконка */}\r\n {!isLoading && leftIcon && <span className=\"mr-2\">{leftIcon}</span>}\r\n\r\n {/* Текст кнопки */}\r\n {children && <span className={isLoading ? 'opacity-0' : ''}>{children}</span>}\r\n\r\n {/* Правая иконка */}\r\n {!isLoading && rightIcon && <span className=\"ml-2\">{rightIcon}</span>}\r\n </button>\r\n );\r\n}"],"mappings":"khBAeA,SAAwB,EAAO,CAC7B,UAAU,UACV,OAAO,KACP,WACA,YACA,YAAY,GACZ,WAAW,GACX,YAAY,GACZ,WACA,GAAG,GACW,CAiCd,OACE,EAAA,EAAA,MAAC,SAAA,CACC,UATsB;;;;;;;MAxB2B,CACnD,QAAS,8DACT,UAAW,iEACX,OAAQ,4DACR,QAAS,gEACT,QAAS,wEACV,CAoBiB,GAAS;MAjBoB,CAC7C,GAAI,wBACJ,GAAI,2BACJ,GAAI,yBACL,CAcc,GAAM;MACjB,EAAU;IAMV,SAAU,GAAa,EACvB,gBAAe,GAAa,EAC5B,GAAI,YAGH,IACC,EAAA,EAAA,MAAC,MAAA,CACC,UAAU,+CACV,MAAM,6BACN,KAAK,OACL,QAAQ,uBAER,EAAA,EAAA,KAAC,SAAA,CACC,UAAU,aACV,GAAG,KACH,GAAG,KACH,EAAE,KACF,OAAO,eACP,YAAY,KACJ,EACV,EAAA,EAAA,KAAC,OAAA,CACC,UAAU,aACV,KAAK,eACL,EAAE,mHACI,CAAA,EACJ,CAIP,CAAC,GAAa,IAAY,EAAA,EAAA,KAAC,OAAA,CAAK,UAAU,gBAAQ,GAAgB,CAGlE,IAAY,EAAA,EAAA,KAAC,OAAA,CAAK,UAAW,EAAY,YAAc,GAAK,YAAgB,CAG5E,CAAC,GAAa,IAAa,EAAA,EAAA,KAAC,OAAA,CAAK,UAAU,gBAAQ,GAAiB,GAC9D"}
package/dist/index.css ADDED
@@ -0,0 +1,2 @@
1
+ /*! tailwindcss v4.1.18 | MIT License | https://tailwindcss.com */
2
+ @layer properties{@supports (((-webkit-hyphens:none)) and (not (margin-trim:inline))) or ((-moz-orient:inline) and (not (color:rgb(from red r g b)))){*,:before,:after,::backdrop{--tw-border-style:solid;--tw-font-weight:initial;--tw-shadow:0 0 #0000;--tw-shadow-color:initial;--tw-shadow-alpha:100%;--tw-inset-shadow:0 0 #0000;--tw-inset-shadow-color:initial;--tw-inset-shadow-alpha:100%;--tw-ring-color:initial;--tw-ring-shadow:0 0 #0000;--tw-inset-ring-color:initial;--tw-inset-ring-shadow:0 0 #0000;--tw-ring-inset:initial;--tw-ring-offset-width:0px;--tw-ring-offset-color:#fff;--tw-ring-offset-shadow:0 0 #0000;--tw-outline-style:solid;--tw-duration:initial}}}@layer theme{:root,:host{--font-sans:ui-sans-serif,system-ui,sans-serif,"Apple Color Emoji","Segoe UI Emoji","Segoe UI Symbol","Noto Color Emoji";--font-mono:ui-monospace,SFMono-Regular,Menlo,Monaco,Consolas,"Liberation Mono","Courier New",monospace;--color-red-600:#e40014;--color-red-700:#bf000f;--color-green-600:#00a544;--color-green-700:#008138;--color-blue-600:#155dfc;--color-blue-700:#1447e6;--color-gray-100:#f3f4f6;--color-gray-200:#e5e7eb;--color-gray-400:#99a1af;--color-gray-800:#1e2939;--color-white:#fff;--spacing:.25rem;--text-sm:.875rem;--text-sm--line-height:calc(1.25/.875);--text-base:1rem;--text-base--line-height:calc(1.5/1);--text-lg:1.125rem;--text-lg--line-height:calc(1.75/1.125);--font-weight-medium:500;--radius-md:.375rem;--animate-spin:spin 1s linear infinite;--default-transition-duration:.15s;--default-transition-timing-function:cubic-bezier(.4,0,.2,1);--default-font-family:var(--font-sans);--default-mono-font-family:var(--font-mono)}@supports (color:lab(0% 0 0)){:root,:host{--color-red-600:lab(48.4493% 77.4328 61.5452);--color-red-700:lab(40.4273% 67.2623 53.7441);--color-green-600:lab(59.0978% -58.6621 41.2579);--color-green-700:lab(47.0329% -47.0239 31.4788);--color-blue-600:lab(44.0605% 29.0279 -86.0352);--color-blue-700:lab(36.9089% 35.0961 -85.6872);--color-gray-100:lab(96.1596% -.082314 -1.13575);--color-gray-200:lab(91.6229% -.159085 -2.26791);--color-gray-400:lab(65.9269% -.832707 -8.17474);--color-gray-800:lab(16.1051% -1.18239 -11.7533)}}}@layer base{*,:after,:before,::backdrop{box-sizing:border-box;border:0 solid;margin:0;padding:0}::file-selector-button{box-sizing:border-box;border:0 solid;margin:0;padding:0}html,:host{-webkit-text-size-adjust:100%;tab-size:4;line-height:1.5;font-family:var(--default-font-family,ui-sans-serif,system-ui,sans-serif,"Apple Color Emoji","Segoe UI Emoji","Segoe UI Symbol","Noto Color Emoji");font-feature-settings:var(--default-font-feature-settings,normal);font-variation-settings:var(--default-font-variation-settings,normal);-webkit-tap-highlight-color:transparent}hr{height:0;color:inherit;border-top-width:1px}abbr:where([title]){-webkit-text-decoration:underline dotted;text-decoration:underline dotted}h1,h2,h3,h4,h5,h6{font-size:inherit;font-weight:inherit}a{color:inherit;-webkit-text-decoration:inherit;-webkit-text-decoration:inherit;-webkit-text-decoration:inherit;-webkit-text-decoration:inherit;text-decoration:inherit}b,strong{font-weight:bolder}code,kbd,samp,pre{font-family:var(--default-mono-font-family,ui-monospace,SFMono-Regular,Menlo,Monaco,Consolas,"Liberation Mono","Courier New",monospace);font-feature-settings:var(--default-mono-font-feature-settings,normal);font-variation-settings:var(--default-mono-font-variation-settings,normal);font-size:1em}small{font-size:80%}sub,sup{vertical-align:baseline;font-size:75%;line-height:0;position:relative}sub{bottom:-.25em}sup{top:-.5em}table{text-indent:0;border-color:inherit;border-collapse:collapse}:-moz-focusring{outline:auto}progress{vertical-align:baseline}summary{display:list-item}ol,ul,menu{list-style:none}img,svg,video,canvas,audio,iframe,embed,object{vertical-align:middle;display:block}img,video{max-width:100%;height:auto}button,input,select,optgroup,textarea{font:inherit;font-feature-settings:inherit;font-variation-settings:inherit;letter-spacing:inherit;color:inherit;opacity:1;background-color:#0000;border-radius:0}::file-selector-button{font:inherit;font-feature-settings:inherit;font-variation-settings:inherit;letter-spacing:inherit;color:inherit;opacity:1;background-color:#0000;border-radius:0}:where(select:is([multiple],[size])) optgroup{font-weight:bolder}:where(select:is([multiple],[size])) optgroup option{padding-inline-start:20px}::file-selector-button{margin-inline-end:4px}::placeholder{opacity:1}@supports (not ((-webkit-appearance:-apple-pay-button))) or (contain-intrinsic-size:1px){::placeholder{color:currentColor}@supports (color:color-mix(in lab, red, red)){::placeholder{color:color-mix(in oklab,currentcolor 50%,transparent)}}}textarea{resize:vertical}::-webkit-search-decoration{-webkit-appearance:none}::-webkit-date-and-time-value{min-height:1lh;text-align:inherit}::-webkit-datetime-edit{display:inline-flex}::-webkit-datetime-edit-fields-wrapper{padding:0}::-webkit-datetime-edit{padding-block:0}::-webkit-datetime-edit-year-field{padding-block:0}::-webkit-datetime-edit-month-field{padding-block:0}::-webkit-datetime-edit-day-field{padding-block:0}::-webkit-datetime-edit-hour-field{padding-block:0}::-webkit-datetime-edit-minute-field{padding-block:0}::-webkit-datetime-edit-second-field{padding-block:0}::-webkit-datetime-edit-millisecond-field{padding-block:0}::-webkit-datetime-edit-meridiem-field{padding-block:0}::-webkit-calendar-picker-indicator{line-height:1}:-moz-ui-invalid{box-shadow:none}button,input:where([type=button],[type=reset],[type=submit]){appearance:button}::file-selector-button{appearance:button}::-webkit-inner-spin-button{height:auto}::-webkit-outer-spin-button{height:auto}[hidden]:where(:not([hidden=until-found])){display:none!important}}@layer components;@layer utilities{.mr-2{margin-right:calc(var(--spacing)*2)}.-ml-1{margin-left:calc(var(--spacing)*-1)}.ml-2{margin-left:calc(var(--spacing)*2)}.inline-flex{display:inline-flex}.h-4{height:calc(var(--spacing)*4)}.h-8{height:calc(var(--spacing)*8)}.h-10{height:calc(var(--spacing)*10)}.h-12{height:calc(var(--spacing)*12)}.w-4{width:calc(var(--spacing)*4)}.animate-spin{animation:var(--animate-spin)}.items-center{align-items:center}.justify-center{justify-content:center}.rounded-md{border-radius:var(--radius-md)}.border{border-style:var(--tw-border-style);border-width:1px}.border-gray-400{border-color:var(--color-gray-400)}.border-transparent{border-color:#0000}.bg-blue-600{background-color:var(--color-blue-600)}.bg-gray-100{background-color:var(--color-gray-100)}.bg-green-600{background-color:var(--color-green-600)}.bg-red-600{background-color:var(--color-red-600)}.bg-transparent{background-color:#0000}.px-3{padding-inline:calc(var(--spacing)*3)}.px-4{padding-inline:calc(var(--spacing)*4)}.px-6{padding-inline:calc(var(--spacing)*6)}.py-1{padding-block:calc(var(--spacing)*1)}.py-2{padding-block:calc(var(--spacing)*2)}.py-3{padding-block:calc(var(--spacing)*3)}.text-base{font-size:var(--text-base);line-height:var(--tw-leading,var(--text-base--line-height))}.text-lg{font-size:var(--text-lg);line-height:var(--tw-leading,var(--text-lg--line-height))}.text-sm{font-size:var(--text-sm);line-height:var(--tw-leading,var(--text-sm--line-height))}.font-medium{--tw-font-weight:var(--font-weight-medium);font-weight:var(--font-weight-medium)}.text-current{color:currentColor}.text-gray-800{color:var(--color-gray-800)}.text-white{color:var(--color-white)}.opacity-0{opacity:0}.opacity-25{opacity:.25}.opacity-75{opacity:.75}.shadow-sm{--tw-shadow:0 1px 3px 0 var(--tw-shadow-color,#0000001a),0 1px 2px -1px var(--tw-shadow-color,#0000001a);box-shadow:var(--tw-inset-shadow),var(--tw-inset-ring-shadow),var(--tw-ring-offset-shadow),var(--tw-ring-shadow),var(--tw-shadow)}.outline{outline-style:var(--tw-outline-style);outline-width:1px}.transition-all{transition-property:all;transition-timing-function:var(--tw-ease,var(--default-transition-timing-function));transition-duration:var(--tw-duration,var(--default-transition-duration))}.duration-200{--tw-duration:.2s;transition-duration:.2s}@media (hover:hover){.hover\:bg-blue-700:hover{background-color:var(--color-blue-700)}.hover\:bg-gray-100:hover{background-color:var(--color-gray-100)}.hover\:bg-gray-200:hover{background-color:var(--color-gray-200)}.hover\:bg-green-700:hover{background-color:var(--color-green-700)}.hover\:bg-red-700:hover{background-color:var(--color-red-700)}.hover\:shadow-md:hover{--tw-shadow:0 4px 6px -1px var(--tw-shadow-color,#0000001a),0 2px 4px -2px var(--tw-shadow-color,#0000001a);box-shadow:var(--tw-inset-shadow),var(--tw-inset-ring-shadow),var(--tw-ring-offset-shadow),var(--tw-ring-shadow),var(--tw-shadow)}}.focus\:ring-2:focus{--tw-ring-shadow:var(--tw-ring-inset,)0 0 0 calc(2px + var(--tw-ring-offset-width))var(--tw-ring-color,currentcolor);box-shadow:var(--tw-inset-shadow),var(--tw-inset-ring-shadow),var(--tw-ring-offset-shadow),var(--tw-ring-shadow),var(--tw-shadow)}.focus\:ring-offset-2:focus{--tw-ring-offset-width:2px;--tw-ring-offset-shadow:var(--tw-ring-inset,)0 0 0 var(--tw-ring-offset-width)var(--tw-ring-offset-color)}.focus\:outline-none:focus{--tw-outline-style:none;outline-style:none}.disabled\:cursor-not-allowed:disabled{cursor:not-allowed}.disabled\:opacity-70:disabled{opacity:.7}}@property --tw-border-style{syntax:"*";inherits:false;initial-value:solid}@property --tw-font-weight{syntax:"*";inherits:false}@property --tw-shadow{syntax:"*";inherits:false;initial-value:0 0 #0000}@property --tw-shadow-color{syntax:"*";inherits:false}@property --tw-shadow-alpha{syntax:"<percentage>";inherits:false;initial-value:100%}@property --tw-inset-shadow{syntax:"*";inherits:false;initial-value:0 0 #0000}@property --tw-inset-shadow-color{syntax:"*";inherits:false}@property --tw-inset-shadow-alpha{syntax:"<percentage>";inherits:false;initial-value:100%}@property --tw-ring-color{syntax:"*";inherits:false}@property --tw-ring-shadow{syntax:"*";inherits:false;initial-value:0 0 #0000}@property --tw-inset-ring-color{syntax:"*";inherits:false}@property --tw-inset-ring-shadow{syntax:"*";inherits:false;initial-value:0 0 #0000}@property --tw-ring-inset{syntax:"*";inherits:false}@property --tw-ring-offset-width{syntax:"<length>";inherits:false;initial-value:0}@property --tw-ring-offset-color{syntax:"*";inherits:false;initial-value:#fff}@property --tw-ring-offset-shadow{syntax:"*";inherits:false;initial-value:0 0 #0000}@property --tw-outline-style{syntax:"*";inherits:false;initial-value:solid}@property --tw-duration{syntax:"*";inherits:false}@keyframes spin{to{transform:rotate(360deg)}}
package/dist/index.d.ts CHANGED
@@ -1,3 +1,3 @@
1
1
  /* Auto-generated by vite-plugin-dts */
2
- export * from './components/Button/Button';
2
+ export { default as Button } from './components/Button/Button';
3
3
  //# sourceMappingURL=index.d.ts.map
@@ -1,2 +1,2 @@
1
1
  /* Auto-generated by vite-plugin-dts */
2
- {"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../src/index.ts"],"names":[],"mappings":"AAAA,cAAc,4BAA4B,CAAA"}
2
+ {"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../src/index.ts"],"names":[],"mappings":"AAAA,OAAO,aAAa,CAAC;AACrB,OAAO,EAAE,OAAO,IAAI,MAAM,EAAE,MAAM,4BAA4B,CAAC"}
package/dist/index.js CHANGED
@@ -1,2 +1,65 @@
1
1
  import "react";
2
- import "react/jsx-runtime";
2
+ import { jsx, jsxs } from "react/jsx-runtime";
3
+ function Button({ variant: n = "primary", size: r = "md", leftIcon: i, rightIcon: a, isLoading: o = !1, disabled: s = !1, className: c = "", children: l, ...u }) {
4
+ return /* @__PURE__ */ jsxs("button", {
5
+ className: `
6
+
7
+ inline-flex items-center justify-center rounded-md font-medium
8
+ transition-all duration-200 focus:outline-none focus:ring-2
9
+ focus:ring-offset-2 disabled:opacity-70 disabled:cursor-not-allowed
10
+ shadow-sm hover:shadow-md
11
+
12
+ ${{
13
+ primary: "bg-blue-600 hover:bg-blue-700 text-white border-transparent",
14
+ secondary: "bg-gray-100 hover:bg-gray-200 text-gray-800 border-transparent",
15
+ danger: "bg-red-600 hover:bg-red-700 text-white border-transparent",
16
+ success: "bg-green-600 hover:bg-green-700 text-white border-transparent",
17
+ outline: "bg-transparent hover:bg-gray-100 text-gray-800 border border-gray-400"
18
+ }[n]}
19
+ ${{
20
+ sm: "px-3 py-1 text-sm h-8",
21
+ md: "px-4 py-2 text-base h-10",
22
+ lg: "px-6 py-3 text-lg h-12"
23
+ }[r]}
24
+ ${c}
25
+ `,
26
+ disabled: o || s,
27
+ "aria-disabled": o || s,
28
+ ...u,
29
+ children: [
30
+ o && /* @__PURE__ */ jsxs("svg", {
31
+ className: "animate-spin -ml-1 mr-2 h-4 w-4 text-current",
32
+ xmlns: "http://www.w3.org/2000/svg",
33
+ fill: "none",
34
+ viewBox: "0 0 24 24",
35
+ children: [/* @__PURE__ */ jsx("circle", {
36
+ className: "opacity-25",
37
+ cx: "12",
38
+ cy: "12",
39
+ r: "10",
40
+ stroke: "currentColor",
41
+ strokeWidth: "4"
42
+ }), /* @__PURE__ */ jsx("path", {
43
+ className: "opacity-75",
44
+ fill: "currentColor",
45
+ d: "M4 12a8 8 0 018-8V0C5.373 0 0 5.373 0 12h4zm2 5.291A7.962 7.962 0 014 12H0c0 3.042 1.135 5.824 3 7.938l3-2.647z"
46
+ })]
47
+ }),
48
+ !o && i && /* @__PURE__ */ jsx("span", {
49
+ className: "mr-2",
50
+ children: i
51
+ }),
52
+ l && /* @__PURE__ */ jsx("span", {
53
+ className: o ? "opacity-0" : "",
54
+ children: l
55
+ }),
56
+ !o && a && /* @__PURE__ */ jsx("span", {
57
+ className: "ml-2",
58
+ children: a
59
+ })
60
+ ]
61
+ });
62
+ }
63
+ export { Button };
64
+
65
+ //# sourceMappingURL=index.js.map
@@ -0,0 +1 @@
1
+ {"version":3,"file":"index.js","names":["variantStyles: Record<ButtonVariant, string>","sizeStyles: Record<ButtonSize, string>"],"sources":["../src/components/Button/Button.tsx"],"sourcesContent":["import React from 'react';\r\n\r\ntype ButtonVariant = 'primary' | 'secondary' | 'danger' | 'success' | 'outline';\r\ntype ButtonSize = 'sm' | 'md' | 'lg';\r\n\r\ninterface ButtonProps extends React.ButtonHTMLAttributes<HTMLButtonElement> {\r\n variant?: ButtonVariant;\r\n size?: ButtonSize;\r\n leftIcon?: React.ReactNode;\r\n rightIcon?: React.ReactNode;\r\n isLoading?: boolean;\r\n className?: string;\r\n children?: React.ReactNode;\r\n}\r\n\r\nexport default function Button({\r\n variant = 'primary',\r\n size = 'md',\r\n leftIcon,\r\n rightIcon,\r\n isLoading = false,\r\n disabled = false,\r\n className = '',\r\n children,\r\n ...props\r\n}: ButtonProps) {\r\n // Стили для разных вариантов кнопок\r\n const variantStyles: Record<ButtonVariant, string> = {\r\n primary: 'bg-blue-600 hover:bg-blue-700 text-white border-transparent',\r\n secondary: 'bg-gray-100 hover:bg-gray-200 text-gray-800 border-transparent',\r\n danger: 'bg-red-600 hover:bg-red-700 text-white border-transparent',\r\n success: 'bg-green-600 hover:bg-green-700 text-white border-transparent',\r\n outline: 'bg-transparent hover:bg-gray-100 text-gray-800 border border-gray-400'\r\n };\r\n\r\n // Стили для разных размеров\r\n const sizeStyles: Record<ButtonSize, string> = {\r\n sm: 'px-3 py-1 text-sm h-8',\r\n md: 'px-4 py-2 text-base h-10',\r\n lg: 'px-6 py-3 text-lg h-12'\r\n };\r\n\r\n // Общие стили для всех кнопок\r\n const baseStyles = `\r\n inline-flex items-center justify-center rounded-md font-medium\r\n transition-all duration-200 focus:outline-none focus:ring-2\r\n focus:ring-offset-2 disabled:opacity-70 disabled:cursor-not-allowed\r\n shadow-sm hover:shadow-md\r\n `;\r\n\r\n // Комбинированные классы\r\n const combinedClassName = `\r\n ${baseStyles}\r\n ${variantStyles[variant]}\r\n ${sizeStyles[size]}\r\n ${className}\r\n `;\r\n\r\n return (\r\n <button\r\n className={combinedClassName}\r\n disabled={isLoading || disabled}\r\n aria-disabled={isLoading || disabled}\r\n {...props}\r\n >\r\n {/* Индикатор загрузки */}\r\n {isLoading && (\r\n <svg\r\n className=\"animate-spin -ml-1 mr-2 h-4 w-4 text-current\"\r\n xmlns=\"http://www.w3.org/2000/svg\"\r\n fill=\"none\"\r\n viewBox=\"0 0 24 24\"\r\n >\r\n <circle\r\n className=\"opacity-25\"\r\n cx=\"12\"\r\n cy=\"12\"\r\n r=\"10\"\r\n stroke=\"currentColor\"\r\n strokeWidth=\"4\"\r\n ></circle>\r\n <path\r\n className=\"opacity-75\"\r\n fill=\"currentColor\"\r\n d=\"M4 12a8 8 0 018-8V0C5.373 0 0 5.373 0 12h4zm2 5.291A7.962 7.962 0 014 12H0c0 3.042 1.135 5.824 3 7.938l3-2.647z\"\r\n ></path>\r\n </svg>\r\n )}\r\n\r\n {/* Левая иконка */}\r\n {!isLoading && leftIcon && <span className=\"mr-2\">{leftIcon}</span>}\r\n\r\n {/* Текст кнопки */}\r\n {children && <span className={isLoading ? 'opacity-0' : ''}>{children}</span>}\r\n\r\n {/* Правая иконка */}\r\n {!isLoading && rightIcon && <span className=\"ml-2\">{rightIcon}</span>}\r\n </button>\r\n );\r\n}"],"mappings":";;AAeA,SAAwB,OAAO,EAC7B,aAAU,WACV,UAAO,MACP,aACA,cACA,eAAY,IACZ,cAAW,IACX,eAAY,IACZ,aACA,GAAG,KACW;AAiCd,QACE,qBAAC,UAAA;EACC,WATsB;;;;;;;MAxB2B;GACnD,SAAS;GACT,WAAW;GACX,QAAQ;GACR,SAAS;GACT,SAAS;GACV,CAoBiB,GAAS;MAjBoB;GAC7C,IAAI;GACJ,IAAI;GACJ,IAAI;GACL,CAcc,GAAM;MACjB,EAAU;;EAMV,UAAU,KAAa;EACvB,iBAAe,KAAa;EAC5B,GAAI;;GAGH,KACC,qBAAC,OAAA;IACC,WAAU;IACV,OAAM;IACN,MAAK;IACL,SAAQ;eAER,oBAAC,UAAA;KACC,WAAU;KACV,IAAG;KACH,IAAG;KACH,GAAE;KACF,QAAO;KACP,aAAY;MACJ,EACV,oBAAC,QAAA;KACC,WAAU;KACV,MAAK;KACL,GAAE;MACI,CAAA;KACJ;GAIP,CAAC,KAAa,KAAY,oBAAC,QAAA;IAAK,WAAU;cAAQ;KAAgB;GAGlE,KAAY,oBAAC,QAAA;IAAK,WAAW,IAAY,cAAc;IAAK;KAAgB;GAG5E,CAAC,KAAa,KAAa,oBAAC,QAAA;IAAK,WAAU;cAAQ;KAAiB;;GAC9D"}
package/dist/index.umd.js CHANGED
@@ -1 +1,14 @@
1
- (function(e,t){typeof exports==`object`&&typeof module<`u`?t(require(`react`),require(`react/jsx-runtime`)):typeof define==`function`&&define.amd?define([`react`,`react/jsx-runtime`],t):(e=typeof globalThis<`u`?globalThis:e||self,t(e.React,e.jsxRuntime))})(this,function(e,t){Object.create,Object.defineProperty,Object.getOwnPropertyDescriptor,Object.getOwnPropertyNames,Object.getPrototypeOf,Object.prototype.hasOwnProperty});
1
+ (function(e,t){typeof exports==`object`&&typeof module<`u`?t(exports,require(`react`),require(`react/jsx-runtime`)):typeof define==`function`&&define.amd?define([`exports`,`react`,`react/jsx-runtime`],t):(e=typeof globalThis<`u`?globalThis:e||self,t(e.CUI={},e.React,e.jsxRuntime))})(this,function(e,t,n){var r=document.createElement(`style`);r.textContent=`/*! tailwindcss v4.1.18 | MIT License | https://tailwindcss.com */
2
+ @layer properties{@supports (((-webkit-hyphens:none)) and (not (margin-trim:inline))) or ((-moz-orient:inline) and (not (color:rgb(from red r g b)))){*,:before,:after,::backdrop{--tw-border-style:solid;--tw-font-weight:initial;--tw-shadow:0 0 #0000;--tw-shadow-color:initial;--tw-shadow-alpha:100%;--tw-inset-shadow:0 0 #0000;--tw-inset-shadow-color:initial;--tw-inset-shadow-alpha:100%;--tw-ring-color:initial;--tw-ring-shadow:0 0 #0000;--tw-inset-ring-color:initial;--tw-inset-ring-shadow:0 0 #0000;--tw-ring-inset:initial;--tw-ring-offset-width:0px;--tw-ring-offset-color:#fff;--tw-ring-offset-shadow:0 0 #0000;--tw-outline-style:solid;--tw-duration:initial}}}@layer theme{:root,:host{--font-sans:ui-sans-serif,system-ui,sans-serif,"Apple Color Emoji","Segoe UI Emoji","Segoe UI Symbol","Noto Color Emoji";--font-mono:ui-monospace,SFMono-Regular,Menlo,Monaco,Consolas,"Liberation Mono","Courier New",monospace;--color-red-600:#e40014;--color-red-700:#bf000f;--color-green-600:#00a544;--color-green-700:#008138;--color-blue-600:#155dfc;--color-blue-700:#1447e6;--color-gray-100:#f3f4f6;--color-gray-200:#e5e7eb;--color-gray-400:#99a1af;--color-gray-800:#1e2939;--color-white:#fff;--spacing:.25rem;--text-sm:.875rem;--text-sm--line-height:calc(1.25/.875);--text-base:1rem;--text-base--line-height:calc(1.5/1);--text-lg:1.125rem;--text-lg--line-height:calc(1.75/1.125);--font-weight-medium:500;--radius-md:.375rem;--animate-spin:spin 1s linear infinite;--default-transition-duration:.15s;--default-transition-timing-function:cubic-bezier(.4,0,.2,1);--default-font-family:var(--font-sans);--default-mono-font-family:var(--font-mono)}@supports (color:lab(0% 0 0)){:root,:host{--color-red-600:lab(48.4493% 77.4328 61.5452);--color-red-700:lab(40.4273% 67.2623 53.7441);--color-green-600:lab(59.0978% -58.6621 41.2579);--color-green-700:lab(47.0329% -47.0239 31.4788);--color-blue-600:lab(44.0605% 29.0279 -86.0352);--color-blue-700:lab(36.9089% 35.0961 -85.6872);--color-gray-100:lab(96.1596% -.082314 -1.13575);--color-gray-200:lab(91.6229% -.159085 -2.26791);--color-gray-400:lab(65.9269% -.832707 -8.17474);--color-gray-800:lab(16.1051% -1.18239 -11.7533)}}}@layer base{*,:after,:before,::backdrop{box-sizing:border-box;border:0 solid;margin:0;padding:0}::file-selector-button{box-sizing:border-box;border:0 solid;margin:0;padding:0}html,:host{-webkit-text-size-adjust:100%;tab-size:4;line-height:1.5;font-family:var(--default-font-family,ui-sans-serif,system-ui,sans-serif,"Apple Color Emoji","Segoe UI Emoji","Segoe UI Symbol","Noto Color Emoji");font-feature-settings:var(--default-font-feature-settings,normal);font-variation-settings:var(--default-font-variation-settings,normal);-webkit-tap-highlight-color:transparent}hr{height:0;color:inherit;border-top-width:1px}abbr:where([title]){-webkit-text-decoration:underline dotted;text-decoration:underline dotted}h1,h2,h3,h4,h5,h6{font-size:inherit;font-weight:inherit}a{color:inherit;-webkit-text-decoration:inherit;-webkit-text-decoration:inherit;-webkit-text-decoration:inherit;-webkit-text-decoration:inherit;text-decoration:inherit}b,strong{font-weight:bolder}code,kbd,samp,pre{font-family:var(--default-mono-font-family,ui-monospace,SFMono-Regular,Menlo,Monaco,Consolas,"Liberation Mono","Courier New",monospace);font-feature-settings:var(--default-mono-font-feature-settings,normal);font-variation-settings:var(--default-mono-font-variation-settings,normal);font-size:1em}small{font-size:80%}sub,sup{vertical-align:baseline;font-size:75%;line-height:0;position:relative}sub{bottom:-.25em}sup{top:-.5em}table{text-indent:0;border-color:inherit;border-collapse:collapse}:-moz-focusring{outline:auto}progress{vertical-align:baseline}summary{display:list-item}ol,ul,menu{list-style:none}img,svg,video,canvas,audio,iframe,embed,object{vertical-align:middle;display:block}img,video{max-width:100%;height:auto}button,input,select,optgroup,textarea{font:inherit;font-feature-settings:inherit;font-variation-settings:inherit;letter-spacing:inherit;color:inherit;opacity:1;background-color:#0000;border-radius:0}::file-selector-button{font:inherit;font-feature-settings:inherit;font-variation-settings:inherit;letter-spacing:inherit;color:inherit;opacity:1;background-color:#0000;border-radius:0}:where(select:is([multiple],[size])) optgroup{font-weight:bolder}:where(select:is([multiple],[size])) optgroup option{padding-inline-start:20px}::file-selector-button{margin-inline-end:4px}::placeholder{opacity:1}@supports (not ((-webkit-appearance:-apple-pay-button))) or (contain-intrinsic-size:1px){::placeholder{color:currentColor}@supports (color:color-mix(in lab, red, red)){::placeholder{color:color-mix(in oklab,currentcolor 50%,transparent)}}}textarea{resize:vertical}::-webkit-search-decoration{-webkit-appearance:none}::-webkit-date-and-time-value{min-height:1lh;text-align:inherit}::-webkit-datetime-edit{display:inline-flex}::-webkit-datetime-edit-fields-wrapper{padding:0}::-webkit-datetime-edit{padding-block:0}::-webkit-datetime-edit-year-field{padding-block:0}::-webkit-datetime-edit-month-field{padding-block:0}::-webkit-datetime-edit-day-field{padding-block:0}::-webkit-datetime-edit-hour-field{padding-block:0}::-webkit-datetime-edit-minute-field{padding-block:0}::-webkit-datetime-edit-second-field{padding-block:0}::-webkit-datetime-edit-millisecond-field{padding-block:0}::-webkit-datetime-edit-meridiem-field{padding-block:0}::-webkit-calendar-picker-indicator{line-height:1}:-moz-ui-invalid{box-shadow:none}button,input:where([type=button],[type=reset],[type=submit]){appearance:button}::file-selector-button{appearance:button}::-webkit-inner-spin-button{height:auto}::-webkit-outer-spin-button{height:auto}[hidden]:where(:not([hidden=until-found])){display:none!important}}@layer components;@layer utilities{.mr-2{margin-right:calc(var(--spacing)*2)}.-ml-1{margin-left:calc(var(--spacing)*-1)}.ml-2{margin-left:calc(var(--spacing)*2)}.inline-flex{display:inline-flex}.h-4{height:calc(var(--spacing)*4)}.h-8{height:calc(var(--spacing)*8)}.h-10{height:calc(var(--spacing)*10)}.h-12{height:calc(var(--spacing)*12)}.w-4{width:calc(var(--spacing)*4)}.animate-spin{animation:var(--animate-spin)}.items-center{align-items:center}.justify-center{justify-content:center}.rounded-md{border-radius:var(--radius-md)}.border{border-style:var(--tw-border-style);border-width:1px}.border-gray-400{border-color:var(--color-gray-400)}.border-transparent{border-color:#0000}.bg-blue-600{background-color:var(--color-blue-600)}.bg-gray-100{background-color:var(--color-gray-100)}.bg-green-600{background-color:var(--color-green-600)}.bg-red-600{background-color:var(--color-red-600)}.bg-transparent{background-color:#0000}.px-3{padding-inline:calc(var(--spacing)*3)}.px-4{padding-inline:calc(var(--spacing)*4)}.px-6{padding-inline:calc(var(--spacing)*6)}.py-1{padding-block:calc(var(--spacing)*1)}.py-2{padding-block:calc(var(--spacing)*2)}.py-3{padding-block:calc(var(--spacing)*3)}.text-base{font-size:var(--text-base);line-height:var(--tw-leading,var(--text-base--line-height))}.text-lg{font-size:var(--text-lg);line-height:var(--tw-leading,var(--text-lg--line-height))}.text-sm{font-size:var(--text-sm);line-height:var(--tw-leading,var(--text-sm--line-height))}.font-medium{--tw-font-weight:var(--font-weight-medium);font-weight:var(--font-weight-medium)}.text-current{color:currentColor}.text-gray-800{color:var(--color-gray-800)}.text-white{color:var(--color-white)}.opacity-0{opacity:0}.opacity-25{opacity:.25}.opacity-75{opacity:.75}.shadow-sm{--tw-shadow:0 1px 3px 0 var(--tw-shadow-color,#0000001a),0 1px 2px -1px var(--tw-shadow-color,#0000001a);box-shadow:var(--tw-inset-shadow),var(--tw-inset-ring-shadow),var(--tw-ring-offset-shadow),var(--tw-ring-shadow),var(--tw-shadow)}.outline{outline-style:var(--tw-outline-style);outline-width:1px}.transition-all{transition-property:all;transition-timing-function:var(--tw-ease,var(--default-transition-timing-function));transition-duration:var(--tw-duration,var(--default-transition-duration))}.duration-200{--tw-duration:.2s;transition-duration:.2s}@media (hover:hover){.hover\\:bg-blue-700:hover{background-color:var(--color-blue-700)}.hover\\:bg-gray-100:hover{background-color:var(--color-gray-100)}.hover\\:bg-gray-200:hover{background-color:var(--color-gray-200)}.hover\\:bg-green-700:hover{background-color:var(--color-green-700)}.hover\\:bg-red-700:hover{background-color:var(--color-red-700)}.hover\\:shadow-md:hover{--tw-shadow:0 4px 6px -1px var(--tw-shadow-color,#0000001a),0 2px 4px -2px var(--tw-shadow-color,#0000001a);box-shadow:var(--tw-inset-shadow),var(--tw-inset-ring-shadow),var(--tw-ring-offset-shadow),var(--tw-ring-shadow),var(--tw-shadow)}}.focus\\:ring-2:focus{--tw-ring-shadow:var(--tw-ring-inset,)0 0 0 calc(2px + var(--tw-ring-offset-width))var(--tw-ring-color,currentcolor);box-shadow:var(--tw-inset-shadow),var(--tw-inset-ring-shadow),var(--tw-ring-offset-shadow),var(--tw-ring-shadow),var(--tw-shadow)}.focus\\:ring-offset-2:focus{--tw-ring-offset-width:2px;--tw-ring-offset-shadow:var(--tw-ring-inset,)0 0 0 var(--tw-ring-offset-width)var(--tw-ring-offset-color)}.focus\\:outline-none:focus{--tw-outline-style:none;outline-style:none}.disabled\\:cursor-not-allowed:disabled{cursor:not-allowed}.disabled\\:opacity-70:disabled{opacity:.7}}@property --tw-border-style{syntax:"*";inherits:false;initial-value:solid}@property --tw-font-weight{syntax:"*";inherits:false}@property --tw-shadow{syntax:"*";inherits:false;initial-value:0 0 #0000}@property --tw-shadow-color{syntax:"*";inherits:false}@property --tw-shadow-alpha{syntax:"<percentage>";inherits:false;initial-value:100%}@property --tw-inset-shadow{syntax:"*";inherits:false;initial-value:0 0 #0000}@property --tw-inset-shadow-color{syntax:"*";inherits:false}@property --tw-inset-shadow-alpha{syntax:"<percentage>";inherits:false;initial-value:100%}@property --tw-ring-color{syntax:"*";inherits:false}@property --tw-ring-shadow{syntax:"*";inherits:false;initial-value:0 0 #0000}@property --tw-inset-ring-color{syntax:"*";inherits:false}@property --tw-inset-ring-shadow{syntax:"*";inherits:false;initial-value:0 0 #0000}@property --tw-ring-inset{syntax:"*";inherits:false}@property --tw-ring-offset-width{syntax:"<length>";inherits:false;initial-value:0}@property --tw-ring-offset-color{syntax:"*";inherits:false;initial-value:#fff}@property --tw-ring-offset-shadow{syntax:"*";inherits:false;initial-value:0 0 #0000}@property --tw-outline-style{syntax:"*";inherits:false;initial-value:solid}@property --tw-duration{syntax:"*";inherits:false}@keyframes spin{to{transform:rotate(360deg)}}
3
+ /*$vite$:1*/`,document.head.appendChild(r),Object.create,Object.defineProperty,Object.getOwnPropertyDescriptor,Object.getOwnPropertyNames,Object.getPrototypeOf,Object.prototype.hasOwnProperty;function i({variant:e=`primary`,size:t=`md`,leftIcon:r,rightIcon:i,isLoading:a=!1,disabled:o=!1,className:s=``,children:c,...l}){return(0,n.jsxs)(`button`,{className:`
4
+
5
+ inline-flex items-center justify-center rounded-md font-medium
6
+ transition-all duration-200 focus:outline-none focus:ring-2
7
+ focus:ring-offset-2 disabled:opacity-70 disabled:cursor-not-allowed
8
+ shadow-sm hover:shadow-md
9
+
10
+ ${{primary:`bg-blue-600 hover:bg-blue-700 text-white border-transparent`,secondary:`bg-gray-100 hover:bg-gray-200 text-gray-800 border-transparent`,danger:`bg-red-600 hover:bg-red-700 text-white border-transparent`,success:`bg-green-600 hover:bg-green-700 text-white border-transparent`,outline:`bg-transparent hover:bg-gray-100 text-gray-800 border border-gray-400`}[e]}
11
+ ${{sm:`px-3 py-1 text-sm h-8`,md:`px-4 py-2 text-base h-10`,lg:`px-6 py-3 text-lg h-12`}[t]}
12
+ ${s}
13
+ `,disabled:a||o,"aria-disabled":a||o,...l,children:[a&&(0,n.jsxs)(`svg`,{className:`animate-spin -ml-1 mr-2 h-4 w-4 text-current`,xmlns:`http://www.w3.org/2000/svg`,fill:`none`,viewBox:`0 0 24 24`,children:[(0,n.jsx)(`circle`,{className:`opacity-25`,cx:`12`,cy:`12`,r:`10`,stroke:`currentColor`,strokeWidth:`4`}),(0,n.jsx)(`path`,{className:`opacity-75`,fill:`currentColor`,d:`M4 12a8 8 0 018-8V0C5.373 0 0 5.373 0 12h4zm2 5.291A7.962 7.962 0 014 12H0c0 3.042 1.135 5.824 3 7.938l3-2.647z`})]}),!a&&r&&(0,n.jsx)(`span`,{className:`mr-2`,children:r}),c&&(0,n.jsx)(`span`,{className:a?`opacity-0`:``,children:c}),!a&&i&&(0,n.jsx)(`span`,{className:`ml-2`,children:i})]})}e.Button=i});
14
+ //# sourceMappingURL=index.umd.js.map
@@ -0,0 +1 @@
1
+ {"version":3,"file":"index.umd.js","names":["variantStyles: Record<ButtonVariant, string>","sizeStyles: Record<ButtonSize, string>"],"sources":["../src/components/Button/Button.tsx"],"sourcesContent":["import React from 'react';\r\n\r\ntype ButtonVariant = 'primary' | 'secondary' | 'danger' | 'success' | 'outline';\r\ntype ButtonSize = 'sm' | 'md' | 'lg';\r\n\r\ninterface ButtonProps extends React.ButtonHTMLAttributes<HTMLButtonElement> {\r\n variant?: ButtonVariant;\r\n size?: ButtonSize;\r\n leftIcon?: React.ReactNode;\r\n rightIcon?: React.ReactNode;\r\n isLoading?: boolean;\r\n className?: string;\r\n children?: React.ReactNode;\r\n}\r\n\r\nexport default function Button({\r\n variant = 'primary',\r\n size = 'md',\r\n leftIcon,\r\n rightIcon,\r\n isLoading = false,\r\n disabled = false,\r\n className = '',\r\n children,\r\n ...props\r\n}: ButtonProps) {\r\n // Стили для разных вариантов кнопок\r\n const variantStyles: Record<ButtonVariant, string> = {\r\n primary: 'bg-blue-600 hover:bg-blue-700 text-white border-transparent',\r\n secondary: 'bg-gray-100 hover:bg-gray-200 text-gray-800 border-transparent',\r\n danger: 'bg-red-600 hover:bg-red-700 text-white border-transparent',\r\n success: 'bg-green-600 hover:bg-green-700 text-white border-transparent',\r\n outline: 'bg-transparent hover:bg-gray-100 text-gray-800 border border-gray-400'\r\n };\r\n\r\n // Стили для разных размеров\r\n const sizeStyles: Record<ButtonSize, string> = {\r\n sm: 'px-3 py-1 text-sm h-8',\r\n md: 'px-4 py-2 text-base h-10',\r\n lg: 'px-6 py-3 text-lg h-12'\r\n };\r\n\r\n // Общие стили для всех кнопок\r\n const baseStyles = `\r\n inline-flex items-center justify-center rounded-md font-medium\r\n transition-all duration-200 focus:outline-none focus:ring-2\r\n focus:ring-offset-2 disabled:opacity-70 disabled:cursor-not-allowed\r\n shadow-sm hover:shadow-md\r\n `;\r\n\r\n // Комбинированные классы\r\n const combinedClassName = `\r\n ${baseStyles}\r\n ${variantStyles[variant]}\r\n ${sizeStyles[size]}\r\n ${className}\r\n `;\r\n\r\n return (\r\n <button\r\n className={combinedClassName}\r\n disabled={isLoading || disabled}\r\n aria-disabled={isLoading || disabled}\r\n {...props}\r\n >\r\n {/* Индикатор загрузки */}\r\n {isLoading && (\r\n <svg\r\n className=\"animate-spin -ml-1 mr-2 h-4 w-4 text-current\"\r\n xmlns=\"http://www.w3.org/2000/svg\"\r\n fill=\"none\"\r\n viewBox=\"0 0 24 24\"\r\n >\r\n <circle\r\n className=\"opacity-25\"\r\n cx=\"12\"\r\n cy=\"12\"\r\n r=\"10\"\r\n stroke=\"currentColor\"\r\n strokeWidth=\"4\"\r\n ></circle>\r\n <path\r\n className=\"opacity-75\"\r\n fill=\"currentColor\"\r\n d=\"M4 12a8 8 0 018-8V0C5.373 0 0 5.373 0 12h4zm2 5.291A7.962 7.962 0 014 12H0c0 3.042 1.135 5.824 3 7.938l3-2.647z\"\r\n ></path>\r\n </svg>\r\n )}\r\n\r\n {/* Левая иконка */}\r\n {!isLoading && leftIcon && <span className=\"mr-2\">{leftIcon}</span>}\r\n\r\n {/* Текст кнопки */}\r\n {children && <span className={isLoading ? 'opacity-0' : ''}>{children}</span>}\r\n\r\n {/* Правая иконка */}\r\n {!isLoading && rightIcon && <span className=\"ml-2\">{rightIcon}</span>}\r\n </button>\r\n );\r\n}"],"mappings":";;gMAeA,SAAwB,EAAO,CAC7B,UAAU,UACV,OAAO,KACP,WACA,YACA,YAAY,GACZ,WAAW,GACX,YAAY,GACZ,WACA,GAAG,GACW,CAiCd,OACE,EAAA,EAAA,MAAC,SAAA,CACC,UATsB;;;;;;;MAxB2B,CACnD,QAAS,8DACT,UAAW,iEACX,OAAQ,4DACR,QAAS,gEACT,QAAS,wEACV,CAoBiB,GAAA;MAjB6B,CAC7C,GAAI,wBACJ,GAAI,2BACJ,GAAI,yBACL,CAcc,GAAA;MACX,EAAA;IAMA,SAAU,GAAa,EACvB,gBAAe,GAAa,EAC5B,GAAI,YAGH,IACC,EAAA,EAAA,MAAC,MAAA,CACC,UAAU,+CACV,MAAM,6BACN,KAAK,OACL,QAAQ,uBAER,EAAA,EAAA,KAAC,SAAA,CACC,UAAU,aACV,GAAG,KACH,GAAG,KACH,EAAE,KACF,OAAO,eACP,YAAY,KACJ,EACV,EAAA,EAAA,KAAC,OAAA,CACC,UAAU,aACV,KAAK,eACL,EAAE,mHACI,CAAA,EACJ,CAIP,CAAC,GAAa,IAAY,EAAA,EAAA,KAAC,OAAA,CAAK,UAAU,gBAAQ,GAAgB,CAGlE,IAAY,EAAA,EAAA,KAAC,OAAA,CAAK,UAAW,EAAY,YAAc,GAAK,YAAgB,CAG5E,CAAC,GAAa,IAAa,EAAA,EAAA,KAAC,OAAA,CAAK,UAAU,gBAAQ,MAC7C"}
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "rc-cui",
3
- "version": "0.0.2",
3
+ "version": "0.0.4",
4
4
  "author": "Igor Ushakov",
5
5
  "description": "This is a customizable UI component library for React + TypeScript + Tailwind CSS.",
6
6
  "license": "MIT",
@@ -37,8 +37,8 @@
37
37
  "preview": "vite preview",
38
38
  "clean": "shx rm -rf dist",
39
39
  "prebuild": "npm run clean",
40
- "postbuild": "shx mkdir -p dist && shx cp src/index.css dist/style.css",
41
- "build:full": "npm run prebuild && npm run build && npm run postbuild"
40
+ "build:full": "npm run prebuild && npm run build",
41
+ "publish": "npm run build:full && npm publish"
42
42
  },
43
43
  "dependencies": {
44
44
  "react": "^19.2.3",
package/dist/style.css DELETED
@@ -1 +0,0 @@
1
- @import "tailwindcss";