@shmidko61/lc-ui-kit 0.13.0 → 0.16.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 (67) hide show
  1. package/README.md +61 -0
  2. package/dist/box/box.d.ts +2 -1
  3. package/dist/box/box.types.d.ts +2 -2
  4. package/dist/box/helpers/box-animation.helpers.d.ts +8 -0
  5. package/dist/box/helpers/box-scrollbar.helpers.d.ts +7 -0
  6. package/dist/box/helpers/index.d.ts +2 -0
  7. package/dist/box/types/box-animation.types.d.ts +3 -0
  8. package/dist/box/types/box-scrollbar.types.d.ts +7 -0
  9. package/dist/box/types/index.d.ts +2 -0
  10. package/dist/box.cjs +1 -1
  11. package/dist/box.js +476 -307
  12. package/dist/button.cjs +1 -1
  13. package/dist/button.js +163 -156
  14. package/dist/flex/flex.d.ts +1 -0
  15. package/dist/index.cjs +1 -1
  16. package/dist/index.d.ts +4 -0
  17. package/dist/index.js +70 -62
  18. package/dist/loader/helpers/index.d.ts +1 -0
  19. package/dist/loader/helpers/loader.helpers.d.ts +2 -0
  20. package/dist/loader/index.d.ts +2 -0
  21. package/dist/loader/loader.d.ts +5 -0
  22. package/dist/loader/types/index.d.ts +1 -0
  23. package/dist/loader/types/loader.types.d.ts +28 -0
  24. package/dist/loader-Daam055i.js +104 -0
  25. package/dist/loader-ODTCTLKE.cjs +1 -0
  26. package/dist/loader.cjs +1 -0
  27. package/dist/loader.js +4 -0
  28. package/dist/media-gallery.cjs +1 -1
  29. package/dist/media-gallery.js +42 -30
  30. package/dist/progress-bar/helpers/index.d.ts +1 -0
  31. package/dist/progress-bar/helpers/progress-bar.helpers.d.ts +6 -0
  32. package/dist/progress-bar/index.d.ts +2 -0
  33. package/dist/progress-bar/progress-bar.d.ts +5 -0
  34. package/dist/progress-bar/types/index.d.ts +1 -0
  35. package/dist/progress-bar/types/progress-bar.types.d.ts +80 -0
  36. package/dist/progress-bar-D4CL9r42.js +236 -0
  37. package/dist/progress-bar-XIJDb_UM.cjs +1 -0
  38. package/dist/progress-bar.cjs +1 -0
  39. package/dist/progress-bar.js +4 -0
  40. package/dist/shared/responsive-style/index.d.ts +1 -0
  41. package/dist/styles.css +1 -1
  42. package/dist/tabs/helpers/index.d.ts +1 -0
  43. package/dist/tabs/helpers/tabs.helpers.d.ts +7 -0
  44. package/dist/tabs/hooks/index.d.ts +1 -0
  45. package/dist/tabs/hooks/tabs.hooks.d.ts +5 -0
  46. package/dist/tabs/index.d.ts +2 -0
  47. package/dist/tabs/tabs.d.ts +4 -0
  48. package/dist/tabs/types/index.d.ts +1 -0
  49. package/dist/tabs/types/tabs.types.d.ts +95 -0
  50. package/dist/tabs-BNZDJRz_.cjs +1 -0
  51. package/dist/tabs-DIPSJX1z.js +264 -0
  52. package/dist/tabs.cjs +1 -0
  53. package/dist/tabs.js +5 -0
  54. package/dist/tooltip/helpers/index.d.ts +1 -0
  55. package/dist/tooltip/helpers/tooltip.helpers.d.ts +7 -0
  56. package/dist/tooltip/index.d.ts +2 -0
  57. package/dist/tooltip/tooltip.d.ts +5 -0
  58. package/dist/tooltip/types/index.d.ts +1 -0
  59. package/dist/tooltip/types/tooltip.types.d.ts +51 -0
  60. package/dist/tooltip-0RbTCYn_.cjs +1 -0
  61. package/dist/tooltip-CWnHAfbI.js +166 -0
  62. package/dist/tooltip.cjs +1 -0
  63. package/dist/tooltip.js +4 -0
  64. package/dist/types/animation.types.d.ts +35 -0
  65. package/dist/types/index.d.ts +2 -0
  66. package/dist/types/scrollbar.types.d.ts +33 -0
  67. package/package.json +44 -4
package/dist/button.cjs CHANGED
@@ -1 +1 @@
1
- "use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const f=require("react/jsx-runtime"),E=require("./box.cjs"),st=require("./responsive-style.config-B2m9jVlX.cjs"),lt=require("class-variance-authority"),z=require("./responsive-style.utils-BdyoDkKg.cjs"),G={default:"bg-[var(--color-primary-accent)] text-[var(--color-background-default)] hover:bg-[color-mix(in_srgb,var(--color-primary-accent)_80%,#fff)] active:bg-[color-mix(in_srgb,var(--color-primary-accent)_80%,#000)]",secondary:"bg-[var(--color-background-subtle)] text-[var(--color-text-primary)] hover:bg-[color-mix(in_srgb,var(--color-background-subtle)_90%,#000)] active:bg-[color-mix(in_srgb,var(--color-background-subtle)_80%,#fff)]",destructive:"bg-[var(--color-secondary-accent-2)] text-[var(--color-background-default)] hover:bg-[color-mix(in_srgb,var(--color-secondary-accent-2)_80%,#fff)] active:bg-[color-mix(in_srgb,var(--color-secondary-accent-2)_80%,#000)]",success:"bg-[var(--color-secondary-accent-1)] text-[var(--color-background-default)] hover:bg-[color-mix(in_srgb,var(--color-secondary-accent-1)_80%,#fff)] active:bg-[color-mix(in_srgb,var(--color-secondary-accent-1)_80%,#000)]",dark:"bg-[var(--color-text-primary)] text-[var(--color-background-default)] hover:bg-[color-mix(in_srgb,var(--color-text-primary)_80%,#fff)] active:bg-[color-mix(in_srgb,var(--color-text-primary)_80%,#000)]",transparent:"bg-transparent text-[var(--color-text-primary)] hover:bg-transparent active:bg-transparent"},J={sm:"text-[13px] font-medium leading-[120%] [&_svg]:size-4",md:"text-[15px] font-medium leading-[140%] [&_svg]:size-5",lg:"text-[18px] font-medium leading-[140%] [&_svg]:size-5"},w={sm:"6px",md:"8px",lg:"12px"},K="box-border shrink-0 items-center overflow-hidden tracking-normal transition-colors duration-150 [font-family:var(--font-family)] focus-visible:outline-none focus-visible:ring-2 focus-visible:ring-[color-mix(in_srgb,var(--color-primary-accent)_35%,transparent)] disabled:pointer-events-none disabled:opacity-50 aria-disabled:pointer-events-none aria-disabled:opacity-50 [&_svg]:pointer-events-none [&_svg]:shrink-0",ct=lt.cva([K,"[justify-content:var(--button-justify-content,center)]"].join(" "),{variants:{variant:G,size:J,fullWidth:{true:"w-full"}},defaultVariants:{variant:"default",size:"md"}}),T={sm:{minWidth:32,p:{px:12,py:8}},md:{p:{px:16,py:10}},lg:{p:{px:32,py:16}}},gt={base:"[justify-content:var(--button-justify-content)]",md:"md:[justify-content:var(--md-button-justify-content)]",lg:"lg:[justify-content:var(--lg-button-justify-content)]",xl:"xl:[justify-content:var(--xl-button-justify-content)]"},ut={default:{activeBg:"color-mix(in srgb, var(--color-primary-accent) 80%, #000)",bg:"--color-primary-accent",color:"--color-background-default",hoverBg:"color-mix(in srgb, var(--color-primary-accent) 80%, #fff)"},secondary:{activeBg:"color-mix(in srgb, var(--color-background-subtle) 80%, #fff)",bg:"--color-background-subtle",color:"--color-text-primary",hoverBg:"color-mix(in srgb, var(--color-background-subtle) 90%, #000)"},destructive:{activeBg:"color-mix(in srgb, var(--color-secondary-accent-2) 80%, #000)",bg:"--color-secondary-accent-2",color:"--color-background-default",hoverBg:"color-mix(in srgb, var(--color-secondary-accent-2) 80%, #fff)"},success:{activeBg:"color-mix(in srgb, var(--color-secondary-accent-1) 80%, #000)",bg:"--color-secondary-accent-1",color:"--color-background-default",hoverBg:"color-mix(in srgb, var(--color-secondary-accent-1) 80%, #fff)"},dark:{activeBg:"color-mix(in srgb, var(--color-text-primary) 80%, #000)",bg:"--color-text-primary",color:"--color-background-default",hoverBg:"color-mix(in srgb, var(--color-text-primary) 80%, #fff)"},transparent:{activeBg:"transparent",bg:"transparent",color:"--color-text-primary",hoverBg:"transparent"}},bt={sm:"[&_svg]:size-4",md:"[&_svg]:size-5",lg:"[&_svg]:size-5"},vt={sm:{fontSize:"13px",fontWeight:500,lineHeight:"120%"},md:{fontSize:"15px",fontWeight:500,lineHeight:"140%"},lg:{fontSize:"18px",fontWeight:500,lineHeight:"140%"}},L={activeBg:"active:bg-[var(--button-active-bg,var(--button-hover-bg,var(--button-bg)))]",bg:"bg-[var(--button-bg)]",color:"text-[var(--button-color)]",hoverBg:"hover:bg-[var(--button-hover-bg,var(--button-bg))]"},p={fontSize:"text-[length:var(--button-font-size)]",fontWeight:"font-[var(--button-font-weight)]",lineHeight:"leading-[var(--button-line-height)]"},Q={md:{activeBg:"md:active:bg-[var(--md-button-active-bg,var(--md-button-hover-bg,var(--md-button-bg)))]",bg:"md:bg-[var(--md-button-bg)]",color:"md:text-[var(--md-button-color)]",hoverBg:"md:hover:bg-[var(--md-button-hover-bg,var(--md-button-bg))]"},lg:{activeBg:"lg:active:bg-[var(--lg-button-active-bg,var(--lg-button-hover-bg,var(--lg-button-bg)))]",bg:"lg:bg-[var(--lg-button-bg)]",color:"lg:text-[var(--lg-button-color)]",hoverBg:"lg:hover:bg-[var(--lg-button-hover-bg,var(--lg-button-bg))]"},xl:{activeBg:"xl:active:bg-[var(--xl-button-active-bg,var(--xl-button-hover-bg,var(--xl-button-bg)))]",bg:"xl:bg-[var(--xl-button-bg)]",color:"xl:text-[var(--xl-button-color)]",hoverBg:"xl:hover:bg-[var(--xl-button-hover-bg,var(--xl-button-bg))]"}},_={md:{fontSize:"md:text-[length:var(--md-button-font-size)]",fontWeight:"md:font-[var(--md-button-font-weight)]",lineHeight:"md:leading-[var(--md-button-line-height)]"},lg:{fontSize:"lg:text-[length:var(--lg-button-font-size)]",fontWeight:"lg:font-[var(--lg-button-font-weight)]",lineHeight:"lg:leading-[var(--lg-button-line-height)]"},xl:{fontSize:"xl:text-[length:var(--xl-button-font-size)]",fontWeight:"xl:font-[var(--xl-button-font-weight)]",lineHeight:"xl:leading-[var(--xl-button-line-height)]"}},dt={md:{sm:"md:[&_svg]:size-4",md:"md:[&_svg]:size-5",lg:"md:[&_svg]:size-5"},lg:{sm:"lg:[&_svg]:size-4",md:"lg:[&_svg]:size-5",lg:"lg:[&_svg]:size-5"},xl:{sm:"xl:[&_svg]:size-4",md:"xl:[&_svg]:size-5",lg:"xl:[&_svg]:size-5"}};function ft({alignContent:o,md:t,lg:r,xl:a}){const e=[],n={};return m(o,e,n,{breakpoint:"base"}),m(t?.alignContent,e,n,{breakpoint:"md",variablePrefix:"md-"}),m(r?.alignContent,e,n,{breakpoint:"lg",variablePrefix:"lg-"}),m(a?.alignContent,e,n,{breakpoint:"xl",variablePrefix:"xl-"}),{className:e.join(" "),style:Object.keys(n).length?n:void 0}}function mt({variant:o,md:t,lg:r,xl:a},e={}){const n=[],i={};return x(o,e,{classNames:n,style:i}),x(t?.variant,e.md,{classNames:n,style:i},"md"),x(r?.variant,e.lg,{classNames:n,style:i},"lg"),x(a?.variant,e.xl,{classNames:n,style:i},"xl"),{className:n.join(" "),style:Object.keys(i).length?i:void 0}}function ht({activeBg:o,bg:t,color:r,hoverBg:a,md:e,lg:n,xl:i}){const s=[],l={};return y({activeBg:o,bg:t,color:r,hoverBg:a},s,l),y(e,s,l,"md"),y(n,s,l,"lg"),y(i,s,l,"xl"),{className:s.join(" "),style:Object.keys(l).length?l:void 0}}function xt({fontSize:o,fontWeight:t,lineHeight:r,md:a,lg:e,xl:n}){const i=[],s={};return B({fontSize:o,fontWeight:t,lineHeight:r},i,s),B(a,i,s,"md"),B(e,i,s,"lg"),B(n,i,s,"xl"),{className:i.join(" "),style:Object.keys(s).length?s:void 0}}function yt({size:o="md",md:t,lg:r,xl:a}){const e=[bt[o],p.fontSize,p.fontWeight,p.lineHeight],n={};return h(o,e,n),h(t?.size,e,n,"md"),h(r?.size,e,n,"lg"),h(a?.size,e,n,"xl"),{className:e.join(" "),style:n}}function H(o){if(!o)return;const t={...o};return(o.size||o.border)&&(t.border={radius:o.size?w[o.size]:void 0,...o.border}),o.size&&o.p===void 0&&(t.p=T[o.size].p),delete t.activeBg,delete t.alignContent,delete t.bg,delete t.color,delete t.fontSize,delete t.fontWeight,delete t.hoverBg,delete t.lineHeight,delete t.size,delete t.variant,t}function m(o,t,r,{breakpoint:a,variablePrefix:e=""}){if(!o)return;const n=`${e}button-justify-content`;r[`--${n}`]=Bt(o),t.push(gt[a])}function h(o,t,r,a){if(!o)return;const{fontSize:e,fontWeight:n,lineHeight:i}=vt[o];if(!a){r["--button-font-size"]=e,r["--button-font-weight"]=n,r["--button-line-height"]=i;return}r[`--${a}-button-font-size`]=e,r[`--${a}-button-font-weight`]=n,r[`--${a}-button-line-height`]=i,t.push(dt[a][o],_[a].fontSize,_[a].fontWeight,_[a].lineHeight)}function x(o,t,{classNames:r,style:a},e){if(!o)return;const n=e?Q[e]:L,i=e?`${e}-`:"",s=ut[o];t?.bg===void 0&&(a[`--${i}button-bg`]=c(s.bg),r.push(n.bg)),t?.color===void 0&&(a[`--${i}button-color`]=c(s.color),r.push(n.color)),t?.bg===void 0&&t?.hoverBg===void 0&&(a[`--${i}button-hover-bg`]=c(s.hoverBg),r.push(n.hoverBg)),t?.bg===void 0&&t?.hoverBg===void 0&&t?.activeBg===void 0&&(a[`--${i}button-active-bg`]=c(s.activeBg),r.push(n.activeBg))}function y(o,t,r,a){if(!o)return;const{activeBg:e,bg:n,color:i,hoverBg:s}=o,l=a?Q[a]:L,v=a?`${a}-`:"";n!==void 0&&(r[`--${v}button-bg`]=c(n),t.push(l.bg,l.hoverBg,l.activeBg)),s!==void 0&&(r[`--${v}button-hover-bg`]=c(s),t.push(l.hoverBg)),e!==void 0&&(r[`--${v}button-active-bg`]=c(e),t.push(l.activeBg)),i!==void 0&&(r[`--${v}button-color`]=c(i),t.push(l.color))}function B(o,t,r,a){if(!o)return;const{fontSize:e,fontWeight:n,lineHeight:i}=o,s=a?_[a]:p,l=a?`${a}-`:"";e!==void 0&&(r[`--${l}button-font-size`]=z.normalizeCssTokenValue(e),t.push(s.fontSize)),n!==void 0&&(r[`--${l}button-font-weight`]=z.normalizeCssTokenValue(n),t.push(s.fontWeight)),i!==void 0&&(r[`--${l}button-line-height`]=z.normalizeCssTokenValue(i),t.push(s.lineHeight))}function c(o){return String(z.normalizeCssTokenValue(o))}function Bt(o){return{center:"center",end:"flex-end",start:"flex-start"}[o]}function zt({alignContent:o,children:t,className:r,disabled:a,display:e,border:n,bg:i,color:s,cursor:l,fullWidth:v,href:C,hoverBg:k,activeBg:A,fontSize:U,fontWeight:X,isLoading:Y=!1,lineHeight:Z,minHeight:O,minWidth:tt,md:g,lg:u,xl:b,p:ot,position:nt,size:et,style:R,variant:at,width:rt,...S}){const d=!!a||Y,N=et??"md",j=yt({size:N,md:g,lg:u,xl:b}),$=ft({alignContent:o,md:g,lg:u,xl:b}),P=mt({variant:at??"default",md:g,lg:u,xl:b},{activeBg:A,bg:i,color:s,hoverBg:k,md:g,lg:u,xl:b}),V=ht({activeBg:A,bg:i,color:s,hoverBg:k,md:g,lg:u,xl:b}),W=xt({fontSize:U,fontWeight:X,lineHeight:Z,md:g,lg:u,xl:b}),q={...S,border:{radius:w[N],style:"none",width:"0",...n},cursor:d?"not-allowed":l??"pointer",display:e??"inline-flex",minHeight:O,minWidth:tt,md:H(g),lg:H(u),xl:H(b),p:ot??T[N].p,position:nt??{type:"relative"},width:rt??(v?"100%":void 0)},I=st.cn(K,j.className,C&&"no-underline",$.className,P.className,V.className,W.className,r),D=j.style||$.style||P.style||V.style||W.style||R?{...j.style,...$.style,...P.style,...V.style,...W.style,...R}:void 0,F=f.jsx(f.Fragment,{children:t});if(C){const M=S;return f.jsx(E.Box,{...M,...q,"aria-disabled":d||void 0,as:"a",className:I,href:d?void 0:C,style:D,tabIndex:d?-1:M.tabIndex,children:F})}const it=S;return f.jsx(E.Box,{...it,...q,as:"button",className:I,disabled:d,style:D,children:F})}exports.Button=zt;exports.buttonSizeBorderRadius=w;exports.buttonSizeBoxProps=T;exports.buttonSizeClassNames=J;exports.buttonVariantClassNames=G;exports.buttonVariants=ct;
1
+ "use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const m=require("react/jsx-runtime"),G=require("./box.cjs"),lt=require("./responsive-style.config-B2m9jVlX.cjs"),ct=require("class-variance-authority"),p=require("./responsive-style.utils-BdyoDkKg.cjs"),J={default:"bg-[var(--color-primary-accent)] text-[var(--color-background-default)] hover:bg-[color-mix(in_srgb,var(--color-primary-accent)_80%,#fff)] active:bg-[color-mix(in_srgb,var(--color-primary-accent)_80%,#000)]",secondary:"bg-[var(--color-background-subtle)] text-[var(--color-text-primary)] hover:bg-[color-mix(in_srgb,var(--color-background-subtle)_90%,#000)] active:bg-[color-mix(in_srgb,var(--color-background-subtle)_80%,#fff)]",destructive:"bg-[var(--color-secondary-accent-2)] text-[var(--color-background-default)] hover:bg-[color-mix(in_srgb,var(--color-secondary-accent-2)_80%,#fff)] active:bg-[color-mix(in_srgb,var(--color-secondary-accent-2)_80%,#000)]",success:"bg-[var(--color-secondary-accent-1)] text-[var(--color-background-default)] hover:bg-[color-mix(in_srgb,var(--color-secondary-accent-1)_80%,#fff)] active:bg-[color-mix(in_srgb,var(--color-secondary-accent-1)_80%,#000)]",dark:"bg-[var(--color-text-primary)] text-[var(--color-background-default)] hover:bg-[color-mix(in_srgb,var(--color-text-primary)_80%,#fff)] active:bg-[color-mix(in_srgb,var(--color-text-primary)_80%,#000)]",transparent:"bg-transparent text-[var(--color-text-primary)] hover:bg-transparent active:bg-transparent"},K={sm:"text-[13px] font-medium leading-[120%] [&_svg]:size-4",md:"text-[15px] font-medium leading-[140%] [&_svg]:size-5",lg:"text-[18px] font-medium leading-[140%] [&_svg]:size-5"},k={sm:"6px",md:"8px",lg:"12px"},L="box-border shrink-0 items-center overflow-hidden tracking-normal transition-colors duration-150 [font-family:var(--font-family)] focus-visible:outline-none focus-visible:ring-2 focus-visible:ring-[color-mix(in_srgb,var(--color-primary-accent)_35%,transparent)] disabled:pointer-events-none disabled:opacity-50 aria-disabled:pointer-events-none aria-disabled:opacity-50 [&_svg]:pointer-events-none [&_svg]:shrink-0",gt=ct.cva([L,"[justify-content:var(--button-justify-content,center)]"].join(" "),{variants:{variant:J,size:K,fullWidth:{true:"w-full"}},defaultVariants:{variant:"default",size:"md"}}),T={sm:{minWidth:32,p:{px:12,py:8}},md:{p:{px:16,py:10}},lg:{p:{px:32,py:16}}},ut={base:"[justify-content:var(--button-justify-content)]",md:"md:[justify-content:var(--md-button-justify-content)]",lg:"lg:[justify-content:var(--lg-button-justify-content)]",xl:"xl:[justify-content:var(--xl-button-justify-content)]"},bt={default:{activeBg:"color-mix(in srgb, var(--color-primary-accent) 80%, #000)",bg:"--color-primary-accent",color:"--color-background-default",hoverBg:"color-mix(in srgb, var(--color-primary-accent) 80%, #fff)"},secondary:{activeBg:"color-mix(in srgb, var(--color-background-subtle) 80%, #fff)",bg:"--color-background-subtle",color:"--color-text-primary",hoverBg:"color-mix(in srgb, var(--color-background-subtle) 90%, #000)"},destructive:{activeBg:"color-mix(in srgb, var(--color-secondary-accent-2) 80%, #000)",bg:"--color-secondary-accent-2",color:"--color-background-default",hoverBg:"color-mix(in srgb, var(--color-secondary-accent-2) 80%, #fff)"},success:{activeBg:"color-mix(in srgb, var(--color-secondary-accent-1) 80%, #000)",bg:"--color-secondary-accent-1",color:"--color-background-default",hoverBg:"color-mix(in srgb, var(--color-secondary-accent-1) 80%, #fff)"},dark:{activeBg:"color-mix(in srgb, var(--color-text-primary) 80%, #000)",bg:"--color-text-primary",color:"--color-background-default",hoverBg:"color-mix(in srgb, var(--color-text-primary) 80%, #fff)"},transparent:{activeBg:"transparent",bg:"transparent",color:"--color-text-primary",hoverBg:"transparent"}},vt={sm:"[&_svg]:size-4",md:"[&_svg]:size-5",lg:"[&_svg]:size-5"},dt={sm:{fontSize:"13px",fontWeight:500,lineHeight:"120%"},md:{fontSize:"15px",fontWeight:500,lineHeight:"140%"},lg:{fontSize:"18px",fontWeight:500,lineHeight:"140%"}},Q={activeBg:"active:bg-[var(--button-active-bg,var(--button-hover-bg,var(--button-bg)))]",bg:"bg-[var(--button-bg)]",color:"text-[var(--button-color)]",hoverBg:"hover:bg-[var(--button-hover-bg,var(--button-bg))]"},C={fontSize:"text-[length:var(--button-font-size)]",fontWeight:"font-[var(--button-font-weight)]",lineHeight:"leading-[var(--button-line-height)]"},U={md:{activeBg:"md:active:bg-[var(--md-button-active-bg,var(--md-button-hover-bg,var(--md-button-bg)))]",bg:"md:bg-[var(--md-button-bg)]",color:"md:text-[var(--md-button-color)]",hoverBg:"md:hover:bg-[var(--md-button-hover-bg,var(--md-button-bg))]"},lg:{activeBg:"lg:active:bg-[var(--lg-button-active-bg,var(--lg-button-hover-bg,var(--lg-button-bg)))]",bg:"lg:bg-[var(--lg-button-bg)]",color:"lg:text-[var(--lg-button-color)]",hoverBg:"lg:hover:bg-[var(--lg-button-hover-bg,var(--lg-button-bg))]"},xl:{activeBg:"xl:active:bg-[var(--xl-button-active-bg,var(--xl-button-hover-bg,var(--xl-button-bg)))]",bg:"xl:bg-[var(--xl-button-bg)]",color:"xl:text-[var(--xl-button-color)]",hoverBg:"xl:hover:bg-[var(--xl-button-hover-bg,var(--xl-button-bg))]"}},_={md:{fontSize:"md:text-[length:var(--md-button-font-size)]",fontWeight:"md:font-[var(--md-button-font-weight)]",lineHeight:"md:leading-[var(--md-button-line-height)]"},lg:{fontSize:"lg:text-[length:var(--lg-button-font-size)]",fontWeight:"lg:font-[var(--lg-button-font-weight)]",lineHeight:"lg:leading-[var(--lg-button-line-height)]"},xl:{fontSize:"xl:text-[length:var(--xl-button-font-size)]",fontWeight:"xl:font-[var(--xl-button-font-weight)]",lineHeight:"xl:leading-[var(--xl-button-line-height)]"}},ft={md:{sm:"md:[&_svg]:size-4",md:"md:[&_svg]:size-5",lg:"md:[&_svg]:size-5"},lg:{sm:"lg:[&_svg]:size-4",md:"lg:[&_svg]:size-5",lg:"lg:[&_svg]:size-5"},xl:{sm:"xl:[&_svg]:size-4",md:"xl:[&_svg]:size-5",lg:"xl:[&_svg]:size-5"}};function mt({alignContent:o,md:t,lg:r,xl:a}){const e=[],n={};return h(o,e,n,{breakpoint:"base"}),h(t?.alignContent,e,n,{breakpoint:"md",variablePrefix:"md-"}),h(r?.alignContent,e,n,{breakpoint:"lg",variablePrefix:"lg-"}),h(a?.alignContent,e,n,{breakpoint:"xl",variablePrefix:"xl-"}),{className:e.join(" "),style:Object.keys(n).length?n:void 0}}function ht({variant:o,md:t,lg:r,xl:a},e={}){const n=[],i={};return y(o,e,{classNames:n,style:i}),y(t?.variant,e.md,{classNames:n,style:i},"md"),y(r?.variant,e.lg,{classNames:n,style:i},"lg"),y(a?.variant,e.xl,{classNames:n,style:i},"xl"),{className:n.join(" "),style:Object.keys(i).length?i:void 0}}function xt({activeBg:o,bg:t,color:r,hoverBg:a,md:e,lg:n,xl:i}){const s=[],l={};return B({activeBg:o,bg:t,color:r,hoverBg:a},s,l),B(e,s,l,"md"),B(n,s,l,"lg"),B(i,s,l,"xl"),{className:s.join(" "),style:Object.keys(l).length?l:void 0}}function yt({fontSize:o,fontWeight:t,lineHeight:r,md:a,lg:e,xl:n}){const i=[],s={};return z({fontSize:o,fontWeight:t,lineHeight:r},i,s),z(a,i,s,"md"),z(e,i,s,"lg"),z(n,i,s,"xl"),{className:i.join(" "),style:Object.keys(s).length?s:void 0}}function Bt({size:o="md",md:t,lg:r,xl:a}){const e=[vt[o],C.fontSize,C.fontWeight,C.lineHeight],n={};return x(o,e,n),x(t?.size,e,n,"md"),x(r?.size,e,n,"lg"),x(a?.size,e,n,"xl"),{className:e.join(" "),style:n}}function w(o){if(!o)return;const t={...o};return(o.size||o.border)&&(t.border={radius:o.size?k[o.size]:void 0,...o.border}),o.size&&o.p===void 0&&(t.p=T[o.size].p),delete t.activeBg,delete t.alignContent,delete t.bg,delete t.color,delete t.fontSize,delete t.fontWeight,delete t.hoverBg,delete t.lineHeight,delete t.size,delete t.variant,t}function h(o,t,r,{breakpoint:a,variablePrefix:e=""}){if(!o)return;const n=`${e}button-justify-content`;r[`--${n}`]=zt(o),t.push(ut[a])}function x(o,t,r,a){if(!o)return;const{fontSize:e,fontWeight:n,lineHeight:i}=dt[o];if(!a){r["--button-font-size"]=e,r["--button-font-weight"]=n,r["--button-line-height"]=i;return}r[`--${a}-button-font-size`]=e,r[`--${a}-button-font-weight`]=n,r[`--${a}-button-line-height`]=i,t.push(ft[a][o],_[a].fontSize,_[a].fontWeight,_[a].lineHeight)}function y(o,t,{classNames:r,style:a},e){if(!o)return;const n=e?U[e]:Q,i=e?`${e}-`:"",s=bt[o];t?.bg===void 0&&(a[`--${i}button-bg`]=c(s.bg),r.push(n.bg)),t?.color===void 0&&(a[`--${i}button-color`]=c(s.color),r.push(n.color)),t?.bg===void 0&&t?.hoverBg===void 0&&(a[`--${i}button-hover-bg`]=c(s.hoverBg),r.push(n.hoverBg)),t?.bg===void 0&&t?.hoverBg===void 0&&t?.activeBg===void 0&&(a[`--${i}button-active-bg`]=c(s.activeBg),r.push(n.activeBg))}function f(o,t){return/(?:gradient|url|image-set|cross-fade)\(/.test(String(t))?o.replace("bg-[","[background:"):o}function B(o,t,r,a){if(!o)return;const{activeBg:e,bg:n,color:i,hoverBg:s}=o,l=a?U[a]:Q,v=a?`${a}-`:"";n!==void 0&&(r[`--${v}button-bg`]=c(n),t.push(f(l.bg,n),f(l.hoverBg,s??n),f(l.activeBg,e??s??n))),s!==void 0&&(r[`--${v}button-hover-bg`]=c(s),t.push(f(l.hoverBg,s))),e!==void 0&&(r[`--${v}button-active-bg`]=c(e),t.push(f(l.activeBg,e))),i!==void 0&&(r[`--${v}button-color`]=c(i),t.push(l.color))}function z(o,t,r,a){if(!o)return;const{fontSize:e,fontWeight:n,lineHeight:i}=o,s=a?_[a]:C,l=a?`${a}-`:"";e!==void 0&&(r[`--${l}button-font-size`]=p.normalizeCssTokenValue(e),t.push(s.fontSize)),n!==void 0&&(r[`--${l}button-font-weight`]=p.normalizeCssTokenValue(n),t.push(s.fontWeight)),i!==void 0&&(r[`--${l}button-line-height`]=p.normalizeCssTokenValue(i),t.push(s.lineHeight))}function c(o){return String(p.normalizeCssTokenValue(o))}function zt(o){return{center:"center",end:"flex-end",start:"flex-start"}[o]}function pt({alignContent:o,children:t,className:r,disabled:a,display:e,border:n,bg:i,color:s,cursor:l,fullWidth:v,href:S,hoverBg:A,activeBg:R,fontSize:X,fontWeight:Y,isLoading:Z=!1,lineHeight:O,minHeight:tt,minWidth:ot,md:g,lg:u,xl:b,p:nt,position:et,size:at,style:q,variant:rt,width:it,...N}){const d=!!a||Z,j=at??"md",$=Bt({size:j,md:g,lg:u,xl:b}),P=mt({alignContent:o,md:g,lg:u,xl:b}),V=ht({variant:rt??"default",md:g,lg:u,xl:b},{activeBg:R,bg:i,color:s,hoverBg:A,md:g,lg:u,xl:b}),W=xt({activeBg:R,bg:i,color:s,hoverBg:A,md:g,lg:u,xl:b}),H=yt({fontSize:X,fontWeight:Y,lineHeight:O,md:g,lg:u,xl:b}),I={...N,border:{radius:k[j],style:"none",width:"0",...n},cursor:d?"not-allowed":l??"pointer",display:e??"inline-flex",minHeight:tt,minWidth:ot,md:w(g),lg:w(u),xl:w(b),p:nt??T[j].p,position:et??{type:"relative"},width:it??(v?"100%":void 0)},D=lt.cn(L,$.className,S&&"no-underline",P.className,V.className,W.className,H.className,r),F=$.style||P.style||V.style||W.style||H.style||q?{...$.style,...P.style,...V.style,...W.style,...H.style,...q}:void 0,M=m.jsx(m.Fragment,{children:t});if(S){const E=N;return m.jsx(G.Box,{...E,...I,"aria-disabled":d||void 0,as:"a",className:D,href:d?void 0:S,style:F,tabIndex:d?-1:E.tabIndex,children:M})}const st=N;return m.jsx(G.Box,{...st,...I,as:"button",className:D,disabled:d,style:F,children:M})}exports.Button=pt;exports.buttonSizeBorderRadius=k;exports.buttonSizeBoxProps=T;exports.buttonSizeClassNames=K;exports.buttonVariantClassNames=J;exports.buttonVariants=gt;
package/dist/button.js CHANGED
@@ -1,29 +1,29 @@
1
- import { jsx as H, Fragment as at } from "react/jsx-runtime";
2
- import { Box as q } from "./box.js";
3
- import { c as rt } from "./responsive-style.config-DFuATrIM.js";
4
- import { cva as it } from "class-variance-authority";
5
- import { n as p } from "./responsive-style.utils-D10sC561.js";
6
- const lt = {
1
+ import { jsx as w, Fragment as at } from "react/jsx-runtime";
2
+ import { Box as E } from "./box.js";
3
+ import { c as it } from "./responsive-style.config-DFuATrIM.js";
4
+ import { cva as lt } from "class-variance-authority";
5
+ import { n as B } from "./responsive-style.utils-D10sC561.js";
6
+ const st = {
7
7
  default: "bg-[var(--color-primary-accent)] text-[var(--color-background-default)] hover:bg-[color-mix(in_srgb,var(--color-primary-accent)_80%,#fff)] active:bg-[color-mix(in_srgb,var(--color-primary-accent)_80%,#000)]",
8
8
  secondary: "bg-[var(--color-background-subtle)] text-[var(--color-text-primary)] hover:bg-[color-mix(in_srgb,var(--color-background-subtle)_90%,#000)] active:bg-[color-mix(in_srgb,var(--color-background-subtle)_80%,#fff)]",
9
9
  destructive: "bg-[var(--color-secondary-accent-2)] text-[var(--color-background-default)] hover:bg-[color-mix(in_srgb,var(--color-secondary-accent-2)_80%,#fff)] active:bg-[color-mix(in_srgb,var(--color-secondary-accent-2)_80%,#000)]",
10
10
  success: "bg-[var(--color-secondary-accent-1)] text-[var(--color-background-default)] hover:bg-[color-mix(in_srgb,var(--color-secondary-accent-1)_80%,#fff)] active:bg-[color-mix(in_srgb,var(--color-secondary-accent-1)_80%,#000)]",
11
11
  dark: "bg-[var(--color-text-primary)] text-[var(--color-background-default)] hover:bg-[color-mix(in_srgb,var(--color-text-primary)_80%,#fff)] active:bg-[color-mix(in_srgb,var(--color-text-primary)_80%,#000)]",
12
12
  transparent: "bg-transparent text-[var(--color-text-primary)] hover:bg-transparent active:bg-transparent"
13
- }, st = {
13
+ }, ct = {
14
14
  sm: "text-[13px] font-medium leading-[120%] [&_svg]:size-4",
15
15
  md: "text-[15px] font-medium leading-[140%] [&_svg]:size-5",
16
16
  lg: "text-[18px] font-medium leading-[140%] [&_svg]:size-5"
17
- }, E = {
17
+ }, G = {
18
18
  sm: "6px",
19
19
  md: "8px",
20
20
  lg: "12px"
21
- }, G = "box-border shrink-0 items-center overflow-hidden tracking-normal transition-colors duration-150 [font-family:var(--font-family)] focus-visible:outline-none focus-visible:ring-2 focus-visible:ring-[color-mix(in_srgb,var(--color-primary-accent)_35%,transparent)] disabled:pointer-events-none disabled:opacity-50 aria-disabled:pointer-events-none aria-disabled:opacity-50 [&_svg]:pointer-events-none [&_svg]:shrink-0", St = it(
22
- [G, "[justify-content:var(--button-justify-content,center)]"].join(" "),
21
+ }, J = "box-border shrink-0 items-center overflow-hidden tracking-normal transition-colors duration-150 [font-family:var(--font-family)] focus-visible:outline-none focus-visible:ring-2 focus-visible:ring-[color-mix(in_srgb,var(--color-primary-accent)_35%,transparent)] disabled:pointer-events-none disabled:opacity-50 aria-disabled:pointer-events-none aria-disabled:opacity-50 [&_svg]:pointer-events-none [&_svg]:shrink-0", jt = lt(
22
+ [J, "[justify-content:var(--button-justify-content,center)]"].join(" "),
23
23
  {
24
24
  variants: {
25
- variant: lt,
26
- size: st,
25
+ variant: st,
26
+ size: ct,
27
27
  fullWidth: {
28
28
  true: "w-full"
29
29
  }
@@ -33,7 +33,7 @@ const lt = {
33
33
  size: "md"
34
34
  }
35
35
  }
36
- ), J = {
36
+ ), K = {
37
37
  sm: {
38
38
  minWidth: 32,
39
39
  p: { px: 12, py: 8 }
@@ -44,12 +44,12 @@ const lt = {
44
44
  lg: {
45
45
  p: { px: 32, py: 16 }
46
46
  }
47
- }, ct = {
47
+ }, gt = {
48
48
  base: "[justify-content:var(--button-justify-content)]",
49
49
  md: "md:[justify-content:var(--md-button-justify-content)]",
50
50
  lg: "lg:[justify-content:var(--lg-button-justify-content)]",
51
51
  xl: "xl:[justify-content:var(--xl-button-justify-content)]"
52
- }, gt = {
52
+ }, ut = {
53
53
  default: {
54
54
  activeBg: "color-mix(in srgb, var(--color-primary-accent) 80%, #000)",
55
55
  bg: "--color-primary-accent",
@@ -90,7 +90,7 @@ const lt = {
90
90
  sm: "[&_svg]:size-4",
91
91
  md: "[&_svg]:size-5",
92
92
  lg: "[&_svg]:size-5"
93
- }, ut = {
93
+ }, vt = {
94
94
  sm: {
95
95
  fontSize: "13px",
96
96
  fontWeight: 500,
@@ -106,16 +106,16 @@ const lt = {
106
106
  fontWeight: 500,
107
107
  lineHeight: "140%"
108
108
  }
109
- }, K = {
109
+ }, L = {
110
110
  activeBg: "active:bg-[var(--button-active-bg,var(--button-hover-bg,var(--button-bg)))]",
111
111
  bg: "bg-[var(--button-bg)]",
112
112
  color: "text-[var(--button-color)]",
113
113
  hoverBg: "hover:bg-[var(--button-hover-bg,var(--button-bg))]"
114
- }, B = {
114
+ }, z = {
115
115
  fontSize: "text-[length:var(--button-font-size)]",
116
116
  fontWeight: "font-[var(--button-font-weight)]",
117
117
  lineHeight: "leading-[var(--button-line-height)]"
118
- }, L = {
118
+ }, M = {
119
119
  md: {
120
120
  activeBg: "md:active:bg-[var(--md-button-active-bg,var(--md-button-hover-bg,var(--md-button-bg)))]",
121
121
  bg: "md:bg-[var(--md-button-bg)]",
@@ -134,7 +134,7 @@ const lt = {
134
134
  color: "xl:text-[var(--xl-button-color)]",
135
135
  hoverBg: "xl:hover:bg-[var(--xl-button-hover-bg,var(--xl-button-bg))]"
136
136
  }
137
- }, z = {
137
+ }, _ = {
138
138
  md: {
139
139
  fontSize: "md:text-[length:var(--md-button-font-size)]",
140
140
  fontWeight: "md:font-[var(--md-button-font-weight)]",
@@ -150,7 +150,7 @@ const lt = {
150
150
  fontWeight: "xl:font-[var(--xl-button-font-weight)]",
151
151
  lineHeight: "xl:leading-[var(--xl-button-line-height)]"
152
152
  }
153
- }, vt = {
153
+ }, dt = {
154
154
  md: {
155
155
  sm: "md:[&_svg]:size-4",
156
156
  md: "md:[&_svg]:size-5",
@@ -167,20 +167,20 @@ const lt = {
167
167
  lg: "xl:[&_svg]:size-5"
168
168
  }
169
169
  };
170
- function dt({
170
+ function ft({
171
171
  alignContent: o,
172
172
  md: t,
173
- lg: r,
174
- xl: a
173
+ lg: a,
174
+ xl: r
175
175
  }) {
176
176
  const e = [], n = {};
177
- return f(o, e, n, { breakpoint: "base" }), f(t?.alignContent, e, n, {
177
+ return m(o, e, n, { breakpoint: "base" }), m(t?.alignContent, e, n, {
178
178
  breakpoint: "md",
179
179
  variablePrefix: "md-"
180
- }), f(r?.alignContent, e, n, {
180
+ }), m(a?.alignContent, e, n, {
181
181
  breakpoint: "lg",
182
182
  variablePrefix: "lg-"
183
- }), f(a?.alignContent, e, n, {
183
+ }), m(r?.alignContent, e, n, {
184
184
  breakpoint: "xl",
185
185
  variablePrefix: "xl-"
186
186
  }), {
@@ -188,262 +188,269 @@ function dt({
188
188
  style: Object.keys(n).length ? n : void 0
189
189
  };
190
190
  }
191
- function ft({ variant: o, md: t, lg: r, xl: a }, e = {}) {
191
+ function mt({ variant: o, md: t, lg: a, xl: r }, e = {}) {
192
192
  const n = [], i = {};
193
- return h(o, e, { classNames: n, style: i }), h(t?.variant, e.md, { classNames: n, style: i }, "md"), h(r?.variant, e.lg, { classNames: n, style: i }, "lg"), h(a?.variant, e.xl, { classNames: n, style: i }, "xl"), {
193
+ return x(o, e, { classNames: n, style: i }), x(t?.variant, e.md, { classNames: n, style: i }, "md"), x(a?.variant, e.lg, { classNames: n, style: i }, "lg"), x(r?.variant, e.xl, { classNames: n, style: i }, "xl"), {
194
194
  className: n.join(" "),
195
195
  style: Object.keys(i).length ? i : void 0
196
196
  };
197
197
  }
198
- function mt({
198
+ function ht({
199
199
  activeBg: o,
200
200
  bg: t,
201
- color: r,
202
- hoverBg: a,
201
+ color: a,
202
+ hoverBg: r,
203
203
  md: e,
204
204
  lg: n,
205
205
  xl: i
206
206
  }) {
207
207
  const l = [], s = {};
208
- return x({ activeBg: o, bg: t, color: r, hoverBg: a }, l, s), x(e, l, s, "md"), x(n, l, s, "lg"), x(i, l, s, "xl"), {
208
+ return y({ activeBg: o, bg: t, color: a, hoverBg: r }, l, s), y(e, l, s, "md"), y(n, l, s, "lg"), y(i, l, s, "xl"), {
209
209
  className: l.join(" "),
210
210
  style: Object.keys(s).length ? s : void 0
211
211
  };
212
212
  }
213
- function ht({
213
+ function xt({
214
214
  fontSize: o,
215
215
  fontWeight: t,
216
- lineHeight: r,
217
- md: a,
216
+ lineHeight: a,
217
+ md: r,
218
218
  lg: e,
219
219
  xl: n
220
220
  }) {
221
221
  const i = [], l = {};
222
- return y({ fontSize: o, fontWeight: t, lineHeight: r }, i, l), y(a, i, l, "md"), y(e, i, l, "lg"), y(n, i, l, "xl"), {
222
+ return p({ fontSize: o, fontWeight: t, lineHeight: a }, i, l), p(r, i, l, "md"), p(e, i, l, "lg"), p(n, i, l, "xl"), {
223
223
  className: i.join(" "),
224
224
  style: Object.keys(l).length ? l : void 0
225
225
  };
226
226
  }
227
- function xt({
227
+ function yt({
228
228
  size: o = "md",
229
229
  md: t,
230
- lg: r,
231
- xl: a
230
+ lg: a,
231
+ xl: r
232
232
  }) {
233
233
  const e = [
234
234
  bt[o],
235
- B.fontSize,
236
- B.fontWeight,
237
- B.lineHeight
235
+ z.fontSize,
236
+ z.fontWeight,
237
+ z.lineHeight
238
238
  ], n = {};
239
- return m(o, e, n), m(t?.size, e, n, "md"), m(r?.size, e, n, "lg"), m(a?.size, e, n, "xl"), {
239
+ return h(o, e, n), h(t?.size, e, n, "md"), h(a?.size, e, n, "lg"), h(r?.size, e, n, "xl"), {
240
240
  className: e.join(" "),
241
241
  style: n
242
242
  };
243
243
  }
244
- function w(o) {
244
+ function V(o) {
245
245
  if (!o)
246
246
  return;
247
247
  const t = { ...o };
248
248
  return (o.size || o.border) && (t.border = {
249
- radius: o.size ? E[o.size] : void 0,
249
+ radius: o.size ? G[o.size] : void 0,
250
250
  ...o.border
251
- }), o.size && o.p === void 0 && (t.p = J[o.size].p), delete t.activeBg, delete t.alignContent, delete t.bg, delete t.color, delete t.fontSize, delete t.fontWeight, delete t.hoverBg, delete t.lineHeight, delete t.size, delete t.variant, t;
251
+ }), o.size && o.p === void 0 && (t.p = K[o.size].p), delete t.activeBg, delete t.alignContent, delete t.bg, delete t.color, delete t.fontSize, delete t.fontWeight, delete t.hoverBg, delete t.lineHeight, delete t.size, delete t.variant, t;
252
252
  }
253
- function f(o, t, r, {
254
- breakpoint: a,
253
+ function m(o, t, a, {
254
+ breakpoint: r,
255
255
  variablePrefix: e = ""
256
256
  }) {
257
257
  if (!o)
258
258
  return;
259
259
  const n = `${e}button-justify-content`;
260
- r[`--${n}`] = yt(o), t.push(ct[a]);
260
+ a[`--${n}`] = pt(o), t.push(gt[r]);
261
261
  }
262
- function m(o, t, r, a) {
262
+ function h(o, t, a, r) {
263
263
  if (!o)
264
264
  return;
265
- const { fontSize: e, fontWeight: n, lineHeight: i } = ut[o];
266
- if (!a) {
267
- r["--button-font-size"] = e, r["--button-font-weight"] = n, r["--button-line-height"] = i;
265
+ const { fontSize: e, fontWeight: n, lineHeight: i } = vt[o];
266
+ if (!r) {
267
+ a["--button-font-size"] = e, a["--button-font-weight"] = n, a["--button-line-height"] = i;
268
268
  return;
269
269
  }
270
- r[`--${a}-button-font-size`] = e, r[`--${a}-button-font-weight`] = n, r[`--${a}-button-line-height`] = i, t.push(
271
- vt[a][o],
272
- z[a].fontSize,
273
- z[a].fontWeight,
274
- z[a].lineHeight
270
+ a[`--${r}-button-font-size`] = e, a[`--${r}-button-font-weight`] = n, a[`--${r}-button-line-height`] = i, t.push(
271
+ dt[r][o],
272
+ _[r].fontSize,
273
+ _[r].fontWeight,
274
+ _[r].lineHeight
275
275
  );
276
276
  }
277
- function h(o, t, { classNames: r, style: a }, e) {
277
+ function x(o, t, { classNames: a, style: r }, e) {
278
278
  if (!o)
279
279
  return;
280
- const n = e ? L[e] : K, i = e ? `${e}-` : "", l = gt[o];
281
- t?.bg === void 0 && (a[`--${i}button-bg`] = c(l.bg), r.push(n.bg)), t?.color === void 0 && (a[`--${i}button-color`] = c(l.color), r.push(n.color)), t?.bg === void 0 && t?.hoverBg === void 0 && (a[`--${i}button-hover-bg`] = c(l.hoverBg), r.push(n.hoverBg)), t?.bg === void 0 && t?.hoverBg === void 0 && t?.activeBg === void 0 && (a[`--${i}button-active-bg`] = c(l.activeBg), r.push(n.activeBg));
280
+ const n = e ? M[e] : L, i = e ? `${e}-` : "", l = ut[o];
281
+ t?.bg === void 0 && (r[`--${i}button-bg`] = c(l.bg), a.push(n.bg)), t?.color === void 0 && (r[`--${i}button-color`] = c(l.color), a.push(n.color)), t?.bg === void 0 && t?.hoverBg === void 0 && (r[`--${i}button-hover-bg`] = c(l.hoverBg), a.push(n.hoverBg)), t?.bg === void 0 && t?.hoverBg === void 0 && t?.activeBg === void 0 && (r[`--${i}button-active-bg`] = c(l.activeBg), a.push(n.activeBg));
282
+ }
283
+ function f(o, t) {
284
+ return /(?:gradient|url|image-set|cross-fade)\(/.test(String(t)) ? o.replace("bg-[", "[background:") : o;
282
285
  }
283
- function x(o, t, r, a) {
286
+ function y(o, t, a, r) {
284
287
  if (!o)
285
288
  return;
286
- const { activeBg: e, bg: n, color: i, hoverBg: l } = o, s = a ? L[a] : K, v = a ? `${a}-` : "";
287
- n !== void 0 && (r[`--${v}button-bg`] = c(n), t.push(s.bg, s.hoverBg, s.activeBg)), l !== void 0 && (r[`--${v}button-hover-bg`] = c(l), t.push(s.hoverBg)), e !== void 0 && (r[`--${v}button-active-bg`] = c(e), t.push(s.activeBg)), i !== void 0 && (r[`--${v}button-color`] = c(i), t.push(s.color));
289
+ const { activeBg: e, bg: n, color: i, hoverBg: l } = o, s = r ? M[r] : L, v = r ? `${r}-` : "";
290
+ n !== void 0 && (a[`--${v}button-bg`] = c(n), t.push(
291
+ f(s.bg, n),
292
+ f(s.hoverBg, l ?? n),
293
+ f(s.activeBg, e ?? l ?? n)
294
+ )), l !== void 0 && (a[`--${v}button-hover-bg`] = c(l), t.push(f(s.hoverBg, l))), e !== void 0 && (a[`--${v}button-active-bg`] = c(e), t.push(f(s.activeBg, e))), i !== void 0 && (a[`--${v}button-color`] = c(i), t.push(s.color));
288
295
  }
289
- function y(o, t, r, a) {
296
+ function p(o, t, a, r) {
290
297
  if (!o)
291
298
  return;
292
- const { fontSize: e, fontWeight: n, lineHeight: i } = o, l = a ? z[a] : B, s = a ? `${a}-` : "";
293
- e !== void 0 && (r[`--${s}button-font-size`] = p(e), t.push(l.fontSize)), n !== void 0 && (r[`--${s}button-font-weight`] = p(n), t.push(l.fontWeight)), i !== void 0 && (r[`--${s}button-line-height`] = p(i), t.push(l.lineHeight));
299
+ const { fontSize: e, fontWeight: n, lineHeight: i } = o, l = r ? _[r] : z, s = r ? `${r}-` : "";
300
+ e !== void 0 && (a[`--${s}button-font-size`] = B(e), t.push(l.fontSize)), n !== void 0 && (a[`--${s}button-font-weight`] = B(n), t.push(l.fontWeight)), i !== void 0 && (a[`--${s}button-line-height`] = B(i), t.push(l.lineHeight));
294
301
  }
295
302
  function c(o) {
296
- return String(p(o));
303
+ return String(B(o));
297
304
  }
298
- function yt(o) {
305
+ function pt(o) {
299
306
  return {
300
307
  center: "center",
301
308
  end: "flex-end",
302
309
  start: "flex-start"
303
310
  }[o];
304
311
  }
305
- function jt({
312
+ function $t({
306
313
  alignContent: o,
307
314
  children: t,
308
- className: r,
309
- disabled: a,
315
+ className: a,
316
+ disabled: r,
310
317
  display: e,
311
318
  border: n,
312
319
  bg: i,
313
320
  color: l,
314
321
  cursor: s,
315
322
  fullWidth: v,
316
- href: _,
317
- hoverBg: V,
323
+ href: C,
324
+ hoverBg: k,
318
325
  activeBg: A,
319
- fontSize: M,
320
- fontWeight: Q,
321
- isLoading: U = !1,
322
- lineHeight: X,
323
- minHeight: Y,
324
- minWidth: Z,
326
+ fontSize: Q,
327
+ fontWeight: U,
328
+ isLoading: X = !1,
329
+ lineHeight: Y,
330
+ minHeight: Z,
331
+ minWidth: O,
325
332
  md: g,
326
- lg: b,
327
- xl: u,
328
- p: O,
329
- position: tt,
330
- size: ot,
333
+ lg: u,
334
+ xl: b,
335
+ p: tt,
336
+ position: ot,
337
+ size: nt,
331
338
  style: T,
332
- variant: nt,
333
- width: et,
334
- ...C
339
+ variant: et,
340
+ width: rt,
341
+ ...N
335
342
  }) {
336
- const d = !!a || U, N = ot ?? "md", S = xt({
337
- size: N,
343
+ const d = !!r || X, S = nt ?? "md", j = yt({
344
+ size: S,
338
345
  md: g,
339
- lg: b,
340
- xl: u
341
- }), j = dt({
346
+ lg: u,
347
+ xl: b
348
+ }), $ = ft({
342
349
  alignContent: o,
343
350
  md: g,
344
- lg: b,
345
- xl: u
346
- }), $ = ft(
351
+ lg: u,
352
+ xl: b
353
+ }), P = mt(
347
354
  {
348
- variant: nt ?? "default",
355
+ variant: et ?? "default",
349
356
  md: g,
350
- lg: b,
351
- xl: u
357
+ lg: u,
358
+ xl: b
352
359
  },
353
360
  {
354
361
  activeBg: A,
355
362
  bg: i,
356
363
  color: l,
357
- hoverBg: V,
364
+ hoverBg: k,
358
365
  md: g,
359
- lg: b,
360
- xl: u
366
+ lg: u,
367
+ xl: b
361
368
  }
362
- ), P = mt({
369
+ ), W = ht({
363
370
  activeBg: A,
364
371
  bg: i,
365
372
  color: l,
366
- hoverBg: V,
373
+ hoverBg: k,
367
374
  md: g,
368
- lg: b,
369
- xl: u
370
- }), W = ht({
371
- fontSize: M,
372
- fontWeight: Q,
373
- lineHeight: X,
375
+ lg: u,
376
+ xl: b
377
+ }), H = xt({
378
+ fontSize: Q,
379
+ fontWeight: U,
380
+ lineHeight: Y,
374
381
  md: g,
375
- lg: b,
376
- xl: u
377
- }), k = {
378
- ...C,
382
+ lg: u,
383
+ xl: b
384
+ }), I = {
385
+ ...N,
379
386
  border: {
380
- radius: E[N],
387
+ radius: G[S],
381
388
  style: "none",
382
389
  width: "0",
383
390
  ...n
384
391
  },
385
392
  cursor: d ? "not-allowed" : s ?? "pointer",
386
393
  display: e ?? "inline-flex",
387
- minHeight: Y,
388
- minWidth: Z,
389
- md: w(g),
390
- lg: w(b),
391
- xl: w(u),
392
- p: O ?? J[N].p,
393
- position: tt ?? { type: "relative" },
394
- width: et ?? (v ? "100%" : void 0)
395
- }, I = rt(
396
- G,
397
- S.className,
398
- _ && "no-underline",
394
+ minHeight: Z,
395
+ minWidth: O,
396
+ md: V(g),
397
+ lg: V(u),
398
+ xl: V(b),
399
+ p: tt ?? K[S].p,
400
+ position: ot ?? { type: "relative" },
401
+ width: rt ?? (v ? "100%" : void 0)
402
+ }, R = it(
403
+ J,
399
404
  j.className,
405
+ C && "no-underline",
400
406
  $.className,
401
407
  P.className,
402
408
  W.className,
403
- r
404
- ), R = S.style || j.style || $.style || P.style || W.style || T ? {
405
- ...S.style,
409
+ H.className,
410
+ a
411
+ ), D = j.style || $.style || P.style || W.style || H.style || T ? {
406
412
  ...j.style,
407
413
  ...$.style,
408
414
  ...P.style,
409
415
  ...W.style,
416
+ ...H.style,
410
417
  ...T
411
- } : void 0, D = /* @__PURE__ */ H(at, { children: t });
412
- if (_) {
413
- const F = C;
414
- return /* @__PURE__ */ H(
415
- q,
418
+ } : void 0, F = /* @__PURE__ */ w(at, { children: t });
419
+ if (C) {
420
+ const q = N;
421
+ return /* @__PURE__ */ w(
422
+ E,
416
423
  {
417
- ...F,
418
- ...k,
424
+ ...q,
425
+ ...I,
419
426
  "aria-disabled": d || void 0,
420
427
  as: "a",
421
- className: I,
422
- href: d ? void 0 : _,
423
- style: R,
424
- tabIndex: d ? -1 : F.tabIndex,
425
- children: D
428
+ className: R,
429
+ href: d ? void 0 : C,
430
+ style: D,
431
+ tabIndex: d ? -1 : q.tabIndex,
432
+ children: F
426
433
  }
427
434
  );
428
435
  }
429
- return /* @__PURE__ */ H(
430
- q,
436
+ return /* @__PURE__ */ w(
437
+ E,
431
438
  {
432
- ...C,
433
- ...k,
439
+ ...N,
440
+ ...I,
434
441
  as: "button",
435
- className: I,
442
+ className: R,
436
443
  disabled: d,
437
- style: R,
438
- children: D
444
+ style: D,
445
+ children: F
439
446
  }
440
447
  );
441
448
  }
442
449
  export {
443
- jt as Button,
444
- E as buttonSizeBorderRadius,
445
- J as buttonSizeBoxProps,
446
- st as buttonSizeClassNames,
447
- lt as buttonVariantClassNames,
448
- St as buttonVariants
450
+ $t as Button,
451
+ G as buttonSizeBorderRadius,
452
+ K as buttonSizeBoxProps,
453
+ ct as buttonSizeClassNames,
454
+ st as buttonVariantClassNames,
455
+ jt as buttonVariants
449
456
  };
@@ -5,5 +5,6 @@ export declare function Flex(props: FlexProps<'div'>): JSX.Element;
5
5
  export declare function Flex<TAs extends BoxAs>(props: FlexProps<TAs> & {
6
6
  as: TAs;
7
7
  }): JSX.Element;
8
+ export type { ScrollbarLength, ScrollbarStyleProps, UiKitScrollbarProps } from '../types/index';
8
9
  export type { UiKitAlign, UiKitFlexDirection, UiKitFlexParams, UiKitFlexWrap, UiKitGap, UiKitJustify, } from '../types/index';
9
10
  export type { FlexBreakpointProps, FlexProps, FlexResponsiveProps } from './flex.types';
package/dist/index.cjs CHANGED
@@ -1 +1 @@
1
- "use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const i=require("./accordion.cjs"),s=require("./alert-DTc0Usg-.cjs"),I=require("./box.cjs"),n=require("./button.cjs"),r=require("./ui-kit-provider-raEFsUm0.cjs"),u=require("./flex.cjs"),a=require("./grid.cjs"),o=require("./icons.cjs"),d=require("./input.cjs"),p=require("./media-card.cjs"),T=require("./media-gallery.cjs"),t=require("./notification-provider-C2ypXy2W.cjs"),b=require("./pagination.cjs"),g=require("./picture.cjs"),C=require("./select.cjs"),c=require("./responsive-style.config-B2m9jVlX.cjs"),k=require("./status-badge.cjs"),S=require("./switch.cjs"),e=require("./table-container-DqqqkChm.cjs"),h=require("./toast-CH8VqvLC.cjs"),l=require("./typography.cjs");exports.Accordion=i.Accordion;exports.AccordionItem=i.AccordionItem;exports.AccordionRoot=i.AccordionRoot;exports.Alert=s.Alert;exports.Box=I.Box;exports.Button=n.Button;exports.buttonSizeBorderRadius=n.buttonSizeBorderRadius;exports.buttonSizeBoxProps=n.buttonSizeBoxProps;exports.buttonSizeClassNames=n.buttonSizeClassNames;exports.buttonVariantClassNames=n.buttonVariantClassNames;exports.buttonVariants=n.buttonVariants;exports.UiKitProvider=r.UiKitProvider;exports.uiKitColorTokens=r.uiKitColorTokens;exports.uiKitTypographyTokens=r.uiKitTypographyTokens;exports.useUiKitConfig=r.useUiKitConfig;exports.Flex=u.Flex;exports.Grid=a.Grid;exports.GridItem=a.GridItem;exports.ArrowCornerIcon=o.ArrowCornerIcon;exports.ArrowIcon=o.ArrowIcon;exports.ArrowLongLeftIcon=o.ArrowLongLeftIcon;exports.ArrowheadRightIcon=o.ArrowheadRightIcon;exports.BlockIcon=o.BlockIcon;exports.BurgerIcon=o.BurgerIcon;exports.CheckIcon=o.CheckIcon;exports.CopyIcon=o.CopyIcon;exports.DoubleCheckIcon=o.DoubleCheckIcon;exports.DropDown=o.DropDown;exports.ExclamationMarkIcon=o.ExclamationMarkIcon;exports.EyeOpenIcon=o.EyeOpenIcon;exports.FileIcon=o.FileIcon;exports.GeminiStarIcon=o.GeminiStarIcon;exports.GeoIcon=o.GeoIcon;exports.InfoCircleIcon=o.InfoCircleIcon;exports.LockClosedIcon=o.LockClosedIcon;exports.LockOpenIcon=o.LockOpenIcon;exports.LogoutIcon=o.LogoutIcon;exports.MailIcon=o.MailIcon;exports.MediaMaxIcon=o.MediaMaxIcon;exports.MediaPictureIcon=o.MediaPictureIcon;exports.MediaTgIcon=o.MediaTgIcon;exports.MediaVkIcon=o.MediaVkIcon;exports.MediaWaIcon=o.MediaWaIcon;exports.NetUploadIcon=o.NetUploadIcon;exports.PaperclipIcon=o.PaperclipIcon;exports.PdfIcon=o.PdfIcon;exports.PhoneIcon=o.PhoneIcon;exports.PlusIcon=o.PlusIcon;exports.SaveIcon=o.SaveIcon;exports.SparkIcon=o.SparkIcon;exports.SparkleIcon=o.SparkleIcon;exports.TelephoneIcon=o.TelephoneIcon;exports.TimeClockIcon=o.TimeClockIcon;exports.TrashIcon=o.TrashIcon;exports.WarningTriangleIcon=o.WarningTriangleIcon;exports.XMarkIcon=o.XMarkIcon;exports.Input=d.Input;exports.MediaCard=p.MediaCard;exports.MediaGallery=T.MediaGallery;exports.NotificationProvider=t.NotificationProvider;exports.useNotifications=t.useNotifications;exports.Pagination=b.Pagination;exports.Picture=g.Picture;exports.Select=C.Select;exports.responsiveBreakpointMinWidth=c.responsiveBreakpointMinWidth;exports.responsiveBreakpoints=c.responsiveBreakpoints;exports.StatusBadge=k.StatusBadge;exports.Switch=S.Switch;exports.DataTable=e.DataTable;exports.Table=e.Table;exports.TableBody=e.TableBody;exports.TableCaption=e.TableCaption;exports.TableCell=e.TableCell;exports.TableContainer=e.TableContainer;exports.TableFooter=e.TableFooter;exports.TableHead=e.TableHead;exports.TableHeader=e.TableHeader;exports.TableRow=e.TableRow;exports.TableScrollArea=e.TableScrollArea;exports.TableStatus=e.TableStatus;exports.TableToolbar=e.TableToolbar;exports.Toast=h.Toast;exports.Typography=l.Typography;exports.typographyVariants=l.typographyVariants;
1
+ "use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const i=require("./accordion.cjs"),l=require("./alert-DTc0Usg-.cjs"),I=require("./box.cjs"),n=require("./button.cjs"),r=require("./ui-kit-provider-raEFsUm0.cjs"),u=require("./flex.cjs"),a=require("./grid.cjs"),o=require("./icons.cjs"),d=require("./input.cjs"),p=require("./loader-ODTCTLKE.cjs"),T=require("./media-card.cjs"),b=require("./media-gallery.cjs"),t=require("./notification-provider-C2ypXy2W.cjs"),g=require("./pagination.cjs"),C=require("./picture.cjs"),k=require("./progress-bar-XIJDb_UM.cjs"),S=require("./select.cjs"),c=require("./responsive-style.config-B2m9jVlX.cjs"),h=require("./status-badge.cjs"),y=require("./switch.cjs"),e=require("./table-container-DqqqkChm.cjs"),q=require("./tabs-BNZDJRz_.cjs"),M=require("./toast-CH8VqvLC.cjs"),P=require("./tooltip-0RbTCYn_.cjs"),s=require("./typography.cjs");exports.Accordion=i.Accordion;exports.AccordionItem=i.AccordionItem;exports.AccordionRoot=i.AccordionRoot;exports.Alert=l.Alert;exports.Box=I.Box;exports.Button=n.Button;exports.buttonSizeBorderRadius=n.buttonSizeBorderRadius;exports.buttonSizeBoxProps=n.buttonSizeBoxProps;exports.buttonSizeClassNames=n.buttonSizeClassNames;exports.buttonVariantClassNames=n.buttonVariantClassNames;exports.buttonVariants=n.buttonVariants;exports.UiKitProvider=r.UiKitProvider;exports.uiKitColorTokens=r.uiKitColorTokens;exports.uiKitTypographyTokens=r.uiKitTypographyTokens;exports.useUiKitConfig=r.useUiKitConfig;exports.Flex=u.Flex;exports.Grid=a.Grid;exports.GridItem=a.GridItem;exports.ArrowCornerIcon=o.ArrowCornerIcon;exports.ArrowIcon=o.ArrowIcon;exports.ArrowLongLeftIcon=o.ArrowLongLeftIcon;exports.ArrowheadRightIcon=o.ArrowheadRightIcon;exports.BlockIcon=o.BlockIcon;exports.BurgerIcon=o.BurgerIcon;exports.CheckIcon=o.CheckIcon;exports.CopyIcon=o.CopyIcon;exports.DoubleCheckIcon=o.DoubleCheckIcon;exports.DropDown=o.DropDown;exports.ExclamationMarkIcon=o.ExclamationMarkIcon;exports.EyeOpenIcon=o.EyeOpenIcon;exports.FileIcon=o.FileIcon;exports.GeminiStarIcon=o.GeminiStarIcon;exports.GeoIcon=o.GeoIcon;exports.InfoCircleIcon=o.InfoCircleIcon;exports.LockClosedIcon=o.LockClosedIcon;exports.LockOpenIcon=o.LockOpenIcon;exports.LogoutIcon=o.LogoutIcon;exports.MailIcon=o.MailIcon;exports.MediaMaxIcon=o.MediaMaxIcon;exports.MediaPictureIcon=o.MediaPictureIcon;exports.MediaTgIcon=o.MediaTgIcon;exports.MediaVkIcon=o.MediaVkIcon;exports.MediaWaIcon=o.MediaWaIcon;exports.NetUploadIcon=o.NetUploadIcon;exports.PaperclipIcon=o.PaperclipIcon;exports.PdfIcon=o.PdfIcon;exports.PhoneIcon=o.PhoneIcon;exports.PlusIcon=o.PlusIcon;exports.SaveIcon=o.SaveIcon;exports.SparkIcon=o.SparkIcon;exports.SparkleIcon=o.SparkleIcon;exports.TelephoneIcon=o.TelephoneIcon;exports.TimeClockIcon=o.TimeClockIcon;exports.TrashIcon=o.TrashIcon;exports.WarningTriangleIcon=o.WarningTriangleIcon;exports.XMarkIcon=o.XMarkIcon;exports.Input=d.Input;exports.Loader=p.Loader;exports.MediaCard=T.MediaCard;exports.MediaGallery=b.MediaGallery;exports.NotificationProvider=t.NotificationProvider;exports.useNotifications=t.useNotifications;exports.Pagination=g.Pagination;exports.Picture=C.Picture;exports.ProgressBar=k.ProgressBar;exports.Select=S.Select;exports.responsiveBreakpointMinWidth=c.responsiveBreakpointMinWidth;exports.responsiveBreakpoints=c.responsiveBreakpoints;exports.StatusBadge=h.StatusBadge;exports.Switch=y.Switch;exports.DataTable=e.DataTable;exports.Table=e.Table;exports.TableBody=e.TableBody;exports.TableCaption=e.TableCaption;exports.TableCell=e.TableCell;exports.TableContainer=e.TableContainer;exports.TableFooter=e.TableFooter;exports.TableHead=e.TableHead;exports.TableHeader=e.TableHeader;exports.TableRow=e.TableRow;exports.TableScrollArea=e.TableScrollArea;exports.TableStatus=e.TableStatus;exports.TableToolbar=e.TableToolbar;exports.Tabs=q.Tabs;exports.Toast=M.Toast;exports.Tooltip=P.Tooltip;exports.Typography=s.Typography;exports.typographyVariants=s.typographyVariants;
package/dist/index.d.ts CHANGED
@@ -10,18 +10,22 @@ export { Flex } from './flex/flex';
10
10
  export * from './grid/grid';
11
11
  export * from './icons/icons';
12
12
  export * from './input/input';
13
+ export * from './loader/index';
13
14
  export * from './media-card/media-card';
14
15
  export * from './media-gallery/media-gallery';
15
16
  export * from './notification-provider/index';
16
17
  export * from './pagination/pagination';
17
18
  export * from './picture/picture';
19
+ export * from './progress-bar/index';
18
20
  export * from './select/select';
19
21
  export * from './shared/responsive-style/responsive-style.config';
20
22
  export type * from './shared/responsive-style/responsive-style.types';
21
23
  export * from './status-badge/status-badge';
22
24
  export * from './switch/switch';
23
25
  export * from './table/table';
26
+ export * from './tabs/index';
24
27
  export * from './toast/index';
28
+ export * from './tooltip/index';
25
29
  export type * from './types/index';
26
30
  export * from './typography/typography';
27
31
  export * from './ui-kit-provider/ui-kit-provider';