@mindlogic-ai/logician-ui 2.0.0 → 3.0.0-alpha.0

package/dist/components/Accordion/Accordion.d.ts

@@ -1,3 +1,4 @@
-import { AccordionProps } from '@chakra-ui/react';
-export declare const Accordion: (props: AccordionProps) => import("react/jsx-runtime").JSX.Element;
+import { AccordionRootProps as ChakraAccordionRootProps } from '@chakra-ui/react';
+export type AccordionProps = ChakraAccordionRootProps;
+export declare const Accordion: ({ collapsible, multiple, variant, ...rest }: AccordionProps) => import("react/jsx-runtime").JSX.Element;
 //# sourceMappingURL=Accordion.d.ts.map

package/dist/components/Accordion/Accordion.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"Accordion.d.ts","sourceRoot":"","sources":["../../../src/components/Accordion/Accordion.tsx"],"names":[],"mappings":"AAAA,OAAO,EAAgC,cAAc,EAAE,MAAM,kBAAkB,CAAC;AAEhF,eAAO,MAAM,SAAS,GAAI,OAAO,cAAc,4CAW9C,CAAC"}
+{"version":3,"file":"Accordion.d.ts","sourceRoot":"","sources":["../../../src/components/Accordion/Accordion.tsx"],"names":[],"mappings":"AAAA,OAAO,EAEL,kBAAkB,IAAI,wBAAwB,EAC/C,MAAM,kBAAkB,CAAC;AAE1B,MAAM,MAAM,cAAc,GAAG,wBAAwB,CAAC;AAEtD,eAAO,MAAM,SAAS,GAAI,6CAKvB,cAAc,4CAShB,CAAC"}

package/dist/components/Accordion/Accordion.js

@@ -4,8 +4,8 @@
 var jsxRuntime = require('react/jsx-runtime');
 var react = require('@chakra-ui/react');
 
-const Accordion = (props) => {
-    return (jsxRuntime.jsx(react.Accordion, { allowMultiple: true, borderRadius: 4, overflow: "hidden", border: "1px solid", borderColor: "gray.300", ...props }));
+const Accordion = ({ collapsible, multiple = true, variant = 'enclosed', ...rest }) => {
+    return (jsxRuntime.jsx(react.Accordion.Root, { collapsible: collapsible, multiple: multiple, variant: variant, ...rest }));
 };
 
 exports.Accordion = Accordion;

package/dist/components/Accordion/Accordion.js.map

@@ -1 +1 @@
-{"version":3,"file":"Accordion.js","sources":["../../../src/components/Accordion/Accordion.tsx"],"sourcesContent":[null],"names":["_jsx","ChakraAccordion"],"mappings":";;;;;;AAEO,MAAM,SAAS,GAAG,CAAC,KAAqB,KAAI;IACjD,QACEA,cAAA,CAACC,eAAe,EAAA,EACd,aAAa,QACb,YAAY,EAAE,CAAC,EACf,QAAQ,EAAC,QAAQ,EACjB,MAAM,EAAC,WAAW,EAClB,WAAW,EAAC,UAAU,EAAA,GAClB,KAAK,EAAA,CACT;AAEN;;;;"}
+{"version":3,"file":"Accordion.js","sources":["../../../src/components/Accordion/Accordion.tsx"],"sourcesContent":[null],"names":["_jsx","ChakraAccordion"],"mappings":";;;;;;MAOa,SAAS,GAAG,CAAC,EACxB,WAAW,EACX,QAAQ,GAAG,IAAI,EACf,OAAO,GAAG,UAAU,EACpB,GAAG,IAAI,EACQ,KAAI;IACnB,QACEA,eAACC,eAAe,CAAC,IAAI,EAAA,EACnB,WAAW,EAAE,WAAW,EACxB,QAAQ,EAAE,QAAQ,EAClB,OAAO,EAAE,OAAO,EAAA,GACZ,IAAI,EAAA,CACR;AAEN;;;;"}

package/dist/components/Accordion/Accordion.mjs

@@ -2,8 +2,8 @@
 import { jsx } from 'react/jsx-runtime';
 import { Accordion as Accordion$1 } from '@chakra-ui/react';
 
-const Accordion = (props) => {
-    return (jsx(Accordion$1, { allowMultiple: true, borderRadius: 4, overflow: "hidden", border: "1px solid", borderColor: "gray.300", ...props }));
+const Accordion = ({ collapsible, multiple = true, variant = 'enclosed', ...rest }) => {
+    return (jsx(Accordion$1.Root, { collapsible: collapsible, multiple: multiple, variant: variant, ...rest }));
 };
 
 export { Accordion };

package/dist/components/Accordion/Accordion.mjs.map

@@ -1 +1 @@
-{"version":3,"file":"Accordion.mjs","sources":["../../../src/components/Accordion/Accordion.tsx"],"sourcesContent":[null],"names":["_jsx","ChakraAccordion"],"mappings":";;;;AAEO,MAAM,SAAS,GAAG,CAAC,KAAqB,KAAI;IACjD,QACEA,GAAA,CAACC,WAAe,EAAA,EACd,aAAa,QACb,YAAY,EAAE,CAAC,EACf,QAAQ,EAAC,QAAQ,EACjB,MAAM,EAAC,WAAW,EAClB,WAAW,EAAC,UAAU,EAAA,GAClB,KAAK,EAAA,CACT;AAEN;;;;"}
+{"version":3,"file":"Accordion.mjs","sources":["../../../src/components/Accordion/Accordion.tsx"],"sourcesContent":[null],"names":["_jsx","ChakraAccordion"],"mappings":";;;;MAOa,SAAS,GAAG,CAAC,EACxB,WAAW,EACX,QAAQ,GAAG,IAAI,EACf,OAAO,GAAG,UAAU,EACpB,GAAG,IAAI,EACQ,KAAI;IACnB,QACEA,IAACC,WAAe,CAAC,IAAI,EAAA,EACnB,WAAW,EAAE,WAAW,EACxB,QAAQ,EAAE,QAAQ,EAClB,OAAO,EAAE,OAAO,EAAA,GACZ,IAAI,EAAA,CACR;AAEN;;;;"}

package/dist/components/Accordion/AccordionButton.d.ts

@@ -1,6 +1,8 @@
-import { PropsWithChildren, ReactNode } from 'react';
-import { ChakraProps } from '@chakra-ui/react';
-export declare const AccordionButton: ({ _hover, _expanded, customIcon, children, ...rest }: PropsWithChildren<ChakraProps> & {
+import { ReactNode } from 'react';
+import type { AccordionItemTriggerProps } from '@chakra-ui/react';
+export type AccordionButtonProps = AccordionItemTriggerProps & {
+    children?: ReactNode;
     customIcon?: ReactNode;
-}) => import("react/jsx-runtime").JSX.Element;
+};
+export declare const AccordionButton: ({ customIcon, children, ...rest }: AccordionButtonProps) => import("react/jsx-runtime").JSX.Element;
 //# sourceMappingURL=AccordionButton.d.ts.map

package/dist/components/Accordion/AccordionButton.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"AccordionButton.d.ts","sourceRoot":"","sources":["../../../src/components/Accordion/AccordionButton.tsx"],"names":[],"mappings":"AAAA,OAAO,EAAE,iBAAiB,EAAE,SAAS,EAAE,MAAM,OAAO,CAAC;AACrD,OAAO,EAGL,WAAW,EAEZ,MAAM,kBAAkB,CAAC;AAI1B,eAAO,MAAM,eAAe,GAAI,sDAM7B,iBAAiB,CAAC,WAAW,CAAC,GAAG;IAClC,UAAU,CAAC,EAAE,SAAS,CAAC;CACxB,4CAqBA,CAAC"}
+{"version":3,"file":"AccordionButton.d.ts","sourceRoot":"","sources":["../../../src/components/Accordion/AccordionButton.tsx"],"names":[],"mappings":"AAAA,OAAO,EAAE,SAAS,EAAE,MAAM,OAAO,CAAC;AAClC,OAAO,KAAK,EAAE,yBAAyB,EAAE,MAAM,kBAAkB,CAAC;AAGlE,MAAM,MAAM,oBAAoB,GAAG,yBAAyB,GAAG;IAC7D,QAAQ,CAAC,EAAE,SAAS,CAAC;IACrB,UAAU,CAAC,EAAE,SAAS,CAAC;CACxB,CAAC;AAEF,eAAO,MAAM,eAAe,GAAI,mCAI7B,oBAAoB,4CAOtB,CAAC"}

package/dist/components/Accordion/AccordionButton.js

@@ -3,17 +3,9 @@
 
 var jsxRuntime = require('react/jsx-runtime');
 var react = require('@chakra-ui/react');
-var index = require('../../theme/index.js');
 
-const AccordionButton = ({ _hover = {}, _expanded = {}, customIcon = undefined, children, ...rest }) => {
-    return (jsxRuntime.jsx(react.AccordionButton, { _hover: {
-            bg: `${index.default.colors.main}08`,
-            ..._hover,
-        }, _expanded: {
-            bg: `${index.default.colors.main}12`,
-            borderBottomWidth: '1px',
-            ..._expanded,
-        }, fontWeight: "bold", ...rest, children: jsxRuntime.jsxs(react.Flex, { w: "100%", justify: "space-between", align: "center", children: [children, customIcon ? customIcon : jsxRuntime.jsx(react.AccordionIcon, {})] }) }));
+const AccordionButton = ({ customIcon, children, ...rest }) => {
+    return (jsxRuntime.jsxs(react.Accordion.ItemTrigger, { fontWeight: "bold", ...rest, children: [jsxRuntime.jsx(react.HStack, { flex: "1", children: children }), customIcon ?? jsxRuntime.jsx(react.Accordion.ItemIndicator, {})] }));
 };
 
 exports.AccordionButton = AccordionButton;

package/dist/components/Accordion/AccordionButton.js.map

@@ -1 +1 @@
-{"version":3,"file":"AccordionButton.js","sources":["../../../src/components/Accordion/AccordionButton.tsx"],"sourcesContent":[null],"names":["_jsx","ChakraAccordionButton","theme","_jsxs","Flex","AccordionIcon"],"mappings":";;;;;;;AAUO,MAAM,eAAe,GAAG,CAAC,EAC9B,MAAM,GAAG,EAAE,EACX,SAAS,GAAG,EAAE,EACd,UAAU,GAAG,SAAS,EACtB,QAAQ,EACR,GAAG,IAAI,EAGR,KAAI;AACH,IAAA,QACEA,cAAA,CAACC,qBAAqB,EAAA,EACpB,MAAM,EAAE;AACN,YAAA,EAAE,EAAE,CAAA,EAAGC,aAAK,CAAC,MAAM,CAAC,IAAI,CAAA,EAAA,CAAI;AAC5B,YAAA,GAAG,MAAM;AACV,SAAA,EACD,SAAS,EAAE;AACT,YAAA,EAAE,EAAE,CAAA,EAAGA,aAAK,CAAC,MAAM,CAAC,IAAI,CAAA,EAAA,CAAI;AAC5B,YAAA,iBAAiB,EAAE,KAAK;AACxB,YAAA,GAAG,SAAS;AACb,SAAA,EACD,UAAU,EAAC,MAAM,EAAA,GACb,IAAI,YAERC,eAAA,CAACC,UAAI,EAAA,EAAC,CAAC,EAAC,MAAM,EAAC,OAAO,EAAC,eAAe,EAAC,KAAK,EAAC,QAAQ,aAClD,QAAQ,EACR,UAAU,GAAG,UAAU,GAAGJ,cAAA,CAACK,mBAAa,KAAG,CAAA,EAAA,CACvC,EAAA,CACe;AAE5B;;;;"}
+{"version":3,"file":"AccordionButton.js","sources":["../../../src/components/Accordion/AccordionButton.tsx"],"sourcesContent":[null],"names":["_jsxs","Accordion","_jsx","HStack"],"mappings":";;;;;;AASO,MAAM,eAAe,GAAG,CAAC,EAC9B,UAAU,EACV,QAAQ,EACR,GAAG,IAAI,EACc,KAAI;AACzB,IAAA,QACEA,eAAA,CAACC,eAAS,CAAC,WAAW,EAAA,EAAC,UAAU,EAAC,MAAM,EAAA,GAAK,IAAI,EAAA,QAAA,EAAA,CAC/CC,eAACC,YAAM,EAAA,EAAC,IAAI,EAAC,GAAG,EAAA,QAAA,EAAE,QAAQ,EAAA,CAAU,EACnC,UAAU,IAAID,cAAA,CAACD,eAAS,CAAC,aAAa,EAAA,EAAA,CAAG,CAAA,EAAA,CACpB;AAE5B;;;;"}

package/dist/components/Accordion/AccordionButton.mjs

@@ -1,17 +1,9 @@
 "use client";
-import { jsx, jsxs } from 'react/jsx-runtime';
-import { AccordionButton as AccordionButton$1, Flex, AccordionIcon } from '@chakra-ui/react';
-import theme from '../../theme/index.mjs';
+import { jsxs, jsx } from 'react/jsx-runtime';
+import { Accordion, HStack } from '@chakra-ui/react';
 
-const AccordionButton = ({ _hover = {}, _expanded = {}, customIcon = undefined, children, ...rest }) => {
-    return (jsx(AccordionButton$1, { _hover: {
-            bg: `${theme.colors.main}08`,
-            ..._hover,
-        }, _expanded: {
-            bg: `${theme.colors.main}12`,
-            borderBottomWidth: '1px',
-            ..._expanded,
-        }, fontWeight: "bold", ...rest, children: jsxs(Flex, { w: "100%", justify: "space-between", align: "center", children: [children, customIcon ? customIcon : jsx(AccordionIcon, {})] }) }));
+const AccordionButton = ({ customIcon, children, ...rest }) => {
+    return (jsxs(Accordion.ItemTrigger, { fontWeight: "bold", ...rest, children: [jsx(HStack, { flex: "1", children: children }), customIcon ?? jsx(Accordion.ItemIndicator, {})] }));
 };
 
 export { AccordionButton };

package/dist/components/Accordion/AccordionButton.mjs.map

@@ -1 +1 @@
-{"version":3,"file":"AccordionButton.mjs","sources":["../../../src/components/Accordion/AccordionButton.tsx"],"sourcesContent":[null],"names":["_jsx","ChakraAccordionButton","_jsxs"],"mappings":";;;;;AAUO,MAAM,eAAe,GAAG,CAAC,EAC9B,MAAM,GAAG,EAAE,EACX,SAAS,GAAG,EAAE,EACd,UAAU,GAAG,SAAS,EACtB,QAAQ,EACR,GAAG,IAAI,EAGR,KAAI;AACH,IAAA,QACEA,GAAA,CAACC,iBAAqB,EAAA,EACpB,MAAM,EAAE;AACN,YAAA,EAAE,EAAE,CAAA,EAAG,KAAK,CAAC,MAAM,CAAC,IAAI,CAAA,EAAA,CAAI;AAC5B,YAAA,GAAG,MAAM;AACV,SAAA,EACD,SAAS,EAAE;AACT,YAAA,EAAE,EAAE,CAAA,EAAG,KAAK,CAAC,MAAM,CAAC,IAAI,CAAA,EAAA,CAAI;AAC5B,YAAA,iBAAiB,EAAE,KAAK;AACxB,YAAA,GAAG,SAAS;AACb,SAAA,EACD,UAAU,EAAC,MAAM,EAAA,GACb,IAAI,YAERC,IAAA,CAAC,IAAI,EAAA,EAAC,CAAC,EAAC,MAAM,EAAC,OAAO,EAAC,eAAe,EAAC,KAAK,EAAC,QAAQ,aAClD,QAAQ,EACR,UAAU,GAAG,UAAU,GAAGF,GAAA,CAAC,aAAa,KAAG,CAAA,EAAA,CACvC,EAAA,CACe;AAE5B;;;;"}
+{"version":3,"file":"AccordionButton.mjs","sources":["../../../src/components/Accordion/AccordionButton.tsx"],"sourcesContent":[null],"names":["_jsxs","_jsx"],"mappings":";;;;AASO,MAAM,eAAe,GAAG,CAAC,EAC9B,UAAU,EACV,QAAQ,EACR,GAAG,IAAI,EACc,KAAI;AACzB,IAAA,QACEA,IAAA,CAAC,SAAS,CAAC,WAAW,EAAA,EAAC,UAAU,EAAC,MAAM,EAAA,GAAK,IAAI,EAAA,QAAA,EAAA,CAC/CC,IAAC,MAAM,EAAA,EAAC,IAAI,EAAC,GAAG,EAAA,QAAA,EAAE,QAAQ,EAAA,CAAU,EACnC,UAAU,IAAIA,GAAA,CAAC,SAAS,CAAC,aAAa,EAAA,EAAA,CAAG,CAAA,EAAA,CACpB;AAE5B;;;;"}

package/dist/components/Accordion/AccordionItem.d.ts

@@ -1,6 +1,4 @@
-export declare const AccordionItem: ({ _first, _last, ...rest }: {
-    [x: string]: any;
-    _first?: {};
-    _last?: {};
-}) => import("react/jsx-runtime").JSX.Element;
+import { AccordionItemProps as ChakraAccordionItemProps } from '@chakra-ui/react';
+export type AccordionItemProps = ChakraAccordionItemProps;
+export declare const AccordionItem: (props: AccordionItemProps) => import("react/jsx-runtime").JSX.Element;
 //# sourceMappingURL=AccordionItem.d.ts.map

package/dist/components/Accordion/AccordionItem.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"AccordionItem.d.ts","sourceRoot":"","sources":["../../../src/components/Accordion/AccordionItem.tsx"],"names":[],"mappings":"AAEA,eAAO,MAAM,aAAa,GAAI;;;;CAAoC,4CAcjE,CAAC"}
+{"version":3,"file":"AccordionItem.d.ts","sourceRoot":"","sources":["../../../src/components/Accordion/AccordionItem.tsx"],"names":[],"mappings":"AAAA,OAAO,EAEL,kBAAkB,IAAI,wBAAwB,EAC/C,MAAM,kBAAkB,CAAC;AAE1B,MAAM,MAAM,kBAAkB,GAAG,wBAAwB,CAAC;AAE1D,eAAO,MAAM,aAAa,GAAI,OAAO,kBAAkB,4CAEtD,CAAC"}

package/dist/components/Accordion/AccordionItem.js

@@ -4,14 +4,8 @@
 var jsxRuntime = require('react/jsx-runtime');
 var react = require('@chakra-ui/react');
 
-const AccordionItem = ({ _first = {}, _last = {}, ...rest }) => {
-    return (jsxRuntime.jsx(react.AccordionItem, { _first: {
-            borderTopWidth: 0,
-            ..._first,
-        }, _last: {
-            borderBottomWidth: 0,
-            ..._last,
-        }, ...rest }));
+const AccordionItem = (props) => {
+    return jsxRuntime.jsx(react.Accordion.Item, { ...props });
 };
 
 exports.AccordionItem = AccordionItem;

package/dist/components/Accordion/AccordionItem.js.map

@@ -1 +1 @@
-{"version":3,"file":"AccordionItem.js","sources":["../../../src/components/Accordion/AccordionItem.tsx"],"sourcesContent":[null],"names":["_jsx","ChakraAccordionItem"],"mappings":";;;;;;AAEO,MAAM,aAAa,GAAG,CAAC,EAAE,MAAM,GAAG,EAAE,EAAE,KAAK,GAAG,EAAE,EAAE,GAAG,IAAI,EAAE,KAAI;AACpE,IAAA,QACEA,cAAA,CAACC,mBAAmB,EAAA,EAClB,MAAM,EAAE;AACN,YAAA,cAAc,EAAE,CAAC;AACjB,YAAA,GAAG,MAAM;AACV,SAAA,EACD,KAAK,EAAE;AACL,YAAA,iBAAiB,EAAE,CAAC;AACpB,YAAA,GAAG,KAAK;SACT,EAAA,GACG,IAAI,EAAA,CACR;AAEN;;;;"}
+{"version":3,"file":"AccordionItem.js","sources":["../../../src/components/Accordion/AccordionItem.tsx"],"sourcesContent":[null],"names":["_jsx","Accordion"],"mappings":";;;;;;AAOO,MAAM,aAAa,GAAG,CAAC,KAAyB,KAAI;AACzD,IAAA,OAAOA,eAACC,eAAS,CAAC,IAAI,EAAA,EAAA,GAAK,KAAK,GAAI;AACtC;;;;"}

package/dist/components/Accordion/AccordionItem.mjs

@@ -1,15 +1,9 @@
 "use client";
 import { jsx } from 'react/jsx-runtime';
-import { AccordionItem as AccordionItem$1 } from '@chakra-ui/react';
+import { Accordion } from '@chakra-ui/react';
 
-const AccordionItem = ({ _first = {}, _last = {}, ...rest }) => {
-    return (jsx(AccordionItem$1, { _first: {
-            borderTopWidth: 0,
-            ..._first,
-        }, _last: {
-            borderBottomWidth: 0,
-            ..._last,
-        }, ...rest }));
+const AccordionItem = (props) => {
+    return jsx(Accordion.Item, { ...props });
 };
 
 export { AccordionItem };

package/dist/components/Accordion/AccordionItem.mjs.map

@@ -1 +1 @@
-{"version":3,"file":"AccordionItem.mjs","sources":["../../../src/components/Accordion/AccordionItem.tsx"],"sourcesContent":[null],"names":["_jsx","ChakraAccordionItem"],"mappings":";;;;AAEO,MAAM,aAAa,GAAG,CAAC,EAAE,MAAM,GAAG,EAAE,EAAE,KAAK,GAAG,EAAE,EAAE,GAAG,IAAI,EAAE,KAAI;AACpE,IAAA,QACEA,GAAA,CAACC,eAAmB,EAAA,EAClB,MAAM,EAAE;AACN,YAAA,cAAc,EAAE,CAAC;AACjB,YAAA,GAAG,MAAM;AACV,SAAA,EACD,KAAK,EAAE;AACL,YAAA,iBAAiB,EAAE,CAAC;AACpB,YAAA,GAAG,KAAK;SACT,EAAA,GACG,IAAI,EAAA,CACR;AAEN;;;;"}
+{"version":3,"file":"AccordionItem.mjs","sources":["../../../src/components/Accordion/AccordionItem.tsx"],"sourcesContent":[null],"names":["_jsx"],"mappings":";;;;AAOO,MAAM,aAAa,GAAG,CAAC,KAAyB,KAAI;AACzD,IAAA,OAAOA,IAAC,SAAS,CAAC,IAAI,EAAA,EAAA,GAAK,KAAK,GAAI;AACtC;;;;"}

package/dist/components/Accordion/AccordionPanel.d.ts

@@ -0,0 +1,19 @@
+import { AccordionItemContentProps as ChakraAccordionItemContentProps } from '@chakra-ui/react';
+export type AccordionPanelProps = ChakraAccordionItemContentProps;
+/**
+ * @deprecated This component doesn't exist in Chakra UI v3. Use `Accordion.ItemContent` and `Accordion.ItemBody` directly instead.
+ * This component will be removed in the next major version.
+ *
+ * @example
+ * ```tsx
+ * // Before
+ * <AccordionPanel>Content here</AccordionPanel>
+ *
+ * // After (Chakra v3)
+ * <Accordion.ItemContent>
+ *   <Accordion.ItemBody>Content here</Accordion.ItemBody>
+ * </Accordion.ItemContent>
+ * ```
+ */
+export declare const AccordionPanel: ({ children, ...rest }: AccordionPanelProps) => import("react/jsx-runtime").JSX.Element;
+//# sourceMappingURL=AccordionPanel.d.ts.map

package/dist/components/Accordion/AccordionPanel.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"AccordionPanel.d.ts","sourceRoot":"","sources":["../../../src/components/Accordion/AccordionPanel.tsx"],"names":[],"mappings":"AAAA,OAAO,EAEL,yBAAyB,IAAI,+BAA+B,EAC7D,MAAM,kBAAkB,CAAC;AAE1B,MAAM,MAAM,mBAAmB,GAAG,+BAA+B,CAAC;AAElE;;;;;;;;;;;;;;GAcG;AACH,eAAO,MAAM,cAAc,GAAI,uBAAuB,mBAAmB,4CAMxE,CAAC"}

package/dist/components/Accordion/AccordionPanel.js

@@ -0,0 +1,27 @@
+"use client";
+'use strict';
+
+var jsxRuntime = require('react/jsx-runtime');
+var react = require('@chakra-ui/react');
+
+/**
+ * @deprecated This component doesn't exist in Chakra UI v3. Use `Accordion.ItemContent` and `Accordion.ItemBody` directly instead.
+ * This component will be removed in the next major version.
+ *
+ * @example
+ * ```tsx
+ * // Before
+ * <AccordionPanel>Content here</AccordionPanel>
+ *
+ * // After (Chakra v3)
+ * <Accordion.ItemContent>
+ *   <Accordion.ItemBody>Content here</Accordion.ItemBody>
+ * </Accordion.ItemContent>
+ * ```
+ */
+const AccordionPanel = ({ children, ...rest }) => {
+    return (jsxRuntime.jsx(react.Accordion.ItemContent, { ...rest, children: jsxRuntime.jsx(react.Accordion.ItemBody, { children: children }) }));
+};
+
+exports.AccordionPanel = AccordionPanel;
+//# sourceMappingURL=AccordionPanel.js.map

package/dist/components/Accordion/AccordionPanel.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"AccordionPanel.js","sources":["../../../src/components/Accordion/AccordionPanel.tsx"],"sourcesContent":[null],"names":["_jsx","Accordion"],"mappings":";;;;;;AAOA;;;;;;;;;;;;;;AAcG;AACI,MAAM,cAAc,GAAG,CAAC,EAAE,QAAQ,EAAE,GAAG,IAAI,EAAuB,KAAI;AAC3E,IAAA,QACEA,cAAA,CAACC,eAAS,CAAC,WAAW,OAAK,IAAI,EAAA,QAAA,EAC7BD,cAAA,CAACC,eAAS,CAAC,QAAQ,EAAA,EAAA,QAAA,EAAE,QAAQ,EAAA,CAAsB,EAAA,CAC7B;AAE5B;;;;"}

package/dist/components/Accordion/AccordionPanel.mjs

@@ -0,0 +1,25 @@
+"use client";
+import { jsx } from 'react/jsx-runtime';
+import { Accordion } from '@chakra-ui/react';
+
+/**
+ * @deprecated This component doesn't exist in Chakra UI v3. Use `Accordion.ItemContent` and `Accordion.ItemBody` directly instead.
+ * This component will be removed in the next major version.
+ *
+ * @example
+ * ```tsx
+ * // Before
+ * <AccordionPanel>Content here</AccordionPanel>
+ *
+ * // After (Chakra v3)
+ * <Accordion.ItemContent>
+ *   <Accordion.ItemBody>Content here</Accordion.ItemBody>
+ * </Accordion.ItemContent>
+ * ```
+ */
+const AccordionPanel = ({ children, ...rest }) => {
+    return (jsx(Accordion.ItemContent, { ...rest, children: jsx(Accordion.ItemBody, { children: children }) }));
+};
+
+export { AccordionPanel };
+//# sourceMappingURL=AccordionPanel.mjs.map

package/dist/components/Accordion/AccordionPanel.mjs.map

@@ -0,0 +1 @@
+{"version":3,"file":"AccordionPanel.mjs","sources":["../../../src/components/Accordion/AccordionPanel.tsx"],"sourcesContent":[null],"names":["_jsx"],"mappings":";;;;AAOA;;;;;;;;;;;;;;AAcG;AACI,MAAM,cAAc,GAAG,CAAC,EAAE,QAAQ,EAAE,GAAG,IAAI,EAAuB,KAAI;AAC3E,IAAA,QACEA,GAAA,CAAC,SAAS,CAAC,WAAW,OAAK,IAAI,EAAA,QAAA,EAC7BA,GAAA,CAAC,SAAS,CAAC,QAAQ,EAAA,EAAA,QAAA,EAAE,QAAQ,EAAA,CAAsB,EAAA,CAC7B;AAE5B;;;;"}

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

@@ -1,5 +1,9 @@
+export type { AccordionProps } from './Accordion';
 export { Accordion } from './Accordion';
+export type { AccordionButtonProps } from './AccordionButton';
 export { AccordionButton } from './AccordionButton';
+export type { AccordionItemProps } from './AccordionItem';
 export { AccordionItem } from './AccordionItem';
-export { AccordionPanel } from '@chakra-ui/react';
+export type { AccordionPanelProps } from './AccordionPanel';
+export { AccordionPanel } from './AccordionPanel';
 //# sourceMappingURL=index.d.ts.map

package/dist/components/Accordion/index.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../src/components/Accordion/index.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,SAAS,EAAE,MAAM,aAAa,CAAC;AACxC,OAAO,EAAE,eAAe,EAAE,MAAM,mBAAmB,CAAC;AACpD,OAAO,EAAE,aAAa,EAAE,MAAM,iBAAiB,CAAC;AAChD,OAAO,EAAE,cAAc,EAAE,MAAM,kBAAkB,CAAC"}
+{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../src/components/Accordion/index.ts"],"names":[],"mappings":"AAAA,YAAY,EAAE,cAAc,EAAE,MAAM,aAAa,CAAC;AAClD,OAAO,EAAE,SAAS,EAAE,MAAM,aAAa,CAAC;AACxC,YAAY,EAAE,oBAAoB,EAAE,MAAM,mBAAmB,CAAC;AAC9D,OAAO,EAAE,eAAe,EAAE,MAAM,mBAAmB,CAAC;AACpD,YAAY,EAAE,kBAAkB,EAAE,MAAM,iBAAiB,CAAC;AAC1D,OAAO,EAAE,aAAa,EAAE,MAAM,iBAAiB,CAAC;AAChD,YAAY,EAAE,mBAAmB,EAAE,MAAM,kBAAkB,CAAC;AAC5D,OAAO,EAAE,cAAc,EAAE,MAAM,kBAAkB,CAAC"}

package/dist/components/Avatar/Avatar.d.ts

@@ -1,3 +1,10 @@
-import { AvatarProps as ChakraAvatarProps } from '@chakra-ui/react';
-export declare const Avatar: import("react").ForwardRefExoticComponent<ChakraAvatarProps & import("react").RefAttributes<unknown>>;
+import { Avatar as ChakraAvatar, AvatarRootProps as ChakraAvatarRootProps } from '@chakra-ui/react';
+export type AvatarProps = ChakraAvatarRootProps & {
+    src?: string;
+    name?: string;
+};
+export declare const Avatar: import("react").ForwardRefExoticComponent<ChakraAvatar.RootProps & {
+    src?: string;
+    name?: string;
+} & import("react").RefAttributes<HTMLDivElement>>;
 //# sourceMappingURL=Avatar.d.ts.map

package/dist/components/Avatar/Avatar.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"Avatar.d.ts","sourceRoot":"","sources":["../../../src/components/Avatar/Avatar.tsx"],"names":[],"mappings":"AACA,OAAO,EAEL,WAAW,IAAI,iBAAiB,EACjC,MAAM,kBAAkB,CAAC;AAE1B,eAAO,MAAM,MAAM,uGAUjB,CAAC"}
+{"version":3,"file":"Avatar.d.ts","sourceRoot":"","sources":["../../../src/components/Avatar/Avatar.tsx"],"names":[],"mappings":"AACA,OAAO,EACL,MAAM,IAAI,YAAY,EACtB,eAAe,IAAI,qBAAqB,EACzC,MAAM,kBAAkB,CAAC;AAE1B,MAAM,MAAM,WAAW,GAAG,qBAAqB,GAAG;IAChD,GAAG,CAAC,EAAE,MAAM,CAAC;IACb,IAAI,CAAC,EAAE,MAAM,CAAC;CACf,CAAC;AAEF,eAAO,MAAM,MAAM;UAJX,MAAM;WACL,MAAM;kDAiBb,CAAC"}

package/dist/components/Avatar/Avatar.js

@@ -5,8 +5,9 @@ var jsxRuntime = require('react/jsx-runtime');
 var React = require('react');
 var react = require('@chakra-ui/react');
 
-const Avatar = React.forwardRef(({ ...rest }, ref) => {
-    return (jsxRuntime.jsx(react.Avatar, { ref: ref, borderWidth: "1px", borderColor: "gray.200", overflow: "hidden", ...rest }));
+const Avatar = React.forwardRef((props, ref) => {
+    const { src, name, ...rest } = props;
+    return (jsxRuntime.jsxs(react.Avatar.Root, { ref: ref, borderWidth: "1px", borderColor: "gray.200", overflow: "hidden", ...rest, children: [jsxRuntime.jsx(react.Avatar.Fallback, { name: name }), jsxRuntime.jsx(react.Avatar.Image, { src: src })] }));
 });
 Avatar.displayName = 'Avatar';
 

package/dist/components/Avatar/Avatar.js.map

@@ -1 +1 @@
-{"version":3,"file":"Avatar.js","sources":["../../../src/components/Avatar/Avatar.tsx"],"sourcesContent":[null],"names":["forwardRef","_jsx","ChakraAvatar"],"mappings":";;;;;;;AAMO,MAAM,MAAM,GAAGA,gBAAU,CAAC,CAAC,EAAE,GAAG,IAAI,EAAqB,EAAE,GAAG,KAAI;IACvE,QACEC,eAACC,YAAY,EAAA,EACX,GAAG,EAAE,GAAG,EACR,WAAW,EAAC,KAAK,EACjB,WAAW,EAAC,UAAU,EACtB,QAAQ,EAAC,QAAQ,EAAA,GACb,IAAI,EAAA,CACR;AAEN,CAAC;AAED,MAAM,CAAC,WAAW,GAAG,QAAQ;;;;"}
+{"version":3,"file":"Avatar.js","sources":["../../../src/components/Avatar/Avatar.tsx"],"sourcesContent":[null],"names":["forwardRef","_jsxs","ChakraAvatar","_jsx"],"mappings":";;;;;;;AAWO,MAAM,MAAM,GAAGA,gBAAU,CAA8B,CAAC,KAAK,EAAE,GAAG,KAAI;IAC3E,MAAM,EAAE,GAAG,EAAE,IAAI,EAAE,GAAG,IAAI,EAAE,GAAG,KAAK;IACpC,QACEC,gBAACC,YAAY,CAAC,IAAI,EAAA,EAChB,GAAG,EAAE,GAAG,EACR,WAAW,EAAC,KAAK,EACjB,WAAW,EAAC,UAAU,EACtB,QAAQ,EAAC,QAAQ,EAAA,GACb,IAAI,EAAA,QAAA,EAAA,CAERC,cAAA,CAACD,YAAY,CAAC,QAAQ,IAAC,IAAI,EAAE,IAAI,EAAA,CAAI,EACrCC,eAACD,YAAY,CAAC,KAAK,EAAA,EAAC,GAAG,EAAE,GAAG,EAAA,CAAI,CAAA,EAAA,CACd;AAExB,CAAC;AAED,MAAM,CAAC,WAAW,GAAG,QAAQ;;;;"}

package/dist/components/Avatar/Avatar.mjs

@@ -1,10 +1,11 @@
 "use client";
-import { jsx } from 'react/jsx-runtime';
+import { jsxs, jsx } from 'react/jsx-runtime';
 import { forwardRef } from 'react';
 import { Avatar as Avatar$1 } from '@chakra-ui/react';
 
-const Avatar = forwardRef(({ ...rest }, ref) => {
-    return (jsx(Avatar$1, { ref: ref, borderWidth: "1px", borderColor: "gray.200", overflow: "hidden", ...rest }));
+const Avatar = forwardRef((props, ref) => {
+    const { src, name, ...rest } = props;
+    return (jsxs(Avatar$1.Root, { ref: ref, borderWidth: "1px", borderColor: "gray.200", overflow: "hidden", ...rest, children: [jsx(Avatar$1.Fallback, { name: name }), jsx(Avatar$1.Image, { src: src })] }));
 });
 Avatar.displayName = 'Avatar';
 

package/dist/components/Avatar/Avatar.mjs.map

@@ -1 +1 @@
-{"version":3,"file":"Avatar.mjs","sources":["../../../src/components/Avatar/Avatar.tsx"],"sourcesContent":[null],"names":["_jsx","ChakraAvatar"],"mappings":";;;;;AAMO,MAAM,MAAM,GAAG,UAAU,CAAC,CAAC,EAAE,GAAG,IAAI,EAAqB,EAAE,GAAG,KAAI;IACvE,QACEA,IAACC,QAAY,EAAA,EACX,GAAG,EAAE,GAAG,EACR,WAAW,EAAC,KAAK,EACjB,WAAW,EAAC,UAAU,EACtB,QAAQ,EAAC,QAAQ,EAAA,GACb,IAAI,EAAA,CACR;AAEN,CAAC;AAED,MAAM,CAAC,WAAW,GAAG,QAAQ;;;;"}
+{"version":3,"file":"Avatar.mjs","sources":["../../../src/components/Avatar/Avatar.tsx"],"sourcesContent":[null],"names":["_jsxs","ChakraAvatar","_jsx"],"mappings":";;;;;AAWO,MAAM,MAAM,GAAG,UAAU,CAA8B,CAAC,KAAK,EAAE,GAAG,KAAI;IAC3E,MAAM,EAAE,GAAG,EAAE,IAAI,EAAE,GAAG,IAAI,EAAE,GAAG,KAAK;IACpC,QACEA,KAACC,QAAY,CAAC,IAAI,EAAA,EAChB,GAAG,EAAE,GAAG,EACR,WAAW,EAAC,KAAK,EACjB,WAAW,EAAC,UAAU,EACtB,QAAQ,EAAC,QAAQ,EAAA,GACb,IAAI,EAAA,QAAA,EAAA,CAERC,GAAA,CAACD,QAAY,CAAC,QAAQ,IAAC,IAAI,EAAE,IAAI,EAAA,CAAI,EACrCC,IAACD,QAAY,CAAC,KAAK,EAAA,EAAC,GAAG,EAAE,GAAG,EAAA,CAAI,CAAA,EAAA,CACd;AAExB,CAAC;AAED,MAAM,CAAC,WAAW,GAAG,QAAQ;;;;"}

package/dist/components/Badge/Badge.d.ts

@@ -1,3 +1,16 @@
-import { BadgeProps as ChakraBadgeProps } from '@chakra-ui/react';
-export declare const Badge: import("react").ForwardRefExoticComponent<ChakraBadgeProps & import("react").RefAttributes<HTMLButtonElement>>;
+import { BadgeProps } from './Badge.types';
+/**
+ * Badge component with color variants using the Golden Ratio color system.
+ *
+ * @example
+ * ```tsx
+ * <Badge>Default</Badge>
+ * <Badge variant="success">Completed</Badge>
+ * <Badge variant="danger">Error</Badge>
+ * <Badge variant="warning">Pending</Badge>
+ * <Badge variant="secondary">Featured</Badge>
+ * <Badge variant="neutral">Draft</Badge>
+ * ```
+ */
+export declare const Badge: import("react").ForwardRefExoticComponent<BadgeProps & import("react").RefAttributes<HTMLButtonElement>>;
 //# sourceMappingURL=Badge.d.ts.map

package/dist/components/Badge/Badge.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"Badge.d.ts","sourceRoot":"","sources":["../../../src/components/Badge/Badge.tsx"],"names":[],"mappings":"AACA,OAAO,EAEL,UAAU,IAAI,gBAAgB,EAC/B,MAAM,kBAAkB,CAAC;AAI1B,eAAO,MAAM,KAAK,gHAejB,CAAC"}
+{"version":3,"file":"Badge.d.ts","sourceRoot":"","sources":["../../../src/components/Badge/Badge.tsx"],"names":[],"mappings":"AAIA,OAAO,EAAE,UAAU,EAAE,MAAM,eAAe,CAAC;AAE3C;;;;;;;;;;;;GAYG;AACH,eAAO,MAAM,KAAK,0GAgBjB,CAAC"}

package/dist/components/Badge/Badge.js

@@ -6,8 +6,21 @@ var React = require('react');
 var react = require('@chakra-ui/react');
 var Badge_styles = require('./Badge.styles.js');
 
-const Badge = React.forwardRef(({ textTransform = 'none', ...rest }, ref) => {
-    return (jsxRuntime.jsx(react.Badge, { ...Badge_styles.baseStyles, w: "fit-content", textTransform: textTransform, ...rest, ref: ref }));
+/**
+ * Badge component with color variants using the Golden Ratio color system.
+ *
+ * @example
+ * ```tsx
+ * <Badge>Default</Badge>
+ * <Badge variant="success">Completed</Badge>
+ * <Badge variant="danger">Error</Badge>
+ * <Badge variant="warning">Pending</Badge>
+ * <Badge variant="secondary">Featured</Badge>
+ * <Badge variant="neutral">Draft</Badge>
+ * ```
+ */
+const Badge = React.forwardRef(({ textTransform = 'none', variant = 'primary', ...rest }, ref) => {
+    return (jsxRuntime.jsx(react.Badge, { ...Badge_styles.baseStyles, ...Badge_styles.variantStyles[variant], w: "fit-content", textTransform: textTransform, ...rest, ref: ref }));
 });
 Badge.displayName = 'Badge';
 

package/dist/components/Badge/Badge.js.map

@@ -1 +1 @@
-{"version":3,"file":"Badge.js","sources":["../../../src/components/Badge/Badge.tsx"],"sourcesContent":[null],"names":["forwardRef","_jsx","ChakraBadge","baseStyles"],"mappings":";;;;;;;;AAQO,MAAM,KAAK,GAAGA,gBAAU,CAC7B,CACE,EAAE,aAAa,GAAG,MAAM,EAAE,GAAG,IAAI,EAAoB,EACrD,GAAqC,KACnC;IACF,QACEC,eAACC,WAAW,EAAA,EAAA,GACNC,uBAAU,EACd,CAAC,EAAC,aAAa,EACf,aAAa,EAAE,aAAa,KACxB,IAAI,EACR,GAAG,EAAE,GAAG,EAAA,CACR;AAEN,CAAC;AAGH,KAAK,CAAC,WAAW,GAAG,OAAO;;;;"}
+{"version":3,"file":"Badge.js","sources":["../../../src/components/Badge/Badge.tsx"],"sourcesContent":[null],"names":["forwardRef","_jsx","ChakraBadge","baseStyles","variantStyles"],"mappings":";;;;;;;;AAMA;;;;;;;;;;;;AAYG;MACU,KAAK,GAAGA,gBAAU,CAC7B,CACE,EAAE,aAAa,GAAG,MAAM,EAAE,OAAO,GAAG,SAAS,EAAE,GAAG,IAAI,EAAc,EACpE,GAAqC,KACnC;IACF,QACEC,cAAA,CAACC,WAAW,EAAA,EAAA,GACNC,uBAAU,EAAA,GACVC,0BAAa,CAAC,OAAO,CAAC,EAC1B,CAAC,EAAC,aAAa,EACf,aAAa,EAAE,aAAa,EAAA,GACxB,IAAI,EACR,GAAG,EAAE,GAAG,EAAA,CACR;AAEN,CAAC;AAGH,KAAK,CAAC,WAAW,GAAG,OAAO;;;;"}

package/dist/components/Badge/Badge.mjs

@@ -2,10 +2,23 @@
 import { jsx } from 'react/jsx-runtime';
 import { forwardRef } from 'react';
 import { Badge as Badge$1 } from '@chakra-ui/react';
-import { baseStyles } from './Badge.styles.mjs';
+import { variantStyles, baseStyles } from './Badge.styles.mjs';
 
-const Badge = forwardRef(({ textTransform = 'none', ...rest }, ref) => {
-    return (jsx(Badge$1, { ...baseStyles, w: "fit-content", textTransform: textTransform, ...rest, ref: ref }));
+/**
+ * Badge component with color variants using the Golden Ratio color system.
+ *
+ * @example
+ * ```tsx
+ * <Badge>Default</Badge>
+ * <Badge variant="success">Completed</Badge>
+ * <Badge variant="danger">Error</Badge>
+ * <Badge variant="warning">Pending</Badge>
+ * <Badge variant="secondary">Featured</Badge>
+ * <Badge variant="neutral">Draft</Badge>
+ * ```
+ */
+const Badge = forwardRef(({ textTransform = 'none', variant = 'primary', ...rest }, ref) => {
+    return (jsx(Badge$1, { ...baseStyles, ...variantStyles[variant], w: "fit-content", textTransform: textTransform, ...rest, ref: ref }));
 });
 Badge.displayName = 'Badge';
 

package/dist/components/Badge/Badge.mjs.map

@@ -1 +1 @@
-{"version":3,"file":"Badge.mjs","sources":["../../../src/components/Badge/Badge.tsx"],"sourcesContent":[null],"names":["_jsx","ChakraBadge"],"mappings":";;;;;;AAQO,MAAM,KAAK,GAAG,UAAU,CAC7B,CACE,EAAE,aAAa,GAAG,MAAM,EAAE,GAAG,IAAI,EAAoB,EACrD,GAAqC,KACnC;IACF,QACEA,IAACC,OAAW,EAAA,EAAA,GACN,UAAU,EACd,CAAC,EAAC,aAAa,EACf,aAAa,EAAE,aAAa,KACxB,IAAI,EACR,GAAG,EAAE,GAAG,EAAA,CACR;AAEN,CAAC;AAGH,KAAK,CAAC,WAAW,GAAG,OAAO;;;;"}
+{"version":3,"file":"Badge.mjs","sources":["../../../src/components/Badge/Badge.tsx"],"sourcesContent":[null],"names":["_jsx","ChakraBadge"],"mappings":";;;;;;AAMA;;;;;;;;;;;;AAYG;MACU,KAAK,GAAG,UAAU,CAC7B,CACE,EAAE,aAAa,GAAG,MAAM,EAAE,OAAO,GAAG,SAAS,EAAE,GAAG,IAAI,EAAc,EACpE,GAAqC,KACnC;IACF,QACEA,GAAA,CAACC,OAAW,EAAA,EAAA,GACN,UAAU,EAAA,GACV,aAAa,CAAC,OAAO,CAAC,EAC1B,CAAC,EAAC,aAAa,EACf,aAAa,EAAE,aAAa,EAAA,GACxB,IAAI,EACR,GAAG,EAAE,GAAG,EAAA,CACR;AAEN,CAAC;AAGH,KAAK,CAAC,WAAW,GAAG,OAAO;;;;"}

package/dist/components/Badge/Badge.styles.d.ts

@@ -1,12 +1,29 @@
+import { BadgeVariant } from './Badge.types';
+/**
+ * Badge base styles using the Golden Ratio color system.
+ *
+ * These styles are shared across all badge variants.
+ */
 export declare const baseStyles: {
     borderRadius: string;
     px: number;
-    fontSize: string;
+    textStyle: string;
     fontWeight: string;
-    color: string;
-    bgColor: string;
     display: string;
     alignItems: string;
     justifyContent: string;
 };
+/**
+ * Badge variant styles using the Golden Ratio color system.
+ *
+ * Each variant uses the `lightest` background shade with `dark` text
+ * for optimal readability and WCAG AA compliance.
+ *
+ * Pattern: bg = `*.lightest`, color = `*.dark`
+ * This matches the Alert/Toast/Banner component styling.
+ */
+export declare const variantStyles: Record<BadgeVariant, {
+    bgColor: string;
+    color: string;
+}>;
 //# sourceMappingURL=Badge.styles.d.ts.map

package/dist/components/Badge/Badge.styles.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"Badge.styles.d.ts","sourceRoot":"","sources":["../../../src/components/Badge/Badge.styles.ts"],"names":[],"mappings":"AAAA,eAAO,MAAM,UAAU;;;;;;;;;;CAUtB,CAAC"}
+{"version":3,"file":"Badge.styles.d.ts","sourceRoot":"","sources":["../../../src/components/Badge/Badge.styles.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,YAAY,EAAE,MAAM,eAAe,CAAC;AAE7C;;;;GAIG;AACH,eAAO,MAAM,UAAU;;;;;;;;CAQtB,CAAC;AAEF;;;;;;;;GAQG;AACH,eAAO,MAAM,aAAa,EAAE,MAAM,CAChC,YAAY,EACZ;IAAE,OAAO,EAAE,MAAM,CAAC;IAAC,KAAK,EAAE,MAAM,CAAA;CAAE,CAuDnC,CAAC"}

package/dist/components/Badge/Badge.styles.js

@@ -1,17 +1,80 @@
 "use client";
 'use strict';
 
+/**
+ * Badge base styles using the Golden Ratio color system.
+ *
+ * These styles are shared across all badge variants.
+ */
 const baseStyles = {
     borderRadius: '2xl',
     px: 2.5,
-    fontSize: 'subtitle',
+    textStyle: 'subtitle',
     fontWeight: 'medium',
-    color: 'primary.dark',
-    bgColor: 'primary.light',
     display: 'flex',
     alignItems: 'center',
     justifyContent: 'center',
 };
+/**
+ * Badge variant styles using the Golden Ratio color system.
+ *
+ * Each variant uses the `lightest` background shade with `dark` text
+ * for optimal readability and WCAG AA compliance.
+ *
+ * Pattern: bg = `*.lightest`, color = `*.dark`
+ * This matches the Alert/Toast/Banner component styling.
+ */
+const variantStyles = {
+    /**
+     * Primary badge - Default, general purpose
+     * Blue lightest background with dark blue text
+     */
+    primary: {
+        bgColor: 'primary.lightest', // #E8EEFB
+        color: 'primary.dark', // #0D317D
+    },
+    /**
+     * Secondary badge - Accent, highlight
+     * Violet lightest background with dark violet text
+     */
+    secondary: {
+        bgColor: 'secondary.lightest', // #F4E8FB
+        color: 'secondary.dark', // #570D7D
+    },
+    /**
+     * Success badge - Positive states
+     * Green lightest background with dark green text
+     */
+    success: {
+        bgColor: 'success.lightest', // #E9FBE8
+        color: 'success.dark', // #147D0D
+    },
+    /**
+     * Warning badge - Caution states
+     * Gold lightest background with dark gold text
+     */
+    warning: {
+        bgColor: 'warning.lightest', // #FBF6E8
+        color: 'warning.dark', // #7D610D
+    },
+    /**
+     * Danger badge - Error/negative states
+     * Rose lightest background with dark rose text
+     */
+    danger: {
+        bgColor: 'danger.lightest', // #FBE8E9
+        color: 'danger.dark', // #7D0D14
+    },
+    /**
+     * Neutral badge - Neutral information
+     * Gray background with dark gray text
+     */
+    neutral: {
+        bgColor: 'gray.100', // #F0F3F9
+        color: 'gray.1200', // #2A3142
+    },
+};
 
 exports.baseStyles = baseStyles;
+exports.variantStyles = variantStyles;
 //# sourceMappingURL=Badge.styles.js.map

package/dist/components/Badge/Badge.styles.js.map

@@ -1 +1 @@
-{"version":3,"file":"Badge.styles.js","sources":["../../../src/components/Badge/Badge.styles.ts"],"sourcesContent":[null],"names":[],"mappings":";;;AAAO,MAAM,UAAU,GAAG;AACxB,IAAA,YAAY,EAAE,KAAK;AACnB,IAAA,EAAE,EAAE,GAAG;AACP,IAAA,QAAQ,EAAE,UAAU;AACpB,IAAA,UAAU,EAAE,QAAQ;AACpB,IAAA,KAAK,EAAE,cAAc;AACrB,IAAA,OAAO,EAAE,eAAe;AACxB,IAAA,OAAO,EAAE,MAAM;AACf,IAAA,UAAU,EAAE,QAAQ;AACpB,IAAA,cAAc,EAAE,QAAQ;;;;;"}
+{"version":3,"file":"Badge.styles.js","sources":["../../../src/components/Badge/Badge.styles.ts"],"sourcesContent":[null],"names":[],"mappings":";;;AAEA;;;;AAIG;AACI,MAAM,UAAU,GAAG;AACxB,IAAA,YAAY,EAAE,KAAK;AACnB,IAAA,EAAE,EAAE,GAAG;AACP,IAAA,SAAS,EAAE,UAAU;AACrB,IAAA,UAAU,EAAE,QAAQ;AACpB,IAAA,OAAO,EAAE,MAAM;AACf,IAAA,UAAU,EAAE,QAAQ;AACpB,IAAA,cAAc,EAAE,QAAQ;;AAG1B;;;;;;;;AAQG;AACI,MAAM,aAAa,GAGtB;AACF;;;AAGG;AACH,IAAA,OAAO,EAAE;QACP,OAAO,EAAE,kBAAkB;QAC3B,KAAK,EAAE,cAAc;AACtB,KAAA;AAED;;;AAGG;AACH,IAAA,SAAS,EAAE;QACT,OAAO,EAAE,oBAAoB;QAC7B,KAAK,EAAE,gBAAgB;AACxB,KAAA;AAED;;;AAGG;AACH,IAAA,OAAO,EAAE;QACP,OAAO,EAAE,kBAAkB;QAC3B,KAAK,EAAE,cAAc;AACtB,KAAA;AAED;;;AAGG;AACH,IAAA,OAAO,EAAE;QACP,OAAO,EAAE,kBAAkB;QAC3B,KAAK,EAAE,cAAc;AACtB,KAAA;AAED;;;AAGG;AACH,IAAA,MAAM,EAAE;QACN,OAAO,EAAE,iBAAiB;QAC1B,KAAK,EAAE,aAAa;AACrB,KAAA;AAED;;;AAGG;AACH,IAAA,OAAO,EAAE;QACP,OAAO,EAAE,UAAU;QACnB,KAAK,EAAE,WAAW;AACnB,KAAA;;;;;;"}