@accelint/design-toolkit 7.0.1 → 8.1.0

package/dist/components/drawer/menu-item.d.ts

@@ -5,15 +5,11 @@ import '@accelint/core';
 import '@react-types/shared';
 import 'react';
 import 'react-aria-components';
-import 'tailwind-variants';
 import '../../lib/types.js';
 import '../button/types.js';
-import '../button/styles.js';
-import 'tailwind-merge';
 import '../view-stack/types.js';
 import '../view-stack/events.js';
 import './events.js';
-import './styles.js';
 
 declare function DrawerMenuItem({ for: id, children, classNames, toggle, textValue, ...rest }: DrawerMenuItemProps): react_jsx_runtime.JSX.Element | null;
 

package/dist/components/drawer/menu-item.js

@@ -1,4 +1,4 @@
 'use client';
 
-import {jsxs,jsx}from'react/jsx-runtime';import'client-only';import {useContext,useRef}from'react';import {composeRenderProps}from'react-aria-components';import {ToggleButton}from'../button/toggle.js';import {Icon}from'../icon/index.js';import {Tooltip}from'../tooltip/index.js';import {TooltipTrigger}from'../tooltip/trigger.js';import {ViewStackContext}from'../view-stack/context.js';import {DrawerContext}from'./context.js';import {DrawerMenuStyles}from'./styles.js';import {DrawerTrigger}from'./trigger.js';const{item:y}=DrawerMenuStyles(),C={left:"right",right:"left",top:"bottom",bottom:"top"};function F({for:o,children:l,classNames:n,toggle:f,textValue:c,...s}){const{parent:a,stack:e}=useContext(ViewStackContext),{placement:g}=useContext(DrawerContext),u=e.at(-1),T=f?"toggle":"open",i=useRef(null);return a?jsxs(TooltipTrigger,{children:[jsx(DrawerTrigger,{for:`${T}:${o}`,children:jsx(ToggleButton,{...s,ref:i,className:composeRenderProps(n?.item,r=>y({className:r})),role:"tab",variant:"icon",isSelected:o===u||e.length>1&&e.includes(o),children:composeRenderProps(l,r=>jsx(Icon,{children:r}))})}),jsx(Tooltip,{triggerRef:i,placement:C[g],offset:6,className:n?.tooltip,children:c})]}):null}export{F as DrawerMenuItem};//# sourceMappingURL=menu-item.js.map
+import {jsxs,jsx}from'react/jsx-runtime';import'client-only';import {clsx}from'@accelint/design-foundation/lib/utils';import {useContext,useRef}from'react';import {composeRenderProps}from'react-aria-components';import {ToggleButton}from'../button/toggle.js';import {Icon}from'../icon/index.js';import {Tooltip}from'../tooltip/index.js';import {TooltipTrigger}from'../tooltip/trigger.js';import {ViewStackContext}from'../view-stack/context.js';import {DrawerContext}from'./context.js';import h from'./styles.module.css';import {DrawerTrigger}from'./trigger.js';const C={left:"right",right:"left",top:"bottom",bottom:"top"};function G({for:t,children:l,classNames:i,toggle:c,textValue:f,...s}){const{parent:a,stack:r}=useContext(ViewStackContext),{placement:g}=useContext(DrawerContext),u=r.at(-1),T=c?"toggle":"open",m=useRef(null);return a?jsxs(TooltipTrigger,{children:[jsx(DrawerTrigger,{for:`${T}:${t}`,children:jsx(ToggleButton,{ref:m,className:composeRenderProps(i?.item,e=>clsx(h.item,e)),color:"accent",role:"tab",variant:"icon",isSelected:t===u||r.length>1&&r.includes(t),...s,children:composeRenderProps(l,e=>jsx(Icon,{children:e}))})}),jsx(Tooltip,{triggerRef:m,placement:C[g],offset:6,className:i?.tooltip,children:f})]}):null}export{G as DrawerMenuItem};//# sourceMappingURL=menu-item.js.map
 //# sourceMappingURL=menu-item.js.map

package/dist/components/drawer/menu-item.js.map

@@ -1 +1 @@
-{"version":3,"sources":["../../../src/components/drawer/menu-item.tsx"],"names":["h","DrawerMenuItem","id","textValue","parent","useContext","placement","view","stack","action","m","R","b","jsxs","TooltipTrigger","DrawerTrigger","S","jsx","ToggleButton","tooltipRef","x","composeRenderProps","classNames","t","D","className","p","children","Icon","Tooltip","I","M"],"mappings":"+fA+BS,UACF,CAAA,CAAA,CAAA,CAAAA,gBAAA,EACL,CAAA,CAAA,CAAA,CAAA,YAGK,CAAA,KAASC,CAAAA,MACTC,CAAAA,YAEL,CAAA,MAAA,CAAA,KACA,CAAA,CAAA,iBACAC,CAAAA,QAGA,aAAQC,EAAQ,CAAA,MAAM,EAAIC,CAAAA,SAClB,CAAA,CAAA,CAAA,GAAAC,CAAU,EAAID,CAAAA,KAChBE,CAAOC,MAAS,CAAE,CAAA,CAClBC,KAAkB,CAAA,CAAA,CAAA,CAAAC,UAAA,CAAAC,gBAAA,CAAW,WACT,IAAID,UAAA,CAE9BE,aAAA,CAAA,CAAA,CAAA,CAAA,CAAA,CAAKR,EAKHS,CAAAA,EAACC,CAAA,CACC,CAAA,CAAA,CAAA,CAAA,QAACC,OAAmB,GAAGN,MAAM,CAAA,IAAM,CAAA,CAAA,OACjC,CAAA,CAAAO,IAAAC,eAACC,CAAAA,CAAA,QAEC,CAAA,CAAKC,IACLC,aAAA,CAAA,CAAA,GAAA,CAAA,CAAA,EAAWC,CAAAA,CAAmBC,GAAY,CAAA,CAAA,CAAA,CAAA,QACjC,CAAAC,GAAA,CAAAC,YAAA,CAAA,CAAA,GAAAC,CAAU,CAAC,GAEpB,YACA,CAAAC,kBAAA,CAAA,CAAA,EAAA,QACA,CAAA,CAAA,CAAA,SAAYxB,CAAAA,CAAAA,CAAOK,GAASC,IAAM,CAAA,aAAoB,CAAA,MAAW,CAEhE,WAAmBmB,CAAAA,GAAWA,CAC7BV,EAACW,CAAAA,CAAA,MAAM,CAAA,CAAA,EAAAD,EAAS,QAItBV,CAACY,EAAA,CACC,QAAA,CAAAH,kBAAA,CAAYP,EACZ,CAAA,EAAAI,GAAA,CAAAO,IAAA,CAAA,CAAA,QACA,CAAA,CAAA,CAAA,CAAA,CAAA,CAAQ,EACR,CAAA,CAAAP,GAAA,CAAAQ,OAAA,CAAA,CAAA,sBAEC,CAAA5B,CAAAA,CACH,CAAA,CAAA,CACF,MAEJ,CAAA,CAAA,CAAA,SAAA,CAAA,CAAA,EAAA,OAAA,CAAA,QAAA,CAAA,CAAA,CAAA,CAAA,CAAA,CAAA,CAAA,CAAA,IAAA","file":"menu-item.js","sourcesContent":["/*\n * Copyright 2025 Hypergiant Galactic Systems Inc. All rights reserved.\n * This file is licensed to you under the Apache License, Version 2.0 (the \"License\");\n * you may not use this file except in compliance with the License. You may obtain a copy\n * of the License at https://www.apache.org/licenses/LICENSE-2.0\n *\n * Unless required by applicable law or agreed to in writing, software distributed under\n * the License is distributed on an \"AS IS\" BASIS, WITHOUT WARRANTIES OR REPRESENTATIONS\n * OF ANY KIND, either express or implied. See the License for the specific language\n * governing permissions and limitations under the License.\n */\n\n'use client';\n\nimport 'client-only';\nimport { useContext, useRef } from 'react';\nimport { composeRenderProps } from 'react-aria-components';\nimport { ToggleButton } from '../button/toggle';\nimport { Icon } from '../icon';\nimport { Tooltip } from '../tooltip';\nimport { TooltipTrigger } from '../tooltip/trigger';\nimport { ViewStackContext } from '../view-stack/context';\nimport { DrawerContext } from './context';\nimport { DrawerMenuStyles } from './styles';\nimport { DrawerTrigger } from './trigger';\nimport type { DrawerMenuItemProps } from './types';\n\nconst { item } = DrawerMenuStyles();\n\nconst tooltipPlacementMap = {\n  left: 'right',\n  right: 'left',\n  top: 'bottom',\n  bottom: 'top',\n} as const;\n\nexport function DrawerMenuItem({\n  for: id,\n  children,\n  classNames,\n  toggle,\n  textValue,\n  ...rest\n}: DrawerMenuItemProps) {\n  const { parent, stack } = useContext(ViewStackContext);\n  const { placement } = useContext(DrawerContext);\n  const view = stack.at(-1);\n  const action = toggle ? 'toggle' : 'open';\n  const tooltipRef = useRef(null);\n\n  if (!parent) {\n    return null;\n  }\n\n  return (\n    <TooltipTrigger>\n      <DrawerTrigger for={`${action}:${id}`}>\n        <ToggleButton\n          {...rest}\n          ref={tooltipRef}\n          className={composeRenderProps(classNames?.item, (className) =>\n            item({ className }),\n          )}\n          role='tab'\n          variant='icon'\n          isSelected={id === view || (stack.length > 1 && stack.includes(id))}\n        >\n          {composeRenderProps(children, (children) => (\n            <Icon>{children}</Icon>\n          ))}\n        </ToggleButton>\n      </DrawerTrigger>\n      <Tooltip\n        triggerRef={tooltipRef}\n        placement={tooltipPlacementMap[placement]}\n        offset={6}\n        className={classNames?.tooltip}\n      >\n        {textValue}\n      </Tooltip>\n    </TooltipTrigger>\n  );\n}\n"]}
+{"version":3,"sources":["../../../src/components/drawer/menu-item.tsx"],"names":["children","classNames","parent","stack","placement","toggle","tooltipRef","useRef","n","b","jsxs","TooltipTrigger","jsx","D","id","o","composeRenderProps","className","p","w","view","Icon","Tooltip","x","M","textValue"],"mappings":"gjBA+BO,MAAA,CACL,CAAA,CAAA,IAAA,CAAQ,OAGH,CAAA,KAAA,CAAA,MACL,CAAA,IACA,QAAA,CAAAA,aACAC,CAAAA,UAEA,CAAA,CAAA,GAAA,CAAA,CAAA,CAAA,QAEF,CAAA,CAAwB,CACtB,aAAQC,MAAQ,CAAA,CAAAC,CAAM,SACd,CAAA,CAAA,CAAA,GAAA,CAAA,CAAA,CAAAC,CAAU,KAA4B,CAAA,MAC3B,CAAA,CAAG,CAAA,KACPC,CAAAA,CAAS,yCAClBC,CAAaC,EAAO,CAAAC,UAAA,CAAAC,aAAI,CAAA,CAE9B,OAAKP,EAKHQ,CAAAA,CAACC,EAAA,CACC,CAAA,QAAA,CAAAC,SAAoBC,MAAA,CAAA,MAAaC,6BAC/BF,CAAAA,QACON,CAAAA,CACLS,wBAAWC,EAAmBf,CAAAA,CAAAA,CAAY,KAAOgB,CAAAA,QACnC,CAAAF,GAAA,CAAME,YAAS,CAC7B,CAAA,GACA,CAAA,CAAA,CAAA,SAAM,CACNC,sBAAK,IAAA,CAAA,CACL,EAAAC,IAAA,CAAA,CAAA,CAAA,SACA,KAAA,CAAA,QAAYL,CAAOM,IAASjB,CAAM,KAAA,CAAA,OAAoB,CAAA,MAAA,CAASW,UAG9D,CAAA,CAAA,GAAA,CAAA,EAAAE,CAAmBhB,OACjBqB,EAAA,EAAM,CAAA,CAAA,QAAS,CACjB,CAAA,CACH,IAEFT,CAAAA,CAACU,QACC,CAAAJ,kBAAA,CAAA,CAAA,CAAA,CAAYZ,EACZS,GAAA,CAAAQ,IAAA,CAAA,CAAA,QAAwC,CAAA,CACxC,CAAA,CAAA,CAAA,CAAA,CAAA,CAAA,CAAQ,IACR,CAAAC,OAAA,CAAA,CAAA,sBAEC,CAAA,CAAA,CAAA,CAAAC,CAAAA,CACH,MA7BK,CAAA,CAAA,CAgCX,SAAA,CAAA,CAAA,EAAA,OAAA,CAAA,QAAA,CAAA,CAAA,CAAA,CAAA,CAAA,CAAA,CAAA,CAAA,IAAA","file":"menu-item.js","sourcesContent":["/*\n * Copyright 2025 Hypergiant Galactic Systems Inc. All rights reserved.\n * This file is licensed to you under the Apache License, Version 2.0 (the \"License\");\n * you may not use this file except in compliance with the License. You may obtain a copy\n * of the License at https://www.apache.org/licenses/LICENSE-2.0\n *\n * Unless required by applicable law or agreed to in writing, software distributed under\n * the License is distributed on an \"AS IS\" BASIS, WITHOUT WARRANTIES OR REPRESENTATIONS\n * OF ANY KIND, either express or implied. See the License for the specific language\n * governing permissions and limitations under the License.\n */\n\n'use client';\n\nimport 'client-only';\nimport { clsx } from '@accelint/design-foundation/lib/utils';\nimport { useContext, useRef } from 'react';\nimport { composeRenderProps } from 'react-aria-components';\nimport { ToggleButton } from '../button/toggle';\nimport { Icon } from '../icon';\nimport { Tooltip } from '../tooltip';\nimport { TooltipTrigger } from '../tooltip/trigger';\nimport { ViewStackContext } from '../view-stack/context';\nimport { DrawerContext } from './context';\nimport styles from './styles.module.css';\nimport { DrawerTrigger } from './trigger';\nimport type { DrawerMenuItemProps } from './types';\n\nconst tooltipPlacementMap = {\n  left: 'right',\n  right: 'left',\n  top: 'bottom',\n  bottom: 'top',\n} as const;\n\nexport function DrawerMenuItem({\n  for: id,\n  children,\n  classNames,\n  toggle,\n  textValue,\n  ...rest\n}: DrawerMenuItemProps) {\n  const { parent, stack } = useContext(ViewStackContext);\n  const { placement } = useContext(DrawerContext);\n  const view = stack.at(-1);\n  const action = toggle ? 'toggle' : 'open';\n  const tooltipRef = useRef(null);\n\n  if (!parent) {\n    return null;\n  }\n\n  return (\n    <TooltipTrigger>\n      <DrawerTrigger for={`${action}:${id}`}>\n        <ToggleButton\n          ref={tooltipRef}\n          className={composeRenderProps(classNames?.item, (className) =>\n            clsx(styles.item, className),\n          )}\n          color='accent'\n          role='tab'\n          variant='icon'\n          isSelected={id === view || (stack.length > 1 && stack.includes(id))}\n          {...rest}\n        >\n          {composeRenderProps(children, (children) => (\n            <Icon>{children}</Icon>\n          ))}\n        </ToggleButton>\n      </DrawerTrigger>\n      <Tooltip\n        triggerRef={tooltipRef}\n        placement={tooltipPlacementMap[placement]}\n        offset={6}\n        className={classNames?.tooltip}\n      >\n        {textValue}\n      </Tooltip>\n    </TooltipTrigger>\n  );\n}\n"]}

package/dist/components/drawer/menu.d.ts

@@ -5,15 +5,11 @@ import '@accelint/core';
 import '@react-types/shared';
 import 'react';
 import 'react-aria-components';
-import 'tailwind-variants';
 import '../../lib/types.js';
 import '../button/types.js';
-import '../button/styles.js';
-import 'tailwind-merge';
 import '../view-stack/types.js';
 import '../view-stack/events.js';
 import './events.js';
-import './styles.js';
 
 declare function DrawerMenu({ className, position, children, ...rest }: DrawerMenuProps): react_jsx_runtime.JSX.Element;
 

package/dist/components/drawer/menu.js

@@ -1,4 +1,2 @@
-'use client';
-
-import {jsx}from'react/jsx-runtime';import'client-only';import {DrawerMenuStyles}from'./styles.js';const{menu:p}=DrawerMenuStyles();function m({className:e,position:r="center",children:n,...o}){return jsx("nav",{...o,className:p({position:r,className:e}),children:n})}export{m as DrawerMenu};//# sourceMappingURL=menu.js.map
+import {jsx}from'react/jsx-runtime';import {clsx}from'@accelint/design-foundation/lib/utils';import r from'./styles.module.css';function u({className:e,position:o="center",children:n,...p}){return jsx("nav",{...p,className:clsx(r.menu,r[o],e),children:n})}export{u as DrawerMenu};//# sourceMappingURL=menu.js.map
 //# sourceMappingURL=menu.js.map

package/dist/components/drawer/menu.js.map

@@ -1 +1 @@
-{"version":3,"sources":["../../../src/components/drawer/menu.tsx"],"names":["DrawerMenuStyles","t","rest"],"mappings":"mGAiBA,UAAiBA,EAAiB,CAAA,CAE3BC,gBAAA,EAAA,CAAA,SACL,CAAA,CAAA,CAAA,SACA,CAAA,CAAA,CAAA,mBACA,CAAA,UACGC,CACL,GACE,CAAA,CAAA,CAAA,CAAA,gBAEK,CAAGA,CAAAA,cAEF,YACA,CAAA,CAAA,CAAA,SACD,CAEA,CAAA,CAAA,CAAA,CAAA,QAGP,CAAA,CAAA,CAAA,CAAA","file":"menu.js","sourcesContent":["/*\n * Copyright 2025 Hypergiant Galactic Systems Inc. All rights reserved.\n * This file is licensed to you under the Apache License, Version 2.0 (the \"License\");\n * you may not use this file except in compliance with the License. You may obtain a copy\n * of the License at https://www.apache.org/licenses/LICENSE-2.0\n *\n * Unless required by applicable law or agreed to in writing, software distributed under\n * the License is distributed on an \"AS IS\" BASIS, WITHOUT WARRANTIES OR REPRESENTATIONS\n * OF ANY KIND, either express or implied. See the License for the specific language\n * governing permissions and limitations under the License.\n */\n'use client';\n\nimport 'client-only';\nimport { DrawerMenuStyles } from './styles';\nimport type { DrawerMenuProps } from './types';\n\nconst { menu } = DrawerMenuStyles();\n\nexport function DrawerMenu({\n  className,\n  position = 'center',\n  children,\n  ...rest\n}: DrawerMenuProps) {\n  return (\n    <nav\n      {...rest}\n      className={menu({\n        position,\n        className,\n      })}\n    >\n      {children}\n    </nav>\n  );\n}\n"]}
+{"version":3,"sources":["../../../src/components/drawer/menu.tsx"],"names":["className","position","children","clsx","styles"],"mappings":"gIAeO,UAAoB,CACzB,CAAA,SAAAA,EACA,CAAA,QAAAC,CAAAA,CAAW,SACX,CAAA,QAAAC,CAAAA,CACA,CAAA,GACF,EAAoB,CAClB,CAAA,UACG,CAAA,KAAA,CAAK,CAAA,IAAS,CAAA,SAAWC,CAAAA,IAAKC,CAAAA,CAAO,CAAA,IAAMA,EAAOH,CAAQ,CAAA,CAAGD,CAAS,CAAA,CACpE,CAAA,QAAAE,EACH,CAEJ,CAAA","file":"menu.js","sourcesContent":["/*\n * Copyright 2025 Hypergiant Galactic Systems Inc. All rights reserved.\n * This file is licensed to you under the Apache License, Version 2.0 (the \"License\");\n * you may not use this file except in compliance with the License. You may obtain a copy\n * of the License at https://www.apache.org/licenses/LICENSE-2.0\n *\n * Unless required by applicable law or agreed to in writing, software distributed under\n * the License is distributed on an \"AS IS\" BASIS, WITHOUT WARRANTIES OR REPRESENTATIONS\n * OF ANY KIND, either express or implied. See the License for the specific language\n * governing permissions and limitations under the License.\n */\nimport { clsx } from '@accelint/design-foundation/lib/utils';\nimport styles from './styles.module.css';\nimport type { DrawerMenuProps } from './types';\n\nexport function DrawerMenu({\n  className,\n  position = 'center',\n  children,\n  ...rest\n}: DrawerMenuProps) {\n  return (\n    <nav {...rest} className={clsx(styles.menu, styles[position], className)}>\n      {children}\n    </nav>\n  );\n}\n"]}

package/dist/components/drawer/panel.js

@@ -1,4 +1,2 @@
-'use client';
-
-import {jsx}from'react/jsx-runtime';import'client-only';import {DrawerStyles}from'./styles.js';const{panel:t}=DrawerStyles();function m({className:e,...o}){return jsx("div",{...o,className:t({className:e})})}export{m as DrawerPanel};//# sourceMappingURL=panel.js.map
+import {jsx}from'react/jsx-runtime';import {clsx}from'@accelint/design-foundation/lib/utils';import t from'./styles.module.css';function i({className:o,...r}){return jsx("div",{...r,className:clsx(t.panel,o)})}export{i as DrawerPanel};//# sourceMappingURL=panel.js.map
 //# sourceMappingURL=panel.js.map

package/dist/components/drawer/panel.js.map

@@ -1 +1 @@
-{"version":3,"sources":["../../../src/components/drawer/panel.tsx"],"names":["DrawerStyles","r","rest","n"],"mappings":"+FAiBA,WAAkBA,CAAAA,CAAa,CAAA,CAExBC,wBACL,CAAA,CAAA,CAAA,WACGC,CACL,GACE,CAAA,CAAA,CAAA,CAAA,OAAQC,GAAA,CAAA,KAAK,CAAGD,CAAAA,GAAM,CAAA,CAAA,SAAmB,CAAA,CAAA,CAAA,CAAA,UAAc,CACzD,CAAA,CAAA,CAAA,CAAA","file":"panel.js","sourcesContent":["/*\n * Copyright 2025 Hypergiant Galactic Systems Inc. All rights reserved.\n * This file is licensed to you under the Apache License, Version 2.0 (the \"License\");\n * you may not use this file except in compliance with the License. You may obtain a copy\n * of the License at https://www.apache.org/licenses/LICENSE-2.0\n *\n * Unless required by applicable law or agreed to in writing, software distributed under\n * the License is distributed on an \"AS IS\" BASIS, WITHOUT WARRANTIES OR REPRESENTATIONS\n * OF ANY KIND, either express or implied. See the License for the specific language\n * governing permissions and limitations under the License.\n */\n'use client';\n\nimport 'client-only';\nimport { DrawerStyles } from './styles';\nimport type { ComponentPropsWithRef } from 'react';\n\nconst { panel } = DrawerStyles();\n\nexport function DrawerPanel({\n  className,\n  ...rest\n}: ComponentPropsWithRef<'div'>) {\n  return <div {...rest} className={panel({ className })} />;\n}\n"]}
+{"version":3,"sources":["../../../src/components/drawer/panel.tsx"],"names":["DrawerPanel","className","jsx","rest","clsx","styles"],"mappings":"gIAeO,SAASA,CAAY,CAC1B,CAAA,SAAAC,CAAAA,CACA,CAAA,GACF,CAAA,CAAiC,CAC/B,CAAA,OAAOC,GAAC,CAAA,KAAA,CAAK,CAAA,GAAGC,CAAM,CAAA,SAAWC,CAAAA,IAAKC,CAAAA,CAAO,CAAA,KAAOJ,CAAS,EAAG,CAClE,CAAA","file":"panel.js","sourcesContent":["/*\n * Copyright 2025 Hypergiant Galactic Systems Inc. All rights reserved.\n * This file is licensed to you under the Apache License, Version 2.0 (the \"License\");\n * you may not use this file except in compliance with the License. You may obtain a copy\n * of the License at https://www.apache.org/licenses/LICENSE-2.0\n *\n * Unless required by applicable law or agreed to in writing, software distributed under\n * the License is distributed on an \"AS IS\" BASIS, WITHOUT WARRANTIES OR REPRESENTATIONS\n * OF ANY KIND, either express or implied. See the License for the specific language\n * governing permissions and limitations under the License.\n */\nimport { clsx } from '@accelint/design-foundation/lib/utils';\nimport styles from './styles.module.css';\nimport type { ComponentPropsWithRef } from 'react';\n\nexport function DrawerPanel({\n  className,\n  ...rest\n}: ComponentPropsWithRef<'div'>) {\n  return <div {...rest} className={clsx(styles.panel, className)} />;\n}\n"]}

package/dist/components/drawer/styles.module.css

@@ -0,0 +1,304 @@
+/*
+ * Copyright 2025 Hypergiant Galactic Systems Inc. All rights reserved.
+ * This file is licensed to you under the Apache License, Version 2.0 (the "License");
+ * you may not use this file except in compliance with the License. You may obtain a copy
+ * of the License at https://www.apache.org/licenses/LICENSE-2.0
+ *
+ * Unless required by applicable law or agreed to in writing, software distributed under
+ * the License is distributed on an "AS IS" BASIS, WITHOUT WARRANTIES OR REPRESENTATIONS
+ * OF ANY KIND, either express or implied. See the License for the specific language
+ * governing permissions and limitations under the License.
+ */
+
+@reference '../../index.module.css';
+
+@layer components.l1 {
+  .layout {
+    --drawer-menu-size: 40px;
+    --drawer-size-small: 100px;
+    --drawer-size-medium: 200px;
+    --drawer-size-large: 400px;
+
+    --drawer-main-row-start: 1;
+    --drawer-main-col-end: 4;
+    --drawer-main-row-end: 4;
+    --drawer-main-col-start: 1;
+
+    --drawer-main-cols: var(--drawer-main-col-start) /
+      var(--drawer-main-col-end);
+    --drawer-main-rows: var(--drawer-main-row-start) /
+      var(--drawer-main-row-end);
+
+    @apply relative grid h-full w-full;
+    grid-template-columns: auto 1fr auto;
+    grid-template-rows: auto 1fr auto;
+
+    @variant push-top {
+      --drawer-main-row-start: 2;
+    }
+
+    @variant push-right {
+      --drawer-main-col-end: 3;
+    }
+
+    @variant push-bottom {
+      --drawer-main-row-end: 3;
+    }
+
+    @variant push-left {
+      --drawer-main-col-start: 2;
+    }
+
+    @variant has-[.group\/sidenav] {
+      --drawer-main-col-start: 2;
+    }
+  }
+
+  .main {
+    @apply relative col-(--drawer-main-cols) row-(--drawer-main-rows);
+  }
+
+  .drawer {
+    @apply bg-surface-default text-body-m pointer-events-none relative flex flex-col;
+
+    @variant placement-top {
+      @apply col-span-full row-start-1 row-end-2;
+
+      @variant group-extend-right/layout {
+        @apply col-end-3;
+      }
+
+      @variant group-extend-left/layout {
+        @apply col-start-2;
+      }
+
+      @variant group-data-[extend=bottom]/layout {
+        @apply col-start-2 col-end-3;
+      }
+    }
+
+    @variant placement-right {
+      @apply col-start-3 col-end-4 row-span-full;
+
+      @variant group-extend-top/layout {
+        @apply row-start-2;
+      }
+
+      @variant group-extend-bottom/layout {
+        @apply row-end-3;
+      }
+
+      @variant group-data-[extend=left]/layout {
+        @apply row-start-2 row-end-3;
+      }
+    }
+
+    @variant placement-bottom {
+      @apply col-span-full row-start-3 row-end-4;
+
+      @variant group-extend-right/layout {
+        @apply col-end-3;
+      }
+
+      @variant group-extend-left/layout {
+        @apply col-start-2;
+      }
+
+      @variant group-data-[extend=top]/layout {
+        @apply col-start-2 col-end-3;
+      }
+    }
+
+    @variant placement-left {
+      @apply col-start-1 col-end-2 row-span-full;
+
+      @variant group-extend-top/layout {
+        @apply row-start-2;
+      }
+
+      @variant group-extend-bottom/layout {
+        @apply row-end-3;
+      }
+
+      @variant group-data-[extend=right]/layout {
+        @apply row-start-2 row-end-3;
+      }
+    }
+
+    & > * {
+      @apply pointer-events-auto;
+    }
+  }
+
+  .menu {
+    @apply rounded-large bg-surface-default p-xs gap-xs absolute flex;
+
+    @variant group-placement-top/drawer {
+      @apply top-full left-1/2 flex-row rounded-t-none;
+    }
+
+    @variant group-placement-right/drawer {
+      @apply right-full flex-col rounded-r-none;
+    }
+
+    @variant group-placement-bottom/drawer {
+      @apply bottom-full left-1/2 flex-row rounded-b-none;
+    }
+
+    @variant group-placement-left/drawer {
+      @apply left-full flex-col rounded-l-none;
+    }
+
+    &.start {
+      @variant group-placement-top/drawer {
+        @apply left-xl;
+      }
+
+      @variant group-placement-right/drawer {
+        @apply top-xl;
+      }
+
+      @variant group-placement-bottom/drawer {
+        @apply left-xl;
+      }
+
+      @variant group-placement-left/drawer {
+        @apply top-xl;
+      }
+    }
+
+    &.center {
+      @variant group-placement-top/drawer {
+        @apply left-1/2 -translate-x-1/2;
+      }
+
+      @variant group-placement-right/drawer {
+        @apply top-1/2 -translate-y-1/2;
+      }
+
+      @variant group-placement-bottom/drawer {
+        @apply left-1/2 -translate-x-1/2;
+      }
+
+      @variant group-placement-left/drawer {
+        @apply top-1/2 -translate-y-1/2;
+      }
+    }
+
+    &.end {
+      @variant group-placement-top/drawer {
+        @apply right-xl;
+      }
+
+      @variant group-placement-right/drawer {
+        @apply bottom-xl;
+      }
+
+      @variant group-placement-bottom/drawer {
+        @apply right-xl;
+      }
+
+      @variant group-placement-left/drawer {
+        @apply bottom-xl;
+      }
+    }
+  }
+
+  .panel {
+    @apply gap-s p-l hidden h-full min-h-0 flex-col;
+
+    @variant group-open/drawer {
+      @apply flex;
+    }
+
+    @variant group-placement-left/drawer {
+      @variant group-size-large/drawer {
+        @apply w-(--drawer-size-large);
+      }
+
+      @variant group-size-medium/drawer {
+        @apply w-(--drawer-size-medium);
+      }
+
+      @variant group-size-small/drawer {
+        @apply w-(--drawer-size-small);
+      }
+    }
+
+    @variant group-placement-right/drawer {
+      @variant group-size-large/drawer {
+        @apply w-(--drawer-size-large);
+      }
+
+      @variant group-size-medium/drawer {
+        @apply w-(--drawer-size-medium);
+      }
+
+      @variant group-size-small/drawer {
+        @apply w-(--drawer-size-small);
+      }
+    }
+
+    @variant group-placement-top/drawer {
+      @variant group-size-large/drawer {
+        @apply h-(--drawer-size-large);
+      }
+
+      @variant group-size-medium/drawer {
+        @apply h-(--drawer-size-medium);
+      }
+
+      @variant group-size-small/drawer {
+        @apply h-(--drawer-size-small);
+      }
+    }
+
+    @variant group-placement-bottom/drawer {
+      @variant group-size-large/drawer {
+        @apply h-(--drawer-size-large);
+      }
+
+      @variant group-size-medium/drawer {
+        @apply h-(--drawer-size-medium);
+      }
+
+      @variant group-size-small/drawer {
+        @apply h-(--drawer-size-small);
+      }
+    }
+  }
+
+  .view {
+    @apply gap-s flex h-full flex-col;
+  }
+
+  .header {
+    @apply gap-s flex flex-row items-center justify-between pt-px pr-px;
+  }
+
+  .title {
+    @apply fg-primary-bold w-fit;
+
+    &.large {
+      @apply text-header-l;
+    }
+
+    &.medium {
+      @apply text-header-m;
+    }
+  }
+
+  .content {
+    @apply fg-primary-bold flex max-h-full flex-1 flex-col overflow-y-auto;
+  }
+
+  .footer {
+    @apply fg-primary-bold mt-s flex flex-row items-center justify-end;
+  }
+}
+
+@layer components.l2 {
+  .item {
+    @apply rounded-medium;
+  }
+}

package/dist/components/drawer/trigger.d.ts

@@ -5,15 +5,11 @@ import '@accelint/core';
 import '@react-types/shared';
 import 'react';
 import 'react-aria-components';
-import 'tailwind-variants';
 import '../../lib/types.js';
 import '../button/types.js';
-import '../button/styles.js';
-import 'tailwind-merge';
 import '../view-stack/types.js';
 import '../view-stack/events.js';
 import './events.js';
-import './styles.js';
 
 declare function DrawerTrigger({ for: events, ...rest }: DrawerTriggerProps): react_jsx_runtime.JSX.Element;
 

package/dist/components/drawer/trigger.js

@@ -1,4 +1,4 @@
 'use client';
 
-import {jsx}from'react/jsx-runtime';import {isUUID}from'@accelint/core';import {Pressable}from'@react-aria/interactions';import'client-only';import {useContext}from'react';import {ViewStackContext}from'../view-stack/context.js';import {useDrawerEmit}from'./context.js';function U({for:r,...t}){const{parent:i}=useContext(ViewStackContext),n=useDrawerEmit();function s(){for(const e of Array.isArray(r)?r:[r]){let[p,o]=isUUID(e)?["push",e]:e.split(":");o??=i,o&&n[p](o);}}return jsx(Pressable,{...t,onPress:s})}export{U as DrawerTrigger};//# sourceMappingURL=trigger.js.map
+import {jsx}from'react/jsx-runtime';import'client-only';import {isUUID}from'@accelint/core';import {Pressable}from'@react-aria/interactions';import {useContext}from'react';import {ViewStackContext}from'../view-stack/context.js';import {useDrawerEmit}from'./context.js';function U({for:r,...t}){const{parent:i}=useContext(ViewStackContext),n=useDrawerEmit();function s(){for(const e of Array.isArray(r)?r:[r]){let[p,o]=isUUID(e)?["push",e]:e.split(":");o??=i,o&&n[p](o);}}return jsx(Pressable,{...t,onPress:s})}export{U as DrawerTrigger};//# sourceMappingURL=trigger.js.map
 //# sourceMappingURL=trigger.js.map

package/dist/components/drawer/trigger.js.map

@@ -1 +1 @@
-{"version":3,"sources":["../../../src/components/drawer/trigger.tsx"],"names":["parent","drawerEmit","useDrawerEmit","c","type","events","event","id","jsx","rest","a","handlePress"],"mappings":"6QAqBO,UAAsC,CAAA,CAAA,IAA+B,CAC1E,CAAA,GAAA,CAAM,CAAE,CAAA,CAAA,KAAAA,CAAO,OACTC,CAAAA,CAAaC,CAAAA,UAAc,iBAEjC,CAAA,CAAA,CAAA,CAAAC,aAAA,EAAA,CAAA,SACE,CAAA,EAAA,CAAA,IAAWC,WAAc,KAAA,CAAQC,OAA0B,CAAA,CAAG,CAC5D,GAAI,CAACC,CAAAA,CAAOC,CAAE,CAAA,GAAYH,CAAI,CAAA,CAAI,CAAC,YAAQA,CAAI,MAAS,CAAA,CAAA,CAAA,CAAM,CAAA,CAAA,KAK9DG,CAAAA,GAEKA,GAILN,GAAgB,EAAEM,CAAE,EAExB,CAEA,CAAA,CAAA,CAAA,CAAA,CAAA,EAAA,CAAOC,QAAeC,GAAAA,CAAMC,SAAA,CAAA,CAAA,GAAA,CAAA,CAASC,OACvC,CAAA,CAAA,CAAA,CAAA","file":"trigger.js","sourcesContent":["/*\n * Copyright 2025 Hypergiant Galactic Systems Inc. All rights reserved.\n * This file is licensed to you under the Apache License, Version 2.0 (the \"License\");\n * you may not use this file except in compliance with the License. You may obtain a copy\n * of the License at https://www.apache.org/licenses/LICENSE-2.0\n *\n * Unless required by applicable law or agreed to in writing, software distributed under\n * the License is distributed on an \"AS IS\" BASIS, WITHOUT WARRANTIES OR REPRESENTATIONS\n * OF ANY KIND, either express or implied. See the License for the specific language\n * governing permissions and limitations under the License.\n */\n'use client';\n\nimport { isUUID, type UniqueId } from '@accelint/core';\nimport { Pressable } from '@react-aria/interactions';\nimport 'client-only';\nimport { useContext } from 'react';\nimport { ViewStackContext } from '../view-stack/context';\nimport { useDrawerEmit } from './context';\nimport type { DrawerTriggerProps } from './types';\n\nexport function DrawerTrigger({ for: events, ...rest }: DrawerTriggerProps) {\n  const { parent } = useContext(ViewStackContext);\n  const drawerEmit = useDrawerEmit();\n\n  function handlePress() {\n    for (const type of Array.isArray(events) ? events : [events]) {\n      let [event, id] = (isUUID(type) ? ['push', type] : type.split(':')) as [\n        'back' | 'clear' | 'close' | 'open' | 'push' | 'reset' | 'toggle',\n        UniqueId | undefined | null,\n      ];\n\n      id ??= parent;\n\n      if (!id) {\n        continue;\n      }\n\n      drawerEmit[event](id);\n    }\n  }\n\n  return <Pressable {...rest} onPress={handlePress} />;\n}\n"]}
+{"version":3,"sources":["../../../src/components/drawer/trigger.tsx"],"names":["parent","drawerEmit","useDrawerEmit","c","type","events","event","id","jsx","rest","a","handlePress"],"mappings":"6QAqBO,UAAsC,CAAA,CAAA,IAA+B,CAC1E,CAAA,GAAA,CAAM,CAAE,CAAA,CAAA,KAAAA,CAAO,OACTC,CAAAA,CAAaC,CAAAA,UAAc,iBAEjC,CAAA,CAAA,CAAA,CAAAC,aAAA,EAAA,CAAA,SACE,CAAA,EAAA,CAAA,IAAWC,WAAc,KAAA,CAAQC,OAA0B,CAAA,CAAG,CAC5D,GAAI,CAACC,CAAAA,CAAOC,CAAE,CAAA,GAAYH,CAAI,CAAA,CAAI,CAAC,YAAQA,CAAI,MAAS,CAAA,CAAA,CAAA,CAAM,CAAA,CAAA,KAK9DG,CAAAA,GAEKA,GAILN,GAAgB,EAAEM,CAAE,EAExB,CAEA,CAAA,CAAA,CAAA,CAAA,CAAA,EAAA,CAAOC,QAAeC,GAAAA,CAAMC,SAAA,CAAA,CAAA,GAAA,CAAA,CAASC,OACvC,CAAA,CAAA,CAAA,CAAA","file":"trigger.js","sourcesContent":["/*\n * Copyright 2025 Hypergiant Galactic Systems Inc. All rights reserved.\n * This file is licensed to you under the Apache License, Version 2.0 (the \"License\");\n * you may not use this file except in compliance with the License. You may obtain a copy\n * of the License at https://www.apache.org/licenses/LICENSE-2.0\n *\n * Unless required by applicable law or agreed to in writing, software distributed under\n * the License is distributed on an \"AS IS\" BASIS, WITHOUT WARRANTIES OR REPRESENTATIONS\n * OF ANY KIND, either express or implied. See the License for the specific language\n * governing permissions and limitations under the License.\n */\n'use client';\n\nimport 'client-only';\nimport { isUUID, type UniqueId } from '@accelint/core';\nimport { Pressable } from '@react-aria/interactions';\nimport { useContext } from 'react';\nimport { ViewStackContext } from '../view-stack/context';\nimport { useDrawerEmit } from './context';\nimport type { DrawerTriggerProps } from './types';\n\nexport function DrawerTrigger({ for: events, ...rest }: DrawerTriggerProps) {\n  const { parent } = useContext(ViewStackContext);\n  const drawerEmit = useDrawerEmit();\n\n  function handlePress() {\n    for (const type of Array.isArray(events) ? events : [events]) {\n      let [event, id] = (isUUID(type) ? ['push', type] : type.split(':')) as [\n        'back' | 'clear' | 'close' | 'open' | 'push' | 'reset' | 'toggle',\n        UniqueId | undefined | null,\n      ];\n\n      id ??= parent;\n\n      if (!id) {\n        continue;\n      }\n\n      drawerEmit[event](id);\n    }\n  }\n\n  return <Pressable {...rest} onPress={handlePress} />;\n}\n"]}

package/dist/components/drawer/types.d.ts

@@ -3,14 +3,10 @@ import { UniqueId } from '@accelint/core';
 import { FocusableElement } from '@react-types/shared';
 import { ComponentPropsWithRef, RefAttributes, ReactElement, DOMAttributes } from 'react';
 import { HeadingProps } from 'react-aria-components';
-import { VariantProps } from 'tailwind-variants';
 import { AriaAttributesWithRef } from '../../lib/types.js';
 import { ToggleButtonProps } from '../button/types.js';
 import { ViewStackEvent } from '../view-stack/types.js';
 import { DrawerEventTypes } from './events.js';
-import { DrawerTitleStyles } from './styles.js';
-import '../button/styles.js';
-import 'tailwind-merge';
 import '../view-stack/events.js';
 
 type Top = 'top';
@@ -153,7 +149,9 @@ type DrawerMenuItemProps = Omit<ToggleButtonProps, 'id' | 'isSelected' | 'classN
         tooltip?: string;
     };
 };
-type DrawerTitleProps = Omit<HeadingProps, 'level'> & AriaAttributesWithRef<HTMLHeadingElement> & VariantProps<typeof DrawerTitleStyles>;
+type DrawerTitleProps = Omit<HeadingProps, 'level'> & AriaAttributesWithRef<HTMLHeadingElement> & {
+    level?: 1 | 2 | 3 | 4 | 5 | 6;
+};
 type DrawerOpenEvent = Payload<typeof DrawerEventTypes.open, {
     view: UniqueId;
 }>;

package/dist/components/drawer/view.js

@@ -1,4 +1,4 @@
 'use client';
 
-import {jsx}from'react/jsx-runtime';import'client-only';import {useContext,useEffect}from'react';import {ViewStackView}from'../view-stack/view.js';import {DrawerContext}from'./context.js';import {DrawerStyles}from'./styles.js';const{view:f}=DrawerStyles();function S({id:e,children:i,className:p,...s}){const{register:t,unregister:r}=useContext(DrawerContext);return useEffect(()=>(t(e),()=>r(e)),[t,r,e]),jsx(ViewStackView,{id:e,children:jsx("div",{...s,className:f({className:p}),role:"tabpanel",children:i})})}export{S as DrawerView};//# sourceMappingURL=view.js.map
+import {jsx}from'react/jsx-runtime';import'client-only';import {clsx}from'@accelint/design-foundation/lib/utils';import {useContext,useEffect}from'react';import {ViewStackView}from'../view-stack/view.js';import {DrawerContext}from'./context.js';import c from'./styles.module.css';function C({id:e,children:i,className:p,...s}){const{register:t,unregister:r}=useContext(DrawerContext);return useEffect(()=>(t(e),()=>r(e)),[t,r,e]),jsx(ViewStackView,{id:e,children:jsx("div",{...s,className:clsx(c.view,p),role:"tabpanel",children:i})})}export{C as DrawerView};//# sourceMappingURL=view.js.map
 //# sourceMappingURL=view.js.map

package/dist/components/drawer/view.js.map

@@ -1 +1 @@
-{"version":3,"sources":["../../../src/components/drawer/view.tsx"],"names":["c","DrawerView","children","className","unregister","useEffect","a","w","register","jsx","ViewStackView","id","o","m","rest","view"],"mappings":"mOAoBa,KAAiB,CAEvB,IAAA,CAAA,CAAA,CAAA,CAAAA,YAASC,EAAW,CACzB,SACA,CAAA,CAAA,CAAA,EAAAC,CAAAA,CACA,UAAAC,CAAAA,CACA,YAEM,GAAE,CAAA,CAAA,CAAA,CAAA,KAAU,CAAA,QAAA,CAAA,CAAAC,CAAW,UAE7B,CAAA,CAAA,CAAA,CAAAC,WAAUC,aAAA,CAAA,CAAA,OAGDC,SAAA,CAAA,KAAmB,CAAA,CAAA,CACzB,CAACC,CAAAA,IAAwB,CAAC,CAAA,CAG3BC,EAACC,CAAAA,CAAA,CAAc,GAAIC,CAAAA,CACjB,CAAA,CAAAC,GAAA,CAAAC,aAAA,CAAA,CAAA,EAAAJ,EAAC,CAAA,QAAK,CAAGK,IAAM,KAAA,CAAA,CAAA,GAAWC,CAAAA,CAAK,SAAE,CAAA,CAAAZ,CAAU,CAAC,kBACzC,CAAA,UACH,SAGN,CAAA,CAAA,CAAA,CAAA,CAAA,CAAA","file":"view.js","sourcesContent":["/*\n * Copyright 2025 Hypergiant Galactic Systems Inc. All rights reserved.\n * This file is licensed to you under the Apache License, Version 2.0 (the \"License\");\n * you may not use this file except in compliance with the License. You may obtain a copy\n * of the License at https://www.apache.org/licenses/LICENSE-2.0\n *\n * Unless required by applicable law or agreed to in writing, software distributed under\n * the License is distributed on an \"AS IS\" BASIS, WITHOUT WARRANTIES OR REPRESENTATIONS\n * OF ANY KIND, either express or implied. See the License for the specific language\n * governing permissions and limitations under the License.\n */\n'use client';\n\nimport 'client-only';\nimport { type ComponentPropsWithRef, useContext, useEffect } from 'react';\nimport { ViewStackView } from '../view-stack/view';\nimport { DrawerContext } from './context';\nimport { DrawerStyles } from './styles';\nimport type { ViewStackViewProps } from '../view-stack/types';\n\nconst { view } = DrawerStyles();\n\nexport function DrawerView({\n  id,\n  children,\n  className,\n  ...rest\n}: ViewStackViewProps & ComponentPropsWithRef<'div'>) {\n  const { register, unregister } = useContext(DrawerContext);\n\n  useEffect(() => {\n    register(id);\n\n    return () => unregister(id);\n  }, [register, unregister, id]);\n\n  return (\n    <ViewStackView id={id}>\n      <div {...rest} className={view({ className })} role='tabpanel'>\n        {children}\n      </div>\n    </ViewStackView>\n  );\n}\n"]}
+{"version":3,"sources":["../../../src/components/drawer/view.tsx"],"names":["DrawerView","children","register","n","a","useEffect","id","unregister","jsx","ViewStackView","o","className"],"mappings":"wRAqBgBA,SAEd,CAAA,CAAA,CAAA,EAAA,CAAA,CAAA,CAAAC,QACA,CAAA,CAAA,CAAA,SAEoD,CACpD,CAAA,CAAA,GAAM,CAAE,CAAA,CAAA,CAAA,KAAA,CAAAC,QAAU,CAAA,CAAA,CAAA,UAElB,CAAA,CAAA,CAAA,CAAAC,UAAA,CAAAC,aAAAC,CAAAA,CAAU,OACCC,SAAE,CAAA,KAEEC,EAAWD,CAAE,CAAA,CAAA,IACdC,CAAAA,CAAYD,CAAE,CAAC,CAAA,CAG3BE,CAAAA,CAACC,CAAAA,CAAA,CAAc,CAAA,CAAA,CAAIH,CAAAA,GACjB,qBAAAE,QAAC,CAAKE,SAAS,CAAA,CAAA,GAAA,CAAA,CAAA,SAAuB,CAAMC,IAAS,CAAA,CAAG,CAAA,IAAK,mBAC1D,CAAAV,QAIT,CAAA,CAAA,CAAA,CAAA,CAAA,CAAA","file":"view.js","sourcesContent":["/*\n * Copyright 2025 Hypergiant Galactic Systems Inc. All rights reserved.\n * This file is licensed to you under the Apache License, Version 2.0 (the \"License\");\n * you may not use this file except in compliance with the License. You may obtain a copy\n * of the License at https://www.apache.org/licenses/LICENSE-2.0\n *\n * Unless required by applicable law or agreed to in writing, software distributed under\n * the License is distributed on an \"AS IS\" BASIS, WITHOUT WARRANTIES OR REPRESENTATIONS\n * OF ANY KIND, either express or implied. See the License for the specific language\n * governing permissions and limitations under the License.\n */\n'use client';\n\nimport 'client-only';\nimport { clsx } from '@accelint/design-foundation/lib/utils';\nimport { type ComponentPropsWithRef, useContext, useEffect } from 'react';\nimport { ViewStackView } from '../view-stack/view';\nimport { DrawerContext } from './context';\nimport styles from './styles.module.css';\nimport type { ViewStackViewProps } from '../view-stack/types';\n\nexport function DrawerView({\n  id,\n  children,\n  className,\n  ...rest\n}: ViewStackViewProps & ComponentPropsWithRef<'div'>) {\n  const { register, unregister } = useContext(DrawerContext);\n\n  useEffect(() => {\n    register(id);\n\n    return () => unregister(id);\n  }, [register, unregister, id]);\n\n  return (\n    <ViewStackView id={id}>\n      <div {...rest} className={clsx(styles.view, className)} role='tabpanel'>\n        {children}\n      </div>\n    </ViewStackView>\n  );\n}\n"]}

package/dist/components/flashcard/index.d.ts

@@ -0,0 +1,57 @@
+import * as react_jsx_runtime from 'react/jsx-runtime';
+import * as react from 'react';
+import { FlashcardProps, FlashcardComponentProps, FlashcardDetailsListProps } from './types.js';
+import '../details-list/types.js';
+import 'react-aria-components';
+
+declare const FlashcardContext: react.Context<FlashcardProps>;
+/**
+ * Example usage.
+ *
+ * ```tsx
+ * <Flashcard isLoading={isLoading} header="Identifier" subheader="DATA">
+ *  <FlashcardHero />
+ *  <FlashcardAdditionalData>
+ *    {secondaryData}
+ *  </FlashcardAdditionalData>
+ *  <FlashcardDetailsList>
+ *    {detail.map((detail) => (
+ *     <Fragment key={detail.id}>
+ *       <FlashcardDetailsLabel>
+ *         {detail.label}
+ *       </FlashcardDetailsLabel>
+ *       <FlashcardDetailsValue>
+ *         {detail.value}
+ *       </FlashcardDetailsValue>
+ *     </Fragment>
+ *     ))}
+ *  </FlashcardDetailsList>
+ * </Flashcard>
+ * ```
+ */
+declare function Flashcard(props: FlashcardProps): react_jsx_runtime.JSX.Element;
+declare namespace Flashcard {
+    var displayName: string;
+}
+declare function FlashcardHero(props: FlashcardComponentProps): react_jsx_runtime.JSX.Element;
+declare namespace FlashcardHero {
+    var displayName: string;
+}
+declare function FlashcardAdditionalData(props: FlashcardComponentProps): react_jsx_runtime.JSX.Element | null;
+declare namespace FlashcardAdditionalData {
+    var displayName: string;
+}
+declare function FlashcardDetailsList(props: FlashcardDetailsListProps): react_jsx_runtime.JSX.Element;
+declare namespace FlashcardDetailsList {
+    var displayName: string;
+}
+declare function FlashcardDetailsLabel(props: FlashcardComponentProps): react_jsx_runtime.JSX.Element;
+declare namespace FlashcardDetailsLabel {
+    var displayName: string;
+}
+declare function FlashcardDetailsValue(props: FlashcardComponentProps): react_jsx_runtime.JSX.Element;
+declare namespace FlashcardDetailsValue {
+    var displayName: string;
+}
+
+export { Flashcard, FlashcardAdditionalData, FlashcardContext, FlashcardDetailsLabel, FlashcardDetailsList, FlashcardDetailsValue, FlashcardHero };

package/dist/components/flashcard/index.js

@@ -0,0 +1,4 @@
+'use client';
+
+import {jsx,jsxs}from'react/jsx-runtime';import {clsx}from'@accelint/design-foundation/lib/utils';import'client-only';import {createContext,useContext}from'react';import {Heading,Text}from'react-aria-components';import {DetailsList}from'../details-list/index.js';import {DetailsListLabel}from'../details-list/label.js';import {DetailsListValue}from'../details-list/value.js';import {Skeleton}from'../skeleton/index.js';import a from'./styles.module.css';const d=createContext({isLoading:false,header:"",subheader:""});function v(t){const{isLoading:l,header:s,subheader:e,children:i,className:m,...h}=t;return jsx(d.Provider,{value:{isLoading:l,header:s,subheader:e},children:jsx("div",{...h,className:clsx(a.container,m),children:i})})}v.displayName="Flashcard";function x(t){const{children:l,className:s,...e}=t,{isLoading:i,header:m,subheader:h}=useContext(d);return i?jsxs("div",{...e,className:clsx(a.hero,s,"gap-s"),children:[jsx(Skeleton,{className:a.skeleton,"data-testid":"hero-skeleton"}),jsx(Skeleton,{className:clsx(a.skeleton,a.half)})]}):jsxs("div",{...e,className:clsx(a.hero,s),children:[jsx(P,{className:a.header,children:m}),jsx(b,{className:a.subheader,children:h})]})}x.displayName="FlashcardHero";const P=Heading,b=Text;function y(t){const{children:l,className:s,...e}=t,{isLoading:i}=useContext(d);return i?null:jsx("div",{...e,className:clsx(a.data,s),children:l})}y.displayName="FlashcardAdditionalData";function g(t){const{children:l,className:s,...e}=t;return jsx(DetailsList,{...e,align:"justify",classNames:{list:clsx(a["details-list"],s)},children:l})}g.displayName="FlashcardDetailsList";function C(t){const{isLoading:l}=useContext(d),{className:s,children:e,...i}=t;return jsx(DetailsListLabel,{...i,className:clsx(a["details-label"],s),children:l?jsx(Skeleton,{className:clsx(a.skeleton,a.smaller)}):e})}C.displayName="FlashcardDetailsLabel";function k(t){const{isLoading:l}=useContext(d),{className:s,children:e,...i}=t;return jsx(DetailsListValue,{...i,className:clsx(a["details-value"],s),children:l?jsx(Skeleton,{className:clsx(a.skeleton,a.smaller)}):e})}k.displayName="FlashcardDetailsValue";export{v as Flashcard,y as FlashcardAdditionalData,d as FlashcardContext,C as FlashcardDetailsLabel,g as FlashcardDetailsList,k as FlashcardDetailsValue,x as FlashcardHero};//# sourceMappingURL=index.js.map
+//# sourceMappingURL=index.js.map

package/dist/components/flashcard/index.js.map

@@ -0,0 +1 @@
+{"version":3,"sources":["../../../src/components/flashcard/index.tsx"],"names":["u","Flashcard","props","header","rest","jsx","FlashcardContext","isLoading","r","className","o","children","jsxs","c","styles","p","Skeleton","n","clsx","FlashcardHero","Text","F","N","DetailsList","f","DetailsListLabel","L","FlashcardDetailsLabel","DetailsListValue","D","FlashcardDetailsValue"],"mappings":"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","file":"index.js","sourcesContent":["/*\n * Copyright 2025 Hypergiant Galactic Systems Inc. All rights reserved.\n * This file is licensed to you under the Apache License, Version 2.0 (the \"License\");\n * you may not use this file except in compliance with the License. You may obtain a copy\n * of the License at https://www.apache.org/licenses/LICENSE-2.0\n *\n * Unless required by applicable law or agreed to in writing, software distributed under\n * the License is distributed on an \"AS IS\" BASIS, WITHOUT WARRANTIES OR REPRESENTATIONS\n * OF ANY KIND, either express or implied. See the License for the specific language\n * governing permissions and limitations under the License.\n */\n\n'use client';\nimport { clsx } from '@accelint/design-foundation/lib/utils';\nimport 'client-only';\nimport { createContext, useContext } from 'react';\nimport { Heading, Text } from 'react-aria-components';\nimport { DetailsList } from '../details-list';\nimport { DetailsListLabel } from '../details-list/label';\nimport { DetailsListValue } from '../details-list/value';\nimport { Skeleton } from '../skeleton';\nimport styles from './styles.module.css';\nimport type {\n  FlashcardComponentProps,\n  FlashcardDetailsListProps,\n  FlashcardProps,\n} from './types';\n\nexport const FlashcardContext = createContext<FlashcardProps>({\n  isLoading: false,\n  header: '',\n  subheader: '',\n});\n\n/**\n * Example usage.\n *\n * ```tsx\n * <Flashcard isLoading={isLoading} header=\"Identifier\" subheader=\"DATA\">\n *  <FlashcardHero />\n *  <FlashcardAdditionalData>\n *    {secondaryData}\n *  </FlashcardAdditionalData>\n *  <FlashcardDetailsList>\n *    {detail.map((detail) => (\n *     <Fragment key={detail.id}>\n *       <FlashcardDetailsLabel>\n *         {detail.label}\n *       </FlashcardDetailsLabel>\n *       <FlashcardDetailsValue>\n *         {detail.value}\n *       </FlashcardDetailsValue>\n *     </Fragment>\n *     ))}\n *  </FlashcardDetailsList>\n * </Flashcard>\n * ```\n */\nexport function Flashcard(props: FlashcardProps) {\n  const { isLoading, header, subheader, children, className, ...rest } = props;\n\n  return (\n    <FlashcardContext.Provider value={{ isLoading, header, subheader }}>\n      <div {...rest} className={clsx(styles.container, className)}>\n        {children}\n      </div>\n    </FlashcardContext.Provider>\n  );\n}\nFlashcard.displayName = 'Flashcard';\n\nexport function FlashcardHero(props: FlashcardComponentProps) {\n  const { children, className, ...rest } = props;\n  const { isLoading, header, subheader } = useContext(FlashcardContext);\n\n  if (isLoading) {\n    return (\n      <div {...rest} className={clsx(styles.hero, className, 'gap-s')}>\n        <Skeleton className={styles.skeleton} data-testid='hero-skeleton' />\n        <Skeleton className={clsx(styles.skeleton, styles.half)} />\n      </div>\n    );\n  }\n\n  return (\n    <div {...rest} className={clsx(styles.hero, className)}>\n      <FlashcardHeader className={styles.header}>{header}</FlashcardHeader>\n      <FlashcardSubheader className={styles.subheader}>\n        {subheader}\n      </FlashcardSubheader>\n    </div>\n  );\n}\nFlashcardHero.displayName = 'FlashcardHero';\n\nconst FlashcardHeader = Heading;\nconst FlashcardSubheader = Text;\n\nexport function FlashcardAdditionalData(props: FlashcardComponentProps) {\n  const { children, className, ...rest } = props;\n  const { isLoading } = useContext(FlashcardContext);\n\n  // While loading, don't display.\n  if (isLoading) {\n    return null;\n  }\n\n  return (\n    <div {...rest} className={clsx(styles.data, className)}>\n      {children}\n    </div>\n  );\n}\nFlashcardAdditionalData.displayName = 'FlashcardAdditionalData';\n\nexport function FlashcardDetailsList(props: FlashcardDetailsListProps) {\n  const { children, className, ...rest } = props;\n  return (\n    <DetailsList\n      {...rest}\n      align='justify'\n      classNames={{ list: clsx(styles['details-list'], className) }}\n    >\n      {children}\n    </DetailsList>\n  );\n}\nFlashcardDetailsList.displayName = 'FlashcardDetailsList';\n\nexport function FlashcardDetailsLabel(props: FlashcardComponentProps) {\n  const { isLoading } = useContext(FlashcardContext);\n  const { className, children, ...rest } = props;\n  return (\n    <DetailsListLabel\n      {...rest}\n      className={clsx(styles['details-label'], className)}\n    >\n      {isLoading ? (\n        <Skeleton className={clsx(styles.skeleton, styles.smaller)} />\n      ) : (\n        children\n      )}\n    </DetailsListLabel>\n  );\n}\nFlashcardDetailsLabel.displayName = 'FlashcardDetailsLabel';\n\nexport function FlashcardDetailsValue(props: FlashcardComponentProps) {\n  const { isLoading } = useContext(FlashcardContext);\n  const { className, children, ...rest } = props;\n  return (\n    <DetailsListValue\n      {...rest}\n      className={clsx(styles['details-value'], className)}\n    >\n      {isLoading ? (\n        <Skeleton className={clsx(styles.skeleton, styles.smaller)} />\n      ) : (\n        children\n      )}\n    </DetailsListValue>\n  );\n}\nFlashcardDetailsValue.displayName = 'FlashcardDetailsValue';\n"]}