@berdsk/ui 0.1.1 → 0.1.2

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,4 +1,4 @@
1
- "use strict";var z=Object.create;var b=Object.defineProperty;var B=Object.getOwnPropertyDescriptor;var A=Object.getOwnPropertyNames;var $=Object.getPrototypeOf,S=Object.prototype.hasOwnProperty;var O=(e,r)=>{for(var o in r)b(e,o,{get:r[o],enumerable:!0})},k=(e,r,o,s)=>{if(r&&typeof r=="object"||typeof r=="function")for(let t of A(r))!S.call(e,t)&&t!==o&&b(e,t,{get:()=>r[t],enumerable:!(s=B(r,t))||s.enumerable});return e};var m=(e,r,o)=>(o=e!=null?z($(e)):{},k(r||!e||!e.__esModule?b(o,"default",{value:e,enumerable:!0}):o,e)),F=e=>k(b({},"__esModule",{value:!0}),e);var D={};O(D,{Button:()=>R,Icon:()=>U,ThemeProvider:()=>W,defaultTheme:()=>l,useTheme:()=>q});module.exports=F(D);var x=m(require("react"),1),T=require("react/jsx-runtime"),y="https://cdn.berdsk.com.br/berdsk-ui/icons/all.css",v="https://cdn.berdsk.com.br",I=()=>{if(typeof document>"u")return;if(!document.querySelector(`link[rel="preconnect"][href="${v}"]`)){let r=document.createElement("link");r.rel="preconnect",r.href=v,document.head.appendChild(r)}if(!document.querySelector(`link[href="${y}"]`)){let r=document.createElement("link");r.rel="stylesheet",r.href=y,document.head.appendChild(r)}},U=({className:e,...r})=>(x.useEffect(()=>{I()},[]),(0,T.jsx)("i",{className:`${e}`,...r}));var C=m(require("react"),1),n=require("react/jsx-runtime"),R=C.forwardRef(({children:e,variant:r="solid",color:o="primary",size:s="md",rounded:t="md",leftIcon:d,rightIcon:c,fullWidth:i=!1,className:w="",href:u,...p},g)=>{let M=`btn-${r}`,N=`btn-${o}`,P=`btn-${s}`,H=`btn-rounded-${t}`,h=["btn",M,N,P,H,i?"btn-full-width":"",!e&&(d||c)?"btn-icon-only":"",w].filter(Boolean).join(" "),f=(0,n.jsxs)(n.Fragment,{children:[d&&(0,n.jsx)("span",{className:"btn-icon-left",children:d}),e&&(0,n.jsx)("span",{className:"btn-content",children:e}),c&&(0,n.jsx)("span",{className:"btn-icon-right",children:c})]});return u?(0,n.jsx)("a",{href:u,className:h,ref:g,...p,children:f}):(0,n.jsx)("button",{className:h,ref:g,...p,children:f})});R.displayName="Button";var a=m(require("react"),1),L=require("react/jsx-runtime"),l={colors:{primary:"#007bff",secondary:"#6c757d",danger:"#dc3545",success:"#28a745"},border:{color:"#dee2e6",size:"1px",radius:{none:"0",xs:"0.125rem",sm:"0.25rem",md:"0.375rem",lg:"0.5rem",full:"9999px"}}},E=a.createContext({theme:l}),W=({theme:e,children:r})=>{let o=a.useMemo(()=>e?{...l,...e,colors:{...l.colors,...e.colors},border:{...l.border,...e.border,radius:{...l.border.radius,...e.border?.radius}}}:l,[e]);return a.useLayoutEffect(()=>{let s=document.documentElement;Object.entries(o.colors).forEach(([c,i])=>{s.style.setProperty(`--berdsk-color-${c}`,i)}),s.style.setProperty("--berdsk-border-color",o.border.color),s.style.setProperty("--berdsk-border-size",o.border.size),Object.entries(o.border.radius).forEach(([c,i])=>{s.style.setProperty(`--berdsk-rounded-${c}`,i)});let t="berdsk-ui-theme-styles",d=document.getElementById(t);d||(d=document.createElement("style"),d.id=t,document.head.appendChild(d)),d.innerHTML=`
1
+ "use strict";var z=Object.create;var b=Object.defineProperty;var B=Object.getOwnPropertyDescriptor;var A=Object.getOwnPropertyNames;var $=Object.getPrototypeOf,S=Object.prototype.hasOwnProperty;var O=(e,r)=>{for(var n in r)b(e,n,{get:r[n],enumerable:!0})},k=(e,r,n,o)=>{if(r&&typeof r=="object"||typeof r=="function")for(let t of A(r))!S.call(e,t)&&t!==n&&b(e,t,{get:()=>r[t],enumerable:!(o=B(r,t))||o.enumerable});return e};var m=(e,r,n)=>(n=e!=null?z($(e)):{},k(r||!e||!e.__esModule?b(n,"default",{value:e,enumerable:!0}):n,e)),F=e=>k(b({},"__esModule",{value:!0}),e);var q={};O(q,{Button:()=>R,Icon:()=>U,ThemeProvider:()=>W,defaultTheme:()=>c,useTheme:()=>j});module.exports=F(q);var x=m(require("react"),1),C=require("react/jsx-runtime"),y="https://cdn.berdsk.com.br/berdsk-ui/icons/all.css",v="https://cdn.berdsk.com.br",I=()=>{if(typeof document>"u")return;if(!document.querySelector(`link[rel="preconnect"][href="${v}"]`)){let r=document.createElement("link");r.rel="preconnect",r.href=v,document.head.appendChild(r)}if(!document.querySelector(`link[href="${y}"]`)){let r=document.createElement("link");r.rel="stylesheet",r.href=y,document.head.appendChild(r)}},U=({className:e,...r})=>(x.useEffect(()=>{I()},[]),(0,C.jsx)("i",{className:`${e}`,...r}));var T=m(require("react"),1),a=require("react/jsx-runtime"),R=T.forwardRef(({children:e,variant:r="solid",color:n="primary",size:o="md",rounded:t="md",leftIcon:s,rightIcon:d,fullWidth:l=!1,className:w="",href:u,...p},g)=>{let P=`btn-${r}`,M=`btn-${n}`,N=`btn-${o}`,H=`btn-rounded-${t}`,h=["btn",P,M,N,H,l?"btn-full-width":"",!e&&(s||d)?"btn-icon-only":"",(s||d)&&e?"btn-has-icons":"",w].filter(Boolean).join(" "),f=(0,a.jsxs)(a.Fragment,{children:[s&&(0,a.jsx)("span",{className:"btn-icon-left",children:s}),e&&(0,a.jsx)("span",{className:"btn-content",children:e}),d&&(0,a.jsx)("span",{className:"btn-icon-right",children:d})]});return u?(0,a.jsx)("a",{href:u,className:h,ref:g,...p,children:f}):(0,a.jsx)("button",{className:h,ref:g,...p,children:f})});R.displayName="Button";var i=m(require("react"),1),L=require("react/jsx-runtime"),c={colors:{primary:"#007bff",secondary:"#6c757d",danger:"#dc3545",success:"#28a745"},spacing:{gap:"0.5rem"},border:{color:"#dee2e6",size:"1px",radius:{none:"0",xs:"0.125rem",sm:"0.25rem",md:"0.375rem",lg:"0.5rem",full:"9999px"}}},E=i.createContext({theme:c}),W=({theme:e,children:r})=>{let n=i.useMemo(()=>e?{...c,...e,colors:{...c.colors,...e.colors},spacing:{...c.spacing,...e.spacing},border:{...c.border,...e.border,radius:{...c.border.radius,...e.border?.radius}}}:c,[e]);return i.useLayoutEffect(()=>{let o=document.documentElement;Object.entries(n.colors).forEach(([d,l])=>{o.style.setProperty(`--berdsk-color-${d}`,l)}),o.style.setProperty("--berdsk-spacing-gap",n.spacing.gap),o.style.setProperty("--berdsk-border-color",n.border.color),o.style.setProperty("--berdsk-border-size",n.border.size),Object.entries(n.border.radius).forEach(([d,l])=>{o.style.setProperty(`--berdsk-rounded-${d}`,l)});let t="berdsk-ui-theme-styles",s=document.getElementById(t);s||(s=document.createElement("style"),s.id=t,document.head.appendChild(s)),s.innerHTML=`
2
2
  :root {
3
3
  --berdsk-font-family: ui-sans-serif, system-ui, -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, "Helvetica Neue", Arial, "Noto Sans", sans-serif;
4
4
  }
@@ -12,7 +12,20 @@
12
12
  transition: all 0.2s;
13
13
  border: var(--berdsk-border-size) solid transparent;
14
14
  text-decoration: none;
15
- gap: 0.5rem;
15
+ gap: var(--berdsk-spacing-gap);
16
+ }
17
+ .btn-content {
18
+ flex: 1;
19
+ text-align: center;
20
+ }
21
+ .btn-icon-left, .btn-icon-right {
22
+ display: flex;
23
+ align-items: center;
24
+ justify-content: center;
25
+ }
26
+ .btn-has-icons {
27
+ padding-left: var(--berdsk-spacing-gap);
28
+ padding-right: var(--berdsk-spacing-gap);
16
29
  }
17
30
  .btn:disabled {
18
31
  opacity: 0.6;
@@ -78,5 +91,5 @@
78
91
  .btn-lg.btn-icon-only { width: 3rem; }
79
92
  .btn-xl.btn-icon-only { width: 3.5rem; }
80
93
  .btn-2xl.btn-icon-only { width: 4rem; }
81
- `},[o]),(0,L.jsx)(E.Provider,{value:{theme:o},children:r})},q=()=>a.useContext(E);0&&(module.exports={Button,Icon,ThemeProvider,defaultTheme,useTheme});
94
+ `},[n]),(0,L.jsx)(E.Provider,{value:{theme:n},children:r})},j=()=>i.useContext(E);0&&(module.exports={Button,Icon,ThemeProvider,defaultTheme,useTheme});
82
95
  //# sourceMappingURL=index.cjs.map
@@ -1 +1 @@
1
- {"version":3,"sources":["../src/index.ts","../src/components/Icon.tsx","../src/components/Button.tsx","../src/theme/ThemeProvider.tsx"],"sourcesContent":["export * from \"./components/Icon\";\r\nexport * from \"./components/Button\";\r\nexport * from \"./theme/ThemeProvider\";\r\n","import * as React from \"react\";\r\n\r\nconst CDN_URL = \"https://cdn.berdsk.com.br/berdsk-ui/icons/all.css\";\r\nconst PRECONNECT_URL = \"https://cdn.berdsk.com.br\";\r\n\r\nexport interface IconProps extends React.HTMLAttributes<HTMLElement> {\r\n className: string;\r\n}\r\n\r\nconst loadCDN = () => {\r\n if (typeof document === \"undefined\") return;\r\n\r\n // Preconnect para acelerar a conexão com o CDN\r\n if (\r\n !document.querySelector(`link[rel=\"preconnect\"][href=\"${PRECONNECT_URL}\"]`)\r\n ) {\r\n const preconnect = document.createElement(\"link\");\r\n preconnect.rel = \"preconnect\";\r\n preconnect.href = PRECONNECT_URL;\r\n document.head.appendChild(preconnect);\r\n }\r\n\r\n // Link do CSS\r\n const existingLink = document.querySelector(`link[href=\"${CDN_URL}\"]`);\r\n if (!existingLink) {\r\n const link = document.createElement(\"link\");\r\n link.rel = \"stylesheet\";\r\n link.href = CDN_URL;\r\n document.head.appendChild(link);\r\n }\r\n};\r\n\r\nexport const Icon: React.FC<IconProps> = ({ className, ...props }) => {\r\n React.useEffect(() => {\r\n loadCDN();\r\n }, []);\r\n\r\n return <i className={`${className}`} {...props} />;\r\n};\r\n","import * as React from \"react\";\r\nimport { Icon } from \"./Icon\";\r\n\r\nexport interface ButtonProps extends React.ButtonHTMLAttributes<HTMLButtonElement | HTMLAnchorElement> {\r\n variant?: \"solid\" | \"outlined\" | \"ghost\" | \"link\";\r\n color?: \"primary\" | \"secondary\" | \"danger\" | \"success\";\r\n size?: \"xs\" | \"sm\" | \"md\" | \"lg\" | \"xl\" | \"2xl\";\r\n rounded?: \"none\" | \"xs\" | \"sm\" | \"md\" | \"lg\" | \"full\";\r\n leftIcon?: React.ReactNode;\r\n rightIcon?: React.ReactNode;\r\n fullWidth?: boolean;\r\n href?: string;\r\n}\r\n\r\nexport const Button = React.forwardRef<HTMLButtonElement | HTMLAnchorElement, ButtonProps>(\r\n (\r\n {\r\n children,\r\n variant = \"solid\",\r\n color = \"primary\",\r\n size = \"md\",\r\n rounded = \"md\",\r\n leftIcon,\r\n rightIcon,\r\n fullWidth = false,\r\n className = \"\",\r\n href,\r\n ...props\r\n },\r\n ref\r\n ) => {\r\n // Estilos base e variantes (simulados via classes, assumindo que o projeto terá um CSS global ou o usuário fornecerá)\r\n // No entanto, para ser útil \"out of the box\", vamos construir uma string de classes bem estruturada.\r\n \r\n const baseClass = \"btn\";\r\n const variantClass = `btn-${variant}`;\r\n const colorClass = `btn-${color}`;\r\n const sizeClass = `btn-${size}`;\r\n const roundedClass = `btn-rounded-${rounded}`;\r\n const fullWidthClass = fullWidth ? \"btn-full-width\" : \"\";\r\n const iconOnlyClass = !children && (leftIcon || rightIcon) ? \"btn-icon-only\" : \"\";\r\n\r\n const combinedClasses = [\r\n baseClass,\r\n variantClass,\r\n colorClass,\r\n sizeClass,\r\n roundedClass,\r\n fullWidthClass,\r\n iconOnlyClass,\r\n className,\r\n ]\r\n .filter(Boolean)\r\n .join(\" \");\r\n\r\n const content = (\r\n <>\r\n {leftIcon && <span className=\"btn-icon-left\">{leftIcon}</span>}\r\n {children && <span className=\"btn-content\">{children}</span>}\r\n {rightIcon && <span className=\"btn-icon-right\">{rightIcon}</span>}\r\n </>\r\n );\r\n\r\n if (href) {\r\n return (\r\n <a\r\n href={href}\r\n className={combinedClasses}\r\n ref={ref as React.ForwardedRef<HTMLAnchorElement>}\r\n {...(props as React.AnchorHTMLAttributes<HTMLAnchorElement>)}\r\n >\r\n {content}\r\n </a>\r\n );\r\n }\r\n\r\n return (\r\n <button\r\n className={combinedClasses}\r\n ref={ref as React.ForwardedRef<HTMLButtonElement>}\r\n {...(props as React.ButtonHTMLAttributes<HTMLButtonElement>)}\r\n >\r\n {content}\r\n </button>\r\n );\r\n }\r\n);\r\n\r\nButton.displayName = \"Button\";\r\n","import * as React from \"react\";\r\n\r\nexport interface ThemeColors {\r\n primary: string;\r\n secondary: string;\r\n danger: string;\r\n success: string;\r\n}\r\n\r\nexport interface ThemeConfig {\r\n colors: ThemeColors;\r\n border: {\r\n color: string;\r\n size: string;\r\n radius: {\r\n none: string;\r\n xs: string;\r\n sm: string;\r\n md: string;\r\n lg: string;\r\n full: string;\r\n };\r\n };\r\n}\r\n\r\nexport const defaultTheme: ThemeConfig = {\r\n colors: {\r\n primary: \"#007bff\",\r\n secondary: \"#6c757d\",\r\n danger: \"#dc3545\",\r\n success: \"#28a745\",\r\n },\r\n border: {\r\n color: \"#dee2e6\",\r\n size: \"1px\",\r\n radius: {\r\n none: \"0\",\r\n xs: \"0.125rem\",\r\n sm: \"0.25rem\",\r\n md: \"0.375rem\",\r\n lg: \"0.5rem\",\r\n full: \"9999px\",\r\n },\r\n },\r\n};\r\n\r\ninterface ThemeContextType {\r\n theme: ThemeConfig;\r\n}\r\n\r\nconst ThemeContext = React.createContext<ThemeContextType>({\r\n theme: defaultTheme,\r\n});\r\n\r\nexport interface ThemeProviderProps {\r\n theme?: Partial<ThemeConfig>;\r\n children: React.ReactNode;\r\n}\r\n\r\nexport const ThemeProvider: React.FC<ThemeProviderProps> = ({\r\n theme,\r\n children,\r\n}) => {\r\n const mergedTheme = React.useMemo(() => {\r\n if (!theme) return defaultTheme;\r\n return {\r\n ...defaultTheme,\r\n ...theme,\r\n colors: { ...defaultTheme.colors, ...theme.colors },\r\n border: {\r\n ...defaultTheme.border,\r\n ...theme.border,\r\n radius: { ...defaultTheme.border.radius, ...theme.border?.radius },\r\n },\r\n };\r\n }, [theme]);\r\n\r\n React.useLayoutEffect(() => {\r\n const root = document.documentElement;\r\n \r\n // Injetar cores\r\n Object.entries(mergedTheme.colors).forEach(([key, value]) => {\r\n root.style.setProperty(`--berdsk-color-${key}`, value);\r\n });\r\n\r\n // Injetar borda\r\n root.style.setProperty(\"--berdsk-border-color\", mergedTheme.border.color);\r\n root.style.setProperty(\"--berdsk-border-size\", mergedTheme.border.size);\r\n\r\n // Injetar arredondamentos\r\n Object.entries(mergedTheme.border.radius).forEach(([key, value]) => {\r\n root.style.setProperty(`--berdsk-rounded-${key}`, value);\r\n });\r\n\r\n // Injetar estilos base para o botão funcionar \"out-of-the-box\"\r\n const styleId = \"berdsk-ui-theme-styles\";\r\n let styleElement = document.getElementById(styleId) as HTMLStyleElement;\r\n \r\n if (!styleElement) {\r\n styleElement = document.createElement(\"style\");\r\n styleElement.id = styleId;\r\n document.head.appendChild(styleElement);\r\n }\r\n\r\n styleElement.innerHTML = `\r\n :root {\r\n --berdsk-font-family: ui-sans-serif, system-ui, -apple-system, BlinkMacSystemFont, \"Segoe UI\", Roboto, \"Helvetica Neue\", Arial, \"Noto Sans\", sans-serif;\r\n }\r\n .btn {\r\n display: inline-flex;\r\n align-items: center;\r\n justify-content: center;\r\n font-family: var(--berdsk-font-family);\r\n font-weight: 500;\r\n cursor: pointer;\r\n transition: all 0.2s;\r\n border: var(--berdsk-border-size) solid transparent;\r\n text-decoration: none;\r\n gap: 0.5rem;\r\n }\r\n .btn:disabled {\r\n opacity: 0.6;\r\n cursor: not-allowed;\r\n }\r\n \r\n /* Tamanhos */\r\n .btn-xs { padding: 0 0.5rem; height: 1.5rem; font-size: 0.75rem; }\r\n .btn-sm { padding: 0 0.75rem; height: 2rem; font-size: 0.875rem; }\r\n .btn-md { padding: 0 1rem; height: 2.5rem; font-size: 1rem; }\r\n .btn-lg { padding: 0 1.5rem; height: 3rem; font-size: 1.125rem; }\r\n .btn-xl { padding: 0 2rem; height: 3.5rem; font-size: 1.25rem; }\r\n .btn-2xl { padding: 0 2.5rem; height: 4rem; font-size: 1.5rem; }\r\n\r\n /* Cores e Variantes - Solid */\r\n .btn-solid.btn-primary { background-color: var(--berdsk-color-primary); color: white; }\r\n .btn-solid.btn-secondary { background-color: var(--berdsk-color-secondary); color: white; }\r\n .btn-solid.btn-danger { background-color: var(--berdsk-color-danger); color: white; }\r\n .btn-solid.btn-success { background-color: var(--berdsk-color-success); color: white; }\r\n \r\n .btn-solid:hover { filter: brightness(0.9); }\r\n\r\n /* Outlined */\r\n .btn-outlined { border-width: var(--berdsk-border-size); }\r\n .btn-outlined.btn-primary { border-color: var(--berdsk-color-primary); color: var(--berdsk-color-primary); background: transparent; }\r\n .btn-outlined.btn-secondary { border-color: var(--berdsk-color-secondary); color: var(--berdsk-color-secondary); background: transparent; }\r\n .btn-outlined.btn-danger { border-color: var(--berdsk-color-danger); color: var(--berdsk-color-danger); background: transparent; }\r\n .btn-outlined.btn-success { border-color: var(--berdsk-color-success); color: var(--berdsk-color-success); background: transparent; }\r\n \r\n .btn-outlined:hover { background: rgba(0,0,0,0.05); }\r\n\r\n /* Ghost */\r\n .btn-ghost.btn-primary { color: var(--berdsk-color-primary); background: transparent; }\r\n .btn-ghost.btn-secondary { color: var(--berdsk-color-secondary); background: transparent; }\r\n .btn-ghost.btn-danger { color: var(--berdsk-color-danger); background: transparent; }\r\n .btn-ghost.btn-success { color: var(--berdsk-color-success); background: transparent; }\r\n \r\n .btn-ghost:hover { background: rgba(0,0,0,0.05); }\r\n\r\n /* Link */\r\n .btn-link { background: transparent; border: none; padding: 0; height: auto; text-decoration: underline; }\r\n .btn-link.btn-primary { color: var(--berdsk-color-primary); }\r\n .btn-link.btn-secondary { color: var(--berdsk-color-secondary); }\r\n .btn-link.btn-danger { color: var(--berdsk-color-danger); }\r\n .btn-link.btn-success { color: var(--berdsk-color-success); }\r\n \r\n .btn-link:hover { opacity: 0.8; }\r\n\r\n /* Rounded */\r\n .btn-rounded-none { border-radius: var(--berdsk-rounded-none); }\r\n .btn-rounded-xs { border-radius: var(--berdsk-rounded-xs); }\r\n .btn-rounded-sm { border-radius: var(--berdsk-rounded-sm); }\r\n .btn-rounded-md { border-radius: var(--berdsk-rounded-md); }\r\n .btn-rounded-lg { border-radius: var(--berdsk-rounded-lg); }\r\n .btn-rounded-full { border-radius: var(--berdsk-rounded-full); }\r\n\r\n .btn-full-width { width: 100%; display: flex; }\r\n \r\n .btn-icon-only { padding: 0; aspect-ratio: 1/1; width: auto; }\r\n .btn-xs.btn-icon-only { width: 1.5rem; }\r\n .btn-sm.btn-icon-only { width: 2rem; }\r\n .btn-md.btn-icon-only { width: 2.5rem; }\r\n .btn-lg.btn-icon-only { width: 3rem; }\r\n .btn-xl.btn-icon-only { width: 3.5rem; }\r\n .btn-2xl.btn-icon-only { width: 4rem; }\r\n `;\r\n\r\n }, [mergedTheme]);\r\n\r\n return (\r\n <ThemeContext.Provider value={{ theme: mergedTheme }}>\r\n {children}\r\n </ThemeContext.Provider>\r\n );\r\n};\r\n\r\nexport const useTheme = () => React.useContext(ThemeContext);\r\n"],"mappings":"0jBAAA,IAAAA,EAAA,GAAAC,EAAAD,EAAA,YAAAE,EAAA,SAAAC,EAAA,kBAAAC,EAAA,iBAAAC,EAAA,aAAAC,IAAA,eAAAC,EAAAP,GCAA,IAAAQ,EAAuB,sBAqCdC,EAAA,6BAnCHC,EAAU,oDACVC,EAAiB,4BAMjBC,EAAU,IAAM,CACpB,GAAI,OAAO,SAAa,IAAa,OAGrC,GACE,CAAC,SAAS,cAAc,gCAAgCD,CAAc,IAAI,EAC1E,CACA,IAAME,EAAa,SAAS,cAAc,MAAM,EAChDA,EAAW,IAAM,aACjBA,EAAW,KAAOF,EAClB,SAAS,KAAK,YAAYE,CAAU,CACtC,CAIA,GAAI,CADiB,SAAS,cAAc,cAAcH,CAAO,IAAI,EAClD,CACjB,IAAMI,EAAO,SAAS,cAAc,MAAM,EAC1CA,EAAK,IAAM,aACXA,EAAK,KAAOJ,EACZ,SAAS,KAAK,YAAYI,CAAI,CAChC,CACF,EAEaC,EAA4B,CAAC,CAAE,UAAAC,EAAW,GAAGC,CAAM,KACxD,YAAU,IAAM,CACpBL,EAAQ,CACV,EAAG,CAAC,CAAC,KAEE,OAAC,KAAE,UAAW,GAAGI,CAAS,GAAK,GAAGC,EAAO,GCrClD,IAAAC,EAAuB,sBAwDjBC,EAAA,6BA1COC,EAAe,aAC1B,CACE,CACE,SAAAC,EACA,QAAAC,EAAU,QACV,MAAAC,EAAQ,UACR,KAAAC,EAAO,KACP,QAAAC,EAAU,KACV,SAAAC,EACA,UAAAC,EACA,UAAAC,EAAY,GACZ,UAAAC,EAAY,GACZ,KAAAC,EACA,GAAGC,CACL,EACAC,IACG,CAKH,IAAMC,EAAe,OAAOX,CAAO,GAC7BY,EAAa,OAAOX,CAAK,GACzBY,EAAY,OAAOX,CAAI,GACvBY,EAAe,eAAeX,CAAO,GAIrCY,EAAkB,CACtB,MACAJ,EACAC,EACAC,EACAC,EARqBR,EAAY,iBAAmB,GAChC,CAACP,IAAaK,GAAYC,GAAa,gBAAkB,GAU7EE,CACF,EACG,OAAO,OAAO,EACd,KAAK,GAAG,EAELS,KACJ,oBACG,UAAAZ,MAAY,OAAC,QAAK,UAAU,gBAAiB,SAAAA,EAAS,EACtDL,MAAY,OAAC,QAAK,UAAU,cAAe,SAAAA,EAAS,EACpDM,MAAa,OAAC,QAAK,UAAU,iBAAkB,SAAAA,EAAU,GAC5D,EAGF,OAAIG,KAEA,OAAC,KACC,KAAMA,EACN,UAAWO,EACX,IAAKL,EACJ,GAAID,EAEJ,SAAAO,EACH,KAKF,OAAC,UACC,UAAWD,EACX,IAAKL,EACJ,GAAID,EAEJ,SAAAO,EACH,CAEJ,CACF,EAEAlB,EAAO,YAAc,SCxFrB,IAAAmB,EAAuB,sBA6LnBC,EAAA,6BApKSC,EAA4B,CACvC,OAAQ,CACN,QAAS,UACT,UAAW,UACX,OAAQ,UACR,QAAS,SACX,EACA,OAAQ,CACN,MAAO,UACP,KAAM,MACN,OAAQ,CACN,KAAM,IACN,GAAI,WACJ,GAAI,UACJ,GAAI,WACJ,GAAI,SACJ,KAAM,QACR,CACF,CACF,EAMMC,EAAqB,gBAAgC,CACzD,MAAOD,CACT,CAAC,EAOYE,EAA8C,CAAC,CAC1D,MAAAC,EACA,SAAAC,CACF,IAAM,CACJ,IAAMC,EAAoB,UAAQ,IAC3BF,EACE,CACL,GAAGH,EACH,GAAGG,EACH,OAAQ,CAAE,GAAGH,EAAa,OAAQ,GAAGG,EAAM,MAAO,EAClD,OAAQ,CACN,GAAGH,EAAa,OAChB,GAAGG,EAAM,OACT,OAAQ,CAAE,GAAGH,EAAa,OAAO,OAAQ,GAAGG,EAAM,QAAQ,MAAO,CACnE,CACF,EAVmBH,EAWlB,CAACG,CAAK,CAAC,EAEV,OAAM,kBAAgB,IAAM,CAC1B,IAAMG,EAAO,SAAS,gBAGtB,OAAO,QAAQD,EAAY,MAAM,EAAE,QAAQ,CAAC,CAACE,EAAKC,CAAK,IAAM,CAC3DF,EAAK,MAAM,YAAY,kBAAkBC,CAAG,GAAIC,CAAK,CACvD,CAAC,EAGDF,EAAK,MAAM,YAAY,wBAAyBD,EAAY,OAAO,KAAK,EACxEC,EAAK,MAAM,YAAY,uBAAwBD,EAAY,OAAO,IAAI,EAGtE,OAAO,QAAQA,EAAY,OAAO,MAAM,EAAE,QAAQ,CAAC,CAACE,EAAKC,CAAK,IAAM,CAClEF,EAAK,MAAM,YAAY,oBAAoBC,CAAG,GAAIC,CAAK,CACzD,CAAC,EAGD,IAAMC,EAAU,yBACZC,EAAe,SAAS,eAAeD,CAAO,EAE7CC,IACHA,EAAe,SAAS,cAAc,OAAO,EAC7CA,EAAa,GAAKD,EAClB,SAAS,KAAK,YAAYC,CAAY,GAGxCA,EAAa,UAAY;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA,KAkF3B,EAAG,CAACL,CAAW,CAAC,KAGd,OAACJ,EAAa,SAAb,CAAsB,MAAO,CAAE,MAAOI,CAAY,EAChD,SAAAD,EACH,CAEJ,EAEaO,EAAW,IAAY,aAAWV,CAAY","names":["index_exports","__export","Button","Icon","ThemeProvider","defaultTheme","useTheme","__toCommonJS","React","import_jsx_runtime","CDN_URL","PRECONNECT_URL","loadCDN","preconnect","link","Icon","className","props","React","import_jsx_runtime","Button","children","variant","color","size","rounded","leftIcon","rightIcon","fullWidth","className","href","props","ref","variantClass","colorClass","sizeClass","roundedClass","combinedClasses","content","React","import_jsx_runtime","defaultTheme","ThemeContext","ThemeProvider","theme","children","mergedTheme","root","key","value","styleId","styleElement","useTheme"]}
1
+ {"version":3,"sources":["../src/index.ts","../src/components/Icon.tsx","../src/components/Button.tsx","../src/theme/ThemeProvider.tsx"],"sourcesContent":["export * from \"./components/Icon\";\r\nexport * from \"./components/Button\";\r\nexport * from \"./theme/ThemeProvider\";\r\n","import * as React from \"react\";\r\n\r\nconst CDN_URL = \"https://cdn.berdsk.com.br/berdsk-ui/icons/all.css\";\r\nconst PRECONNECT_URL = \"https://cdn.berdsk.com.br\";\r\n\r\nexport interface IconProps extends React.HTMLAttributes<HTMLElement> {\r\n className: string;\r\n}\r\n\r\nconst loadCDN = () => {\r\n if (typeof document === \"undefined\") return;\r\n\r\n // Preconnect para acelerar a conexão com o CDN\r\n if (\r\n !document.querySelector(`link[rel=\"preconnect\"][href=\"${PRECONNECT_URL}\"]`)\r\n ) {\r\n const preconnect = document.createElement(\"link\");\r\n preconnect.rel = \"preconnect\";\r\n preconnect.href = PRECONNECT_URL;\r\n document.head.appendChild(preconnect);\r\n }\r\n\r\n // Link do CSS\r\n const existingLink = document.querySelector(`link[href=\"${CDN_URL}\"]`);\r\n if (!existingLink) {\r\n const link = document.createElement(\"link\");\r\n link.rel = \"stylesheet\";\r\n link.href = CDN_URL;\r\n document.head.appendChild(link);\r\n }\r\n};\r\n\r\nexport const Icon: React.FC<IconProps> = ({ className, ...props }) => {\r\n React.useEffect(() => {\r\n loadCDN();\r\n }, []);\r\n\r\n return <i className={`${className}`} {...props} />;\r\n};\r\n","import * as React from \"react\";\r\nimport { Icon } from \"./Icon\";\r\n\r\nexport interface ButtonProps extends React.ButtonHTMLAttributes<HTMLButtonElement | HTMLAnchorElement> {\r\n variant?: \"solid\" | \"outlined\" | \"ghost\" | \"link\";\r\n color?: \"primary\" | \"secondary\" | \"danger\" | \"success\";\r\n size?: \"xs\" | \"sm\" | \"md\" | \"lg\" | \"xl\" | \"2xl\";\r\n rounded?: \"none\" | \"xs\" | \"sm\" | \"md\" | \"lg\" | \"full\";\r\n leftIcon?: React.ReactNode;\r\n rightIcon?: React.ReactNode;\r\n fullWidth?: boolean;\r\n href?: string;\r\n}\r\n\r\nexport const Button = React.forwardRef<HTMLButtonElement | HTMLAnchorElement, ButtonProps>(\r\n (\r\n {\r\n children,\r\n variant = \"solid\",\r\n color = \"primary\",\r\n size = \"md\",\r\n rounded = \"md\",\r\n leftIcon,\r\n rightIcon,\r\n fullWidth = false,\r\n className = \"\",\r\n href,\r\n ...props\r\n },\r\n ref\r\n ) => {\r\n // Estilos base e variantes (simulados via classes, assumindo que o projeto terá um CSS global ou o usuário fornecerá)\r\n // No entanto, para ser útil \"out of the box\", vamos construir uma string de classes bem estruturada.\r\n \r\n const baseClass = \"btn\";\r\n const variantClass = `btn-${variant}`;\r\n const colorClass = `btn-${color}`;\r\n const sizeClass = `btn-${size}`;\r\n const roundedClass = `btn-rounded-${rounded}`;\r\n const fullWidthClass = fullWidth ? \"btn-full-width\" : \"\";\r\n const iconOnlyClass = !children && (leftIcon || rightIcon) ? \"btn-icon-only\" : \"\";\r\n const hasIconsClass = (leftIcon || rightIcon) && children ? \"btn-has-icons\" : \"\";\r\n\r\n const combinedClasses = [\r\n baseClass,\r\n variantClass,\r\n colorClass,\r\n sizeClass,\r\n roundedClass,\r\n fullWidthClass,\r\n iconOnlyClass,\r\n hasIconsClass,\r\n className,\r\n ]\r\n .filter(Boolean)\r\n .join(\" \");\r\n\r\n const content = (\r\n <>\r\n {leftIcon && <span className=\"btn-icon-left\">{leftIcon}</span>}\r\n {children && <span className=\"btn-content\">{children}</span>}\r\n {rightIcon && <span className=\"btn-icon-right\">{rightIcon}</span>}\r\n </>\r\n );\r\n\r\n if (href) {\r\n return (\r\n <a\r\n href={href}\r\n className={combinedClasses}\r\n ref={ref as React.ForwardedRef<HTMLAnchorElement>}\r\n {...(props as React.AnchorHTMLAttributes<HTMLAnchorElement>)}\r\n >\r\n {content}\r\n </a>\r\n );\r\n }\r\n\r\n return (\r\n <button\r\n className={combinedClasses}\r\n ref={ref as React.ForwardedRef<HTMLButtonElement>}\r\n {...(props as React.ButtonHTMLAttributes<HTMLButtonElement>)}\r\n >\r\n {content}\r\n </button>\r\n );\r\n }\r\n);\r\n\r\nButton.displayName = \"Button\";\r\n","import * as React from \"react\";\r\n\r\nexport interface ThemeColors {\r\n primary: string;\r\n secondary: string;\r\n danger: string;\r\n success: string;\r\n}\r\n\r\nexport interface ThemeConfig {\r\n colors: ThemeColors;\r\n spacing: {\r\n gap: string;\r\n };\r\n border: {\r\n color: string;\r\n size: string;\r\n radius: {\r\n none: string;\r\n xs: string;\r\n sm: string;\r\n md: string;\r\n lg: string;\r\n full: string;\r\n };\r\n };\r\n}\r\n\r\nexport const defaultTheme: ThemeConfig = {\r\n colors: {\r\n primary: \"#007bff\",\r\n secondary: \"#6c757d\",\r\n danger: \"#dc3545\",\r\n success: \"#28a745\",\r\n },\r\n spacing: {\r\n gap: \"0.5rem\",\r\n },\r\n border: {\r\n color: \"#dee2e6\",\r\n size: \"1px\",\r\n radius: {\r\n none: \"0\",\r\n xs: \"0.125rem\",\r\n sm: \"0.25rem\",\r\n md: \"0.375rem\",\r\n lg: \"0.5rem\",\r\n full: \"9999px\",\r\n },\r\n },\r\n};\r\n\r\ninterface ThemeContextType {\r\n theme: ThemeConfig;\r\n}\r\n\r\nconst ThemeContext = React.createContext<ThemeContextType>({\r\n theme: defaultTheme,\r\n});\r\n\r\nexport interface ThemeProviderProps {\r\n theme?: Partial<ThemeConfig>;\r\n children: React.ReactNode;\r\n}\r\n\r\nexport const ThemeProvider: React.FC<ThemeProviderProps> = ({\r\n theme,\r\n children,\r\n}) => {\r\n const mergedTheme = React.useMemo(() => {\r\n if (!theme) return defaultTheme;\r\n return {\r\n ...defaultTheme,\r\n ...theme,\r\n colors: { ...defaultTheme.colors, ...theme.colors },\r\n spacing: { ...defaultTheme.spacing, ...theme.spacing },\r\n border: {\r\n ...defaultTheme.border,\r\n ...theme.border,\r\n radius: { ...defaultTheme.border.radius, ...theme.border?.radius },\r\n },\r\n };\r\n }, [theme]);\r\n\r\n React.useLayoutEffect(() => {\r\n const root = document.documentElement;\r\n \r\n // Injetar cores\r\n Object.entries(mergedTheme.colors).forEach(([key, value]) => {\r\n root.style.setProperty(`--berdsk-color-${key}`, value);\r\n });\r\n\r\n // Injetar espaçamento\r\n root.style.setProperty(\"--berdsk-spacing-gap\", mergedTheme.spacing.gap);\r\n\r\n // Injetar borda\r\n root.style.setProperty(\"--berdsk-border-color\", mergedTheme.border.color);\r\n root.style.setProperty(\"--berdsk-border-size\", mergedTheme.border.size);\r\n\r\n // Injetar arredondamentos\r\n Object.entries(mergedTheme.border.radius).forEach(([key, value]) => {\r\n root.style.setProperty(`--berdsk-rounded-${key}`, value);\r\n });\r\n\r\n // Injetar estilos base para o botão funcionar \"out-of-the-box\"\r\n const styleId = \"berdsk-ui-theme-styles\";\r\n let styleElement = document.getElementById(styleId) as HTMLStyleElement;\r\n \r\n if (!styleElement) {\r\n styleElement = document.createElement(\"style\");\r\n styleElement.id = styleId;\r\n document.head.appendChild(styleElement);\r\n }\r\n\r\n styleElement.innerHTML = `\r\n :root {\r\n --berdsk-font-family: ui-sans-serif, system-ui, -apple-system, BlinkMacSystemFont, \"Segoe UI\", Roboto, \"Helvetica Neue\", Arial, \"Noto Sans\", sans-serif;\r\n }\r\n .btn {\r\n display: inline-flex;\r\n align-items: center;\r\n justify-content: center;\r\n font-family: var(--berdsk-font-family);\r\n font-weight: 500;\r\n cursor: pointer;\r\n transition: all 0.2s;\r\n border: var(--berdsk-border-size) solid transparent;\r\n text-decoration: none;\r\n gap: var(--berdsk-spacing-gap);\r\n }\r\n .btn-content {\r\n flex: 1;\r\n text-align: center;\r\n }\r\n .btn-icon-left, .btn-icon-right {\r\n display: flex;\r\n align-items: center;\r\n justify-content: center;\r\n }\r\n .btn-has-icons {\r\n padding-left: var(--berdsk-spacing-gap);\r\n padding-right: var(--berdsk-spacing-gap);\r\n }\r\n .btn:disabled {\r\n opacity: 0.6;\r\n cursor: not-allowed;\r\n }\r\n \r\n /* Tamanhos */\r\n .btn-xs { padding: 0 0.5rem; height: 1.5rem; font-size: 0.75rem; }\r\n .btn-sm { padding: 0 0.75rem; height: 2rem; font-size: 0.875rem; }\r\n .btn-md { padding: 0 1rem; height: 2.5rem; font-size: 1rem; }\r\n .btn-lg { padding: 0 1.5rem; height: 3rem; font-size: 1.125rem; }\r\n .btn-xl { padding: 0 2rem; height: 3.5rem; font-size: 1.25rem; }\r\n .btn-2xl { padding: 0 2.5rem; height: 4rem; font-size: 1.5rem; }\r\n\r\n /* Cores e Variantes - Solid */\r\n .btn-solid.btn-primary { background-color: var(--berdsk-color-primary); color: white; }\r\n .btn-solid.btn-secondary { background-color: var(--berdsk-color-secondary); color: white; }\r\n .btn-solid.btn-danger { background-color: var(--berdsk-color-danger); color: white; }\r\n .btn-solid.btn-success { background-color: var(--berdsk-color-success); color: white; }\r\n \r\n .btn-solid:hover { filter: brightness(0.9); }\r\n\r\n /* Outlined */\r\n .btn-outlined { border-width: var(--berdsk-border-size); }\r\n .btn-outlined.btn-primary { border-color: var(--berdsk-color-primary); color: var(--berdsk-color-primary); background: transparent; }\r\n .btn-outlined.btn-secondary { border-color: var(--berdsk-color-secondary); color: var(--berdsk-color-secondary); background: transparent; }\r\n .btn-outlined.btn-danger { border-color: var(--berdsk-color-danger); color: var(--berdsk-color-danger); background: transparent; }\r\n .btn-outlined.btn-success { border-color: var(--berdsk-color-success); color: var(--berdsk-color-success); background: transparent; }\r\n \r\n .btn-outlined:hover { background: rgba(0,0,0,0.05); }\r\n\r\n /* Ghost */\r\n .btn-ghost.btn-primary { color: var(--berdsk-color-primary); background: transparent; }\r\n .btn-ghost.btn-secondary { color: var(--berdsk-color-secondary); background: transparent; }\r\n .btn-ghost.btn-danger { color: var(--berdsk-color-danger); background: transparent; }\r\n .btn-ghost.btn-success { color: var(--berdsk-color-success); background: transparent; }\r\n \r\n .btn-ghost:hover { background: rgba(0,0,0,0.05); }\r\n\r\n /* Link */\r\n .btn-link { background: transparent; border: none; padding: 0; height: auto; text-decoration: underline; }\r\n .btn-link.btn-primary { color: var(--berdsk-color-primary); }\r\n .btn-link.btn-secondary { color: var(--berdsk-color-secondary); }\r\n .btn-link.btn-danger { color: var(--berdsk-color-danger); }\r\n .btn-link.btn-success { color: var(--berdsk-color-success); }\r\n \r\n .btn-link:hover { opacity: 0.8; }\r\n\r\n /* Rounded */\r\n .btn-rounded-none { border-radius: var(--berdsk-rounded-none); }\r\n .btn-rounded-xs { border-radius: var(--berdsk-rounded-xs); }\r\n .btn-rounded-sm { border-radius: var(--berdsk-rounded-sm); }\r\n .btn-rounded-md { border-radius: var(--berdsk-rounded-md); }\r\n .btn-rounded-lg { border-radius: var(--berdsk-rounded-lg); }\r\n .btn-rounded-full { border-radius: var(--berdsk-rounded-full); }\r\n\r\n .btn-full-width { width: 100%; display: flex; }\r\n \r\n .btn-icon-only { padding: 0; aspect-ratio: 1/1; width: auto; }\r\n .btn-xs.btn-icon-only { width: 1.5rem; }\r\n .btn-sm.btn-icon-only { width: 2rem; }\r\n .btn-md.btn-icon-only { width: 2.5rem; }\r\n .btn-lg.btn-icon-only { width: 3rem; }\r\n .btn-xl.btn-icon-only { width: 3.5rem; }\r\n .btn-2xl.btn-icon-only { width: 4rem; }\r\n `;\r\n\r\n }, [mergedTheme]);\r\n\r\n return (\r\n <ThemeContext.Provider value={{ theme: mergedTheme }}>\r\n {children}\r\n </ThemeContext.Provider>\r\n );\r\n};\r\n\r\nexport const useTheme = () => React.useContext(ThemeContext);\r\n"],"mappings":"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","names":["index_exports","__export","Button","Icon","ThemeProvider","defaultTheme","useTheme","__toCommonJS","React","import_jsx_runtime","CDN_URL","PRECONNECT_URL","loadCDN","preconnect","link","Icon","className","props","React","import_jsx_runtime","Button","children","variant","color","size","rounded","leftIcon","rightIcon","fullWidth","className","href","props","ref","variantClass","colorClass","sizeClass","roundedClass","combinedClasses","content","React","import_jsx_runtime","defaultTheme","ThemeContext","ThemeProvider","theme","children","mergedTheme","root","key","value","styleId","styleElement","useTheme"]}
package/dist/index.d.cts CHANGED
@@ -25,6 +25,9 @@ interface ThemeColors {
25
25
  }
26
26
  interface ThemeConfig {
27
27
  colors: ThemeColors;
28
+ spacing: {
29
+ gap: string;
30
+ };
28
31
  border: {
29
32
  color: string;
30
33
  size: string;
package/dist/index.d.ts CHANGED
@@ -25,6 +25,9 @@ interface ThemeColors {
25
25
  }
26
26
  interface ThemeConfig {
27
27
  colors: ThemeColors;
28
+ spacing: {
29
+ gap: string;
30
+ };
28
31
  border: {
29
32
  color: string;
30
33
  size: string;
package/dist/index.js CHANGED
@@ -1,4 +1,4 @@
1
- import*as k from"react";import{jsx as w}from"react/jsx-runtime";var h="https://cdn.berdsk.com.br/berdsk-ui/icons/all.css",f="https://cdn.berdsk.com.br",L=()=>{if(typeof document>"u")return;if(!document.querySelector(`link[rel="preconnect"][href="${f}"]`)){let r=document.createElement("link");r.rel="preconnect",r.href=f,document.head.appendChild(r)}if(!document.querySelector(`link[href="${h}"]`)){let r=document.createElement("link");r.rel="stylesheet",r.href=h,document.head.appendChild(r)}},$=({className:e,...r})=>(k.useEffect(()=>{L()},[]),w("i",{className:`${e}`,...r}));import*as y from"react";import{Fragment as N,jsx as l,jsxs as P}from"react/jsx-runtime";var M=y.forwardRef(({children:e,variant:r="solid",color:t="primary",size:d="md",rounded:i="md",leftIcon:o,rightIcon:s,fullWidth:c=!1,className:x="",href:b,...m},u)=>{let T=`btn-${r}`,C=`btn-${t}`,R=`btn-${d}`,E=`btn-rounded-${i}`,p=["btn",T,C,R,E,c?"btn-full-width":"",!e&&(o||s)?"btn-icon-only":"",x].filter(Boolean).join(" "),g=P(N,{children:[o&&l("span",{className:"btn-icon-left",children:o}),e&&l("span",{className:"btn-content",children:e}),s&&l("span",{className:"btn-icon-right",children:s})]});return b?l("a",{href:b,className:p,ref:u,...m,children:g}):l("button",{className:p,ref:u,...m,children:g})});M.displayName="Button";import*as n from"react";import{jsx as H}from"react/jsx-runtime";var a={colors:{primary:"#007bff",secondary:"#6c757d",danger:"#dc3545",success:"#28a745"},border:{color:"#dee2e6",size:"1px",radius:{none:"0",xs:"0.125rem",sm:"0.25rem",md:"0.375rem",lg:"0.5rem",full:"9999px"}}},v=n.createContext({theme:a}),U=({theme:e,children:r})=>{let t=n.useMemo(()=>e?{...a,...e,colors:{...a.colors,...e.colors},border:{...a.border,...e.border,radius:{...a.border.radius,...e.border?.radius}}}:a,[e]);return n.useLayoutEffect(()=>{let d=document.documentElement;Object.entries(t.colors).forEach(([s,c])=>{d.style.setProperty(`--berdsk-color-${s}`,c)}),d.style.setProperty("--berdsk-border-color",t.border.color),d.style.setProperty("--berdsk-border-size",t.border.size),Object.entries(t.border.radius).forEach(([s,c])=>{d.style.setProperty(`--berdsk-rounded-${s}`,c)});let i="berdsk-ui-theme-styles",o=document.getElementById(i);o||(o=document.createElement("style"),o.id=i,document.head.appendChild(o)),o.innerHTML=`
1
+ import*as k from"react";import{jsx as w}from"react/jsx-runtime";var h="https://cdn.berdsk.com.br/berdsk-ui/icons/all.css",f="https://cdn.berdsk.com.br",L=()=>{if(typeof document>"u")return;if(!document.querySelector(`link[rel="preconnect"][href="${f}"]`)){let r=document.createElement("link");r.rel="preconnect",r.href=f,document.head.appendChild(r)}if(!document.querySelector(`link[href="${h}"]`)){let r=document.createElement("link");r.rel="stylesheet",r.href=h,document.head.appendChild(r)}},S=({className:e,...r})=>(k.useEffect(()=>{L()},[]),w("i",{className:`${e}`,...r}));import*as y from"react";import{Fragment as M,jsx as i,jsxs as N}from"react/jsx-runtime";var P=y.forwardRef(({children:e,variant:r="solid",color:o="primary",size:a="md",rounded:l="md",leftIcon:n,rightIcon:t,fullWidth:c=!1,className:x="",href:b,...m},u)=>{let C=`btn-${r}`,T=`btn-${o}`,R=`btn-${a}`,E=`btn-rounded-${l}`,p=["btn",C,T,R,E,c?"btn-full-width":"",!e&&(n||t)?"btn-icon-only":"",(n||t)&&e?"btn-has-icons":"",x].filter(Boolean).join(" "),g=N(M,{children:[n&&i("span",{className:"btn-icon-left",children:n}),e&&i("span",{className:"btn-content",children:e}),t&&i("span",{className:"btn-icon-right",children:t})]});return b?i("a",{href:b,className:p,ref:u,...m,children:g}):i("button",{className:p,ref:u,...m,children:g})});P.displayName="Button";import*as s from"react";import{jsx as H}from"react/jsx-runtime";var d={colors:{primary:"#007bff",secondary:"#6c757d",danger:"#dc3545",success:"#28a745"},spacing:{gap:"0.5rem"},border:{color:"#dee2e6",size:"1px",radius:{none:"0",xs:"0.125rem",sm:"0.25rem",md:"0.375rem",lg:"0.5rem",full:"9999px"}}},v=s.createContext({theme:d}),W=({theme:e,children:r})=>{let o=s.useMemo(()=>e?{...d,...e,colors:{...d.colors,...e.colors},spacing:{...d.spacing,...e.spacing},border:{...d.border,...e.border,radius:{...d.border.radius,...e.border?.radius}}}:d,[e]);return s.useLayoutEffect(()=>{let a=document.documentElement;Object.entries(o.colors).forEach(([t,c])=>{a.style.setProperty(`--berdsk-color-${t}`,c)}),a.style.setProperty("--berdsk-spacing-gap",o.spacing.gap),a.style.setProperty("--berdsk-border-color",o.border.color),a.style.setProperty("--berdsk-border-size",o.border.size),Object.entries(o.border.radius).forEach(([t,c])=>{a.style.setProperty(`--berdsk-rounded-${t}`,c)});let l="berdsk-ui-theme-styles",n=document.getElementById(l);n||(n=document.createElement("style"),n.id=l,document.head.appendChild(n)),n.innerHTML=`
2
2
  :root {
3
3
  --berdsk-font-family: ui-sans-serif, system-ui, -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, "Helvetica Neue", Arial, "Noto Sans", sans-serif;
4
4
  }
@@ -12,7 +12,20 @@ import*as k from"react";import{jsx as w}from"react/jsx-runtime";var h="https://c
12
12
  transition: all 0.2s;
13
13
  border: var(--berdsk-border-size) solid transparent;
14
14
  text-decoration: none;
15
- gap: 0.5rem;
15
+ gap: var(--berdsk-spacing-gap);
16
+ }
17
+ .btn-content {
18
+ flex: 1;
19
+ text-align: center;
20
+ }
21
+ .btn-icon-left, .btn-icon-right {
22
+ display: flex;
23
+ align-items: center;
24
+ justify-content: center;
25
+ }
26
+ .btn-has-icons {
27
+ padding-left: var(--berdsk-spacing-gap);
28
+ padding-right: var(--berdsk-spacing-gap);
16
29
  }
17
30
  .btn:disabled {
18
31
  opacity: 0.6;
@@ -78,5 +91,5 @@ import*as k from"react";import{jsx as w}from"react/jsx-runtime";var h="https://c
78
91
  .btn-lg.btn-icon-only { width: 3rem; }
79
92
  .btn-xl.btn-icon-only { width: 3.5rem; }
80
93
  .btn-2xl.btn-icon-only { width: 4rem; }
81
- `},[t]),H(v.Provider,{value:{theme:t},children:r})},W=()=>n.useContext(v);export{M as Button,$ as Icon,U as ThemeProvider,a as defaultTheme,W as useTheme};
94
+ `},[o]),H(v.Provider,{value:{theme:o},children:r})},j=()=>s.useContext(v);export{P as Button,S as Icon,W as ThemeProvider,d as defaultTheme,j as useTheme};
82
95
  //# sourceMappingURL=index.js.map
package/dist/index.js.map CHANGED
@@ -1 +1 @@
1
- {"version":3,"sources":["../src/components/Icon.tsx","../src/components/Button.tsx","../src/theme/ThemeProvider.tsx"],"sourcesContent":["import * as React from \"react\";\r\n\r\nconst CDN_URL = \"https://cdn.berdsk.com.br/berdsk-ui/icons/all.css\";\r\nconst PRECONNECT_URL = \"https://cdn.berdsk.com.br\";\r\n\r\nexport interface IconProps extends React.HTMLAttributes<HTMLElement> {\r\n className: string;\r\n}\r\n\r\nconst loadCDN = () => {\r\n if (typeof document === \"undefined\") return;\r\n\r\n // Preconnect para acelerar a conexão com o CDN\r\n if (\r\n !document.querySelector(`link[rel=\"preconnect\"][href=\"${PRECONNECT_URL}\"]`)\r\n ) {\r\n const preconnect = document.createElement(\"link\");\r\n preconnect.rel = \"preconnect\";\r\n preconnect.href = PRECONNECT_URL;\r\n document.head.appendChild(preconnect);\r\n }\r\n\r\n // Link do CSS\r\n const existingLink = document.querySelector(`link[href=\"${CDN_URL}\"]`);\r\n if (!existingLink) {\r\n const link = document.createElement(\"link\");\r\n link.rel = \"stylesheet\";\r\n link.href = CDN_URL;\r\n document.head.appendChild(link);\r\n }\r\n};\r\n\r\nexport const Icon: React.FC<IconProps> = ({ className, ...props }) => {\r\n React.useEffect(() => {\r\n loadCDN();\r\n }, []);\r\n\r\n return <i className={`${className}`} {...props} />;\r\n};\r\n","import * as React from \"react\";\r\nimport { Icon } from \"./Icon\";\r\n\r\nexport interface ButtonProps extends React.ButtonHTMLAttributes<HTMLButtonElement | HTMLAnchorElement> {\r\n variant?: \"solid\" | \"outlined\" | \"ghost\" | \"link\";\r\n color?: \"primary\" | \"secondary\" | \"danger\" | \"success\";\r\n size?: \"xs\" | \"sm\" | \"md\" | \"lg\" | \"xl\" | \"2xl\";\r\n rounded?: \"none\" | \"xs\" | \"sm\" | \"md\" | \"lg\" | \"full\";\r\n leftIcon?: React.ReactNode;\r\n rightIcon?: React.ReactNode;\r\n fullWidth?: boolean;\r\n href?: string;\r\n}\r\n\r\nexport const Button = React.forwardRef<HTMLButtonElement | HTMLAnchorElement, ButtonProps>(\r\n (\r\n {\r\n children,\r\n variant = \"solid\",\r\n color = \"primary\",\r\n size = \"md\",\r\n rounded = \"md\",\r\n leftIcon,\r\n rightIcon,\r\n fullWidth = false,\r\n className = \"\",\r\n href,\r\n ...props\r\n },\r\n ref\r\n ) => {\r\n // Estilos base e variantes (simulados via classes, assumindo que o projeto terá um CSS global ou o usuário fornecerá)\r\n // No entanto, para ser útil \"out of the box\", vamos construir uma string de classes bem estruturada.\r\n \r\n const baseClass = \"btn\";\r\n const variantClass = `btn-${variant}`;\r\n const colorClass = `btn-${color}`;\r\n const sizeClass = `btn-${size}`;\r\n const roundedClass = `btn-rounded-${rounded}`;\r\n const fullWidthClass = fullWidth ? \"btn-full-width\" : \"\";\r\n const iconOnlyClass = !children && (leftIcon || rightIcon) ? \"btn-icon-only\" : \"\";\r\n\r\n const combinedClasses = [\r\n baseClass,\r\n variantClass,\r\n colorClass,\r\n sizeClass,\r\n roundedClass,\r\n fullWidthClass,\r\n iconOnlyClass,\r\n className,\r\n ]\r\n .filter(Boolean)\r\n .join(\" \");\r\n\r\n const content = (\r\n <>\r\n {leftIcon && <span className=\"btn-icon-left\">{leftIcon}</span>}\r\n {children && <span className=\"btn-content\">{children}</span>}\r\n {rightIcon && <span className=\"btn-icon-right\">{rightIcon}</span>}\r\n </>\r\n );\r\n\r\n if (href) {\r\n return (\r\n <a\r\n href={href}\r\n className={combinedClasses}\r\n ref={ref as React.ForwardedRef<HTMLAnchorElement>}\r\n {...(props as React.AnchorHTMLAttributes<HTMLAnchorElement>)}\r\n >\r\n {content}\r\n </a>\r\n );\r\n }\r\n\r\n return (\r\n <button\r\n className={combinedClasses}\r\n ref={ref as React.ForwardedRef<HTMLButtonElement>}\r\n {...(props as React.ButtonHTMLAttributes<HTMLButtonElement>)}\r\n >\r\n {content}\r\n </button>\r\n );\r\n }\r\n);\r\n\r\nButton.displayName = \"Button\";\r\n","import * as React from \"react\";\r\n\r\nexport interface ThemeColors {\r\n primary: string;\r\n secondary: string;\r\n danger: string;\r\n success: string;\r\n}\r\n\r\nexport interface ThemeConfig {\r\n colors: ThemeColors;\r\n border: {\r\n color: string;\r\n size: string;\r\n radius: {\r\n none: string;\r\n xs: string;\r\n sm: string;\r\n md: string;\r\n lg: string;\r\n full: string;\r\n };\r\n };\r\n}\r\n\r\nexport const defaultTheme: ThemeConfig = {\r\n colors: {\r\n primary: \"#007bff\",\r\n secondary: \"#6c757d\",\r\n danger: \"#dc3545\",\r\n success: \"#28a745\",\r\n },\r\n border: {\r\n color: \"#dee2e6\",\r\n size: \"1px\",\r\n radius: {\r\n none: \"0\",\r\n xs: \"0.125rem\",\r\n sm: \"0.25rem\",\r\n md: \"0.375rem\",\r\n lg: \"0.5rem\",\r\n full: \"9999px\",\r\n },\r\n },\r\n};\r\n\r\ninterface ThemeContextType {\r\n theme: ThemeConfig;\r\n}\r\n\r\nconst ThemeContext = React.createContext<ThemeContextType>({\r\n theme: defaultTheme,\r\n});\r\n\r\nexport interface ThemeProviderProps {\r\n theme?: Partial<ThemeConfig>;\r\n children: React.ReactNode;\r\n}\r\n\r\nexport const ThemeProvider: React.FC<ThemeProviderProps> = ({\r\n theme,\r\n children,\r\n}) => {\r\n const mergedTheme = React.useMemo(() => {\r\n if (!theme) return defaultTheme;\r\n return {\r\n ...defaultTheme,\r\n ...theme,\r\n colors: { ...defaultTheme.colors, ...theme.colors },\r\n border: {\r\n ...defaultTheme.border,\r\n ...theme.border,\r\n radius: { ...defaultTheme.border.radius, ...theme.border?.radius },\r\n },\r\n };\r\n }, [theme]);\r\n\r\n React.useLayoutEffect(() => {\r\n const root = document.documentElement;\r\n \r\n // Injetar cores\r\n Object.entries(mergedTheme.colors).forEach(([key, value]) => {\r\n root.style.setProperty(`--berdsk-color-${key}`, value);\r\n });\r\n\r\n // Injetar borda\r\n root.style.setProperty(\"--berdsk-border-color\", mergedTheme.border.color);\r\n root.style.setProperty(\"--berdsk-border-size\", mergedTheme.border.size);\r\n\r\n // Injetar arredondamentos\r\n Object.entries(mergedTheme.border.radius).forEach(([key, value]) => {\r\n root.style.setProperty(`--berdsk-rounded-${key}`, value);\r\n });\r\n\r\n // Injetar estilos base para o botão funcionar \"out-of-the-box\"\r\n const styleId = \"berdsk-ui-theme-styles\";\r\n let styleElement = document.getElementById(styleId) as HTMLStyleElement;\r\n \r\n if (!styleElement) {\r\n styleElement = document.createElement(\"style\");\r\n styleElement.id = styleId;\r\n document.head.appendChild(styleElement);\r\n }\r\n\r\n styleElement.innerHTML = `\r\n :root {\r\n --berdsk-font-family: ui-sans-serif, system-ui, -apple-system, BlinkMacSystemFont, \"Segoe UI\", Roboto, \"Helvetica Neue\", Arial, \"Noto Sans\", sans-serif;\r\n }\r\n .btn {\r\n display: inline-flex;\r\n align-items: center;\r\n justify-content: center;\r\n font-family: var(--berdsk-font-family);\r\n font-weight: 500;\r\n cursor: pointer;\r\n transition: all 0.2s;\r\n border: var(--berdsk-border-size) solid transparent;\r\n text-decoration: none;\r\n gap: 0.5rem;\r\n }\r\n .btn:disabled {\r\n opacity: 0.6;\r\n cursor: not-allowed;\r\n }\r\n \r\n /* Tamanhos */\r\n .btn-xs { padding: 0 0.5rem; height: 1.5rem; font-size: 0.75rem; }\r\n .btn-sm { padding: 0 0.75rem; height: 2rem; font-size: 0.875rem; }\r\n .btn-md { padding: 0 1rem; height: 2.5rem; font-size: 1rem; }\r\n .btn-lg { padding: 0 1.5rem; height: 3rem; font-size: 1.125rem; }\r\n .btn-xl { padding: 0 2rem; height: 3.5rem; font-size: 1.25rem; }\r\n .btn-2xl { padding: 0 2.5rem; height: 4rem; font-size: 1.5rem; }\r\n\r\n /* Cores e Variantes - Solid */\r\n .btn-solid.btn-primary { background-color: var(--berdsk-color-primary); color: white; }\r\n .btn-solid.btn-secondary { background-color: var(--berdsk-color-secondary); color: white; }\r\n .btn-solid.btn-danger { background-color: var(--berdsk-color-danger); color: white; }\r\n .btn-solid.btn-success { background-color: var(--berdsk-color-success); color: white; }\r\n \r\n .btn-solid:hover { filter: brightness(0.9); }\r\n\r\n /* Outlined */\r\n .btn-outlined { border-width: var(--berdsk-border-size); }\r\n .btn-outlined.btn-primary { border-color: var(--berdsk-color-primary); color: var(--berdsk-color-primary); background: transparent; }\r\n .btn-outlined.btn-secondary { border-color: var(--berdsk-color-secondary); color: var(--berdsk-color-secondary); background: transparent; }\r\n .btn-outlined.btn-danger { border-color: var(--berdsk-color-danger); color: var(--berdsk-color-danger); background: transparent; }\r\n .btn-outlined.btn-success { border-color: var(--berdsk-color-success); color: var(--berdsk-color-success); background: transparent; }\r\n \r\n .btn-outlined:hover { background: rgba(0,0,0,0.05); }\r\n\r\n /* Ghost */\r\n .btn-ghost.btn-primary { color: var(--berdsk-color-primary); background: transparent; }\r\n .btn-ghost.btn-secondary { color: var(--berdsk-color-secondary); background: transparent; }\r\n .btn-ghost.btn-danger { color: var(--berdsk-color-danger); background: transparent; }\r\n .btn-ghost.btn-success { color: var(--berdsk-color-success); background: transparent; }\r\n \r\n .btn-ghost:hover { background: rgba(0,0,0,0.05); }\r\n\r\n /* Link */\r\n .btn-link { background: transparent; border: none; padding: 0; height: auto; text-decoration: underline; }\r\n .btn-link.btn-primary { color: var(--berdsk-color-primary); }\r\n .btn-link.btn-secondary { color: var(--berdsk-color-secondary); }\r\n .btn-link.btn-danger { color: var(--berdsk-color-danger); }\r\n .btn-link.btn-success { color: var(--berdsk-color-success); }\r\n \r\n .btn-link:hover { opacity: 0.8; }\r\n\r\n /* Rounded */\r\n .btn-rounded-none { border-radius: var(--berdsk-rounded-none); }\r\n .btn-rounded-xs { border-radius: var(--berdsk-rounded-xs); }\r\n .btn-rounded-sm { border-radius: var(--berdsk-rounded-sm); }\r\n .btn-rounded-md { border-radius: var(--berdsk-rounded-md); }\r\n .btn-rounded-lg { border-radius: var(--berdsk-rounded-lg); }\r\n .btn-rounded-full { border-radius: var(--berdsk-rounded-full); }\r\n\r\n .btn-full-width { width: 100%; display: flex; }\r\n \r\n .btn-icon-only { padding: 0; aspect-ratio: 1/1; width: auto; }\r\n .btn-xs.btn-icon-only { width: 1.5rem; }\r\n .btn-sm.btn-icon-only { width: 2rem; }\r\n .btn-md.btn-icon-only { width: 2.5rem; }\r\n .btn-lg.btn-icon-only { width: 3rem; }\r\n .btn-xl.btn-icon-only { width: 3.5rem; }\r\n .btn-2xl.btn-icon-only { width: 4rem; }\r\n `;\r\n\r\n }, [mergedTheme]);\r\n\r\n return (\r\n <ThemeContext.Provider value={{ theme: mergedTheme }}>\r\n {children}\r\n </ThemeContext.Provider>\r\n );\r\n};\r\n\r\nexport const useTheme = () => React.useContext(ThemeContext);\r\n"],"mappings":"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","names":["React","jsx","CDN_URL","PRECONNECT_URL","loadCDN","preconnect","link","Icon","className","props","React","Fragment","jsx","jsxs","Button","children","variant","color","size","rounded","leftIcon","rightIcon","fullWidth","className","href","props","ref","variantClass","colorClass","sizeClass","roundedClass","combinedClasses","content","React","jsx","defaultTheme","ThemeContext","ThemeProvider","theme","children","mergedTheme","root","key","value","styleId","styleElement","useTheme"]}
1
+ {"version":3,"sources":["../src/components/Icon.tsx","../src/components/Button.tsx","../src/theme/ThemeProvider.tsx"],"sourcesContent":["import * as React from \"react\";\r\n\r\nconst CDN_URL = \"https://cdn.berdsk.com.br/berdsk-ui/icons/all.css\";\r\nconst PRECONNECT_URL = \"https://cdn.berdsk.com.br\";\r\n\r\nexport interface IconProps extends React.HTMLAttributes<HTMLElement> {\r\n className: string;\r\n}\r\n\r\nconst loadCDN = () => {\r\n if (typeof document === \"undefined\") return;\r\n\r\n // Preconnect para acelerar a conexão com o CDN\r\n if (\r\n !document.querySelector(`link[rel=\"preconnect\"][href=\"${PRECONNECT_URL}\"]`)\r\n ) {\r\n const preconnect = document.createElement(\"link\");\r\n preconnect.rel = \"preconnect\";\r\n preconnect.href = PRECONNECT_URL;\r\n document.head.appendChild(preconnect);\r\n }\r\n\r\n // Link do CSS\r\n const existingLink = document.querySelector(`link[href=\"${CDN_URL}\"]`);\r\n if (!existingLink) {\r\n const link = document.createElement(\"link\");\r\n link.rel = \"stylesheet\";\r\n link.href = CDN_URL;\r\n document.head.appendChild(link);\r\n }\r\n};\r\n\r\nexport const Icon: React.FC<IconProps> = ({ className, ...props }) => {\r\n React.useEffect(() => {\r\n loadCDN();\r\n }, []);\r\n\r\n return <i className={`${className}`} {...props} />;\r\n};\r\n","import * as React from \"react\";\r\nimport { Icon } from \"./Icon\";\r\n\r\nexport interface ButtonProps extends React.ButtonHTMLAttributes<HTMLButtonElement | HTMLAnchorElement> {\r\n variant?: \"solid\" | \"outlined\" | \"ghost\" | \"link\";\r\n color?: \"primary\" | \"secondary\" | \"danger\" | \"success\";\r\n size?: \"xs\" | \"sm\" | \"md\" | \"lg\" | \"xl\" | \"2xl\";\r\n rounded?: \"none\" | \"xs\" | \"sm\" | \"md\" | \"lg\" | \"full\";\r\n leftIcon?: React.ReactNode;\r\n rightIcon?: React.ReactNode;\r\n fullWidth?: boolean;\r\n href?: string;\r\n}\r\n\r\nexport const Button = React.forwardRef<HTMLButtonElement | HTMLAnchorElement, ButtonProps>(\r\n (\r\n {\r\n children,\r\n variant = \"solid\",\r\n color = \"primary\",\r\n size = \"md\",\r\n rounded = \"md\",\r\n leftIcon,\r\n rightIcon,\r\n fullWidth = false,\r\n className = \"\",\r\n href,\r\n ...props\r\n },\r\n ref\r\n ) => {\r\n // Estilos base e variantes (simulados via classes, assumindo que o projeto terá um CSS global ou o usuário fornecerá)\r\n // No entanto, para ser útil \"out of the box\", vamos construir uma string de classes bem estruturada.\r\n \r\n const baseClass = \"btn\";\r\n const variantClass = `btn-${variant}`;\r\n const colorClass = `btn-${color}`;\r\n const sizeClass = `btn-${size}`;\r\n const roundedClass = `btn-rounded-${rounded}`;\r\n const fullWidthClass = fullWidth ? \"btn-full-width\" : \"\";\r\n const iconOnlyClass = !children && (leftIcon || rightIcon) ? \"btn-icon-only\" : \"\";\r\n const hasIconsClass = (leftIcon || rightIcon) && children ? \"btn-has-icons\" : \"\";\r\n\r\n const combinedClasses = [\r\n baseClass,\r\n variantClass,\r\n colorClass,\r\n sizeClass,\r\n roundedClass,\r\n fullWidthClass,\r\n iconOnlyClass,\r\n hasIconsClass,\r\n className,\r\n ]\r\n .filter(Boolean)\r\n .join(\" \");\r\n\r\n const content = (\r\n <>\r\n {leftIcon && <span className=\"btn-icon-left\">{leftIcon}</span>}\r\n {children && <span className=\"btn-content\">{children}</span>}\r\n {rightIcon && <span className=\"btn-icon-right\">{rightIcon}</span>}\r\n </>\r\n );\r\n\r\n if (href) {\r\n return (\r\n <a\r\n href={href}\r\n className={combinedClasses}\r\n ref={ref as React.ForwardedRef<HTMLAnchorElement>}\r\n {...(props as React.AnchorHTMLAttributes<HTMLAnchorElement>)}\r\n >\r\n {content}\r\n </a>\r\n );\r\n }\r\n\r\n return (\r\n <button\r\n className={combinedClasses}\r\n ref={ref as React.ForwardedRef<HTMLButtonElement>}\r\n {...(props as React.ButtonHTMLAttributes<HTMLButtonElement>)}\r\n >\r\n {content}\r\n </button>\r\n );\r\n }\r\n);\r\n\r\nButton.displayName = \"Button\";\r\n","import * as React from \"react\";\r\n\r\nexport interface ThemeColors {\r\n primary: string;\r\n secondary: string;\r\n danger: string;\r\n success: string;\r\n}\r\n\r\nexport interface ThemeConfig {\r\n colors: ThemeColors;\r\n spacing: {\r\n gap: string;\r\n };\r\n border: {\r\n color: string;\r\n size: string;\r\n radius: {\r\n none: string;\r\n xs: string;\r\n sm: string;\r\n md: string;\r\n lg: string;\r\n full: string;\r\n };\r\n };\r\n}\r\n\r\nexport const defaultTheme: ThemeConfig = {\r\n colors: {\r\n primary: \"#007bff\",\r\n secondary: \"#6c757d\",\r\n danger: \"#dc3545\",\r\n success: \"#28a745\",\r\n },\r\n spacing: {\r\n gap: \"0.5rem\",\r\n },\r\n border: {\r\n color: \"#dee2e6\",\r\n size: \"1px\",\r\n radius: {\r\n none: \"0\",\r\n xs: \"0.125rem\",\r\n sm: \"0.25rem\",\r\n md: \"0.375rem\",\r\n lg: \"0.5rem\",\r\n full: \"9999px\",\r\n },\r\n },\r\n};\r\n\r\ninterface ThemeContextType {\r\n theme: ThemeConfig;\r\n}\r\n\r\nconst ThemeContext = React.createContext<ThemeContextType>({\r\n theme: defaultTheme,\r\n});\r\n\r\nexport interface ThemeProviderProps {\r\n theme?: Partial<ThemeConfig>;\r\n children: React.ReactNode;\r\n}\r\n\r\nexport const ThemeProvider: React.FC<ThemeProviderProps> = ({\r\n theme,\r\n children,\r\n}) => {\r\n const mergedTheme = React.useMemo(() => {\r\n if (!theme) return defaultTheme;\r\n return {\r\n ...defaultTheme,\r\n ...theme,\r\n colors: { ...defaultTheme.colors, ...theme.colors },\r\n spacing: { ...defaultTheme.spacing, ...theme.spacing },\r\n border: {\r\n ...defaultTheme.border,\r\n ...theme.border,\r\n radius: { ...defaultTheme.border.radius, ...theme.border?.radius },\r\n },\r\n };\r\n }, [theme]);\r\n\r\n React.useLayoutEffect(() => {\r\n const root = document.documentElement;\r\n \r\n // Injetar cores\r\n Object.entries(mergedTheme.colors).forEach(([key, value]) => {\r\n root.style.setProperty(`--berdsk-color-${key}`, value);\r\n });\r\n\r\n // Injetar espaçamento\r\n root.style.setProperty(\"--berdsk-spacing-gap\", mergedTheme.spacing.gap);\r\n\r\n // Injetar borda\r\n root.style.setProperty(\"--berdsk-border-color\", mergedTheme.border.color);\r\n root.style.setProperty(\"--berdsk-border-size\", mergedTheme.border.size);\r\n\r\n // Injetar arredondamentos\r\n Object.entries(mergedTheme.border.radius).forEach(([key, value]) => {\r\n root.style.setProperty(`--berdsk-rounded-${key}`, value);\r\n });\r\n\r\n // Injetar estilos base para o botão funcionar \"out-of-the-box\"\r\n const styleId = \"berdsk-ui-theme-styles\";\r\n let styleElement = document.getElementById(styleId) as HTMLStyleElement;\r\n \r\n if (!styleElement) {\r\n styleElement = document.createElement(\"style\");\r\n styleElement.id = styleId;\r\n document.head.appendChild(styleElement);\r\n }\r\n\r\n styleElement.innerHTML = `\r\n :root {\r\n --berdsk-font-family: ui-sans-serif, system-ui, -apple-system, BlinkMacSystemFont, \"Segoe UI\", Roboto, \"Helvetica Neue\", Arial, \"Noto Sans\", sans-serif;\r\n }\r\n .btn {\r\n display: inline-flex;\r\n align-items: center;\r\n justify-content: center;\r\n font-family: var(--berdsk-font-family);\r\n font-weight: 500;\r\n cursor: pointer;\r\n transition: all 0.2s;\r\n border: var(--berdsk-border-size) solid transparent;\r\n text-decoration: none;\r\n gap: var(--berdsk-spacing-gap);\r\n }\r\n .btn-content {\r\n flex: 1;\r\n text-align: center;\r\n }\r\n .btn-icon-left, .btn-icon-right {\r\n display: flex;\r\n align-items: center;\r\n justify-content: center;\r\n }\r\n .btn-has-icons {\r\n padding-left: var(--berdsk-spacing-gap);\r\n padding-right: var(--berdsk-spacing-gap);\r\n }\r\n .btn:disabled {\r\n opacity: 0.6;\r\n cursor: not-allowed;\r\n }\r\n \r\n /* Tamanhos */\r\n .btn-xs { padding: 0 0.5rem; height: 1.5rem; font-size: 0.75rem; }\r\n .btn-sm { padding: 0 0.75rem; height: 2rem; font-size: 0.875rem; }\r\n .btn-md { padding: 0 1rem; height: 2.5rem; font-size: 1rem; }\r\n .btn-lg { padding: 0 1.5rem; height: 3rem; font-size: 1.125rem; }\r\n .btn-xl { padding: 0 2rem; height: 3.5rem; font-size: 1.25rem; }\r\n .btn-2xl { padding: 0 2.5rem; height: 4rem; font-size: 1.5rem; }\r\n\r\n /* Cores e Variantes - Solid */\r\n .btn-solid.btn-primary { background-color: var(--berdsk-color-primary); color: white; }\r\n .btn-solid.btn-secondary { background-color: var(--berdsk-color-secondary); color: white; }\r\n .btn-solid.btn-danger { background-color: var(--berdsk-color-danger); color: white; }\r\n .btn-solid.btn-success { background-color: var(--berdsk-color-success); color: white; }\r\n \r\n .btn-solid:hover { filter: brightness(0.9); }\r\n\r\n /* Outlined */\r\n .btn-outlined { border-width: var(--berdsk-border-size); }\r\n .btn-outlined.btn-primary { border-color: var(--berdsk-color-primary); color: var(--berdsk-color-primary); background: transparent; }\r\n .btn-outlined.btn-secondary { border-color: var(--berdsk-color-secondary); color: var(--berdsk-color-secondary); background: transparent; }\r\n .btn-outlined.btn-danger { border-color: var(--berdsk-color-danger); color: var(--berdsk-color-danger); background: transparent; }\r\n .btn-outlined.btn-success { border-color: var(--berdsk-color-success); color: var(--berdsk-color-success); background: transparent; }\r\n \r\n .btn-outlined:hover { background: rgba(0,0,0,0.05); }\r\n\r\n /* Ghost */\r\n .btn-ghost.btn-primary { color: var(--berdsk-color-primary); background: transparent; }\r\n .btn-ghost.btn-secondary { color: var(--berdsk-color-secondary); background: transparent; }\r\n .btn-ghost.btn-danger { color: var(--berdsk-color-danger); background: transparent; }\r\n .btn-ghost.btn-success { color: var(--berdsk-color-success); background: transparent; }\r\n \r\n .btn-ghost:hover { background: rgba(0,0,0,0.05); }\r\n\r\n /* Link */\r\n .btn-link { background: transparent; border: none; padding: 0; height: auto; text-decoration: underline; }\r\n .btn-link.btn-primary { color: var(--berdsk-color-primary); }\r\n .btn-link.btn-secondary { color: var(--berdsk-color-secondary); }\r\n .btn-link.btn-danger { color: var(--berdsk-color-danger); }\r\n .btn-link.btn-success { color: var(--berdsk-color-success); }\r\n \r\n .btn-link:hover { opacity: 0.8; }\r\n\r\n /* Rounded */\r\n .btn-rounded-none { border-radius: var(--berdsk-rounded-none); }\r\n .btn-rounded-xs { border-radius: var(--berdsk-rounded-xs); }\r\n .btn-rounded-sm { border-radius: var(--berdsk-rounded-sm); }\r\n .btn-rounded-md { border-radius: var(--berdsk-rounded-md); }\r\n .btn-rounded-lg { border-radius: var(--berdsk-rounded-lg); }\r\n .btn-rounded-full { border-radius: var(--berdsk-rounded-full); }\r\n\r\n .btn-full-width { width: 100%; display: flex; }\r\n \r\n .btn-icon-only { padding: 0; aspect-ratio: 1/1; width: auto; }\r\n .btn-xs.btn-icon-only { width: 1.5rem; }\r\n .btn-sm.btn-icon-only { width: 2rem; }\r\n .btn-md.btn-icon-only { width: 2.5rem; }\r\n .btn-lg.btn-icon-only { width: 3rem; }\r\n .btn-xl.btn-icon-only { width: 3.5rem; }\r\n .btn-2xl.btn-icon-only { width: 4rem; }\r\n `;\r\n\r\n }, [mergedTheme]);\r\n\r\n return (\r\n <ThemeContext.Provider value={{ theme: mergedTheme }}>\r\n {children}\r\n </ThemeContext.Provider>\r\n );\r\n};\r\n\r\nexport const useTheme = () => React.useContext(ThemeContext);\r\n"],"mappings":"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","names":["React","jsx","CDN_URL","PRECONNECT_URL","loadCDN","preconnect","link","Icon","className","props","React","Fragment","jsx","jsxs","Button","children","variant","color","size","rounded","leftIcon","rightIcon","fullWidth","className","href","props","ref","variantClass","colorClass","sizeClass","roundedClass","combinedClasses","content","React","jsx","defaultTheme","ThemeContext","ThemeProvider","theme","children","mergedTheme","root","key","value","styleId","styleElement","useTheme"]}
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "@berdsk/ui",
3
- "version": "0.1.1",
3
+ "version": "0.1.2",
4
4
  "description": "Biblioteca de componentes UI profissional da Berdsk",
5
5
  "author": "Berdsk",
6
6
  "publishConfig": {