@kushagradhawan/kookie-ui 0.1.0

package/dist/esm/components/theme-panel.d.ts

@@ -0,0 +1,16 @@
+import * as React from 'react';
+import type { ComponentPropsWithout, RemovedProps } from '../helpers/component-props.js';
+interface ThemePanelProps extends Omit<ThemePanelImplProps, keyof ThemePanelImplPrivateProps> {
+    defaultOpen?: boolean;
+}
+declare const ThemePanel: React.ForwardRefExoticComponent<ThemePanelProps & React.RefAttributes<HTMLDivElement>>;
+interface ThemePanelImplPrivateProps {
+    open: boolean;
+    onOpenChange: (open: boolean) => void;
+}
+interface ThemePanelImplProps extends ComponentPropsWithout<'div', RemovedProps>, ThemePanelImplPrivateProps {
+    onAppearanceChange?: (value: 'light' | 'dark') => void;
+}
+export { ThemePanel };
+export type { ThemePanelProps };
+//# sourceMappingURL=theme-panel.d.ts.map

package/dist/esm/components/theme-panel.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"theme-panel.d.ts","sourceRoot":"","sources":["../../../src/components/theme-panel.tsx"],"names":[],"mappings":"AAEA,OAAO,KAAK,KAAK,MAAM,OAAO,CAAC;AAsB/B,OAAO,KAAK,EAAE,qBAAqB,EAAE,YAAY,EAAE,MAAM,+BAA+B,CAAC;AAGzF,UAAU,eAAgB,SAAQ,IAAI,CAAC,mBAAmB,EAAE,MAAM,0BAA0B,CAAC;IAC3F,WAAW,CAAC,EAAE,OAAO,CAAC;CACvB;AACD,QAAA,MAAM,UAAU,wFAKf,CAAC;AAIF,UAAU,0BAA0B;IAClC,IAAI,EAAE,OAAO,CAAC;IACd,YAAY,EAAE,CAAC,IAAI,EAAE,OAAO,KAAK,IAAI,CAAC;CACvC;AACD,UAAU,mBACR,SAAQ,qBAAqB,CAAC,KAAK,EAAE,YAAY,CAAC,EAChD,0BAA0B;IAC5B,kBAAkB,CAAC,EAAE,CAAC,KAAK,EAAE,OAAO,GAAG,MAAM,KAAK,IAAI,CAAC;CACxD;AAsnBD,OAAO,EAAE,UAAU,EAAE,CAAC;AACtB,YAAY,EAAE,eAAe,EAAE,CAAC"}

package/dist/esm/components/theme-panel.js

@@ -0,0 +1,10 @@
+"use client";import*as e from"react";import{useCallbackRef as q}from"radix-ui/internal";import{AccessibleIcon as J,Box as L,Button as Q,Flex as p,Grid as u,Heading as Y,IconButton as _,Kbd as R,Popover as I,ScrollArea as e9,Text as r,Tooltip as A}from"../index.js";import{Theme as V,useThemeContext as t9}from"./theme.js";import{inert as o9}from"../helpers/inert.js";import{getMatchingGrayColor as n9}from"../helpers/get-matching-gray-color.js";import{themePropDefs as s}from"./theme.props.js";const N=e.forwardRef(({defaultOpen:n=!0,...a},l)=>{const[c,h]=e.useState(n);return e.createElement(z,{...a,ref:l,open:c,onOpenChange:h})});N.displayName="ThemePanel";const z=e.forwardRef((n,a)=>{const{open:l,onOpenChange:c,onAppearanceChange:h,...v}=n,G=t9(),{appearance:d,onAppearanceChange:B,accentColor:g,onAccentColorChange:$,grayColor:f,onGrayColorChange:F,panelBackground:T,onPanelBackgroundChange:O,radius:w,onRadiusChange:D,scaling:x,onScalingChange:j}=G,E=h!==void 0,K=q(h),k=e.useCallback(t=>{const o=a9();if(d!=="inherit"){B(t);return}E?K(t):(H(t),l9(t)),o()},[d,B,E,K]),P=n9(g),S=f==="auto"?P:f,[W,M]=e.useState("idle");async function U(){const t={appearance:d===s.appearance.default?void 0:d,accentColor:g===s.accentColor.default?void 0:g,grayColor:f===s.grayColor.default?void 0:f,panelBackground:T===s.panelBackground.default?void 0:T,radius:w===s.radius.default?void 0:w,scaling:x===s.scaling.default?void 0:x},o=Object.keys(t).filter(i=>t[i]!==void 0).map(i=>`${i}="${t[i]}"`).join(" "),m=o?`<Theme ${o}>`:"<Theme>";M("copying"),await navigator.clipboard.writeText(m),M("copied"),setTimeout(()=>M("idle"),2e3)}const[Z,H]=e.useState(d==="inherit"?null:d),b=`
+      [contenteditable],
+      [role="combobox"],
+      [role="listbox"],
+      [role="menu"],
+      input:not([type="radio"], [type="checkbox"]),
+      select,
+      textarea
+    `;return e.useEffect(()=>{function t(o){const m=o.altKey||o.ctrlKey||o.shiftKey||o.metaKey,i=document.activeElement?.closest(b);o.key?.toUpperCase()==="T"&&!m&&!i&&c(!l)}return document.addEventListener("keydown",t),()=>document.removeEventListener("keydown",t)},[c,l,b]),e.useEffect(()=>{function t(o){const m=o.altKey||o.ctrlKey||o.shiftKey||o.metaKey,i=document.activeElement?.closest(b);o.key?.toUpperCase()==="D"&&!m&&!i&&k(Z==="light"?"dark":"light")}return document.addEventListener("keydown",t),()=>document.removeEventListener("keydown",t)},[k,Z,b]),e.useEffect(()=>{const t=document.documentElement,o=document.body;function m(){const y=t.classList.contains("dark")||t.classList.contains("dark-theme")||o.classList.contains("dark")||o.classList.contains("dark-theme");H(d==="inherit"?y?"dark":"light":d)}const i=new MutationObserver(function(y){y.forEach(function(X){X.attributeName==="class"&&m()})});return m(),d==="inherit"&&(i.observe(t,{attributes:!0}),i.observe(o,{attributes:!0})),()=>i.disconnect()},[d]),e.createElement(V,{asChild:!0,radius:"medium",scaling:"100%"},e.createElement(p,{direction:"column",position:"fixed",top:"0",right:"0",mr:"4",mt:"4",inert:l?void 0:o9,...v,ref:a,style:{zIndex:9999,overflow:"hidden",maxHeight:"calc(100vh - var(--space-4) - var(--space-4))",borderRadius:"var(--radius-4)",backgroundColor:"var(--color-panel-solid)",transformOrigin:"top center",transitionProperty:"transform, box-shadow",transitionDuration:"200ms",transitionTimingFunction:l?"ease-out":"ease-in",transform:l?"none":"translateX(105%)",boxShadow:l?"var(--shadow-5)":"var(--shadow-2)",...n.style}},e.createElement(e9,null,e.createElement(L,{flexGrow:"1",p:"5",position:"relative"},e.createElement(L,{position:"absolute",top:"0",right:"0",m:"2"},e.createElement(A,{content:"Press T to show/hide the Theme Panel",side:"bottom",sideOffset:6},e.createElement(R,{asChild:!0,size:"3",tabIndex:0,className:"rt-ThemePanelShortcut"},e.createElement("button",{onClick:()=>c(!l)},"T")))),e.createElement(Y,{size:"5",trim:"both",as:"h3",mb:"5"},"Theme"),e.createElement(r,{id:"accent-color-title",as:"p",size:"2",weight:"medium",mt:"5"},"Accent color"),e.createElement(u,{columns:"10",gap:"2",mt:"3",role:"group","aria-labelledby":"accent-color-title"},s.accentColor.values.map(t=>e.createElement("label",{key:t,className:"rt-ThemePanelSwatch",style:{backgroundColor:`var(--${t}-9)`}},e.createElement(A,{content:`${C(t)}${g==="gray"&&S!=="gray"?` (${C(S)})`:""}`},e.createElement("input",{className:"rt-ThemePanelSwatchInput",type:"radio",name:"accentColor",value:t,checked:g===t,onChange:o=>$(o.target.value)}))))),e.createElement(p,{asChild:!0,align:"center",justify:"between"},e.createElement(r,{as:"p",id:"gray-color-title",size:"2",weight:"medium",mt:"5"},"Gray color")),e.createElement(u,{columns:"10",gap:"2",mt:"3",role:"group","aria-labelledby":"gray-color-title"},s.grayColor.values.map(t=>e.createElement(p,{key:t,asChild:!0,align:"center",justify:"center"},e.createElement("label",{className:"rt-ThemePanelSwatch",style:{backgroundColor:t==="auto"?`var(--${P}-9)`:t==="gray"?"var(--gray-9)":`var(--${t}-9)`,filter:t==="gray"?"saturate(0)":void 0}},e.createElement(A,{content:`${C(t)}${t==="auto"?` (${C(P)})`:""}`},e.createElement("input",{className:"rt-ThemePanelSwatchInput",type:"radio",name:"grayColor",value:t,checked:f===t,onChange:o=>F(o.target.value)})))))),e.createElement(r,{id:"appearance-title",as:"p",size:"2",weight:"medium",mt:"5"},"Appearance"),e.createElement(u,{columns:"2",gap:"2",mt:"3",role:"group","aria-labelledby":"appearance-title"},["light","dark"].map(t=>e.createElement("label",{key:t,className:"rt-ThemePanelRadioCard"},e.createElement("input",{className:"rt-ThemePanelRadioCardInput",type:"radio",name:"appearance",value:t,checked:Z===t,onChange:o=>k(o.target.value)}),e.createElement(p,{align:"center",justify:"center",height:"32px",gap:"2"},t==="light"?e.createElement("svg",{width:"15",height:"15",viewBox:"0 0 15 15",fill:"none",xmlns:"http://www.w3.org/2000/svg",style:{margin:"0 -1px"}},e.createElement("path",{d:"M7.5 0C7.77614 0 8 0.223858 8 0.5V2.5C8 2.77614 7.77614 3 7.5 3C7.22386 3 7 2.77614 7 2.5V0.5C7 0.223858 7.22386 0 7.5 0ZM2.1967 2.1967C2.39196 2.00144 2.70854 2.00144 2.90381 2.1967L4.31802 3.61091C4.51328 3.80617 4.51328 4.12276 4.31802 4.31802C4.12276 4.51328 3.80617 4.51328 3.61091 4.31802L2.1967 2.90381C2.00144 2.70854 2.00144 2.39196 2.1967 2.1967ZM0.5 7C0.223858 7 0 7.22386 0 7.5C0 7.77614 0.223858 8 0.5 8H2.5C2.77614 8 3 7.77614 3 7.5C3 7.22386 2.77614 7 2.5 7H0.5ZM2.1967 12.8033C2.00144 12.608 2.00144 12.2915 2.1967 12.0962L3.61091 10.682C3.80617 10.4867 4.12276 10.4867 4.31802 10.682C4.51328 10.8772 4.51328 11.1938 4.31802 11.3891L2.90381 12.8033C2.70854 12.9986 2.39196 12.9986 2.1967 12.8033ZM12.5 7C12.2239 7 12 7.22386 12 7.5C12 7.77614 12.2239 8 12.5 8H14.5C14.7761 8 15 7.77614 15 7.5C15 7.22386 14.7761 7 14.5 7H12.5ZM10.682 4.31802C10.4867 4.12276 10.4867 3.80617 10.682 3.61091L12.0962 2.1967C12.2915 2.00144 12.608 2.00144 12.8033 2.1967C12.9986 2.39196 12.9986 2.70854 12.8033 2.90381L11.3891 4.31802C11.1938 4.51328 10.8772 4.51328 10.682 4.31802ZM8 12.5C8 12.2239 7.77614 12 7.5 12C7.22386 12 7 12.2239 7 12.5V14.5C7 14.7761 7.22386 15 7.5 15C7.77614 15 8 14.7761 8 14.5V12.5ZM10.682 10.682C10.8772 10.4867 11.1938 10.4867 11.3891 10.682L12.8033 12.0962C12.9986 12.2915 12.9986 12.608 12.8033 12.8033C12.608 12.9986 12.2915 12.9986 12.0962 12.8033L10.682 11.3891C10.4867 11.1938 10.4867 10.8772 10.682 10.682ZM5.5 7.5C5.5 6.39543 6.39543 5.5 7.5 5.5C8.60457 5.5 9.5 6.39543 9.5 7.5C9.5 8.60457 8.60457 9.5 7.5 9.5C6.39543 9.5 5.5 8.60457 5.5 7.5ZM7.5 4.5C5.84315 4.5 4.5 5.84315 4.5 7.5C4.5 9.15685 5.84315 10.5 7.5 10.5C9.15685 10.5 10.5 9.15685 10.5 7.5C10.5 5.84315 9.15685 4.5 7.5 4.5Z",fill:"currentColor",fillRule:"evenodd",clipRule:"evenodd"})):e.createElement("svg",{width:"15",height:"15",viewBox:"0 0 15 15",fill:"none",xmlns:"http://www.w3.org/2000/svg",style:{margin:"0 -1px"}},e.createElement("path",{d:"M2.89998 0.499976C2.89998 0.279062 2.72089 0.0999756 2.49998 0.0999756C2.27906 0.0999756 2.09998 0.279062 2.09998 0.499976V1.09998H1.49998C1.27906 1.09998 1.09998 1.27906 1.09998 1.49998C1.09998 1.72089 1.27906 1.89998 1.49998 1.89998H2.09998V2.49998C2.09998 2.72089 2.27906 2.89998 2.49998 2.89998C2.72089 2.89998 2.89998 2.72089 2.89998 2.49998V1.89998H3.49998C3.72089 1.89998 3.89998 1.72089 3.89998 1.49998C3.89998 1.27906 3.72089 1.09998 3.49998 1.09998H2.89998V0.499976ZM5.89998 3.49998C5.89998 3.27906 5.72089 3.09998 5.49998 3.09998C5.27906 3.09998 5.09998 3.27906 5.09998 3.49998V4.09998H4.49998C4.27906 4.09998 4.09998 4.27906 4.09998 4.49998C4.09998 4.72089 4.27906 4.89998 4.49998 4.89998H5.09998V5.49998C5.09998 5.72089 5.27906 5.89998 5.49998 5.89998C5.72089 5.89998 5.89998 5.72089 5.89998 5.49998V4.89998H6.49998C6.72089 4.89998 6.89998 4.72089 6.89998 4.49998C6.89998 4.27906 6.72089 4.09998 6.49998 4.09998H5.89998V3.49998ZM1.89998 6.49998C1.89998 6.27906 1.72089 6.09998 1.49998 6.09998C1.27906 6.09998 1.09998 6.27906 1.09998 6.49998V7.09998H0.499976C0.279062 7.09998 0.0999756 7.27906 0.0999756 7.49998C0.0999756 7.72089 0.279062 7.89998 0.499976 7.89998H1.09998V8.49998C1.09998 8.72089 1.27906 8.89997 1.49998 8.89997C1.72089 8.89997 1.89998 8.72089 1.89998 8.49998V7.89998H2.49998C2.72089 7.89998 2.89998 7.72089 2.89998 7.49998C2.89998 7.27906 2.72089 7.09998 2.49998 7.09998H1.89998V6.49998ZM8.54406 0.98184L8.24618 0.941586C8.03275 0.917676 7.90692 1.1655 8.02936 1.34194C8.17013 1.54479 8.29981 1.75592 8.41754 1.97445C8.91878 2.90485 9.20322 3.96932 9.20322 5.10022C9.20322 8.37201 6.82247 11.0878 3.69887 11.6097C3.45736 11.65 3.20988 11.6772 2.96008 11.6906C2.74563 11.702 2.62729 11.9535 2.77721 12.1072C2.84551 12.1773 2.91535 12.2458 2.98667 12.3128L3.05883 12.3795L3.31883 12.6045L3.50684 12.7532L3.62796 12.8433L3.81491 12.9742L3.99079 13.089C4.11175 13.1651 4.23536 13.2375 4.36157 13.3059L4.62496 13.4412L4.88553 13.5607L5.18837 13.6828L5.43169 13.7686C5.56564 13.8128 5.70149 13.8529 5.83857 13.8885C5.94262 13.9155 6.04767 13.9401 6.15405 13.9622C6.27993 13.9883 6.40713 14.0109 6.53544 14.0298L6.85241 14.0685L7.11934 14.0892C7.24637 14.0965 7.37436 14.1002 7.50322 14.1002C11.1483 14.1002 14.1032 11.1453 14.1032 7.50023C14.1032 7.25044 14.0893 7.00389 14.0623 6.76131L14.0255 6.48407C13.991 6.26083 13.9453 6.04129 13.8891 5.82642C13.8213 5.56709 13.7382 5.31398 13.6409 5.06881L13.5279 4.80132L13.4507 4.63542L13.3766 4.48666C13.2178 4.17773 13.0353 3.88295 12.8312 3.60423L12.6782 3.40352L12.4793 3.16432L12.3157 2.98361L12.1961 2.85951L12.0355 2.70246L11.8134 2.50184L11.4925 2.24191L11.2483 2.06498L10.9562 1.87446L10.6346 1.68894L10.3073 1.52378L10.1938 1.47176L9.95488 1.3706L9.67791 1.2669L9.42566 1.1846L9.10075 1.09489L8.83599 1.03486L8.54406 0.98184ZM10.4032 5.30023C10.4032 4.27588 10.2002 3.29829 9.83244 2.40604C11.7623 3.28995 13.1032 5.23862 13.1032 7.50023C13.1032 10.593 10.596 13.1002 7.50322 13.1002C6.63646 13.1002 5.81597 12.9036 5.08355 12.5522C6.5419 12.0941 7.81081 11.2082 8.74322 10.0416C8.87963 10.2284 9.10028 10.3497 9.34928 10.3497C9.76349 10.3497 10.0993 10.0139 10.0993 9.59971C10.0993 9.24256 9.84965 8.94373 9.51535 8.86816C9.57741 8.75165 9.63653 8.63334 9.6926 8.51332C9.88358 8.63163 10.1088 8.69993 10.35 8.69993C11.0403 8.69993 11.6 8.14028 11.6 7.44993C11.6 6.75976 11.0406 6.20024 10.3505 6.19993C10.3853 5.90487 10.4032 5.60464 10.4032 5.30023Z",fill:"currentColor",fillRule:"evenodd",clipRule:"evenodd"})),e.createElement(r,{size:"1",weight:"medium"},C(t)))))),e.createElement(r,{id:"radius-title",as:"p",size:"2",weight:"medium",mt:"5"},"Radius"),e.createElement(u,{columns:"5",gap:"2",mt:"3",role:"group","aria-labelledby":"radius-title"},s.radius.values.map(t=>e.createElement(p,{key:t,direction:"column",align:"center"},e.createElement("label",{className:"rt-ThemePanelRadioCard"},e.createElement("input",{className:"rt-ThemePanelRadioCardInput",type:"radio",name:"radius",id:`theme-panel-radius-${t}`,value:t,checked:w===t,onChange:o=>D(o.target.value)}),e.createElement(V,{asChild:!0,radius:t},e.createElement(L,{m:"3",width:"32px",height:"32px",style:{borderTopLeftRadius:t==="full"?"80%":"var(--radius-5)",backgroundImage:"linear-gradient(to bottom right, var(--accent-3), var(--accent-4))",borderTop:"2px solid var(--accent-a8)",borderLeft:"2px solid var(--accent-a8)"}}))),e.createElement(L,{asChild:!0,pt:"2"},e.createElement(r,{asChild:!0,size:"1",color:"gray"},e.createElement("label",{htmlFor:`theme-panel-radius-${t}`},C(t))))))),e.createElement(r,{id:"scaling-title",as:"p",size:"2",weight:"medium",mt:"5"},"Scaling"),e.createElement(u,{columns:"5",gap:"2",mt:"3",role:"group","aria-labelledby":"scaling-title"},s.scaling.values.map(t=>e.createElement("label",{key:t,className:"rt-ThemePanelRadioCard"},e.createElement("input",{className:"rt-ThemePanelRadioCardInput",type:"radio",name:"scaling",value:t,checked:x===t,onChange:o=>j(o.target.value)}),e.createElement(p,{align:"center",justify:"center",height:"32px"},e.createElement(V,{asChild:!0,scaling:t},e.createElement(p,{align:"center",justify:"center"},e.createElement(r,{size:"1",weight:"medium"},C(t)))))))),e.createElement(p,{mt:"5",align:"center",gap:"2"},e.createElement(r,{id:"panel-background-title",as:"p",size:"2",weight:"medium"},"Panel background"),e.createElement(I.Root,null,e.createElement(I.Trigger,null,e.createElement(_,{size:"1",variant:"ghost",color:"gray"},e.createElement(J,{label:"Learn more about panel background options"},e.createElement("svg",{width:"15",height:"15",viewBox:"0 0 15 15",fill:"currentColor",xmlns:"http://www.w3.org/2000/svg"},e.createElement("path",{d:"M7.49991 0.876892C3.84222 0.876892 0.877075 3.84204 0.877075 7.49972C0.877075 11.1574 3.84222 14.1226 7.49991 14.1226C11.1576 14.1226 14.1227 11.1574 14.1227 7.49972C14.1227 3.84204 11.1576 0.876892 7.49991 0.876892ZM1.82707 7.49972C1.82707 4.36671 4.36689 1.82689 7.49991 1.82689C10.6329 1.82689 13.1727 4.36671 13.1727 7.49972C13.1727 10.6327 10.6329 13.1726 7.49991 13.1726C4.36689 13.1726 1.82707 10.6327 1.82707 7.49972ZM8.24992 4.49999C8.24992 4.9142 7.91413 5.24999 7.49992 5.24999C7.08571 5.24999 6.74992 4.9142 6.74992 4.49999C6.74992 4.08577 7.08571 3.74999 7.49992 3.74999C7.91413 3.74999 8.24992 4.08577 8.24992 4.49999ZM6.00003 5.99999H6.50003H7.50003C7.77618 5.99999 8.00003 6.22384 8.00003 6.49999V9.99999H8.50003H9.00003V11H8.50003H7.50003H6.50003H6.00003V9.99999H6.50003H7.00003V6.99999H6.50003H6.00003V5.99999Z",fillRule:"evenodd",clipRule:"evenodd"}))))),e.createElement(I.Content,{size:"1",style:{maxWidth:220},side:"top",align:"center"},e.createElement(r,{as:"p",size:"2"},"Whether Card and Table panels are translucent, showing some of\xA0the background behind them.")))),e.createElement(u,{columns:"2",gap:"2",mt:"3",role:"group","aria-labelledby":"panel-background-title"},s.panelBackground.values.map(t=>e.createElement("label",{key:t,className:"rt-ThemePanelRadioCard"},e.createElement("input",{className:"rt-ThemePanelRadioCardInput",type:"radio",name:"panelBackground",value:t,checked:T===t,onChange:o=>O(o.target.value)}),e.createElement(p,{align:"center",justify:"center",height:"32px",gap:"2"},t==="solid"?e.createElement("svg",{width:"15",height:"15",viewBox:"0 0 15 15",fill:"none",xmlns:"http://www.w3.org/2000/svg",style:{margin:"0 -2px"}},e.createElement("path",{d:"M0.877075 7.49988C0.877075 3.84219 3.84222 0.877045 7.49991 0.877045C11.1576 0.877045 14.1227 3.84219 14.1227 7.49988C14.1227 11.1575 11.1576 14.1227 7.49991 14.1227C3.84222 14.1227 0.877075 11.1575 0.877075 7.49988ZM7.49991 1.82704C4.36689 1.82704 1.82708 4.36686 1.82708 7.49988C1.82708 10.6329 4.36689 13.1727 7.49991 13.1727C10.6329 13.1727 13.1727 10.6329 13.1727 7.49988C13.1727 4.36686 10.6329 1.82704 7.49991 1.82704Z",fill:"currentColor",fillRule:"evenodd",clipRule:"evenodd"})):e.createElement("svg",{width:"15",height:"15",viewBox:"0 0 15 15",fill:"none",xmlns:"http://www.w3.org/2000/svg",style:{margin:"0 -2px"}},e.createElement("path",{opacity:".05",d:"M6.78296 13.376C8.73904 9.95284 8.73904 5.04719 6.78296 1.62405L7.21708 1.37598C9.261 4.95283 9.261 10.0472 7.21708 13.624L6.78296 13.376Z",fill:"currentColor",fillRule:"evenodd",clipRule:"evenodd"}),e.createElement("path",{opacity:".1",d:"M7.28204 13.4775C9.23929 9.99523 9.23929 5.00475 7.28204 1.52248L7.71791 1.2775C9.76067 4.9119 9.76067 10.0881 7.71791 13.7225L7.28204 13.4775Z",fill:"currentColor",fillRule:"evenodd",clipRule:"evenodd"}),e.createElement("path",{opacity:".15",d:"M7.82098 13.5064C9.72502 9.99523 9.72636 5.01411 7.82492 1.50084L8.26465 1.26285C10.2465 4.92466 10.2451 10.085 8.26052 13.7448L7.82098 13.5064Z",fill:"currentColor",fillRule:"evenodd",clipRule:"evenodd"}),e.createElement("path",{opacity:".2",d:"M8.41284 13.429C10.1952 9.92842 10.1957 5.07537 8.41435 1.57402L8.85999 1.34729C10.7139 4.99113 10.7133 10.0128 8.85841 13.6559L8.41284 13.429Z",fill:"currentColor",fillRule:"evenodd",clipRule:"evenodd"}),e.createElement("path",{opacity:".25",d:"M9.02441 13.2956C10.6567 9.8379 10.6586 5.17715 9.03005 1.71656L9.48245 1.50366C11.1745 5.09919 11.1726 9.91629 9.47657 13.5091L9.02441 13.2956Z",fill:"currentColor",fillRule:"evenodd",clipRule:"evenodd"}),e.createElement("path",{opacity:".3",d:"M9.66809 13.0655C11.1097 9.69572 11.1107 5.3121 9.67088 1.94095L10.1307 1.74457C11.6241 5.24121 11.6231 9.76683 10.1278 13.2622L9.66809 13.0655Z",fill:"currentColor",fillRule:"evenodd",clipRule:"evenodd"}),e.createElement("path",{opacity:".35",d:"M10.331 12.7456C11.5551 9.52073 11.5564 5.49103 10.3347 2.26444L10.8024 2.0874C12.0672 5.42815 12.0659 9.58394 10.7985 12.9231L10.331 12.7456Z",fill:"currentColor",fillRule:"evenodd",clipRule:"evenodd"}),e.createElement("path",{opacity:".4",d:"M11.0155 12.2986C11.9938 9.29744 11.9948 5.71296 11.0184 2.71067L11.4939 2.55603C12.503 5.6589 12.502 9.35178 11.4909 12.4535L11.0155 12.2986Z",fill:"currentColor",fillRule:"evenodd",clipRule:"evenodd"}),e.createElement("path",{opacity:".45",d:"M11.7214 11.668C12.4254 9.01303 12.4262 5.99691 11.7237 3.34116L12.2071 3.21329C12.9318 5.95292 12.931 9.05728 12.2047 11.7961L11.7214 11.668Z",fill:"currentColor",fillRule:"evenodd",clipRule:"evenodd"}),e.createElement("path",{opacity:".5",d:"M12.4432 10.752C12.8524 8.63762 12.8523 6.36089 12.4429 4.2466L12.9338 4.15155C13.3553 6.32861 13.3554 8.66985 12.9341 10.847L12.4432 10.752Z",fill:"currentColor",fillRule:"evenodd",clipRule:"evenodd"}),e.createElement("path",{d:"M0.877075 7.49988C0.877075 3.84219 3.84222 0.877045 7.49991 0.877045C11.1576 0.877045 14.1227 3.84219 14.1227 7.49988C14.1227 11.1575 11.1576 14.1227 7.49991 14.1227C3.84222 14.1227 0.877075 11.1575 0.877075 7.49988ZM7.49991 1.82704C4.36689 1.82704 1.82708 4.36686 1.82708 7.49988C1.82708 10.6329 4.36689 13.1727 7.49991 13.1727C10.6329 13.1727 13.1727 10.6329 13.1727 7.49988C13.1727 4.36686 10.6329 1.82704 7.49991 1.82704Z",fill:"currentColor",fillRule:"evenodd",clipRule:"evenodd"})),e.createElement(r,{size:"1",weight:"medium"},C(t)))))),e.createElement(Q,{mt:"5",style:{width:"100%"},onClick:U},W==="copied"?"Copied":"Copy Theme")))))});z.displayName="ThemePanelImpl";function a9(){const n=document.createElement("style");return n.appendChild(document.createTextNode("*,*::before,*::after{-webkit-transition:none!important;-moz-transition:none!important;-o-transition:none!important;-ms-transition:none!important;transition:none!important}")),document.head.appendChild(n),()=>{window.getComputedStyle(document.body),setTimeout(()=>{document.head.removeChild(n)},1)}}function C(n){return n.charAt(0).toUpperCase()+n.slice(1)}function l9(n){const a=document.documentElement,l=a.classList.contains("light-theme"),c=a.classList.contains("dark-theme"),h=a.classList.contains("light"),v=a.classList.contains("dark");(l||c)&&(a.classList.remove("light-theme","dark-theme"),a.style.colorScheme=n,a.classList.add(`${n}-theme`)),(h||v)&&(a.classList.remove("light","dark"),a.style.colorScheme=n,a.classList.add(n)),!l&&!c&&!h&&!v&&(a.style.colorScheme=n,a.classList.add(n))}export{N as ThemePanel};
+//# sourceMappingURL=theme-panel.js.map

package/dist/esm/components/theme-panel.js.map

@@ -0,0 +1,7 @@
+{
+  "version": 3,
+  "sources": ["../../../src/components/theme-panel.tsx"],
+  "sourcesContent": ["'use client';\n\nimport * as React from 'react';\nimport { useCallbackRef } from 'radix-ui/internal';\n\nimport {\n  AccessibleIcon,\n  Box,\n  Button,\n  Flex,\n  Grid,\n  Heading,\n  IconButton,\n  Kbd,\n  Popover,\n  ScrollArea,\n  Text,\n  Tooltip,\n} from '../index.js';\nimport { Theme, useThemeContext } from './theme.js';\nimport { inert } from '../helpers/inert.js';\nimport { getMatchingGrayColor } from '../helpers/get-matching-gray-color.js';\nimport { themePropDefs } from './theme.props.js';\n\nimport type { ComponentPropsWithout, RemovedProps } from '../helpers/component-props.js';\nimport type { GetPropDefTypes } from '../props/prop-def.js';\n\ninterface ThemePanelProps extends Omit<ThemePanelImplProps, keyof ThemePanelImplPrivateProps> {\n  defaultOpen?: boolean;\n}\nconst ThemePanel = React.forwardRef<ThemePanelImplElement, ThemePanelProps>(\n  ({ defaultOpen = true, ...props }, forwardedRef) => {\n    const [open, setOpen] = React.useState(defaultOpen);\n    return <ThemePanelImpl {...props} ref={forwardedRef} open={open} onOpenChange={setOpen} />;\n  }\n);\nThemePanel.displayName = 'ThemePanel';\n\ntype ThemePanelImplElement = React.ElementRef<'div'>;\ninterface ThemePanelImplPrivateProps {\n  open: boolean;\n  onOpenChange: (open: boolean) => void;\n}\ninterface ThemePanelImplProps\n  extends ComponentPropsWithout<'div', RemovedProps>,\n    ThemePanelImplPrivateProps {\n  onAppearanceChange?: (value: 'light' | 'dark') => void;\n}\nconst ThemePanelImpl = React.forwardRef<ThemePanelImplElement, ThemePanelImplProps>(\n  (props, forwardedRef) => {\n    const { open, onOpenChange, onAppearanceChange: onAppearanceChangeProp, ...panelProps } = props;\n    const themeContext = useThemeContext();\n    const {\n      appearance,\n      onAppearanceChange,\n      accentColor,\n      onAccentColorChange,\n      grayColor,\n      onGrayColorChange,\n      panelBackground,\n      onPanelBackgroundChange,\n      radius,\n      onRadiusChange,\n      scaling,\n      onScalingChange,\n    } = themeContext;\n\n    const hasOnAppearanceChangeProp = onAppearanceChangeProp !== undefined;\n    const handleAppearanceChangeProp = useCallbackRef(onAppearanceChangeProp);\n    const handleAppearanceChange = React.useCallback(\n      (value: 'light' | 'dark') => {\n        const cleanup = disableAnimation();\n\n        if (appearance !== 'inherit') {\n          onAppearanceChange(value);\n          return;\n        }\n\n        if (hasOnAppearanceChangeProp) {\n          handleAppearanceChangeProp(value);\n        } else {\n          setResolvedAppearance(value);\n          updateRootAppearanceClass(value);\n        }\n\n        cleanup();\n      },\n      [appearance, onAppearanceChange, hasOnAppearanceChangeProp, handleAppearanceChangeProp]\n    );\n\n    const autoMatchedGray = getMatchingGrayColor(accentColor);\n    const resolvedGrayColor = grayColor === 'auto' ? autoMatchedGray : grayColor;\n\n    const [copyState, setCopyState] = React.useState<'idle' | 'copying' | 'copied'>('idle');\n    async function handleCopyThemeConfig() {\n      const theme = {\n        appearance: appearance === themePropDefs.appearance.default ? undefined : appearance,\n        accentColor: accentColor === themePropDefs.accentColor.default ? undefined : accentColor,\n        grayColor: grayColor === themePropDefs.grayColor.default ? undefined : grayColor,\n        panelBackground:\n          panelBackground === themePropDefs.panelBackground.default ? undefined : panelBackground,\n        radius: radius === themePropDefs.radius.default ? undefined : radius,\n        scaling: scaling === themePropDefs.scaling.default ? undefined : scaling,\n      } satisfies GetPropDefTypes<typeof themePropDefs>;\n\n      const props = Object.keys(theme)\n        .filter((key) => theme[key as keyof typeof theme] !== undefined)\n        .map((key) => `${key}=\"${theme[key as keyof typeof theme]}\"`)\n        .join(' ');\n\n      const textToCopy = props ? `<Theme ${props}>` : '<Theme>';\n\n      setCopyState('copying');\n      await navigator.clipboard.writeText(textToCopy);\n      setCopyState('copied');\n      setTimeout(() => setCopyState('idle'), 2000);\n    }\n\n    const [resolvedAppearance, setResolvedAppearance] = React.useState<'light' | 'dark' | null>(\n      appearance === 'inherit' ? null : appearance\n    );\n\n    const keyboardInputElement = `\n      [contenteditable],\n      [role=\"combobox\"],\n      [role=\"listbox\"],\n      [role=\"menu\"],\n      input:not([type=\"radio\"], [type=\"checkbox\"]),\n      select,\n      textarea\n    `;\n\n    // quickly show/hide using \"T\" keypress\n    React.useEffect(() => {\n      function handleKeydown(event: KeyboardEvent) {\n        const isModifierActive = event.altKey || event.ctrlKey || event.shiftKey || event.metaKey;\n        const isKeyboardInputActive = document.activeElement?.closest(keyboardInputElement);\n        const isKeyT = event.key?.toUpperCase() === 'T' && !isModifierActive;\n        if (isKeyT && !isKeyboardInputActive) {\n          onOpenChange(!open);\n        }\n      }\n      document.addEventListener('keydown', handleKeydown);\n      return () => document.removeEventListener('keydown', handleKeydown);\n    }, [onOpenChange, open, keyboardInputElement]);\n\n    // quickly toggle appearance using \"D\" keypress\n    React.useEffect(() => {\n      function handleKeydown(event: KeyboardEvent) {\n        const isModifierActive = event.altKey || event.ctrlKey || event.shiftKey || event.metaKey;\n        const isKeyboardInputActive = document.activeElement?.closest(keyboardInputElement);\n        const isKeyD = event.key?.toUpperCase() === 'D' && !isModifierActive;\n        if (isKeyD && !isKeyboardInputActive) {\n          handleAppearanceChange(resolvedAppearance === 'light' ? 'dark' : 'light');\n        }\n      }\n      document.addEventListener('keydown', handleKeydown);\n      return () => document.removeEventListener('keydown', handleKeydown);\n    }, [handleAppearanceChange, resolvedAppearance, keyboardInputElement]);\n\n    React.useEffect(() => {\n      const root = document.documentElement;\n      const body = document.body;\n\n      function update() {\n        const hasDarkClass =\n          root.classList.contains('dark') ||\n          root.classList.contains('dark-theme') ||\n          body.classList.contains('dark') ||\n          body.classList.contains('dark-theme');\n\n        if (appearance === 'inherit') {\n          setResolvedAppearance(hasDarkClass ? 'dark' : 'light');\n        } else {\n          setResolvedAppearance(appearance);\n        }\n      }\n\n      const classNameObserver = new MutationObserver(function (mutations) {\n        mutations.forEach(function (mutation) {\n          if (mutation.attributeName === 'class') {\n            update();\n          }\n        });\n      });\n\n      update();\n\n      // Observe <html> and <body> for `class` changes only when the appearance is inherited from them\n      if (appearance === 'inherit') {\n        classNameObserver.observe(root, { attributes: true });\n        classNameObserver.observe(body, { attributes: true });\n      }\n\n      return () => classNameObserver.disconnect();\n    }, [appearance]);\n\n    return (\n      <Theme asChild radius=\"medium\" scaling=\"100%\">\n        <Flex\n          direction=\"column\"\n          position=\"fixed\"\n          top=\"0\"\n          right=\"0\"\n          mr=\"4\"\n          mt=\"4\"\n          // @ts-ignore\n          inert={open ? undefined : inert}\n          {...panelProps}\n          ref={forwardedRef}\n          style={{\n            zIndex: 9999,\n            overflow: 'hidden',\n            maxHeight: 'calc(100vh - var(--space-4) - var(--space-4))',\n            borderRadius: 'var(--radius-4)',\n            backgroundColor: 'var(--color-panel-solid)',\n            transformOrigin: 'top center',\n            transitionProperty: 'transform, box-shadow',\n            transitionDuration: '200ms',\n            transitionTimingFunction: open ? 'ease-out' : 'ease-in',\n            transform: open ? 'none' : 'translateX(105%)',\n            boxShadow: open ? 'var(--shadow-5)' : 'var(--shadow-2)',\n            ...props.style,\n          }}\n        >\n          <ScrollArea>\n            <Box flexGrow=\"1\" p=\"5\" position=\"relative\">\n              <Box position=\"absolute\" top=\"0\" right=\"0\" m=\"2\">\n                <Tooltip\n                  content=\"Press T to show/hide the Theme Panel\"\n                  side=\"bottom\"\n                  sideOffset={6}\n                >\n                  <Kbd asChild size=\"3\" tabIndex={0} className=\"rt-ThemePanelShortcut\">\n                    <button onClick={() => onOpenChange(!open)}>T</button>\n                  </Kbd>\n                </Tooltip>\n              </Box>\n\n              <Heading size=\"5\" trim=\"both\" as=\"h3\" mb=\"5\">\n                Theme\n              </Heading>\n\n              <Text id=\"accent-color-title\" as=\"p\" size=\"2\" weight=\"medium\" mt=\"5\">\n                Accent color\n              </Text>\n\n              <Grid columns=\"10\" gap=\"2\" mt=\"3\" role=\"group\" aria-labelledby=\"accent-color-title\">\n                {themePropDefs.accentColor.values.map((color) => (\n                  <label\n                    key={color}\n                    className=\"rt-ThemePanelSwatch\"\n                    style={{ backgroundColor: `var(--${color}-9)` }}\n                  >\n                    <Tooltip\n                      content={`${upperFirst(color)}${\n                        accentColor === 'gray' && resolvedGrayColor !== 'gray'\n                          ? ` (${upperFirst(resolvedGrayColor)})`\n                          : ''\n                      }`}\n                    >\n                      <input\n                        className=\"rt-ThemePanelSwatchInput\"\n                        type=\"radio\"\n                        name=\"accentColor\"\n                        value={color}\n                        checked={accentColor === color}\n                        onChange={(event) =>\n                          onAccentColorChange(event.target.value as typeof accentColor)\n                        }\n                      />\n                    </Tooltip>\n                  </label>\n                ))}\n              </Grid>\n\n              <Flex asChild align=\"center\" justify=\"between\">\n                <Text as=\"p\" id=\"gray-color-title\" size=\"2\" weight=\"medium\" mt=\"5\">\n                  Gray color\n                </Text>\n              </Flex>\n\n              <Grid columns=\"10\" gap=\"2\" mt=\"3\" role=\"group\" aria-labelledby=\"gray-color-title\">\n                {themePropDefs.grayColor.values.map((gray) => (\n                  <Flex key={gray} asChild align=\"center\" justify=\"center\">\n                    <label\n                      className=\"rt-ThemePanelSwatch\"\n                      style={{\n                        backgroundColor:\n                          gray === 'auto'\n                            ? `var(--${autoMatchedGray}-9)`\n                            : gray === 'gray'\n                            ? 'var(--gray-9)'\n                            : `var(--${gray}-9)`,\n                        // we override --gray so pure gray doesn't exist anymore\n                        // recover something as close as possible by desaturating\n                        filter: gray === 'gray' ? 'saturate(0)' : undefined,\n                      }}\n                    >\n                      <Tooltip\n                        content={`${upperFirst(gray)}${\n                          gray === 'auto' ? ` (${upperFirst(autoMatchedGray)})` : ''\n                        }`}\n                      >\n                        <input\n                          className=\"rt-ThemePanelSwatchInput\"\n                          type=\"radio\"\n                          name=\"grayColor\"\n                          value={gray}\n                          checked={grayColor === gray}\n                          onChange={(event) =>\n                            onGrayColorChange(event.target.value as typeof grayColor)\n                          }\n                        />\n                      </Tooltip>\n                    </label>\n                  </Flex>\n                ))}\n              </Grid>\n\n              <Text id=\"appearance-title\" as=\"p\" size=\"2\" weight=\"medium\" mt=\"5\">\n                Appearance\n              </Text>\n\n              <Grid columns=\"2\" gap=\"2\" mt=\"3\" role=\"group\" aria-labelledby=\"appearance-title\">\n                {(['light', 'dark'] as const).map((value) => (\n                  <label key={value} className=\"rt-ThemePanelRadioCard\">\n                    <input\n                      className=\"rt-ThemePanelRadioCardInput\"\n                      type=\"radio\"\n                      name=\"appearance\"\n                      value={value}\n                      checked={resolvedAppearance === value}\n                      onChange={(event) =>\n                        handleAppearanceChange(event.target.value as 'light' | 'dark')\n                      }\n                    />\n                    <Flex align=\"center\" justify=\"center\" height=\"32px\" gap=\"2\">\n                      {value === 'light' ? (\n                        <svg\n                          width=\"15\"\n                          height=\"15\"\n                          viewBox=\"0 0 15 15\"\n                          fill=\"none\"\n                          xmlns=\"http://www.w3.org/2000/svg\"\n                          style={{ margin: '0 -1px' }}\n                        >\n                          <path\n                            d=\"M7.5 0C7.77614 0 8 0.223858 8 0.5V2.5C8 2.77614 7.77614 3 7.5 3C7.22386 3 7 2.77614 7 2.5V0.5C7 0.223858 7.22386 0 7.5 0ZM2.1967 2.1967C2.39196 2.00144 2.70854 2.00144 2.90381 2.1967L4.31802 3.61091C4.51328 3.80617 4.51328 4.12276 4.31802 4.31802C4.12276 4.51328 3.80617 4.51328 3.61091 4.31802L2.1967 2.90381C2.00144 2.70854 2.00144 2.39196 2.1967 2.1967ZM0.5 7C0.223858 7 0 7.22386 0 7.5C0 7.77614 0.223858 8 0.5 8H2.5C2.77614 8 3 7.77614 3 7.5C3 7.22386 2.77614 7 2.5 7H0.5ZM2.1967 12.8033C2.00144 12.608 2.00144 12.2915 2.1967 12.0962L3.61091 10.682C3.80617 10.4867 4.12276 10.4867 4.31802 10.682C4.51328 10.8772 4.51328 11.1938 4.31802 11.3891L2.90381 12.8033C2.70854 12.9986 2.39196 12.9986 2.1967 12.8033ZM12.5 7C12.2239 7 12 7.22386 12 7.5C12 7.77614 12.2239 8 12.5 8H14.5C14.7761 8 15 7.77614 15 7.5C15 7.22386 14.7761 7 14.5 7H12.5ZM10.682 4.31802C10.4867 4.12276 10.4867 3.80617 10.682 3.61091L12.0962 2.1967C12.2915 2.00144 12.608 2.00144 12.8033 2.1967C12.9986 2.39196 12.9986 2.70854 12.8033 2.90381L11.3891 4.31802C11.1938 4.51328 10.8772 4.51328 10.682 4.31802ZM8 12.5C8 12.2239 7.77614 12 7.5 12C7.22386 12 7 12.2239 7 12.5V14.5C7 14.7761 7.22386 15 7.5 15C7.77614 15 8 14.7761 8 14.5V12.5ZM10.682 10.682C10.8772 10.4867 11.1938 10.4867 11.3891 10.682L12.8033 12.0962C12.9986 12.2915 12.9986 12.608 12.8033 12.8033C12.608 12.9986 12.2915 12.9986 12.0962 12.8033L10.682 11.3891C10.4867 11.1938 10.4867 10.8772 10.682 10.682ZM5.5 7.5C5.5 6.39543 6.39543 5.5 7.5 5.5C8.60457 5.5 9.5 6.39543 9.5 7.5C9.5 8.60457 8.60457 9.5 7.5 9.5C6.39543 9.5 5.5 8.60457 5.5 7.5ZM7.5 4.5C5.84315 4.5 4.5 5.84315 4.5 7.5C4.5 9.15685 5.84315 10.5 7.5 10.5C9.15685 10.5 10.5 9.15685 10.5 7.5C10.5 5.84315 9.15685 4.5 7.5 4.5Z\"\n                            fill=\"currentColor\"\n                            fillRule=\"evenodd\"\n                            clipRule=\"evenodd\"\n                          ></path>\n                        </svg>\n                      ) : (\n                        <svg\n                          width=\"15\"\n                          height=\"15\"\n                          viewBox=\"0 0 15 15\"\n                          fill=\"none\"\n                          xmlns=\"http://www.w3.org/2000/svg\"\n                          style={{ margin: '0 -1px' }}\n                        >\n                          <path\n                            d=\"M2.89998 0.499976C2.89998 0.279062 2.72089 0.0999756 2.49998 0.0999756C2.27906 0.0999756 2.09998 0.279062 2.09998 0.499976V1.09998H1.49998C1.27906 1.09998 1.09998 1.27906 1.09998 1.49998C1.09998 1.72089 1.27906 1.89998 1.49998 1.89998H2.09998V2.49998C2.09998 2.72089 2.27906 2.89998 2.49998 2.89998C2.72089 2.89998 2.89998 2.72089 2.89998 2.49998V1.89998H3.49998C3.72089 1.89998 3.89998 1.72089 3.89998 1.49998C3.89998 1.27906 3.72089 1.09998 3.49998 1.09998H2.89998V0.499976ZM5.89998 3.49998C5.89998 3.27906 5.72089 3.09998 5.49998 3.09998C5.27906 3.09998 5.09998 3.27906 5.09998 3.49998V4.09998H4.49998C4.27906 4.09998 4.09998 4.27906 4.09998 4.49998C4.09998 4.72089 4.27906 4.89998 4.49998 4.89998H5.09998V5.49998C5.09998 5.72089 5.27906 5.89998 5.49998 5.89998C5.72089 5.89998 5.89998 5.72089 5.89998 5.49998V4.89998H6.49998C6.72089 4.89998 6.89998 4.72089 6.89998 4.49998C6.89998 4.27906 6.72089 4.09998 6.49998 4.09998H5.89998V3.49998ZM1.89998 6.49998C1.89998 6.27906 1.72089 6.09998 1.49998 6.09998C1.27906 6.09998 1.09998 6.27906 1.09998 6.49998V7.09998H0.499976C0.279062 7.09998 0.0999756 7.27906 0.0999756 7.49998C0.0999756 7.72089 0.279062 7.89998 0.499976 7.89998H1.09998V8.49998C1.09998 8.72089 1.27906 8.89997 1.49998 8.89997C1.72089 8.89997 1.89998 8.72089 1.89998 8.49998V7.89998H2.49998C2.72089 7.89998 2.89998 7.72089 2.89998 7.49998C2.89998 7.27906 2.72089 7.09998 2.49998 7.09998H1.89998V6.49998ZM8.54406 0.98184L8.24618 0.941586C8.03275 0.917676 7.90692 1.1655 8.02936 1.34194C8.17013 1.54479 8.29981 1.75592 8.41754 1.97445C8.91878 2.90485 9.20322 3.96932 9.20322 5.10022C9.20322 8.37201 6.82247 11.0878 3.69887 11.6097C3.45736 11.65 3.20988 11.6772 2.96008 11.6906C2.74563 11.702 2.62729 11.9535 2.77721 12.1072C2.84551 12.1773 2.91535 12.2458 2.98667 12.3128L3.05883 12.3795L3.31883 12.6045L3.50684 12.7532L3.62796 12.8433L3.81491 12.9742L3.99079 13.089C4.11175 13.1651 4.23536 13.2375 4.36157 13.3059L4.62496 13.4412L4.88553 13.5607L5.18837 13.6828L5.43169 13.7686C5.56564 13.8128 5.70149 13.8529 5.83857 13.8885C5.94262 13.9155 6.04767 13.9401 6.15405 13.9622C6.27993 13.9883 6.40713 14.0109 6.53544 14.0298L6.85241 14.0685L7.11934 14.0892C7.24637 14.0965 7.37436 14.1002 7.50322 14.1002C11.1483 14.1002 14.1032 11.1453 14.1032 7.50023C14.1032 7.25044 14.0893 7.00389 14.0623 6.76131L14.0255 6.48407C13.991 6.26083 13.9453 6.04129 13.8891 5.82642C13.8213 5.56709 13.7382 5.31398 13.6409 5.06881L13.5279 4.80132L13.4507 4.63542L13.3766 4.48666C13.2178 4.17773 13.0353 3.88295 12.8312 3.60423L12.6782 3.40352L12.4793 3.16432L12.3157 2.98361L12.1961 2.85951L12.0355 2.70246L11.8134 2.50184L11.4925 2.24191L11.2483 2.06498L10.9562 1.87446L10.6346 1.68894L10.3073 1.52378L10.1938 1.47176L9.95488 1.3706L9.67791 1.2669L9.42566 1.1846L9.10075 1.09489L8.83599 1.03486L8.54406 0.98184ZM10.4032 5.30023C10.4032 4.27588 10.2002 3.29829 9.83244 2.40604C11.7623 3.28995 13.1032 5.23862 13.1032 7.50023C13.1032 10.593 10.596 13.1002 7.50322 13.1002C6.63646 13.1002 5.81597 12.9036 5.08355 12.5522C6.5419 12.0941 7.81081 11.2082 8.74322 10.0416C8.87963 10.2284 9.10028 10.3497 9.34928 10.3497C9.76349 10.3497 10.0993 10.0139 10.0993 9.59971C10.0993 9.24256 9.84965 8.94373 9.51535 8.86816C9.57741 8.75165 9.63653 8.63334 9.6926 8.51332C9.88358 8.63163 10.1088 8.69993 10.35 8.69993C11.0403 8.69993 11.6 8.14028 11.6 7.44993C11.6 6.75976 11.0406 6.20024 10.3505 6.19993C10.3853 5.90487 10.4032 5.60464 10.4032 5.30023Z\"\n                            fill=\"currentColor\"\n                            fillRule=\"evenodd\"\n                            clipRule=\"evenodd\"\n                          ></path>\n                        </svg>\n                      )}\n                      <Text size=\"1\" weight=\"medium\">\n                        {upperFirst(value)}\n                      </Text>\n                    </Flex>\n                  </label>\n                ))}\n              </Grid>\n\n              <Text id=\"radius-title\" as=\"p\" size=\"2\" weight=\"medium\" mt=\"5\">\n                Radius\n              </Text>\n\n              <Grid columns=\"5\" gap=\"2\" mt=\"3\" role=\"group\" aria-labelledby=\"radius-title\">\n                {themePropDefs.radius.values.map((value) => (\n                  <Flex key={value} direction=\"column\" align=\"center\">\n                    <label className=\"rt-ThemePanelRadioCard\">\n                      <input\n                        className=\"rt-ThemePanelRadioCardInput\"\n                        type=\"radio\"\n                        name=\"radius\"\n                        id={`theme-panel-radius-${value}`}\n                        value={value}\n                        checked={radius === value}\n                        onChange={(event) => onRadiusChange(event.target.value as typeof radius)}\n                      />\n                      <Theme asChild radius={value}>\n                        <Box\n                          m=\"3\"\n                          width=\"32px\"\n                          height=\"32px\"\n                          style={{\n                            borderTopLeftRadius: value === 'full' ? '80%' : 'var(--radius-5)',\n                            backgroundImage:\n                              'linear-gradient(to bottom right, var(--accent-3), var(--accent-4))',\n                            borderTop: '2px solid var(--accent-a8)',\n                            borderLeft: '2px solid var(--accent-a8)',\n                          }}\n                        />\n                      </Theme>\n                    </label>\n                    <Box asChild pt=\"2\">\n                      <Text asChild size=\"1\" color=\"gray\">\n                        <label htmlFor={`theme-panel-radius-${value}`}>{upperFirst(value)}</label>\n                      </Text>\n                    </Box>\n                  </Flex>\n                ))}\n              </Grid>\n\n              <Text id=\"scaling-title\" as=\"p\" size=\"2\" weight=\"medium\" mt=\"5\">\n                Scaling\n              </Text>\n\n              <Grid columns=\"5\" gap=\"2\" mt=\"3\" role=\"group\" aria-labelledby=\"scaling-title\">\n                {themePropDefs.scaling.values.map((value) => (\n                  <label key={value} className=\"rt-ThemePanelRadioCard\">\n                    <input\n                      className=\"rt-ThemePanelRadioCardInput\"\n                      type=\"radio\"\n                      name=\"scaling\"\n                      value={value}\n                      checked={scaling === value}\n                      onChange={(event) => onScalingChange(event.target.value as typeof scaling)}\n                    />\n\n                    <Flex align=\"center\" justify=\"center\" height=\"32px\">\n                      <Theme asChild scaling={value}>\n                        <Flex align=\"center\" justify=\"center\">\n                          <Text size=\"1\" weight=\"medium\">\n                            {upperFirst(value)}\n                          </Text>\n                        </Flex>\n                      </Theme>\n                    </Flex>\n                  </label>\n                ))}\n              </Grid>\n\n              <Flex mt=\"5\" align=\"center\" gap=\"2\">\n                <Text id=\"panel-background-title\" as=\"p\" size=\"2\" weight=\"medium\">\n                  Panel background\n                </Text>\n\n                <Popover.Root>\n                  <Popover.Trigger>\n                    <IconButton size=\"1\" variant=\"ghost\" color=\"gray\">\n                      <AccessibleIcon label=\"Learn more about panel background options\">\n                        <svg\n                          width=\"15\"\n                          height=\"15\"\n                          viewBox=\"0 0 15 15\"\n                          fill=\"currentColor\"\n                          xmlns=\"http://www.w3.org/2000/svg\"\n                        >\n                          <path\n                            d=\"M7.49991 0.876892C3.84222 0.876892 0.877075 3.84204 0.877075 7.49972C0.877075 11.1574 3.84222 14.1226 7.49991 14.1226C11.1576 14.1226 14.1227 11.1574 14.1227 7.49972C14.1227 3.84204 11.1576 0.876892 7.49991 0.876892ZM1.82707 7.49972C1.82707 4.36671 4.36689 1.82689 7.49991 1.82689C10.6329 1.82689 13.1727 4.36671 13.1727 7.49972C13.1727 10.6327 10.6329 13.1726 7.49991 13.1726C4.36689 13.1726 1.82707 10.6327 1.82707 7.49972ZM8.24992 4.49999C8.24992 4.9142 7.91413 5.24999 7.49992 5.24999C7.08571 5.24999 6.74992 4.9142 6.74992 4.49999C6.74992 4.08577 7.08571 3.74999 7.49992 3.74999C7.91413 3.74999 8.24992 4.08577 8.24992 4.49999ZM6.00003 5.99999H6.50003H7.50003C7.77618 5.99999 8.00003 6.22384 8.00003 6.49999V9.99999H8.50003H9.00003V11H8.50003H7.50003H6.50003H6.00003V9.99999H6.50003H7.00003V6.99999H6.50003H6.00003V5.99999Z\"\n                            fillRule=\"evenodd\"\n                            clipRule=\"evenodd\"\n                          />\n                        </svg>\n                      </AccessibleIcon>\n                    </IconButton>\n                  </Popover.Trigger>\n\n                  <Popover.Content size=\"1\" style={{ maxWidth: 220 }} side=\"top\" align=\"center\">\n                    <Text as=\"p\" size=\"2\">\n                      Whether Card and Table panels are translucent, showing some of\u00A0the background\n                      behind them.\n                    </Text>\n                  </Popover.Content>\n                </Popover.Root>\n              </Flex>\n\n              <Grid\n                columns=\"2\"\n                gap=\"2\"\n                mt=\"3\"\n                role=\"group\"\n                aria-labelledby=\"panel-background-title\"\n              >\n                {themePropDefs.panelBackground.values.map((value) => (\n                  <label key={value} className=\"rt-ThemePanelRadioCard\">\n                    <input\n                      className=\"rt-ThemePanelRadioCardInput\"\n                      type=\"radio\"\n                      name=\"panelBackground\"\n                      value={value}\n                      checked={panelBackground === value}\n                      onChange={(event) =>\n                        onPanelBackgroundChange(event.target.value as typeof panelBackground)\n                      }\n                    />\n                    <Flex align=\"center\" justify=\"center\" height=\"32px\" gap=\"2\">\n                      {value === 'solid' ? (\n                        <svg\n                          width=\"15\"\n                          height=\"15\"\n                          viewBox=\"0 0 15 15\"\n                          fill=\"none\"\n                          xmlns=\"http://www.w3.org/2000/svg\"\n                          style={{ margin: '0 -2px' }}\n                        >\n                          <path\n                            d=\"M0.877075 7.49988C0.877075 3.84219 3.84222 0.877045 7.49991 0.877045C11.1576 0.877045 14.1227 3.84219 14.1227 7.49988C14.1227 11.1575 11.1576 14.1227 7.49991 14.1227C3.84222 14.1227 0.877075 11.1575 0.877075 7.49988ZM7.49991 1.82704C4.36689 1.82704 1.82708 4.36686 1.82708 7.49988C1.82708 10.6329 4.36689 13.1727 7.49991 13.1727C10.6329 13.1727 13.1727 10.6329 13.1727 7.49988C13.1727 4.36686 10.6329 1.82704 7.49991 1.82704Z\"\n                            fill=\"currentColor\"\n                            fillRule=\"evenodd\"\n                            clipRule=\"evenodd\"\n                          ></path>\n                        </svg>\n                      ) : (\n                        <svg\n                          width=\"15\"\n                          height=\"15\"\n                          viewBox=\"0 0 15 15\"\n                          fill=\"none\"\n                          xmlns=\"http://www.w3.org/2000/svg\"\n                          style={{ margin: '0 -2px' }}\n                        >\n                          <path\n                            opacity=\".05\"\n                            d=\"M6.78296 13.376C8.73904 9.95284 8.73904 5.04719 6.78296 1.62405L7.21708 1.37598C9.261 4.95283 9.261 10.0472 7.21708 13.624L6.78296 13.376Z\"\n                            fill=\"currentColor\"\n                            fillRule=\"evenodd\"\n                            clipRule=\"evenodd\"\n                          ></path>\n                          <path\n                            opacity=\".1\"\n                            d=\"M7.28204 13.4775C9.23929 9.99523 9.23929 5.00475 7.28204 1.52248L7.71791 1.2775C9.76067 4.9119 9.76067 10.0881 7.71791 13.7225L7.28204 13.4775Z\"\n                            fill=\"currentColor\"\n                            fillRule=\"evenodd\"\n                            clipRule=\"evenodd\"\n                          ></path>\n                          <path\n                            opacity=\".15\"\n                            d=\"M7.82098 13.5064C9.72502 9.99523 9.72636 5.01411 7.82492 1.50084L8.26465 1.26285C10.2465 4.92466 10.2451 10.085 8.26052 13.7448L7.82098 13.5064Z\"\n                            fill=\"currentColor\"\n                            fillRule=\"evenodd\"\n                            clipRule=\"evenodd\"\n                          ></path>\n                          <path\n                            opacity=\".2\"\n                            d=\"M8.41284 13.429C10.1952 9.92842 10.1957 5.07537 8.41435 1.57402L8.85999 1.34729C10.7139 4.99113 10.7133 10.0128 8.85841 13.6559L8.41284 13.429Z\"\n                            fill=\"currentColor\"\n                            fillRule=\"evenodd\"\n                            clipRule=\"evenodd\"\n                          ></path>\n                          <path\n                            opacity=\".25\"\n                            d=\"M9.02441 13.2956C10.6567 9.8379 10.6586 5.17715 9.03005 1.71656L9.48245 1.50366C11.1745 5.09919 11.1726 9.91629 9.47657 13.5091L9.02441 13.2956Z\"\n                            fill=\"currentColor\"\n                            fillRule=\"evenodd\"\n                            clipRule=\"evenodd\"\n                          ></path>\n                          <path\n                            opacity=\".3\"\n                            d=\"M9.66809 13.0655C11.1097 9.69572 11.1107 5.3121 9.67088 1.94095L10.1307 1.74457C11.6241 5.24121 11.6231 9.76683 10.1278 13.2622L9.66809 13.0655Z\"\n                            fill=\"currentColor\"\n                            fillRule=\"evenodd\"\n                            clipRule=\"evenodd\"\n                          ></path>\n                          <path\n                            opacity=\".35\"\n                            d=\"M10.331 12.7456C11.5551 9.52073 11.5564 5.49103 10.3347 2.26444L10.8024 2.0874C12.0672 5.42815 12.0659 9.58394 10.7985 12.9231L10.331 12.7456Z\"\n                            fill=\"currentColor\"\n                            fillRule=\"evenodd\"\n                            clipRule=\"evenodd\"\n                          ></path>\n                          <path\n                            opacity=\".4\"\n                            d=\"M11.0155 12.2986C11.9938 9.29744 11.9948 5.71296 11.0184 2.71067L11.4939 2.55603C12.503 5.6589 12.502 9.35178 11.4909 12.4535L11.0155 12.2986Z\"\n                            fill=\"currentColor\"\n                            fillRule=\"evenodd\"\n                            clipRule=\"evenodd\"\n                          ></path>\n                          <path\n                            opacity=\".45\"\n                            d=\"M11.7214 11.668C12.4254 9.01303 12.4262 5.99691 11.7237 3.34116L12.2071 3.21329C12.9318 5.95292 12.931 9.05728 12.2047 11.7961L11.7214 11.668Z\"\n                            fill=\"currentColor\"\n                            fillRule=\"evenodd\"\n                            clipRule=\"evenodd\"\n                          ></path>\n                          <path\n                            opacity=\".5\"\n                            d=\"M12.4432 10.752C12.8524 8.63762 12.8523 6.36089 12.4429 4.2466L12.9338 4.15155C13.3553 6.32861 13.3554 8.66985 12.9341 10.847L12.4432 10.752Z\"\n                            fill=\"currentColor\"\n                            fillRule=\"evenodd\"\n                            clipRule=\"evenodd\"\n                          ></path>\n                          <path\n                            d=\"M0.877075 7.49988C0.877075 3.84219 3.84222 0.877045 7.49991 0.877045C11.1576 0.877045 14.1227 3.84219 14.1227 7.49988C14.1227 11.1575 11.1576 14.1227 7.49991 14.1227C3.84222 14.1227 0.877075 11.1575 0.877075 7.49988ZM7.49991 1.82704C4.36689 1.82704 1.82708 4.36686 1.82708 7.49988C1.82708 10.6329 4.36689 13.1727 7.49991 13.1727C10.6329 13.1727 13.1727 10.6329 13.1727 7.49988C13.1727 4.36686 10.6329 1.82704 7.49991 1.82704Z\"\n                            fill=\"currentColor\"\n                            fillRule=\"evenodd\"\n                            clipRule=\"evenodd\"\n                          ></path>\n                        </svg>\n                      )}\n                      <Text size=\"1\" weight=\"medium\">\n                        {upperFirst(value)}\n                      </Text>\n                    </Flex>\n                  </label>\n                ))}\n              </Grid>\n\n              <Button mt=\"5\" style={{ width: '100%' }} onClick={handleCopyThemeConfig}>\n                {copyState === 'copied' ? 'Copied' : 'Copy Theme'}\n              </Button>\n            </Box>\n          </ScrollArea>\n        </Flex>\n      </Theme>\n    );\n  }\n);\nThemePanelImpl.displayName = 'ThemePanelImpl';\n\n// https://github.com/pacocoursey/next-themes/blob/main/packages/next-themes/src/index.tsx#L285\nfunction disableAnimation() {\n  const css = document.createElement('style');\n  css.appendChild(\n    document.createTextNode(\n      `*,*::before,*::after{-webkit-transition:none!important;-moz-transition:none!important;-o-transition:none!important;-ms-transition:none!important;transition:none!important}`\n    )\n  );\n  document.head.appendChild(css);\n\n  return () => {\n    // Force restyle\n    (() => window.getComputedStyle(document.body))();\n\n    // Wait for next tick before removing\n    setTimeout(() => {\n      document.head.removeChild(css);\n    }, 1);\n  };\n}\n\nfunction upperFirst(string: string) {\n  return string.charAt(0).toUpperCase() + string.slice(1);\n}\n\nfunction updateRootAppearanceClass(appearance: 'light' | 'dark') {\n  const root = document.documentElement;\n  const hasLightTheme = root.classList.contains('light-theme');\n  const hasDarkTheme = root.classList.contains('dark-theme');\n  const hasLight = root.classList.contains('light');\n  const hasDark = root.classList.contains('dark');\n\n  if (hasLightTheme || hasDarkTheme) {\n    root.classList.remove('light-theme', 'dark-theme');\n    root.style.colorScheme = appearance;\n    root.classList.add(`${appearance}-theme`);\n  }\n\n  if (hasLight || hasDark) {\n    root.classList.remove('light', 'dark');\n    root.style.colorScheme = appearance;\n    root.classList.add(appearance);\n  }\n\n  if (!hasLightTheme && !hasDarkTheme && !hasLight && !hasDark) {\n    root.style.colorScheme = appearance;\n    root.classList.add(appearance);\n  }\n}\n\nexport { ThemePanel };\nexport type { ThemePanelProps };\n"],
+  "mappings": "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",
+  "names": ["React", "useCallbackRef", "AccessibleIcon", "Box", "Button", "Flex", "Grid", "Heading", "IconButton", "Kbd", "Popover", "ScrollArea", "Text", "Tooltip", "Theme", "useThemeContext", "inert", "getMatchingGrayColor", "themePropDefs", "ThemePanel", "defaultOpen", "props", "forwardedRef", "open", "setOpen", "ThemePanelImpl", "onOpenChange", "onAppearanceChangeProp", "panelProps", "themeContext", "appearance", "onAppearanceChange", "accentColor", "onAccentColorChange", "grayColor", "onGrayColorChange", "panelBackground", "onPanelBackgroundChange", "radius", "onRadiusChange", "scaling", "onScalingChange", "hasOnAppearanceChangeProp", "handleAppearanceChangeProp", "handleAppearanceChange", "value", "cleanup", "disableAnimation", "setResolvedAppearance", "updateRootAppearanceClass", "autoMatchedGray", "resolvedGrayColor", "copyState", "setCopyState", "handleCopyThemeConfig", "theme", "key", "textToCopy", "resolvedAppearance", "keyboardInputElement", "handleKeydown", "event", "isModifierActive", "isKeyboardInputActive", "root", "body", "update", "hasDarkClass", "classNameObserver", "mutations", "mutation", "color", "upperFirst", "gray", "css", "string", "hasLightTheme", "hasDarkTheme", "hasLight", "hasDark"]
+}

package/dist/esm/components/theme.d.ts

@@ -0,0 +1,37 @@
+import * as React from 'react';
+import { themePropDefs } from './theme.props.js';
+import type { ThemeOwnProps } from './theme.props.js';
+import type { ComponentPropsWithout, RemovedProps } from '../helpers/component-props.js';
+type ThemeAppearance = (typeof themePropDefs.appearance.values)[number];
+type ThemeAccentColor = (typeof themePropDefs.accentColor.values)[number];
+type ThemeGrayColor = (typeof themePropDefs.grayColor.values)[number];
+type ThemePanelBackground = (typeof themePropDefs.panelBackground.values)[number];
+type ThemeRadius = (typeof themePropDefs.radius.values)[number];
+type ThemeScaling = (typeof themePropDefs.scaling.values)[number];
+interface ThemeChangeHandlers {
+    onAppearanceChange: (appearance: ThemeAppearance) => void;
+    onAccentColorChange: (accentColor: ThemeAccentColor) => void;
+    onGrayColorChange: (grayColor: ThemeGrayColor) => void;
+    onPanelBackgroundChange: (panelBackground: ThemePanelBackground) => void;
+    onRadiusChange: (radius: ThemeRadius) => void;
+    onScalingChange: (scaling: ThemeScaling) => void;
+}
+interface ThemeContextValue extends ThemeChangeHandlers {
+    appearance: ThemeAppearance;
+    accentColor: ThemeAccentColor;
+    grayColor: ThemeGrayColor;
+    resolvedGrayColor: ThemeGrayColor;
+    panelBackground: ThemePanelBackground;
+    radius: ThemeRadius;
+    scaling: ThemeScaling;
+}
+declare const ThemeContext: React.Context<ThemeContextValue | undefined>;
+declare function useThemeContext(): ThemeContextValue;
+interface ThemeProps extends ThemeImplPublicProps {
+}
+declare const Theme: React.ForwardRefExoticComponent<ThemeProps & React.RefAttributes<HTMLDivElement>>;
+interface ThemeImplPublicProps extends ComponentPropsWithout<'div', RemovedProps | 'dir'>, ThemeOwnProps {
+}
+export { Theme, ThemeContext, useThemeContext };
+export type { ThemeProps };
+//# sourceMappingURL=theme.d.ts.map

package/dist/esm/components/theme.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"theme.d.ts","sourceRoot":"","sources":["../../../src/components/theme.tsx"],"names":[],"mappings":"AAEA,OAAO,KAAK,KAAK,MAAM,OAAO,CAAC;AAK/B,OAAO,EAAE,aAAa,EAAE,MAAM,kBAAkB,CAAC;AAEjD,OAAO,KAAK,EAAE,aAAa,EAAE,MAAM,kBAAkB,CAAC;AACtD,OAAO,KAAK,EAAE,qBAAqB,EAAE,YAAY,EAAE,MAAM,+BAA+B,CAAC;AAIzF,KAAK,eAAe,GAAG,CAAC,OAAO,aAAa,CAAC,UAAU,CAAC,MAAM,CAAC,CAAC,MAAM,CAAC,CAAC;AACxE,KAAK,gBAAgB,GAAG,CAAC,OAAO,aAAa,CAAC,WAAW,CAAC,MAAM,CAAC,CAAC,MAAM,CAAC,CAAC;AAC1E,KAAK,cAAc,GAAG,CAAC,OAAO,aAAa,CAAC,SAAS,CAAC,MAAM,CAAC,CAAC,MAAM,CAAC,CAAC;AACtE,KAAK,oBAAoB,GAAG,CAAC,OAAO,aAAa,CAAC,eAAe,CAAC,MAAM,CAAC,CAAC,MAAM,CAAC,CAAC;AAClF,KAAK,WAAW,GAAG,CAAC,OAAO,aAAa,CAAC,MAAM,CAAC,MAAM,CAAC,CAAC,MAAM,CAAC,CAAC;AAChE,KAAK,YAAY,GAAG,CAAC,OAAO,aAAa,CAAC,OAAO,CAAC,MAAM,CAAC,CAAC,MAAM,CAAC,CAAC;AAElE,UAAU,mBAAmB;IAC3B,kBAAkB,EAAE,CAAC,UAAU,EAAE,eAAe,KAAK,IAAI,CAAC;IAC1D,mBAAmB,EAAE,CAAC,WAAW,EAAE,gBAAgB,KAAK,IAAI,CAAC;IAC7D,iBAAiB,EAAE,CAAC,SAAS,EAAE,cAAc,KAAK,IAAI,CAAC;IACvD,uBAAuB,EAAE,CAAC,eAAe,EAAE,oBAAoB,KAAK,IAAI,CAAC;IACzE,cAAc,EAAE,CAAC,MAAM,EAAE,WAAW,KAAK,IAAI,CAAC;IAC9C,eAAe,EAAE,CAAC,OAAO,EAAE,YAAY,KAAK,IAAI,CAAC;CAClD;AAED,UAAU,iBAAkB,SAAQ,mBAAmB;IACrD,UAAU,EAAE,eAAe,CAAC;IAC5B,WAAW,EAAE,gBAAgB,CAAC;IAC9B,SAAS,EAAE,cAAc,CAAC;IAC1B,iBAAiB,EAAE,cAAc,CAAC;IAClC,eAAe,EAAE,oBAAoB,CAAC;IACtC,MAAM,EAAE,WAAW,CAAC;IACpB,OAAO,EAAE,YAAY,CAAC;CACvB;AACD,QAAA,MAAM,YAAY,8CAAgE,CAAC;AAEnF,iBAAS,eAAe,sBAMvB;AAED,UAAU,UAAW,SAAQ,oBAAoB;CAAG;AACpD,QAAA,MAAM,KAAK,mFAaT,CAAC;AA6DH,UAAU,oBACR,SAAQ,qBAAqB,CAAC,KAAK,EAAE,YAAY,GAAG,KAAK,CAAC,EACxD,aAAa;CAAG;AA8FpB,OAAO,EAAE,KAAK,EAAE,YAAY,EAAE,eAAe,EAAE,CAAC;AAChD,YAAY,EAAE,UAAU,EAAE,CAAC"}

package/dist/esm/components/theme.js

@@ -0,0 +1,2 @@
+"use client";import*as e from"react";import E from"classnames";import{Direction as G,Slot as D,Tooltip as w}from"radix-ui";import{getMatchingGrayColor as N}from"../helpers/get-matching-gray-color.js";import{themePropDefs as o}from"./theme.props.js";const d=()=>{},P=e.createContext(void 0);function H(){const a=e.useContext(P);if(a===void 0)throw new Error("`useThemeContext` must be used within a `Theme`");return a}const R=e.forwardRef((a,s)=>e.useContext(P)===void 0?e.createElement(w.Provider,{delayDuration:200},e.createElement(G.Provider,{dir:"ltr"},e.createElement(I,{...a,ref:s}))):e.createElement(A,{...a,ref:s}));R.displayName="Theme";const I=e.forwardRef((a,s)=>{const{appearance:r=o.appearance.default,accentColor:c=o.accentColor.default,grayColor:l=o.grayColor.default,panelBackground:p=o.panelBackground.default,radius:n=o.radius.default,scaling:t=o.scaling.default,hasBackground:i=o.hasBackground.default,...u}=a,[h,m]=e.useState(r);e.useEffect(()=>m(r),[r]);const[y,g]=e.useState(c);e.useEffect(()=>g(c),[c]);const[v,C]=e.useState(l);e.useEffect(()=>C(l),[l]);const[k,f]=e.useState(p);e.useEffect(()=>f(p),[p]);const[B,x]=e.useState(n);e.useEffect(()=>x(n),[n]);const[T,b]=e.useState(t);return e.useEffect(()=>b(t),[t]),e.createElement(A,{...u,ref:s,isRoot:!0,hasBackground:i,appearance:h,accentColor:y,grayColor:v,panelBackground:k,radius:B,scaling:T,onAppearanceChange:m,onAccentColorChange:g,onGrayColorChange:C,onPanelBackgroundChange:f,onRadiusChange:x,onScalingChange:b})});I.displayName="ThemeRoot";const A=e.forwardRef((a,s)=>{const r=e.useContext(P),{asChild:c,isRoot:l,hasBackground:p,appearance:n=r?.appearance??o.appearance.default,accentColor:t=r?.accentColor??o.accentColor.default,grayColor:i=r?.resolvedGrayColor??o.grayColor.default,panelBackground:u=r?.panelBackground??o.panelBackground.default,radius:h=r?.radius??o.radius.default,scaling:m=r?.scaling??o.scaling.default,onAppearanceChange:y=d,onAccentColorChange:g=d,onGrayColorChange:v=d,onPanelBackgroundChange:C=d,onRadiusChange:k=d,onScalingChange:f=d,...B}=a,x=c?D.Root:"div",T=i==="auto"?N(t):i,b=a.appearance==="light"||a.appearance==="dark",S=p===void 0?l||b:p;return e.createElement(P.Provider,{value:e.useMemo(()=>({appearance:n,accentColor:t,grayColor:i,resolvedGrayColor:T,panelBackground:u,radius:h,scaling:m,onAppearanceChange:y,onAccentColorChange:g,onGrayColorChange:v,onPanelBackgroundChange:C,onRadiusChange:k,onScalingChange:f}),[n,t,i,T,u,h,m,y,g,v,C,k,f])},e.createElement(x,{"data-is-root-theme":l?"true":"false","data-accent-color":t,"data-gray-color":T,"data-has-background":S?"true":"false","data-panel-background":u,"data-radius":h,"data-scaling":m,ref:s,...B,className:E("radix-themes",{light:n==="light",dark:n==="dark"},B.className)}))});A.displayName="ThemeImpl";export{R as Theme,P as ThemeContext,H as useThemeContext};
+//# sourceMappingURL=theme.js.map

package/dist/esm/components/theme.js.map

@@ -0,0 +1,7 @@
+{
+  "version": 3,
+  "sources": ["../../../src/components/theme.tsx"],
+  "sourcesContent": ["'use client';\n\nimport * as React from 'react';\nimport classNames from 'classnames';\nimport { Direction, Slot, Tooltip as TooltipPrimitive } from 'radix-ui';\n\nimport { getMatchingGrayColor } from '../helpers/get-matching-gray-color.js';\nimport { themePropDefs } from './theme.props.js';\n\nimport type { ThemeOwnProps } from './theme.props.js';\nimport type { ComponentPropsWithout, RemovedProps } from '../helpers/component-props.js';\n\nconst noop = () => {};\n\ntype ThemeAppearance = (typeof themePropDefs.appearance.values)[number];\ntype ThemeAccentColor = (typeof themePropDefs.accentColor.values)[number];\ntype ThemeGrayColor = (typeof themePropDefs.grayColor.values)[number];\ntype ThemePanelBackground = (typeof themePropDefs.panelBackground.values)[number];\ntype ThemeRadius = (typeof themePropDefs.radius.values)[number];\ntype ThemeScaling = (typeof themePropDefs.scaling.values)[number];\n\ninterface ThemeChangeHandlers {\n  onAppearanceChange: (appearance: ThemeAppearance) => void;\n  onAccentColorChange: (accentColor: ThemeAccentColor) => void;\n  onGrayColorChange: (grayColor: ThemeGrayColor) => void;\n  onPanelBackgroundChange: (panelBackground: ThemePanelBackground) => void;\n  onRadiusChange: (radius: ThemeRadius) => void;\n  onScalingChange: (scaling: ThemeScaling) => void;\n}\n\ninterface ThemeContextValue extends ThemeChangeHandlers {\n  appearance: ThemeAppearance;\n  accentColor: ThemeAccentColor;\n  grayColor: ThemeGrayColor;\n  resolvedGrayColor: ThemeGrayColor;\n  panelBackground: ThemePanelBackground;\n  radius: ThemeRadius;\n  scaling: ThemeScaling;\n}\nconst ThemeContext = React.createContext<ThemeContextValue | undefined>(undefined);\n\nfunction useThemeContext() {\n  const context = React.useContext(ThemeContext);\n  if (context === undefined) {\n    throw new Error('`useThemeContext` must be used within a `Theme`');\n  }\n  return context;\n}\n\ninterface ThemeProps extends ThemeImplPublicProps {}\nconst Theme = React.forwardRef<ThemeImplElement, ThemeProps>((props, forwardedRef) => {\n  const context = React.useContext(ThemeContext);\n  const isRoot = context === undefined;\n  if (isRoot) {\n    return (\n      <TooltipPrimitive.Provider delayDuration={200}>\n        <Direction.Provider dir=\"ltr\">\n          <ThemeRoot {...props} ref={forwardedRef} />\n        </Direction.Provider>\n      </TooltipPrimitive.Provider>\n    );\n  }\n  return <ThemeImpl {...props} ref={forwardedRef} />;\n});\nTheme.displayName = 'Theme';\n\nconst ThemeRoot = React.forwardRef<ThemeImplElement, ThemeImplPublicProps>(\n  (props, forwardedRef) => {\n    const {\n      appearance: appearanceProp = themePropDefs.appearance.default,\n      accentColor: accentColorProp = themePropDefs.accentColor.default,\n      grayColor: grayColorProp = themePropDefs.grayColor.default,\n      panelBackground: panelBackgroundProp = themePropDefs.panelBackground.default,\n      radius: radiusProp = themePropDefs.radius.default,\n      scaling: scalingProp = themePropDefs.scaling.default,\n      hasBackground = themePropDefs.hasBackground.default,\n      ...rootProps\n    } = props;\n    const [appearance, setAppearance] = React.useState(appearanceProp);\n    React.useEffect(() => setAppearance(appearanceProp), [appearanceProp]);\n\n    const [accentColor, setAccentColor] = React.useState(accentColorProp);\n    React.useEffect(() => setAccentColor(accentColorProp), [accentColorProp]);\n\n    const [grayColor, setGrayColor] = React.useState(grayColorProp);\n    React.useEffect(() => setGrayColor(grayColorProp), [grayColorProp]);\n\n    const [panelBackground, setPanelBackground] = React.useState(panelBackgroundProp);\n    React.useEffect(() => setPanelBackground(panelBackgroundProp), [panelBackgroundProp]);\n\n    const [radius, setRadius] = React.useState(radiusProp);\n    React.useEffect(() => setRadius(radiusProp), [radiusProp]);\n\n    const [scaling, setScaling] = React.useState(scalingProp);\n    React.useEffect(() => setScaling(scalingProp), [scalingProp]);\n\n    return (\n      <ThemeImpl\n        {...rootProps}\n        ref={forwardedRef}\n        isRoot\n        hasBackground={hasBackground}\n        //\n        appearance={appearance}\n        accentColor={accentColor}\n        grayColor={grayColor}\n        panelBackground={panelBackground}\n        radius={radius}\n        scaling={scaling}\n        //\n        onAppearanceChange={setAppearance}\n        onAccentColorChange={setAccentColor}\n        onGrayColorChange={setGrayColor}\n        onPanelBackgroundChange={setPanelBackground}\n        onRadiusChange={setRadius}\n        onScalingChange={setScaling}\n      />\n    );\n  }\n);\nThemeRoot.displayName = 'ThemeRoot';\n\ntype ThemeImplElement = React.ElementRef<'div'>;\ninterface ThemeImplProps extends ThemeImplPublicProps, ThemeImplPrivateProps {}\ninterface ThemeImplPublicProps\n  extends ComponentPropsWithout<'div', RemovedProps | 'dir'>,\n    ThemeOwnProps {}\ninterface ThemeImplPrivateProps extends Partial<ThemeChangeHandlers> {\n  isRoot?: boolean;\n}\nconst ThemeImpl = React.forwardRef<ThemeImplElement, ThemeImplProps>((props, forwardedRef) => {\n  const context = React.useContext(ThemeContext);\n  const {\n    asChild,\n    isRoot,\n    hasBackground: hasBackgroundProp,\n    //\n    appearance = context?.appearance ?? themePropDefs.appearance.default,\n    accentColor = context?.accentColor ?? themePropDefs.accentColor.default,\n    grayColor = context?.resolvedGrayColor ?? themePropDefs.grayColor.default,\n    panelBackground = context?.panelBackground ?? themePropDefs.panelBackground.default,\n    radius = context?.radius ?? themePropDefs.radius.default,\n    scaling = context?.scaling ?? themePropDefs.scaling.default,\n    //\n    onAppearanceChange = noop,\n    onAccentColorChange = noop,\n    onGrayColorChange = noop,\n    onPanelBackgroundChange = noop,\n    onRadiusChange = noop,\n    onScalingChange = noop,\n    //\n    ...themeProps\n  } = props;\n  const Comp = asChild ? Slot.Root : 'div';\n  const resolvedGrayColor = grayColor === 'auto' ? getMatchingGrayColor(accentColor) : grayColor;\n  const isExplicitAppearance = props.appearance === 'light' || props.appearance === 'dark';\n  const hasBackground =\n    hasBackgroundProp === undefined ? isRoot || isExplicitAppearance : hasBackgroundProp;\n  return (\n    <ThemeContext.Provider\n      value={React.useMemo(\n        () => ({\n          appearance,\n          accentColor,\n          grayColor,\n          resolvedGrayColor,\n          panelBackground,\n          radius,\n          scaling,\n          //\n          onAppearanceChange,\n          onAccentColorChange,\n          onGrayColorChange,\n          onPanelBackgroundChange,\n          onRadiusChange,\n          onScalingChange,\n        }),\n        [\n          appearance,\n          accentColor,\n          grayColor,\n          resolvedGrayColor,\n          panelBackground,\n          radius,\n          scaling,\n          //\n          onAppearanceChange,\n          onAccentColorChange,\n          onGrayColorChange,\n          onPanelBackgroundChange,\n          onRadiusChange,\n          onScalingChange,\n        ]\n      )}\n    >\n      <Comp\n        data-is-root-theme={isRoot ? 'true' : 'false'}\n        data-accent-color={accentColor}\n        data-gray-color={resolvedGrayColor}\n        // for nested `Theme` background\n        data-has-background={hasBackground ? 'true' : 'false'}\n        data-panel-background={panelBackground}\n        data-radius={radius}\n        data-scaling={scaling}\n        ref={forwardedRef}\n        {...themeProps}\n        className={classNames(\n          'radix-themes',\n          {\n            light: appearance === 'light',\n            dark: appearance === 'dark',\n          },\n          themeProps.className\n        )}\n      />\n    </ThemeContext.Provider>\n  );\n});\nThemeImpl.displayName = 'ThemeImpl';\n\nexport { Theme, ThemeContext, useThemeContext };\nexport type { ThemeProps };\n"],
+  "mappings": "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",
+  "names": ["React", "classNames", "Direction", "Slot", "TooltipPrimitive", "getMatchingGrayColor", "themePropDefs", "noop", "ThemeContext", "useThemeContext", "context", "Theme", "props", "forwardedRef", "ThemeRoot", "ThemeImpl", "appearanceProp", "accentColorProp", "grayColorProp", "panelBackgroundProp", "radiusProp", "scalingProp", "hasBackground", "rootProps", "appearance", "setAppearance", "accentColor", "setAccentColor", "grayColor", "setGrayColor", "panelBackground", "setPanelBackground", "radius", "setRadius", "scaling", "setScaling", "asChild", "isRoot", "hasBackgroundProp", "onAppearanceChange", "onAccentColorChange", "onGrayColorChange", "onPanelBackgroundChange", "onRadiusChange", "onScalingChange", "themeProps", "Comp", "resolvedGrayColor", "isExplicitAppearance"]
+}

package/dist/esm/components/theme.props.d.ts

@@ -0,0 +1,88 @@
+import { asChildPropDef } from '../props/as-child.prop.js';
+import type { GetPropDefTypes } from '../props/prop-def.js';
+declare const themePropDefs: {
+    /**
+     * Whether to apply background color to the Theme element.
+     *
+     * Defaults to true for the root Theme and for Theme elements that
+     * have an explicit light or dark appearance prop.
+     */
+    hasBackground: {
+        type: "boolean";
+        default: true;
+    };
+    /**
+     * Sets the color scheme of the theme, typcially referred to as light and dark mode.
+     *
+     * @link
+     * https://www.radix-ui.com/themes/docs/theme/dark-mode
+     */
+    appearance: {
+        type: "enum";
+        values: readonly ["inherit", "light", "dark"];
+        default: "inherit";
+    };
+    /**
+     * Selects one of the accent color options to use in the Theme.
+     *
+     * @link
+     * https://www.radix-ui.com/themes/docs/theme/color
+     */
+    accentColor: {
+        type: "enum";
+        values: readonly ["gray", "gold", "bronze", "brown", "yellow", "amber", "orange", "tomato", "red", "ruby", "crimson", "pink", "plum", "purple", "violet", "iris", "indigo", "blue", "cyan", "teal", "jade", "green", "grass", "lime", "mint", "sky"];
+        default: "indigo";
+    };
+    /**
+     * Selects one of the gray color options to use in the Theme.
+     *
+     * @link
+     * https://www.radix-ui.com/themes/docs/theme/color
+     */
+    grayColor: {
+        type: "enum";
+        values: readonly ["auto", "gray", "mauve", "slate", "sage", "olive", "sand"];
+        default: "auto";
+    };
+    /**
+     * Controls whether to use a solid or translucent background color on panelled
+     * elements such as Card or Table is solid or translucent.
+     *
+     * @link
+     * https://www.radix-ui.com/themes/docs/theme/visual-style
+     */
+    panelBackground: {
+        type: "enum";
+        values: readonly ["solid", "translucent"];
+        default: "translucent";
+    };
+    /**
+     * Sets the default radius of the components.
+     *
+     * @link
+     * https://www.radix-ui.com/themes/docs/theme/visual-style
+     */
+    radius: {
+        type: "enum";
+        values: readonly ["none", "small", "medium", "large", "full"];
+        default: "medium";
+    };
+    /**
+     * Sets a scaling multiplier for values like spacing, font sizes, line heights, etc. are scaled.
+     *
+     * @link
+     * https://www.radix-ui.com/themes/docs/theme/layout
+     */
+    scaling: {
+        type: "enum";
+        values: readonly ["90%", "95%", "100%", "105%", "110%"];
+        default: "100%";
+    };
+    asChild: {
+        type: "boolean";
+    };
+};
+type ThemeOwnProps = GetPropDefTypes<typeof themePropDefs & typeof asChildPropDef>;
+export { themePropDefs };
+export type { ThemeOwnProps };
+//# sourceMappingURL=theme.props.d.ts.map

package/dist/esm/components/theme.props.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"theme.props.d.ts","sourceRoot":"","sources":["../../../src/components/theme.props.tsx"],"names":[],"mappings":"AAAA,OAAO,EAAE,cAAc,EAAE,MAAM,2BAA2B,CAAC;AAI3D,OAAO,KAAK,EAAE,eAAe,EAAW,MAAM,sBAAsB,CAAC;AAMrE,QAAA,MAAM,aAAa;IAEjB;;;;;OAKG;;;;;IAEH;;;;;OAKG;;;;;;IAEH;;;;;OAKG;;;;;;IAEH;;;;;OAKG;;;;;;IAEH;;;;;;OAMG;;;;;;IAEH;;;;;OAKG;;;;;;IAEH;;;;;OAKG;;;;;;;;;CAUJ,CAAC;AAEF,KAAK,aAAa,GAAG,eAAe,CAAC,OAAO,aAAa,GAAG,OAAO,cAAc,CAAC,CAAC;AAEnF,OAAO,EAAE,aAAa,EAAE,CAAC;AACzB,YAAY,EAAE,aAAa,EAAE,CAAC"}

package/dist/esm/components/theme.props.js

@@ -0,0 +1,2 @@
+import{asChildPropDef as e}from"../props/as-child.prop.js";import{accentColors as o,grayColors as r}from"../props/color.prop.js";import{radii as a}from"../props/radius.prop.js";const p=["inherit","light","dark"],t=["solid","translucent"],n=["90%","95%","100%","105%","110%"],s={...e,hasBackground:{type:"boolean",default:!0},appearance:{type:"enum",values:p,default:"inherit"},accentColor:{type:"enum",values:o,default:"indigo"},grayColor:{type:"enum",values:r,default:"auto"},panelBackground:{type:"enum",values:t,default:"translucent"},radius:{type:"enum",values:a,default:"medium"},scaling:{type:"enum",values:n,default:"100%"}};export{s as themePropDefs};
+//# sourceMappingURL=theme.props.js.map

package/dist/esm/components/theme.props.js.map

@@ -0,0 +1,7 @@
+{
+  "version": 3,
+  "sources": ["../../../src/components/theme.props.tsx"],
+  "sourcesContent": ["import { asChildPropDef } from '../props/as-child.prop.js';\nimport { accentColors, grayColors } from '../props/color.prop.js';\nimport { radii } from '../props/radius.prop.js';\n\nimport type { GetPropDefTypes, PropDef } from '../props/prop-def.js';\n\nconst appearances = ['inherit', 'light', 'dark'] as const;\nconst panelBackgrounds = ['solid', 'translucent'] as const;\nconst scalings = ['90%', '95%', '100%', '105%', '110%'] as const;\n\nconst themePropDefs = {\n  ...asChildPropDef,\n  /**\n   * Whether to apply background color to the Theme element.\n   *\n   * Defaults to true for the root Theme and for Theme elements that\n   * have an explicit light or dark appearance prop.\n   */\n  hasBackground: { type: 'boolean', default: true },\n  /**\n   * Sets the color scheme of the theme, typcially referred to as light and dark mode.\n   *\n   * @link\n   * https://www.radix-ui.com/themes/docs/theme/dark-mode\n   */\n  appearance: { type: 'enum', values: appearances, default: 'inherit' },\n  /**\n   * Selects one of the accent color options to use in the Theme.\n   *\n   * @link\n   * https://www.radix-ui.com/themes/docs/theme/color\n   */\n  accentColor: { type: 'enum', values: accentColors, default: 'indigo' },\n  /**\n   * Selects one of the gray color options to use in the Theme.\n   *\n   * @link\n   * https://www.radix-ui.com/themes/docs/theme/color\n   */\n  grayColor: { type: 'enum', values: grayColors, default: 'auto' },\n  /**\n   * Controls whether to use a solid or translucent background color on panelled\n   * elements such as Card or Table is solid or translucent.\n   *\n   * @link\n   * https://www.radix-ui.com/themes/docs/theme/visual-style\n   */\n  panelBackground: { type: 'enum', values: panelBackgrounds, default: 'translucent' },\n  /**\n   * Sets the default radius of the components.\n   *\n   * @link\n   * https://www.radix-ui.com/themes/docs/theme/visual-style\n   */\n  radius: { type: 'enum', values: radii, default: 'medium' },\n  /**\n   * Sets a scaling multiplier for values like spacing, font sizes, line heights, etc. are scaled.\n   *\n   * @link\n   * https://www.radix-ui.com/themes/docs/theme/layout\n   */\n  scaling: { type: 'enum', values: scalings, default: '100%' },\n} satisfies {\n  hasBackground: PropDef<boolean>;\n  appearance: PropDef<(typeof appearances)[number]>;\n  accentColor: PropDef<(typeof accentColors)[number]>;\n  grayColor: PropDef<(typeof grayColors)[number]>;\n  panelBackground: PropDef<(typeof panelBackgrounds)[number]>;\n  radius: PropDef<(typeof radii)[number]>;\n  scaling: PropDef<(typeof scalings)[number]>;\n};\n\ntype ThemeOwnProps = GetPropDefTypes<typeof themePropDefs & typeof asChildPropDef>;\n\nexport { themePropDefs };\nexport type { ThemeOwnProps };\n"],
+  "mappings": "AAAA,OAAS,kBAAAA,MAAsB,4BAC/B,OAAS,gBAAAC,EAAc,cAAAC,MAAkB,yBACzC,OAAS,SAAAC,MAAa,0BAItB,MAAMC,EAAc,CAAC,UAAW,QAAS,MAAM,EACzCC,EAAmB,CAAC,QAAS,aAAa,EAC1CC,EAAW,CAAC,MAAO,MAAO,OAAQ,OAAQ,MAAM,EAEhDC,EAAgB,CACpB,GAAGP,EAOH,cAAe,CAAE,KAAM,UAAW,QAAS,EAAK,EAOhD,WAAY,CAAE,KAAM,OAAQ,OAAQI,EAAa,QAAS,SAAU,EAOpE,YAAa,CAAE,KAAM,OAAQ,OAAQH,EAAc,QAAS,QAAS,EAOrE,UAAW,CAAE,KAAM,OAAQ,OAAQC,EAAY,QAAS,MAAO,EAQ/D,gBAAiB,CAAE,KAAM,OAAQ,OAAQG,EAAkB,QAAS,aAAc,EAOlF,OAAQ,CAAE,KAAM,OAAQ,OAAQF,EAAO,QAAS,QAAS,EAOzD,QAAS,CAAE,KAAM,OAAQ,OAAQG,EAAU,QAAS,MAAO,CAC7D",
+  "names": ["asChildPropDef", "accentColors", "grayColors", "radii", "appearances", "panelBackgrounds", "scalings", "themePropDefs"]
+}

package/dist/esm/components/tooltip.d.ts

@@ -0,0 +1,14 @@
+import * as React from 'react';
+import { Tooltip as TooltipPrimitive } from 'radix-ui';
+import { tooltipPropDefs } from './tooltip.props.js';
+import type { ComponentPropsWithout, RemovedProps } from '../helpers/component-props.js';
+import type { GetPropDefTypes } from '../props/prop-def.js';
+type TooltipOwnProps = GetPropDefTypes<typeof tooltipPropDefs>;
+interface TooltipProps extends React.ComponentPropsWithoutRef<typeof TooltipPrimitive.Root>, ComponentPropsWithout<typeof TooltipPrimitive.Content, RemovedProps | 'content'>, TooltipOwnProps {
+    content: React.ReactNode;
+    container?: React.ComponentPropsWithoutRef<typeof TooltipPrimitive.Portal>['container'];
+}
+declare const Tooltip: React.ForwardRefExoticComponent<TooltipProps & React.RefAttributes<HTMLDivElement>>;
+export { Tooltip };
+export type { TooltipProps };
+//# sourceMappingURL=tooltip.d.ts.map

package/dist/esm/components/tooltip.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"tooltip.d.ts","sourceRoot":"","sources":["../../../src/components/tooltip.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,KAAK,MAAM,OAAO,CAAC;AAE/B,OAAO,EAAE,OAAO,IAAI,gBAAgB,EAAE,MAAM,UAAU,CAAC;AAKvD,OAAO,EAAE,eAAe,EAAE,MAAM,oBAAoB,CAAC;AAErD,OAAO,KAAK,EAAE,qBAAqB,EAAE,YAAY,EAAE,MAAM,+BAA+B,CAAC;AACzF,OAAO,KAAK,EAAE,eAAe,EAAE,MAAM,sBAAsB,CAAC;AAG5D,KAAK,eAAe,GAAG,eAAe,CAAC,OAAO,eAAe,CAAC,CAAC;AAC/D,UAAU,YACR,SAAQ,KAAK,CAAC,wBAAwB,CAAC,OAAO,gBAAgB,CAAC,IAAI,CAAC,EAClE,qBAAqB,CAAC,OAAO,gBAAgB,CAAC,OAAO,EAAE,YAAY,GAAG,SAAS,CAAC,EAChF,eAAe;IACjB,OAAO,EAAE,KAAK,CAAC,SAAS,CAAC;IACzB,SAAS,CAAC,EAAE,KAAK,CAAC,wBAAwB,CAAC,OAAO,gBAAgB,CAAC,MAAM,CAAC,CAAC,WAAW,CAAC,CAAC;CACzF;AACD,QAAA,MAAM,OAAO,qFAqCX,CAAC;AAGH,OAAO,EAAE,OAAO,EAAE,CAAC;AACnB,YAAY,EAAE,YAAY,EAAE,CAAC"}

package/dist/esm/components/tooltip.js

@@ -0,0 +1,2 @@
+import*as o from"react";import y from"classnames";import{Tooltip as t}from"radix-ui";import{Text as h}from"./text.js";import{Theme as v}from"./theme.js";import{extractProps as u}from"../helpers/extract-props.js";import{tooltipPropDefs as R}from"./tooltip.props.js";const e=o.forwardRef((i,p)=>{const{children:r,className:n,open:s,defaultOpen:l,onOpenChange:m,delayDuration:a,disableHoverableContent:f,content:P,container:T,forceMount:c,...d}=u(i,R),C={open:s,defaultOpen:l,onOpenChange:m,delayDuration:a,disableHoverableContent:f};return o.createElement(t.Root,{...C},o.createElement(t.Trigger,{asChild:!0},r),o.createElement(t.Portal,{container:T,forceMount:c},o.createElement(v,{asChild:!0},o.createElement(t.Content,{sideOffset:4,collisionPadding:10,...d,asChild:!1,ref:p,className:y("rt-TooltipContent",n)},o.createElement(h,{as:"p",className:"rt-TooltipText",size:"1"},P),o.createElement(t.Arrow,{className:"rt-TooltipArrow"})))))});e.displayName="Tooltip";export{e as Tooltip};
+//# sourceMappingURL=tooltip.js.map

package/dist/esm/components/tooltip.js.map

@@ -0,0 +1,7 @@
+{
+  "version": 3,
+  "sources": ["../../../src/components/tooltip.tsx"],
+  "sourcesContent": ["import * as React from 'react';\nimport classNames from 'classnames';\nimport { Tooltip as TooltipPrimitive } from 'radix-ui';\n\nimport { Text } from './text.js';\nimport { Theme } from './theme.js';\nimport { extractProps } from '../helpers/extract-props.js';\nimport { tooltipPropDefs } from './tooltip.props.js';\n\nimport type { ComponentPropsWithout, RemovedProps } from '../helpers/component-props.js';\nimport type { GetPropDefTypes } from '../props/prop-def.js';\n\ntype TooltipElement = React.ElementRef<typeof TooltipPrimitive.Content>;\ntype TooltipOwnProps = GetPropDefTypes<typeof tooltipPropDefs>;\ninterface TooltipProps\n  extends React.ComponentPropsWithoutRef<typeof TooltipPrimitive.Root>,\n    ComponentPropsWithout<typeof TooltipPrimitive.Content, RemovedProps | 'content'>,\n    TooltipOwnProps {\n  content: React.ReactNode;\n  container?: React.ComponentPropsWithoutRef<typeof TooltipPrimitive.Portal>['container'];\n}\nconst Tooltip = React.forwardRef<TooltipElement, TooltipProps>((props, forwardedRef) => {\n  const {\n    children,\n    className,\n    open,\n    defaultOpen,\n    onOpenChange,\n    delayDuration,\n    disableHoverableContent,\n    content,\n    container,\n    forceMount,\n    ...tooltipContentProps\n  } = extractProps(props, tooltipPropDefs);\n  const rootProps = { open, defaultOpen, onOpenChange, delayDuration, disableHoverableContent };\n  return (\n    <TooltipPrimitive.Root {...rootProps}>\n      <TooltipPrimitive.Trigger asChild>{children}</TooltipPrimitive.Trigger>\n      <TooltipPrimitive.Portal container={container} forceMount={forceMount}>\n        <Theme asChild>\n          <TooltipPrimitive.Content\n            sideOffset={4}\n            collisionPadding={10}\n            {...tooltipContentProps}\n            asChild={false}\n            ref={forwardedRef}\n            className={classNames('rt-TooltipContent', className)}\n          >\n            <Text as=\"p\" className=\"rt-TooltipText\" size=\"1\">\n              {content}\n            </Text>\n            <TooltipPrimitive.Arrow className=\"rt-TooltipArrow\" />\n          </TooltipPrimitive.Content>\n        </Theme>\n      </TooltipPrimitive.Portal>\n    </TooltipPrimitive.Root>\n  );\n});\nTooltip.displayName = 'Tooltip';\n\nexport { Tooltip };\nexport type { TooltipProps };\n"],
+  "mappings": "AAAA,UAAYA,MAAW,QACvB,OAAOC,MAAgB,aACvB,OAAS,WAAWC,MAAwB,WAE5C,OAAS,QAAAC,MAAY,YACrB,OAAS,SAAAC,MAAa,aACtB,OAAS,gBAAAC,MAAoB,8BAC7B,OAAS,mBAAAC,MAAuB,qBAchC,MAAMC,EAAUP,EAAM,WAAyC,CAACQ,EAAOC,IAAiB,CACtF,KAAM,CACJ,SAAAC,EACA,UAAAC,EACA,KAAAC,EACA,YAAAC,EACA,aAAAC,EACA,cAAAC,EACA,wBAAAC,EACA,QAAAC,EACA,UAAAC,EACA,WAAAC,EACA,GAAGC,CACL,EAAIf,EAAaG,EAAOF,CAAe,EACjCe,EAAY,CAAE,KAAAT,EAAM,YAAAC,EAAa,aAAAC,EAAc,cAAAC,EAAe,wBAAAC,CAAwB,EAC5F,OACEhB,EAAA,cAACE,EAAiB,KAAjB,CAAuB,GAAGmB,GACzBrB,EAAA,cAACE,EAAiB,QAAjB,CAAyB,QAAO,IAAEQ,CAAS,EAC5CV,EAAA,cAACE,EAAiB,OAAjB,CAAwB,UAAWgB,EAAW,WAAYC,GACzDnB,EAAA,cAACI,EAAA,CAAM,QAAO,IACZJ,EAAA,cAACE,EAAiB,QAAjB,CACC,WAAY,EACZ,iBAAkB,GACjB,GAAGkB,EACJ,QAAS,GACT,IAAKX,EACL,UAAWR,EAAW,oBAAqBU,CAAS,GAEpDX,EAAA,cAACG,EAAA,CAAK,GAAG,IAAI,UAAU,iBAAiB,KAAK,KAC1Cc,CACH,EACAjB,EAAA,cAACE,EAAiB,MAAjB,CAAuB,UAAU,kBAAkB,CACtD,CACF,CACF,CACF,CAEJ,CAAC,EACDK,EAAQ,YAAc",
+  "names": ["React", "classNames", "TooltipPrimitive", "Text", "Theme", "extractProps", "tooltipPropDefs", "Tooltip", "props", "forwardedRef", "children", "className", "open", "defaultOpen", "onOpenChange", "delayDuration", "disableHoverableContent", "content", "container", "forceMount", "tooltipContentProps", "rootProps"]
+}

package/dist/esm/components/tooltip.props.d.ts

@@ -0,0 +1,31 @@
+import { widthPropDefs } from '../props/width.props.js';
+import type { GetPropDefTypes } from '../props/prop-def.js';
+declare const tooltipPropDefs: {
+    content: {
+        type: "ReactNode";
+        required: true;
+    };
+    width: {
+        type: "string";
+        className: string;
+        customProperties: "--width"[];
+        responsive: true;
+    };
+    minWidth: {
+        type: "string";
+        className: string;
+        customProperties: "--min-width"[];
+        responsive: true;
+    };
+    maxWidth: {
+        default: string;
+        type: "string";
+        className: string;
+        customProperties: "--max-width"[];
+        responsive: true;
+    };
+};
+type TooltipOwnProps = GetPropDefTypes<typeof tooltipPropDefs & typeof widthPropDefs>;
+export { tooltipPropDefs };
+export type { TooltipOwnProps };
+//# sourceMappingURL=tooltip.props.d.ts.map

package/dist/esm/components/tooltip.props.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"tooltip.props.d.ts","sourceRoot":"","sources":["../../../src/components/tooltip.props.tsx"],"names":[],"mappings":"AAAA,OAAO,EAAE,aAAa,EAAE,MAAM,yBAAyB,CAAC;AAExD,OAAO,KAAK,EAAW,eAAe,EAAE,MAAM,sBAAsB,CAAC;AAErE,QAAA,MAAM,eAAe;;;;;;;;;;;;;;;;;;;;;;;;CAUpB,CAAC;AAEF,KAAK,eAAe,GAAG,eAAe,CAAC,OAAO,eAAe,GAAG,OAAO,aAAa,CAAC,CAAC;AAEtF,OAAO,EAAE,eAAe,EAAE,CAAC;AAC3B,YAAY,EAAE,eAAe,EAAE,CAAC"}

package/dist/esm/components/tooltip.props.js

@@ -0,0 +1,2 @@
+import{widthPropDefs as t}from"../props/width.props.js";const e={content:{type:"ReactNode",required:!0},width:t.width,minWidth:t.minWidth,maxWidth:{...t.maxWidth,default:"360px"}};export{e as tooltipPropDefs};
+//# sourceMappingURL=tooltip.props.js.map

package/dist/esm/components/tooltip.props.js.map

@@ -0,0 +1,7 @@
+{
+  "version": 3,
+  "sources": ["../../../src/components/tooltip.props.tsx"],
+  "sourcesContent": ["import { widthPropDefs } from '../props/width.props.js';\n\nimport type { PropDef, GetPropDefTypes } from '../props/prop-def.js';\n\nconst tooltipPropDefs = {\n  content: { type: 'ReactNode', required: true },\n  width: widthPropDefs.width,\n  minWidth: widthPropDefs.minWidth,\n  maxWidth: { ...widthPropDefs.maxWidth, default: '360px' },\n} satisfies {\n  width: PropDef<string>;\n  minWidth: PropDef<string>;\n  maxWidth: PropDef<string>;\n  content: PropDef<React.ReactNode>;\n};\n\ntype TooltipOwnProps = GetPropDefTypes<typeof tooltipPropDefs & typeof widthPropDefs>;\n\nexport { tooltipPropDefs };\nexport type { TooltipOwnProps };\n"],
+  "mappings": "AAAA,OAAS,iBAAAA,MAAqB,0BAI9B,MAAMC,EAAkB,CACtB,QAAS,CAAE,KAAM,YAAa,SAAU,EAAK,EAC7C,MAAOD,EAAc,MACrB,SAAUA,EAAc,SACxB,SAAU,CAAE,GAAGA,EAAc,SAAU,QAAS,OAAQ,CAC1D",
+  "names": ["widthPropDefs", "tooltipPropDefs"]
+}

package/dist/esm/components/visually-hidden.d.ts

@@ -0,0 +1,5 @@
+import { VisuallyHidden as VisuallyHiddenPrimitive } from 'radix-ui';
+export declare const VisuallyHidden: import("react").ForwardRefExoticComponent<VisuallyHiddenPrimitive.VisuallyHiddenProps & import("react").RefAttributes<HTMLSpanElement>>;
+export declare const Root: import("react").ForwardRefExoticComponent<VisuallyHiddenPrimitive.VisuallyHiddenProps & import("react").RefAttributes<HTMLSpanElement>>;
+export type VisuallyHiddenProps = VisuallyHiddenPrimitive.VisuallyHiddenProps;
+//# sourceMappingURL=visually-hidden.d.ts.map

package/dist/esm/components/visually-hidden.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"visually-hidden.d.ts","sourceRoot":"","sources":["../../../src/components/visually-hidden.tsx"],"names":[],"mappings":"AAAA,OAAO,EAAE,cAAc,IAAI,uBAAuB,EAAE,MAAM,UAAU,CAAC;AACrE,eAAO,MAAM,cAAc,yIAA+B,CAAC;AAC3D,eAAO,MAAM,IAAI,yIAA+B,CAAC;AACjD,MAAM,MAAM,mBAAmB,GAAG,uBAAuB,CAAC,mBAAmB,CAAC"}

package/dist/esm/components/visually-hidden.js

@@ -0,0 +1,2 @@
+import{VisuallyHidden as i}from"radix-ui";const d=i.Root,e=i.Root;export{e as Root,d as VisuallyHidden};
+//# sourceMappingURL=visually-hidden.js.map

package/dist/esm/components/visually-hidden.js.map

@@ -0,0 +1,7 @@
+{
+  "version": 3,
+  "sources": ["../../../src/components/visually-hidden.tsx"],
+  "sourcesContent": ["import { VisuallyHidden as VisuallyHiddenPrimitive } from 'radix-ui';\nexport const VisuallyHidden = VisuallyHiddenPrimitive.Root;\nexport const Root = VisuallyHiddenPrimitive.Root;\nexport type VisuallyHiddenProps = VisuallyHiddenPrimitive.VisuallyHiddenProps;\n"],
+  "mappings": "AAAA,OAAS,kBAAkBA,MAA+B,WACnD,MAAMC,EAAiBD,EAAwB,KACzCE,EAAOF,EAAwB",
+  "names": ["VisuallyHiddenPrimitive", "VisuallyHidden", "Root"]
+}

package/dist/esm/helpers/component-props.d.ts

@@ -0,0 +1,8 @@
+import type React from 'react';
+type ComponentPropsAs<C extends React.ElementType<any>, T extends React.ComponentPropsWithoutRef<C>['as']> = Omit<Extract<React.ComponentPropsWithoutRef<C>, {
+    as: T;
+}>, 'as' | 'asChild'>;
+type ComponentPropsWithout<T extends React.ElementType, O extends Omit<string, keyof React.ComponentPropsWithoutRef<T>> | keyof React.ComponentPropsWithoutRef<T>> = Omit<React.ComponentPropsWithoutRef<T>, O & string>;
+type RemovedProps = 'asChild' | 'defaultChecked' | 'defaultValue' | 'color';
+export type { ComponentPropsAs, ComponentPropsWithout, RemovedProps };
+//# sourceMappingURL=component-props.d.ts.map

package/dist/esm/helpers/component-props.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"component-props.d.ts","sourceRoot":"","sources":["../../../src/helpers/component-props.ts"],"names":[],"mappings":"AAAA,OAAO,KAAK,KAAK,MAAM,OAAO,CAAC;AAE/B,KAAK,gBAAgB,CACnB,CAAC,SAAS,KAAK,CAAC,WAAW,CAAC,GAAG,CAAC,EAChC,CAAC,SAAS,KAAK,CAAC,wBAAwB,CAAC,CAAC,CAAC,CAAC,IAAI,CAAC,IAC/C,IAAI,CAAC,OAAO,CAAC,KAAK,CAAC,wBAAwB,CAAC,CAAC,CAAC,EAAE;IAAE,EAAE,EAAE,CAAC,CAAA;CAAE,CAAC,EAAE,IAAI,GAAG,SAAS,CAAC,CAAC;AAIlF,KAAK,qBAAqB,CACxB,CAAC,SAAS,KAAK,CAAC,WAAW,EAC3B,CAAC,SACG,IAAI,CAAC,MAAM,EAAE,MAAM,KAAK,CAAC,wBAAwB,CAAC,CAAC,CAAC,CAAC,GACrD,MAAM,KAAK,CAAC,wBAAwB,CAAC,CAAC,CAAC,IACzC,IAAI,CAAC,KAAK,CAAC,wBAAwB,CAAC,CAAC,CAAC,EAAE,CAAC,GAAG,MAAM,CAAC,CAAC;AAExD,KAAK,YAAY,GAAG,SAAS,GAAG,gBAAgB,GAAG,cAAc,GAAG,OAAO,CAAC;AAE5E,YAAY,EAAE,gBAAgB,EAAE,qBAAqB,EAAE,YAAY,EAAE,CAAC"}

package/dist/esm/helpers/component-props.js

@@ -0,0 +1 @@
+//# sourceMappingURL=component-props.js.map

package/dist/esm/helpers/component-props.js.map

@@ -0,0 +1,7 @@
+{
+  "version": 3,
+  "sources": [],
+  "sourcesContent": [],
+  "mappings": "",
+  "names": []
+}

package/dist/esm/helpers/extract-margin-props.d.ts

@@ -0,0 +1,12 @@
+import type { MarginProps } from '../props/margin.props.js';
+export declare function extractMarginProps<T extends MarginProps>(props: T): {
+    m: import("../props/prop-def.js").Responsive<import("../props/prop-def.js").Union<string, "0" | "1" | "2" | "3" | "4" | "5" | "6" | "7" | "8" | "9" | "-1" | "-2" | "-3" | "-4" | "-5" | "-6" | "-7" | "-8" | "-9">> | undefined;
+    mx: import("../props/prop-def.js").Responsive<import("../props/prop-def.js").Union<string, "0" | "1" | "2" | "3" | "4" | "5" | "6" | "7" | "8" | "9" | "-1" | "-2" | "-3" | "-4" | "-5" | "-6" | "-7" | "-8" | "-9">> | undefined;
+    my: import("../props/prop-def.js").Responsive<import("../props/prop-def.js").Union<string, "0" | "1" | "2" | "3" | "4" | "5" | "6" | "7" | "8" | "9" | "-1" | "-2" | "-3" | "-4" | "-5" | "-6" | "-7" | "-8" | "-9">> | undefined;
+    mt: import("../props/prop-def.js").Responsive<import("../props/prop-def.js").Union<string, "0" | "1" | "2" | "3" | "4" | "5" | "6" | "7" | "8" | "9" | "-1" | "-2" | "-3" | "-4" | "-5" | "-6" | "-7" | "-8" | "-9">> | undefined;
+    mr: import("../props/prop-def.js").Responsive<import("../props/prop-def.js").Union<string, "0" | "1" | "2" | "3" | "4" | "5" | "6" | "7" | "8" | "9" | "-1" | "-2" | "-3" | "-4" | "-5" | "-6" | "-7" | "-8" | "-9">> | undefined;
+    mb: import("../props/prop-def.js").Responsive<import("../props/prop-def.js").Union<string, "0" | "1" | "2" | "3" | "4" | "5" | "6" | "7" | "8" | "9" | "-1" | "-2" | "-3" | "-4" | "-5" | "-6" | "-7" | "-8" | "-9">> | undefined;
+    ml: import("../props/prop-def.js").Responsive<import("../props/prop-def.js").Union<string, "0" | "1" | "2" | "3" | "4" | "5" | "6" | "7" | "8" | "9" | "-1" | "-2" | "-3" | "-4" | "-5" | "-6" | "-7" | "-8" | "-9">> | undefined;
+    rest: Omit<T, "m" | "ml" | "mr" | "mt" | "mb" | "mx" | "my">;
+};
+//# sourceMappingURL=extract-margin-props.d.ts.map

package/dist/esm/helpers/extract-margin-props.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"extract-margin-props.d.ts","sourceRoot":"","sources":["../../../src/helpers/extract-margin-props.ts"],"names":[],"mappings":"AAAA,OAAO,KAAK,EAAE,WAAW,EAAE,MAAM,0BAA0B,CAAC;AAE5D,wBAAgB,kBAAkB,CAAC,CAAC,SAAS,WAAW,EAAE,KAAK,EAAE,CAAC;;;;;;;;;EAGjE"}

package/dist/esm/helpers/extract-margin-props.js

@@ -0,0 +1,2 @@
+function a(r){const{m:t,mx:m,my:o,mt:p,mr:n,mb:s,ml:e,...i}=r;return{m:t,mx:m,my:o,mt:p,mr:n,mb:s,ml:e,rest:i}}export{a as extractMarginProps};
+//# sourceMappingURL=extract-margin-props.js.map