@kushagradhawan/kookie-ui 0.1.3 → 0.1.5

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

@@ -1,8 +1,17 @@
 import * as React from 'react';
 import { BaseButton } from './_internal/base-button.js';
-interface ButtonProps extends React.ComponentPropsWithoutRef<typeof BaseButton> {
-}
-declare const Button: React.ForwardRefExoticComponent<ButtonProps & React.RefAttributes<HTMLButtonElement>>;
+import type { BaseButtonProps } from './_internal/base-button.js';
+type ButtonElement = React.ElementRef<typeof BaseButton>;
+type ButtonOwnProps = Omit<BaseButtonProps, 'as'>;
+type ButtonProps<C extends React.ElementType = 'button'> = ButtonOwnProps & {
+    as?: C;
+} & Omit<React.ComponentPropsWithoutRef<C>, keyof ButtonOwnProps>;
+type ButtonComponent = <C extends React.ElementType = 'button'>(props: ButtonProps<C> & {
+    ref?: React.ForwardedRef<ButtonElement>;
+}) => React.ReactElement | null;
+declare const Button: ButtonComponent & {
+    displayName?: string;
+};
 export { Button };
 export type { ButtonProps };
 //# sourceMappingURL=button.d.ts.map

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

@@ -1 +1 @@
-{"version":3,"file":"button.d.ts","sourceRoot":"","sources":["../../../src/components/button.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,KAAK,MAAM,OAAO,CAAC;AAG/B,OAAO,EAAE,UAAU,EAAE,MAAM,4BAA4B,CAAC;AAGxD,UAAU,WAAY,SAAQ,KAAK,CAAC,wBAAwB,CAAC,OAAO,UAAU,CAAC;CAAG;AAClF,QAAA,MAAM,MAAM,uFAIX,CAAC;AAGF,OAAO,EAAE,MAAM,EAAE,CAAC;AAClB,YAAY,EAAE,WAAW,EAAE,CAAC"}
+{"version":3,"file":"button.d.ts","sourceRoot":"","sources":["../../../src/components/button.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,KAAK,MAAM,OAAO,CAAC;AAG/B,OAAO,EAAE,UAAU,EAAE,MAAM,4BAA4B,CAAC;AACxD,OAAO,KAAK,EAAE,eAAe,EAAE,MAAM,4BAA4B,CAAC;AAElE,KAAK,aAAa,GAAG,KAAK,CAAC,UAAU,CAAC,OAAO,UAAU,CAAC,CAAC;AAGzD,KAAK,cAAc,GAAG,IAAI,CAAC,eAAe,EAAE,IAAI,CAAC,CAAC;AAElD,KAAK,WAAW,CAAC,CAAC,SAAS,KAAK,CAAC,WAAW,GAAG,QAAQ,IAAI,cAAc,GAAG;IAC1E,EAAE,CAAC,EAAE,CAAC,CAAC;CACR,GAAG,IAAI,CAAC,KAAK,CAAC,wBAAwB,CAAC,CAAC,CAAC,EAAE,MAAM,cAAc,CAAC,CAAC;AAElE,KAAK,eAAe,GAAG,CAAC,CAAC,SAAS,KAAK,CAAC,WAAW,GAAG,QAAQ,EAC5D,KAAK,EAAE,WAAW,CAAC,CAAC,CAAC,GAAG;IAAE,GAAG,CAAC,EAAE,KAAK,CAAC,YAAY,CAAC,aAAa,CAAC,CAAA;CAAE,KAChE,KAAK,CAAC,YAAY,GAAG,IAAI,CAAC;AAE/B,QAAA,MAAM,MAAM,EAIP,eAAe,GAAG;IAAE,WAAW,CAAC,EAAE,MAAM,CAAA;CAAE,CAAC;AAIhD,OAAO,EAAE,MAAM,EAAE,CAAC;AAClB,YAAY,EAAE,WAAW,EAAE,CAAC"}

package/dist/esm/components/button.js

@@ -1,2 +1,2 @@
-import*as t from"react";import s from"classnames";import{BaseButton as p}from"./_internal/base-button.js";const o=t.forwardRef(({className:e,...n},r)=>t.createElement(p,{...n,ref:r,className:s("rt-Button",e)}));o.displayName="Button";export{o as Button};
+import*as t from"react";import r from"classnames";import{BaseButton as s}from"./_internal/base-button.js";const e=t.forwardRef(({className:o,...n},p)=>t.createElement(s,{...n,ref:p,className:r("rt-Button",o)}));e.displayName="Button";export{e as Button};
 //# sourceMappingURL=button.js.map

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

@@ -1,7 +1,7 @@
 {
   "version": 3,
   "sources": ["../../../src/components/button.tsx"],
-  "sourcesContent": ["import * as React from 'react';\nimport classNames from 'classnames';\n\nimport { BaseButton } from './_internal/base-button.js';\n\ntype ButtonElement = React.ElementRef<typeof BaseButton>;\ninterface ButtonProps extends React.ComponentPropsWithoutRef<typeof BaseButton> {}\nconst Button = React.forwardRef<ButtonElement, ButtonProps>(\n  ({ className, ...props }, forwardedRef) => (\n    <BaseButton {...props} ref={forwardedRef} className={classNames('rt-Button', className)} />\n  )\n);\nButton.displayName = 'Button';\n\nexport { Button };\nexport type { ButtonProps };\n"],
-  "mappings": "AAAA,UAAYA,MAAW,QACvB,OAAOC,MAAgB,aAEvB,OAAS,cAAAC,MAAkB,6BAI3B,MAAMC,EAASH,EAAM,WACnB,CAAC,CAAE,UAAAI,EAAW,GAAGC,CAAM,EAAGC,IACxBN,EAAA,cAACE,EAAA,CAAY,GAAGG,EAAO,IAAKC,EAAc,UAAWL,EAAW,YAAaG,CAAS,EAAG,CAE7F,EACAD,EAAO,YAAc",
+  "sourcesContent": ["import * as React from 'react';\nimport classNames from 'classnames';\n\nimport { BaseButton } from './_internal/base-button.js';\nimport type { BaseButtonProps } from './_internal/base-button.js';\n\ntype ButtonElement = React.ElementRef<typeof BaseButton>;\n\n// Polymorphic Button props\ntype ButtonOwnProps = Omit<BaseButtonProps, 'as'>;\n\ntype ButtonProps<C extends React.ElementType = 'button'> = ButtonOwnProps & {\n  as?: C;\n} & Omit<React.ComponentPropsWithoutRef<C>, keyof ButtonOwnProps>;\n\ntype ButtonComponent = <C extends React.ElementType = 'button'>(\n  props: ButtonProps<C> & { ref?: React.ForwardedRef<ButtonElement> },\n) => React.ReactElement | null;\n\nconst Button = React.forwardRef(\n  ({ className, ...props }: ButtonProps, forwardedRef: React.ForwardedRef<ButtonElement>) => (\n    <BaseButton {...props} ref={forwardedRef} className={classNames('rt-Button', className)} />\n  ),\n) as ButtonComponent & { displayName?: string };\n\nButton.displayName = 'Button';\n\nexport { Button };\nexport type { ButtonProps };\n"],
+  "mappings": "AAAA,UAAYA,MAAW,QACvB,OAAOC,MAAgB,aAEvB,OAAS,cAAAC,MAAkB,6BAgB3B,MAAMC,EAASH,EAAM,WACnB,CAAC,CAAE,UAAAI,EAAW,GAAGC,CAAM,EAAgBC,IACrCN,EAAA,cAACE,EAAA,CAAY,GAAGG,EAAO,IAAKC,EAAc,UAAWL,EAAW,YAAaG,CAAS,EAAG,CAE7F,EAEAD,EAAO,YAAc",
   "names": ["React", "classNames", "BaseButton", "Button", "className", "props", "forwardedRef"]
 }

package/dist/esm/components/icon-button.d.ts

@@ -1,8 +1,17 @@
 import * as React from 'react';
 import { BaseButton } from './_internal/base-button.js';
-interface IconButtonProps extends React.ComponentPropsWithoutRef<typeof BaseButton> {
-}
-declare const IconButton: React.ForwardRefExoticComponent<IconButtonProps & React.RefAttributes<HTMLButtonElement>>;
+import type { BaseButtonProps } from './_internal/base-button.js';
+type IconButtonElement = React.ElementRef<typeof BaseButton>;
+type IconButtonOwnProps = Omit<BaseButtonProps, 'as'>;
+type IconButtonProps<C extends React.ElementType = 'button'> = IconButtonOwnProps & {
+    as?: C;
+} & Omit<React.ComponentPropsWithoutRef<C>, keyof IconButtonOwnProps>;
+type IconButtonComponent = <C extends React.ElementType = 'button'>(props: IconButtonProps<C> & {
+    ref?: React.ForwardedRef<IconButtonElement>;
+}) => React.ReactElement | null;
+declare const IconButton: IconButtonComponent & {
+    displayName?: string;
+};
 export { IconButton };
 export type { IconButtonProps };
 //# sourceMappingURL=icon-button.d.ts.map

package/dist/esm/components/icon-button.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"icon-button.d.ts","sourceRoot":"","sources":["../../../src/components/icon-button.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,KAAK,MAAM,OAAO,CAAC;AAG/B,OAAO,EAAE,UAAU,EAAE,MAAM,4BAA4B,CAAC;AAGxD,UAAU,eAAgB,SAAQ,KAAK,CAAC,wBAAwB,CAAC,OAAO,UAAU,CAAC;CAAG;AACtF,QAAA,MAAM,UAAU,2FAIf,CAAC;AAGF,OAAO,EAAE,UAAU,EAAE,CAAC;AACtB,YAAY,EAAE,eAAe,EAAE,CAAC"}
+{"version":3,"file":"icon-button.d.ts","sourceRoot":"","sources":["../../../src/components/icon-button.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,KAAK,MAAM,OAAO,CAAC;AAG/B,OAAO,EAAE,UAAU,EAAE,MAAM,4BAA4B,CAAC;AACxD,OAAO,KAAK,EAAE,eAAe,EAAE,MAAM,4BAA4B,CAAC;AAElE,KAAK,iBAAiB,GAAG,KAAK,CAAC,UAAU,CAAC,OAAO,UAAU,CAAC,CAAC;AAG7D,KAAK,kBAAkB,GAAG,IAAI,CAAC,eAAe,EAAE,IAAI,CAAC,CAAC;AAEtD,KAAK,eAAe,CAAC,CAAC,SAAS,KAAK,CAAC,WAAW,GAAG,QAAQ,IAAI,kBAAkB,GAAG;IAClF,EAAE,CAAC,EAAE,CAAC,CAAC;CACR,GAAG,IAAI,CAAC,KAAK,CAAC,wBAAwB,CAAC,CAAC,CAAC,EAAE,MAAM,kBAAkB,CAAC,CAAC;AAEtE,KAAK,mBAAmB,GAAG,CAAC,CAAC,SAAS,KAAK,CAAC,WAAW,GAAG,QAAQ,EAChE,KAAK,EAAE,eAAe,CAAC,CAAC,CAAC,GAAG;IAAE,GAAG,CAAC,EAAE,KAAK,CAAC,YAAY,CAAC,iBAAiB,CAAC,CAAA;CAAE,KACxE,KAAK,CAAC,YAAY,GAAG,IAAI,CAAC;AAE/B,QAAA,MAAM,UAAU,EAOX,mBAAmB,GAAG;IAAE,WAAW,CAAC,EAAE,MAAM,CAAA;CAAE,CAAC;AAIpD,OAAO,EAAE,UAAU,EAAE,CAAC;AACtB,YAAY,EAAE,eAAe,EAAE,CAAC"}

package/dist/esm/components/icon-button.js

@@ -1,2 +1,2 @@
-import*as t from"react";import s from"classnames";import{BaseButton as p}from"./_internal/base-button.js";const o=t.forwardRef(({className:e,...n},r)=>t.createElement(p,{...n,ref:r,className:s("rt-IconButton",e)}));o.displayName="IconButton";export{o as IconButton};
+import*as t from"react";import r from"classnames";import{BaseButton as s}from"./_internal/base-button.js";const o=t.forwardRef(({className:e,...n},p)=>t.createElement(s,{...n,ref:p,className:r("rt-IconButton",e)}));o.displayName="IconButton";export{o as IconButton};
 //# sourceMappingURL=icon-button.js.map

package/dist/esm/components/icon-button.js.map

@@ -1,7 +1,7 @@
 {
   "version": 3,
   "sources": ["../../../src/components/icon-button.tsx"],
-  "sourcesContent": ["import * as React from 'react';\nimport classNames from 'classnames';\n\nimport { BaseButton } from './_internal/base-button.js';\n\ntype IconButtonElement = React.ElementRef<typeof BaseButton>;\ninterface IconButtonProps extends React.ComponentPropsWithoutRef<typeof BaseButton> {}\nconst IconButton = React.forwardRef<IconButtonElement, IconButtonProps>(\n  ({ className, ...props }, forwardedRef) => (\n    <BaseButton {...props} ref={forwardedRef} className={classNames('rt-IconButton', className)} />\n  )\n);\nIconButton.displayName = 'IconButton';\n\nexport { IconButton };\nexport type { IconButtonProps };\n"],
-  "mappings": "AAAA,UAAYA,MAAW,QACvB,OAAOC,MAAgB,aAEvB,OAAS,cAAAC,MAAkB,6BAI3B,MAAMC,EAAaH,EAAM,WACvB,CAAC,CAAE,UAAAI,EAAW,GAAGC,CAAM,EAAGC,IACxBN,EAAA,cAACE,EAAA,CAAY,GAAGG,EAAO,IAAKC,EAAc,UAAWL,EAAW,gBAAiBG,CAAS,EAAG,CAEjG,EACAD,EAAW,YAAc",
+  "sourcesContent": ["import * as React from 'react';\nimport classNames from 'classnames';\n\nimport { BaseButton } from './_internal/base-button.js';\nimport type { BaseButtonProps } from './_internal/base-button.js';\n\ntype IconButtonElement = React.ElementRef<typeof BaseButton>;\n\n// Polymorphic IconButton props\ntype IconButtonOwnProps = Omit<BaseButtonProps, 'as'>;\n\ntype IconButtonProps<C extends React.ElementType = 'button'> = IconButtonOwnProps & {\n  as?: C;\n} & Omit<React.ComponentPropsWithoutRef<C>, keyof IconButtonOwnProps>;\n\ntype IconButtonComponent = <C extends React.ElementType = 'button'>(\n  props: IconButtonProps<C> & { ref?: React.ForwardedRef<IconButtonElement> },\n) => React.ReactElement | null;\n\nconst IconButton = React.forwardRef(\n  (\n    { className, ...props }: IconButtonProps,\n    forwardedRef: React.ForwardedRef<IconButtonElement>,\n  ) => (\n    <BaseButton {...props} ref={forwardedRef} className={classNames('rt-IconButton', className)} />\n  ),\n) as IconButtonComponent & { displayName?: string };\n\nIconButton.displayName = 'IconButton';\n\nexport { IconButton };\nexport type { IconButtonProps };\n"],
+  "mappings": "AAAA,UAAYA,MAAW,QACvB,OAAOC,MAAgB,aAEvB,OAAS,cAAAC,MAAkB,6BAgB3B,MAAMC,EAAaH,EAAM,WACvB,CACE,CAAE,UAAAI,EAAW,GAAGC,CAAM,EACtBC,IAEAN,EAAA,cAACE,EAAA,CAAY,GAAGG,EAAO,IAAKC,EAAc,UAAWL,EAAW,gBAAiBG,CAAS,EAAG,CAEjG,EAEAD,EAAW,YAAc",
   "names": ["React", "classNames", "BaseButton", "IconButton", "className", "props", "forwardedRef"]
 }

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

@@ -54,6 +54,8 @@ export * as TextField from './text-field.js';
 export { Text, type TextProps } from './text.js';
 export { ThemePanel, type ThemePanelProps } from './theme-panel.js';
 export { Theme, ThemeContext, type ThemeProps, useThemeContext } from './theme.js';
+export { ToggleButton, type ToggleButtonProps } from './toggle-button.js';
+export { ToggleIconButton, type ToggleIconButtonProps } from './toggle-icon-button.js';
 export { Tooltip, type TooltipProps } from './tooltip.js';
 export { VisuallyHidden, type VisuallyHiddenProps } from './visually-hidden.js';
 //# sourceMappingURL=index.d.ts.map

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

@@ -1 +1 @@
-{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../src/components/index.tsx"],"names":[],"mappings":"AAAA,OAAO,EAAE,cAAc,EAAE,KAAK,mBAAmB,EAAE,MAAM,sBAAsB,CAAC;AAChF,OAAO,KAAK,WAAW,MAAM,mBAAmB,CAAC;AACjD,OAAO,EAAE,WAAW,EAAE,KAAK,gBAAgB,EAAE,MAAM,mBAAmB,CAAC;AACvE,OAAO,EAAE,MAAM,EAAE,KAAK,WAAW,EAAE,MAAM,aAAa,CAAC;AACvD,OAAO,EAAE,KAAK,EAAE,KAAK,UAAU,EAAE,MAAM,YAAY,CAAC;AACpD,OAAO,EAAE,UAAU,EAAE,KAAK,eAAe,EAAE,MAAM,iBAAiB,CAAC;AACnE,OAAO,EAAE,GAAG,EAAE,KAAK,QAAQ,EAAE,MAAM,UAAU,CAAC;AAC9C,OAAO,EAAE,MAAM,EAAE,KAAK,WAAW,EAAE,MAAM,aAAa,CAAC;AACvD,OAAO,KAAK,OAAO,MAAM,cAAc,CAAC;AACxC,OAAO,EAAE,IAAI,EAAE,KAAK,SAAS,EAAE,MAAM,WAAW,CAAC;AACjD,OAAO,KAAK,aAAa,MAAM,qBAAqB,CAAC;AACrD,OAAO,KAAK,aAAa,MAAM,qBAAqB,CAAC;AACrD,OAAO,EAAE,QAAQ,EAAE,KAAK,aAAa,EAAE,MAAM,eAAe,CAAC;AAC7D,OAAO,EAAE,IAAI,EAAE,KAAK,SAAS,EAAE,MAAM,WAAW,CAAC;AACjD,OAAO,EAAE,SAAS,EAAE,KAAK,cAAc,EAAE,MAAM,gBAAgB,CAAC;AAChE,OAAO,KAAK,WAAW,MAAM,mBAAmB,CAAC;AACjD,OAAO,KAAK,QAAQ,MAAM,gBAAgB,CAAC;AAC3C,OAAO,KAAK,MAAM,MAAM,aAAa,CAAC;AACtC,OAAO,KAAK,YAAY,MAAM,oBAAoB,CAAC;AACnD,OAAO,EAAE,EAAE,EAAE,KAAK,OAAO,EAAE,MAAM,SAAS,CAAC;AAC3C,OAAO,EAAE,IAAI,EAAE,KAAK,SAAS,EAAE,MAAM,WAAW,CAAC;AACjD,OAAO,EAAE,IAAI,EAAE,KAAK,SAAS,EAAE,MAAM,WAAW,CAAC;AACjD,OAAO,EAAE,OAAO,EAAE,KAAK,YAAY,EAAE,MAAM,cAAc,CAAC;AAC1D,OAAO,KAAK,SAAS,MAAM,iBAAiB,CAAC;AAC7C,OAAO,EAAE,UAAU,EAAE,KAAK,eAAe,EAAE,MAAM,kBAAkB,CAAC;AACpE,OAAO,EACL,KAAK,SAAS,EACd,eAAe,EACf,cAAc,EACd,qBAAqB,EACrB,0BAA0B,GAC3B,MAAM,YAAY,CAAC;AACpB,OAAO,EAAE,KAAK,EAAE,KAAK,UAAU,EAAE,MAAM,YAAY,CAAC;AACpD,OAAO,EAAE,GAAG,EAAE,KAAK,QAAQ,EAAE,MAAM,UAAU,CAAC;AAC9C,OAAO,EAAE,IAAI,EAAE,KAAK,SAAS,EAAE,MAAM,WAAW,CAAC;AACjD,OAAO,KAAK,OAAO,MAAM,cAAc,CAAC;AACxC,OAAO,EAAE,MAAM,EAAE,KAAK,WAAW,EAAE,MAAM,aAAa,CAAC;AACvD,OAAO,EAAE,QAAQ,EAAE,KAAK,aAAa,EAAE,MAAM,eAAe,CAAC;AAC7D,OAAO,EAAE,KAAK,EAAE,KAAK,UAAU,EAAE,MAAM,YAAY,CAAC;AACpD,OAAO,KAAK,UAAU,MAAM,kBAAkB,CAAC;AAC/C,OAAO,KAAK,UAAU,MAAM,kBAAkB,CAAC;AAC/C,OAAO,EAAE,KAAK,EAAE,KAAK,UAAU,EAAE,MAAM,YAAY,CAAC;AACpD,OAAO,EAAE,KAAK,EAAE,KAAK,UAAU,EAAE,MAAM,YAAY,CAAC;AACpD,OAAO,EAAE,UAAU,EAAE,KAAK,eAAe,EAAE,MAAM,kBAAkB,CAAC;AACpE,OAAO,KAAK,gBAAgB,MAAM,wBAAwB,CAAC;AAC3D,OAAO,EAAE,OAAO,EAAE,KAAK,YAAY,EAAE,MAAM,cAAc,CAAC;AAC1D,OAAO,KAAK,MAAM,MAAM,aAAa,CAAC;AACtC,OAAO,EAAE,SAAS,EAAE,KAAK,cAAc,EAAE,MAAM,gBAAgB,CAAC;AAChE,OAAO,EAAE,QAAQ,EAAE,KAAK,aAAa,EAAE,MAAM,eAAe,CAAC;AAC7D,OAAO,EAAE,MAAM,EAAE,KAAK,WAAW,EAAE,MAAM,aAAa,CAAC;AACvD,OAAO,EAAE,IAAI,EAAE,SAAS,EAAE,MAAM,WAAW,CAAC;AAC5C,OAAO,EAAE,OAAO,EAAE,KAAK,YAAY,EAAE,MAAM,cAAc,CAAC;AAC1D,OAAO,EAAE,MAAM,EAAE,KAAK,WAAW,EAAE,MAAM,aAAa,CAAC;AACvD,OAAO,EAAE,MAAM,EAAE,KAAK,WAAW,EAAE,MAAM,aAAa,CAAC;AACvD,OAAO,KAAK,MAAM,MAAM,cAAc,CAAC;AACvC,OAAO,KAAK,KAAK,MAAM,YAAY,CAAC;AACpC,OAAO,KAAK,IAAI,MAAM,WAAW,CAAC;AAClC,OAAO,EAAE,QAAQ,EAAE,KAAK,aAAa,EAAE,MAAM,gBAAgB,CAAC;AAC9D,OAAO,KAAK,SAAS,MAAM,iBAAiB,CAAC;AAC7C,OAAO,EAAE,IAAI,EAAE,KAAK,SAAS,EAAE,MAAM,WAAW,CAAC;AACjD,OAAO,EAAE,UAAU,EAAE,KAAK,eAAe,EAAE,MAAM,kBAAkB,CAAC;AACpE,OAAO,EAAE,KAAK,EAAE,YAAY,EAAE,KAAK,UAAU,EAAE,eAAe,EAAE,MAAM,YAAY,CAAC;AACnF,OAAO,EAAE,OAAO,EAAE,KAAK,YAAY,EAAE,MAAM,cAAc,CAAC;AAC1D,OAAO,EAAE,cAAc,EAAE,KAAK,mBAAmB,EAAE,MAAM,sBAAsB,CAAC"}
+{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../src/components/index.tsx"],"names":[],"mappings":"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"}

package/dist/esm/components/index.js

@@ -1,2 +1,2 @@
-import{AccessibleIcon as e}from"./accessible-icon.js";import*as t from"./alert-dialog.js";import{AspectRatio as s}from"./aspect-ratio.js";import{Avatar as m}from"./avatar.js";import{Badge as f}from"./badge.js";import{Blockquote as P}from"./blockquote.js";import{Box as y}from"./box.js";import{Button as c}from"./button.js";import*as d from"./callout.js";import{Card as S}from"./card.js";import*as h from"./checkbox-cards.js";import*as T from"./checkbox-group.js";import{Checkbox as k}from"./checkbox.js";import{Code as g}from"./code.js";import{Container as I}from"./container.js";import*as B from"./context-menu.js";import*as R from"./data-list.js";import*as v from"./dialog.js";import*as D from"./dropdown-menu.js";import{Em as w}from"./em.js";import{Flex as F}from"./flex.js";import{Grid as q}from"./grid.js";import{Heading as K}from"./heading.js";import*as M from"./hover-card.js";import{IconButton as V}from"./icon-button.js";import{ChevronDownIcon as N,ThickCheckIcon as j,ThickChevronRightIcon as J,ThickDividerHorizontalIcon as O}from"./icons.js";import{Inset as W}from"./inset.js";import{Kbd as Y}from"./kbd.js";import{Link as _}from"./link.js";import*as $ from"./popover.js";import{Portal as ro}from"./portal.js";import{Progress as to}from"./progress.js";import{Quote as so}from"./quote.js";import*as xo from"./radio-cards.js";import*as mo from"./radio-group.js";import{Radio as fo}from"./radio.js";import{Reset as Po}from"./reset.js";import{ScrollArea as yo}from"./scroll-area.js";import*as lo from"./segmented-control.js";import{Section as Co}from"./section.js";import*as So from"./select.js";import{Separator as To}from"./separator.js";import{Skeleton as ko}from"./skeleton.js";import{Slider as go}from"./slider.js";import{Slot as Io,Slottable as Bo}from"./slot.js";import{Spinner as vo}from"./spinner.js";import{Strong as Ho}from"./strong.js";import{Switch as Go}from"./switch.js";import*as Fo from"./tab-nav.js";import*as Lo from"./table.js";import*as qo from"./tabs.js";import{TextArea as Ko}from"./text-area.js";import*as Mo from"./text-field.js";import{Text as Vo}from"./text.js";import{ThemePanel as No}from"./theme-panel.js";import{Theme as Jo,ThemeContext as Oo,useThemeContext as Uo}from"./theme.js";import{Tooltip as Xo}from"./tooltip.js";import{VisuallyHidden as Zo}from"./visually-hidden.js";export{e as AccessibleIcon,t as AlertDialog,s as AspectRatio,m as Avatar,f as Badge,P as Blockquote,y as Box,c as Button,d as Callout,S as Card,k as Checkbox,h as CheckboxCards,T as CheckboxGroup,N as ChevronDownIcon,g as Code,I as Container,B as ContextMenu,R as DataList,v as Dialog,D as DropdownMenu,w as Em,F as Flex,q as Grid,K as Heading,M as HoverCard,V as IconButton,W as Inset,Y as Kbd,_ as Link,$ as Popover,ro as Portal,to as Progress,so as Quote,fo as Radio,xo as RadioCards,mo as RadioGroup,Po as Reset,yo as ScrollArea,Co as Section,lo as SegmentedControl,So as Select,To as Separator,ko as Skeleton,go as Slider,Io as Slot,Bo as Slottable,vo as Spinner,Ho as Strong,Go as Switch,Fo as TabNav,Lo as Table,qo as Tabs,Vo as Text,Ko as TextArea,Mo as TextField,Jo as Theme,Oo as ThemeContext,No as ThemePanel,j as ThickCheckIcon,J as ThickChevronRightIcon,O as ThickDividerHorizontalIcon,Xo as Tooltip,Zo as VisuallyHidden,Uo as useThemeContext};
+import{AccessibleIcon as e}from"./accessible-icon.js";import*as t from"./alert-dialog.js";import{AspectRatio as s}from"./aspect-ratio.js";import{Avatar as m}from"./avatar.js";import{Badge as f}from"./badge.js";import{Blockquote as P}from"./blockquote.js";import{Box as i}from"./box.js";import{Button as c}from"./button.js";import*as d from"./callout.js";import{Card as C}from"./card.js";import*as g from"./checkbox-cards.js";import*as u from"./checkbox-group.js";import{Checkbox as h}from"./checkbox.js";import{Code as B}from"./code.js";import{Container as b}from"./container.js";import*as A from"./context-menu.js";import*as R from"./data-list.js";import*as v from"./dialog.js";import*as D from"./dropdown-menu.js";import{Em as w}from"./em.js";import{Flex as F}from"./flex.js";import{Grid as q}from"./grid.js";import{Heading as K}from"./heading.js";import*as M from"./hover-card.js";import{IconButton as V}from"./icon-button.js";import{ChevronDownIcon as N,ThickCheckIcon as j,ThickChevronRightIcon as J,ThickDividerHorizontalIcon as O}from"./icons.js";import{Inset as W}from"./inset.js";import{Kbd as Y}from"./kbd.js";import{Link as _}from"./link.js";import*as $ from"./popover.js";import{Portal as ro}from"./portal.js";import{Progress as to}from"./progress.js";import{Quote as so}from"./quote.js";import*as xo from"./radio-cards.js";import*as mo from"./radio-group.js";import{Radio as fo}from"./radio.js";import{Reset as Po}from"./reset.js";import{ScrollArea as io}from"./scroll-area.js";import*as lo from"./segmented-control.js";import{Section as To}from"./section.js";import*as Co from"./select.js";import{Separator as uo}from"./separator.js";import{Skeleton as ho}from"./skeleton.js";import{Slider as Bo}from"./slider.js";import{Slot as bo,Slottable as Ao}from"./slot.js";import{Spinner as vo}from"./spinner.js";import{Strong as Ho}from"./strong.js";import{Switch as Go}from"./switch.js";import*as Fo from"./tab-nav.js";import*as Lo from"./table.js";import*as qo from"./tabs.js";import{TextArea as Ko}from"./text-area.js";import*as Mo from"./text-field.js";import{Text as Vo}from"./text.js";import{ThemePanel as No}from"./theme-panel.js";import{Theme as Jo,ThemeContext as Oo,useThemeContext as Uo}from"./theme.js";import{ToggleButton as Xo}from"./toggle-button.js";import{ToggleIconButton as Zo}from"./toggle-icon-button.js";import{Tooltip as $o}from"./tooltip.js";import{VisuallyHidden as rr}from"./visually-hidden.js";export{e as AccessibleIcon,t as AlertDialog,s as AspectRatio,m as Avatar,f as Badge,P as Blockquote,i as Box,c as Button,d as Callout,C as Card,h as Checkbox,g as CheckboxCards,u as CheckboxGroup,N as ChevronDownIcon,B as Code,b as Container,A as ContextMenu,R as DataList,v as Dialog,D as DropdownMenu,w as Em,F as Flex,q as Grid,K as Heading,M as HoverCard,V as IconButton,W as Inset,Y as Kbd,_ as Link,$ as Popover,ro as Portal,to as Progress,so as Quote,fo as Radio,xo as RadioCards,mo as RadioGroup,Po as Reset,io as ScrollArea,To as Section,lo as SegmentedControl,Co as Select,uo as Separator,ho as Skeleton,Bo as Slider,bo as Slot,Ao as Slottable,vo as Spinner,Ho as Strong,Go as Switch,Fo as TabNav,Lo as Table,qo as Tabs,Vo as Text,Ko as TextArea,Mo as TextField,Jo as Theme,Oo as ThemeContext,No as ThemePanel,j as ThickCheckIcon,J as ThickChevronRightIcon,O as ThickDividerHorizontalIcon,Xo as ToggleButton,Zo as ToggleIconButton,$o as Tooltip,rr as VisuallyHidden,Uo as useThemeContext};
 //# sourceMappingURL=index.js.map

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

@@ -1,7 +1,7 @@
 {
   "version": 3,
   "sources": ["../../../src/components/index.tsx"],
-  "sourcesContent": ["export { AccessibleIcon, type AccessibleIconProps } from './accessible-icon.js';\nexport * as AlertDialog from './alert-dialog.js';\nexport { AspectRatio, type AspectRatioProps } from './aspect-ratio.js';\nexport { Avatar, type AvatarProps } from './avatar.js';\nexport { Badge, type BadgeProps } from './badge.js';\nexport { Blockquote, type BlockquoteProps } from './blockquote.js';\nexport { Box, type BoxProps } from './box.js';\nexport { Button, type ButtonProps } from './button.js';\nexport * as Callout from './callout.js';\nexport { Card, type CardProps } from './card.js';\nexport * as CheckboxCards from './checkbox-cards.js';\nexport * as CheckboxGroup from './checkbox-group.js';\nexport { Checkbox, type CheckboxProps } from './checkbox.js';\nexport { Code, type CodeProps } from './code.js';\nexport { Container, type ContainerProps } from './container.js';\nexport * as ContextMenu from './context-menu.js';\nexport * as DataList from './data-list.js';\nexport * as Dialog from './dialog.js';\nexport * as DropdownMenu from './dropdown-menu.js';\nexport { Em, type EmProps } from './em.js';\nexport { Flex, type FlexProps } from './flex.js';\nexport { Grid, type GridProps } from './grid.js';\nexport { Heading, type HeadingProps } from './heading.js';\nexport * as HoverCard from './hover-card.js';\nexport { IconButton, type IconButtonProps } from './icon-button.js';\nexport {\n  type IconProps,\n  ChevronDownIcon,\n  ThickCheckIcon,\n  ThickChevronRightIcon,\n  ThickDividerHorizontalIcon,\n} from './icons.js';\nexport { Inset, type InsetProps } from './inset.js';\nexport { Kbd, type KbdProps } from './kbd.js';\nexport { Link, type LinkProps } from './link.js';\nexport * as Popover from './popover.js';\nexport { Portal, type PortalProps } from './portal.js';\nexport { Progress, type ProgressProps } from './progress.js';\nexport { Quote, type QuoteProps } from './quote.js';\nexport * as RadioCards from './radio-cards.js';\nexport * as RadioGroup from './radio-group.js';\nexport { Radio, type RadioProps } from './radio.js';\nexport { Reset, type ResetProps } from './reset.js';\nexport { ScrollArea, type ScrollAreaProps } from './scroll-area.js';\nexport * as SegmentedControl from './segmented-control.js';\nexport { Section, type SectionProps } from './section.js';\nexport * as Select from './select.js';\nexport { Separator, type SeparatorProps } from './separator.js';\nexport { Skeleton, type SkeletonProps } from './skeleton.js';\nexport { Slider, type SliderProps } from './slider.js';\nexport { Slot, Slottable } from './slot.js';\nexport { Spinner, type SpinnerProps } from './spinner.js';\nexport { Strong, type StrongProps } from './strong.js';\nexport { Switch, type SwitchProps } from './switch.js';\nexport * as TabNav from './tab-nav.js';\nexport * as Table from './table.js';\nexport * as Tabs from './tabs.js';\nexport { TextArea, type TextAreaProps } from './text-area.js';\nexport * as TextField from './text-field.js';\nexport { Text, type TextProps } from './text.js';\nexport { ThemePanel, type ThemePanelProps } from './theme-panel.js';\nexport { Theme, ThemeContext, type ThemeProps, useThemeContext } from './theme.js';\nexport { Tooltip, type TooltipProps } from './tooltip.js';\nexport { VisuallyHidden, type VisuallyHiddenProps } from './visually-hidden.js';\n"],
-  "mappings": "AAAA,OAAS,kBAAAA,MAAgD,uBACzD,UAAYC,MAAiB,oBAC7B,OAAS,eAAAC,MAA0C,oBACnD,OAAS,UAAAC,MAAgC,cACzC,OAAS,SAAAC,MAA8B,aACvC,OAAS,cAAAC,MAAwC,kBACjD,OAAS,OAAAC,MAA0B,WACnC,OAAS,UAAAC,MAAgC,cACzC,UAAYC,MAAa,eACzB,OAAS,QAAAC,MAA4B,YACrC,UAAYC,MAAmB,sBAC/B,UAAYC,MAAmB,sBAC/B,OAAS,YAAAC,MAAoC,gBAC7C,OAAS,QAAAC,MAA4B,YACrC,OAAS,aAAAC,MAAsC,iBAC/C,UAAYC,MAAiB,oBAC7B,UAAYC,MAAc,iBAC1B,UAAYC,MAAY,cACxB,UAAYC,MAAkB,qBAC9B,OAAS,MAAAC,MAAwB,UACjC,OAAS,QAAAC,MAA4B,YACrC,OAAS,QAAAC,MAA4B,YACrC,OAAS,WAAAC,MAAkC,eAC3C,UAAYC,MAAe,kBAC3B,OAAS,cAAAC,MAAwC,mBACjD,OAEE,mBAAAC,EACA,kBAAAC,EACA,yBAAAC,EACA,8BAAAC,MACK,aACP,OAAS,SAAAC,MAA8B,aACvC,OAAS,OAAAC,MAA0B,WACnC,OAAS,QAAAC,MAA4B,YACrC,UAAYC,MAAa,eACzB,OAAS,UAAAC,OAAgC,cACzC,OAAS,YAAAC,OAAoC,gBAC7C,OAAS,SAAAC,OAA8B,aACvC,UAAYC,OAAgB,mBAC5B,UAAYC,OAAgB,mBAC5B,OAAS,SAAAC,OAA8B,aACvC,OAAS,SAAAC,OAA8B,aACvC,OAAS,cAAAC,OAAwC,mBACjD,UAAYC,OAAsB,yBAClC,OAAS,WAAAC,OAAkC,eAC3C,UAAYC,OAAY,cACxB,OAAS,aAAAC,OAAsC,iBAC/C,OAAS,YAAAC,OAAoC,gBAC7C,OAAS,UAAAC,OAAgC,cACzC,OAAS,QAAAC,GAAM,aAAAC,OAAiB,YAChC,OAAS,WAAAC,OAAkC,eAC3C,OAAS,UAAAC,OAAgC,cACzC,OAAS,UAAAC,OAAgC,cACzC,UAAYC,OAAY,eACxB,UAAYC,OAAW,aACvB,UAAYC,OAAU,YACtB,OAAS,YAAAC,OAAoC,iBAC7C,UAAYC,OAAe,kBAC3B,OAAS,QAAAC,OAA4B,YACrC,OAAS,cAAAC,OAAwC,mBACjD,OAAS,SAAAC,GAAO,gBAAAC,GAA+B,mBAAAC,OAAuB,aACtE,OAAS,WAAAC,OAAkC,eAC3C,OAAS,kBAAAC,OAAgD",
-  "names": ["AccessibleIcon", "AlertDialog", "AspectRatio", "Avatar", "Badge", "Blockquote", "Box", "Button", "Callout", "Card", "CheckboxCards", "CheckboxGroup", "Checkbox", "Code", "Container", "ContextMenu", "DataList", "Dialog", "DropdownMenu", "Em", "Flex", "Grid", "Heading", "HoverCard", "IconButton", "ChevronDownIcon", "ThickCheckIcon", "ThickChevronRightIcon", "ThickDividerHorizontalIcon", "Inset", "Kbd", "Link", "Popover", "Portal", "Progress", "Quote", "RadioCards", "RadioGroup", "Radio", "Reset", "ScrollArea", "SegmentedControl", "Section", "Select", "Separator", "Skeleton", "Slider", "Slot", "Slottable", "Spinner", "Strong", "Switch", "TabNav", "Table", "Tabs", "TextArea", "TextField", "Text", "ThemePanel", "Theme", "ThemeContext", "useThemeContext", "Tooltip", "VisuallyHidden"]
+  "sourcesContent": ["export { AccessibleIcon, type AccessibleIconProps } from './accessible-icon.js';\nexport * as AlertDialog from './alert-dialog.js';\nexport { AspectRatio, type AspectRatioProps } from './aspect-ratio.js';\nexport { Avatar, type AvatarProps } from './avatar.js';\nexport { Badge, type BadgeProps } from './badge.js';\nexport { Blockquote, type BlockquoteProps } from './blockquote.js';\nexport { Box, type BoxProps } from './box.js';\nexport { Button, type ButtonProps } from './button.js';\nexport * as Callout from './callout.js';\nexport { Card, type CardProps } from './card.js';\nexport * as CheckboxCards from './checkbox-cards.js';\nexport * as CheckboxGroup from './checkbox-group.js';\nexport { Checkbox, type CheckboxProps } from './checkbox.js';\nexport { Code, type CodeProps } from './code.js';\nexport { Container, type ContainerProps } from './container.js';\nexport * as ContextMenu from './context-menu.js';\nexport * as DataList from './data-list.js';\nexport * as Dialog from './dialog.js';\nexport * as DropdownMenu from './dropdown-menu.js';\nexport { Em, type EmProps } from './em.js';\nexport { Flex, type FlexProps } from './flex.js';\nexport { Grid, type GridProps } from './grid.js';\nexport { Heading, type HeadingProps } from './heading.js';\nexport * as HoverCard from './hover-card.js';\nexport { IconButton, type IconButtonProps } from './icon-button.js';\nexport {\n  type IconProps,\n  ChevronDownIcon,\n  ThickCheckIcon,\n  ThickChevronRightIcon,\n  ThickDividerHorizontalIcon,\n} from './icons.js';\nexport { Inset, type InsetProps } from './inset.js';\nexport { Kbd, type KbdProps } from './kbd.js';\nexport { Link, type LinkProps } from './link.js';\nexport * as Popover from './popover.js';\nexport { Portal, type PortalProps } from './portal.js';\nexport { Progress, type ProgressProps } from './progress.js';\nexport { Quote, type QuoteProps } from './quote.js';\nexport * as RadioCards from './radio-cards.js';\nexport * as RadioGroup from './radio-group.js';\nexport { Radio, type RadioProps } from './radio.js';\nexport { Reset, type ResetProps } from './reset.js';\nexport { ScrollArea, type ScrollAreaProps } from './scroll-area.js';\nexport * as SegmentedControl from './segmented-control.js';\nexport { Section, type SectionProps } from './section.js';\nexport * as Select from './select.js';\nexport { Separator, type SeparatorProps } from './separator.js';\nexport { Skeleton, type SkeletonProps } from './skeleton.js';\nexport { Slider, type SliderProps } from './slider.js';\nexport { Slot, Slottable } from './slot.js';\nexport { Spinner, type SpinnerProps } from './spinner.js';\nexport { Strong, type StrongProps } from './strong.js';\nexport { Switch, type SwitchProps } from './switch.js';\nexport * as TabNav from './tab-nav.js';\nexport * as Table from './table.js';\nexport * as Tabs from './tabs.js';\nexport { TextArea, type TextAreaProps } from './text-area.js';\nexport * as TextField from './text-field.js';\nexport { Text, type TextProps } from './text.js';\nexport { ThemePanel, type ThemePanelProps } from './theme-panel.js';\nexport { Theme, ThemeContext, type ThemeProps, useThemeContext } from './theme.js';\nexport { ToggleButton, type ToggleButtonProps } from './toggle-button.js';\nexport { ToggleIconButton, type ToggleIconButtonProps } from './toggle-icon-button.js';\nexport { Tooltip, type TooltipProps } from './tooltip.js';\nexport { VisuallyHidden, type VisuallyHiddenProps } from './visually-hidden.js';\n"],
+  "mappings": "AAAA,OAAS,kBAAAA,MAAgD,uBACzD,UAAYC,MAAiB,oBAC7B,OAAS,eAAAC,MAA0C,oBACnD,OAAS,UAAAC,MAAgC,cACzC,OAAS,SAAAC,MAA8B,aACvC,OAAS,cAAAC,MAAwC,kBACjD,OAAS,OAAAC,MAA0B,WACnC,OAAS,UAAAC,MAAgC,cACzC,UAAYC,MAAa,eACzB,OAAS,QAAAC,MAA4B,YACrC,UAAYC,MAAmB,sBAC/B,UAAYC,MAAmB,sBAC/B,OAAS,YAAAC,MAAoC,gBAC7C,OAAS,QAAAC,MAA4B,YACrC,OAAS,aAAAC,MAAsC,iBAC/C,UAAYC,MAAiB,oBAC7B,UAAYC,MAAc,iBAC1B,UAAYC,MAAY,cACxB,UAAYC,MAAkB,qBAC9B,OAAS,MAAAC,MAAwB,UACjC,OAAS,QAAAC,MAA4B,YACrC,OAAS,QAAAC,MAA4B,YACrC,OAAS,WAAAC,MAAkC,eAC3C,UAAYC,MAAe,kBAC3B,OAAS,cAAAC,MAAwC,mBACjD,OAEE,mBAAAC,EACA,kBAAAC,EACA,yBAAAC,EACA,8BAAAC,MACK,aACP,OAAS,SAAAC,MAA8B,aACvC,OAAS,OAAAC,MAA0B,WACnC,OAAS,QAAAC,MAA4B,YACrC,UAAYC,MAAa,eACzB,OAAS,UAAAC,OAAgC,cACzC,OAAS,YAAAC,OAAoC,gBAC7C,OAAS,SAAAC,OAA8B,aACvC,UAAYC,OAAgB,mBAC5B,UAAYC,OAAgB,mBAC5B,OAAS,SAAAC,OAA8B,aACvC,OAAS,SAAAC,OAA8B,aACvC,OAAS,cAAAC,OAAwC,mBACjD,UAAYC,OAAsB,yBAClC,OAAS,WAAAC,OAAkC,eAC3C,UAAYC,OAAY,cACxB,OAAS,aAAAC,OAAsC,iBAC/C,OAAS,YAAAC,OAAoC,gBAC7C,OAAS,UAAAC,OAAgC,cACzC,OAAS,QAAAC,GAAM,aAAAC,OAAiB,YAChC,OAAS,WAAAC,OAAkC,eAC3C,OAAS,UAAAC,OAAgC,cACzC,OAAS,UAAAC,OAAgC,cACzC,UAAYC,OAAY,eACxB,UAAYC,OAAW,aACvB,UAAYC,OAAU,YACtB,OAAS,YAAAC,OAAoC,iBAC7C,UAAYC,OAAe,kBAC3B,OAAS,QAAAC,OAA4B,YACrC,OAAS,cAAAC,OAAwC,mBACjD,OAAS,SAAAC,GAAO,gBAAAC,GAA+B,mBAAAC,OAAuB,aACtE,OAAS,gBAAAC,OAA4C,qBACrD,OAAS,oBAAAC,OAAoD,0BAC7D,OAAS,WAAAC,OAAkC,eAC3C,OAAS,kBAAAC,OAAgD",
+  "names": ["AccessibleIcon", "AlertDialog", "AspectRatio", "Avatar", "Badge", "Blockquote", "Box", "Button", "Callout", "Card", "CheckboxCards", "CheckboxGroup", "Checkbox", "Code", "Container", "ContextMenu", "DataList", "Dialog", "DropdownMenu", "Em", "Flex", "Grid", "Heading", "HoverCard", "IconButton", "ChevronDownIcon", "ThickCheckIcon", "ThickChevronRightIcon", "ThickDividerHorizontalIcon", "Inset", "Kbd", "Link", "Popover", "Portal", "Progress", "Quote", "RadioCards", "RadioGroup", "Radio", "Reset", "ScrollArea", "SegmentedControl", "Section", "Select", "Separator", "Skeleton", "Slider", "Slot", "Slottable", "Spinner", "Strong", "Switch", "TabNav", "Table", "Tabs", "TextArea", "TextField", "Text", "ThemePanel", "Theme", "ThemeContext", "useThemeContext", "ToggleButton", "ToggleIconButton", "Tooltip", "VisuallyHidden"]
 }

package/dist/esm/components/toggle-button.d.ts

@@ -0,0 +1,11 @@
+import * as React from 'react';
+import { Button } from './button.js';
+interface ToggleButtonProps extends React.ComponentPropsWithoutRef<typeof Button> {
+    pressed?: boolean;
+    onPressedChange?: (pressed: boolean) => void;
+    defaultPressed?: boolean;
+}
+declare const ToggleButton: React.ForwardRefExoticComponent<Omit<ToggleButtonProps, "ref"> & React.RefAttributes<HTMLButtonElement>>;
+export { ToggleButton };
+export type { ToggleButtonProps };
+//# sourceMappingURL=toggle-button.d.ts.map

package/dist/esm/components/toggle-button.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"toggle-button.d.ts","sourceRoot":"","sources":["../../../src/components/toggle-button.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,KAAK,MAAM,OAAO,CAAC;AAE/B,OAAO,EAAE,MAAM,EAAE,MAAM,aAAa,CAAC;AAErC,UAAU,iBAAkB,SAAQ,KAAK,CAAC,wBAAwB,CAAC,OAAO,MAAM,CAAC;IAC/E,OAAO,CAAC,EAAE,OAAO,CAAC;IAClB,eAAe,CAAC,EAAE,CAAC,OAAO,EAAE,OAAO,KAAK,IAAI,CAAC;IAC7C,cAAc,CAAC,EAAE,OAAO,CAAC;CAC1B;AAID,QAAA,MAAM,YAAY,0GAajB,CAAC;AAGF,OAAO,EAAE,YAAY,EAAE,CAAC;AACxB,YAAY,EAAE,iBAAiB,EAAE,CAAC"}

package/dist/esm/components/toggle-button.js

@@ -0,0 +1,2 @@
+import*as e from"react";import{Toggle as l}from"radix-ui";import{Button as p}from"./button.js";const o=e.forwardRef(({pressed:t,onPressedChange:n,defaultPressed:r,...s},g)=>e.createElement(l.Root,{pressed:t,onPressedChange:n,defaultPressed:r,asChild:!0},e.createElement(p,{...s,ref:g})));o.displayName="ToggleButton";export{o as ToggleButton};
+//# sourceMappingURL=toggle-button.js.map

package/dist/esm/components/toggle-button.js.map

@@ -0,0 +1,7 @@
+{
+  "version": 3,
+  "sources": ["../../../src/components/toggle-button.tsx"],
+  "sourcesContent": ["import * as React from 'react';\nimport { Toggle } from 'radix-ui';\nimport { Button } from './button.js';\n\ninterface ToggleButtonProps extends React.ComponentPropsWithoutRef<typeof Button> {\n  pressed?: boolean;\n  onPressedChange?: (pressed: boolean) => void;\n  defaultPressed?: boolean;\n}\n\ntype ToggleButtonElement = React.ElementRef<typeof Button>;\n\nconst ToggleButton = React.forwardRef<ToggleButtonElement, ToggleButtonProps>(\n  ({ pressed, onPressedChange, defaultPressed, ...buttonProps }, forwardedRef) => {\n    return (\n      <Toggle.Root\n        pressed={pressed}\n        onPressedChange={onPressedChange}\n        defaultPressed={defaultPressed}\n        asChild\n      >\n        <Button {...buttonProps} ref={forwardedRef} />\n      </Toggle.Root>\n    );\n  },\n);\nToggleButton.displayName = 'ToggleButton';\n\nexport { ToggleButton };\nexport type { ToggleButtonProps };\n"],
+  "mappings": "AAAA,UAAYA,MAAW,QACvB,OAAS,UAAAC,MAAc,WACvB,OAAS,UAAAC,MAAc,cAUvB,MAAMC,EAAeH,EAAM,WACzB,CAAC,CAAE,QAAAI,EAAS,gBAAAC,EAAiB,eAAAC,EAAgB,GAAGC,CAAY,EAAGC,IAE3DR,EAAA,cAACC,EAAO,KAAP,CACC,QAASG,EACT,gBAAiBC,EACjB,eAAgBC,EAChB,QAAO,IAEPN,EAAA,cAACE,EAAA,CAAQ,GAAGK,EAAa,IAAKC,EAAc,CAC9C,CAGN,EACAL,EAAa,YAAc",
+  "names": ["React", "Toggle", "Button", "ToggleButton", "pressed", "onPressedChange", "defaultPressed", "buttonProps", "forwardedRef"]
+}

package/dist/esm/components/toggle-icon-button.d.ts

@@ -0,0 +1,11 @@
+import * as React from 'react';
+import { IconButton } from './icon-button.js';
+interface ToggleIconButtonProps extends React.ComponentPropsWithoutRef<typeof IconButton> {
+    pressed?: boolean;
+    onPressedChange?: (pressed: boolean) => void;
+    defaultPressed?: boolean;
+}
+declare const ToggleIconButton: React.ForwardRefExoticComponent<Omit<ToggleIconButtonProps, "ref"> & React.RefAttributes<HTMLButtonElement>>;
+export { ToggleIconButton };
+export type { ToggleIconButtonProps };
+//# sourceMappingURL=toggle-icon-button.d.ts.map

package/dist/esm/components/toggle-icon-button.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"toggle-icon-button.d.ts","sourceRoot":"","sources":["../../../src/components/toggle-icon-button.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,KAAK,MAAM,OAAO,CAAC;AAE/B,OAAO,EAAE,UAAU,EAAE,MAAM,kBAAkB,CAAC;AAE9C,UAAU,qBAAsB,SAAQ,KAAK,CAAC,wBAAwB,CAAC,OAAO,UAAU,CAAC;IACvF,OAAO,CAAC,EAAE,OAAO,CAAC;IAClB,eAAe,CAAC,EAAE,CAAC,OAAO,EAAE,OAAO,KAAK,IAAI,CAAC;IAC7C,cAAc,CAAC,EAAE,OAAO,CAAC;CAC1B;AAID,QAAA,MAAM,gBAAgB,8GAarB,CAAC;AAGF,OAAO,EAAE,gBAAgB,EAAE,CAAC;AAC5B,YAAY,EAAE,qBAAqB,EAAE,CAAC"}

package/dist/esm/components/toggle-icon-button.js

@@ -0,0 +1,2 @@
+import*as o from"react";import{Toggle as l}from"radix-ui";import{IconButton as p}from"./icon-button.js";const e=o.forwardRef(({pressed:t,onPressedChange:n,defaultPressed:r,...s},g)=>o.createElement(l.Root,{pressed:t,onPressedChange:n,defaultPressed:r,asChild:!0},o.createElement(p,{...s,ref:g})));e.displayName="ToggleIconButton";export{e as ToggleIconButton};
+//# sourceMappingURL=toggle-icon-button.js.map

package/dist/esm/components/toggle-icon-button.js.map

@@ -0,0 +1,7 @@
+{
+  "version": 3,
+  "sources": ["../../../src/components/toggle-icon-button.tsx"],
+  "sourcesContent": ["import * as React from 'react';\nimport { Toggle } from 'radix-ui';\nimport { IconButton } from './icon-button.js';\n\ninterface ToggleIconButtonProps extends React.ComponentPropsWithoutRef<typeof IconButton> {\n  pressed?: boolean;\n  onPressedChange?: (pressed: boolean) => void;\n  defaultPressed?: boolean;\n}\n\ntype ToggleIconButtonElement = React.ElementRef<typeof IconButton>;\n\nconst ToggleIconButton = React.forwardRef<ToggleIconButtonElement, ToggleIconButtonProps>(\n  ({ pressed, onPressedChange, defaultPressed, ...iconButtonProps }, forwardedRef) => {\n    return (\n      <Toggle.Root\n        pressed={pressed}\n        onPressedChange={onPressedChange}\n        defaultPressed={defaultPressed}\n        asChild\n      >\n        <IconButton {...iconButtonProps} ref={forwardedRef} />\n      </Toggle.Root>\n    );\n  },\n);\nToggleIconButton.displayName = 'ToggleIconButton';\n\nexport { ToggleIconButton };\nexport type { ToggleIconButtonProps };\n"],
+  "mappings": "AAAA,UAAYA,MAAW,QACvB,OAAS,UAAAC,MAAc,WACvB,OAAS,cAAAC,MAAkB,mBAU3B,MAAMC,EAAmBH,EAAM,WAC7B,CAAC,CAAE,QAAAI,EAAS,gBAAAC,EAAiB,eAAAC,EAAgB,GAAGC,CAAgB,EAAGC,IAE/DR,EAAA,cAACC,EAAO,KAAP,CACC,QAASG,EACT,gBAAiBC,EACjB,eAAgBC,EAChB,QAAO,IAEPN,EAAA,cAACE,EAAA,CAAY,GAAGK,EAAiB,IAAKC,EAAc,CACtD,CAGN,EACAL,EAAiB,YAAc",
+  "names": ["React", "Toggle", "IconButton", "ToggleIconButton", "pressed", "onPressedChange", "defaultPressed", "iconButtonProps", "forwardedRef"]
+}

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@kushagradhawan/kookie-ui",
-  "version": "0.1.3",
+  "version": "0.1.5",
   "description": "A modern React component library with beautiful design tokens and flexible theming",
   "keywords": [
     "react",

package/src/components/_internal/base-button.css

@@ -21,6 +21,11 @@
   height: var(--base-button-height);
 }
 
+.rt-BaseButton:where(.rt-full-width) {
+  display: flex;
+  width: 100%;
+}
+
 /***************************************************************************************************
  *                                                                                                 *
  * SIZES                                                                                           *
@@ -346,3 +351,58 @@
     background-color: var(--gray-a2);
   }
 }
+
+/***************************************************************************************************
+ *                                                                                                 *
+ * TOGGLE PRESSED STATES                                                                           *
+ *                                                                                                 *
+ ***************************************************************************************************/
+
+/* Toggle button pressed states for all variants */
+.rt-BaseButton:where([data-state='on']) {
+  /* Classic variant pressed */
+  &:where(.rt-variant-classic) {
+    background: linear-gradient(to bottom, var(--accent-10), var(--accent-11));
+    box-shadow: var(--base-button-classic-hover-shadow);
+
+    &:where(.rt-high-contrast) {
+      background: linear-gradient(to bottom, var(--accent-11), var(--accent-12));
+      filter: contrast(0.88) saturate(1.1) brightness(1.1);
+
+      &:where(:not([data-accent-color='gray'])) {
+        background: var(--accent-12);
+      }
+    }
+  }
+
+  /* Solid variant pressed */
+  &:where(.rt-variant-solid) {
+    background-color: var(--accent-10);
+
+    &:where(.rt-high-contrast) {
+      background-color: var(--accent-12);
+      filter: var(--base-button-solid-high-contrast-hover-filter);
+    }
+  }
+
+  /* Soft variant pressed */
+  &:where(.rt-variant-soft) {
+    background-color: var(--accent-a5);
+  }
+
+  /* Ghost variant pressed */
+  &:where(.rt-variant-ghost) {
+    background-color: var(--accent-a4);
+  }
+
+  /* Outline variant pressed */
+  &:where(.rt-variant-outline) {
+    background-color: var(--accent-a3);
+  }
+
+  /* Surface variant pressed */
+  &:where(.rt-variant-surface) {
+    background-color: var(--accent-a3);
+    box-shadow: inset 0 0 0 1px var(--accent-a8);
+  }
+}

package/src/components/_internal/base-button.props.ts

@@ -16,10 +16,12 @@ const baseButtonPropDefs = {
   ...highContrastPropDef,
   ...radiusPropDef,
   loading: { type: 'boolean', className: 'rt-loading', default: false },
+  fullWidth: { type: 'boolean', className: 'rt-full-width', default: false },
 } satisfies {
   size: PropDef<(typeof sizes)[number]>;
   variant: PropDef<(typeof variants)[number]>;
   loading: PropDef<boolean>;
+  fullWidth: PropDef<boolean>;
 };
 
 export { baseButtonPropDefs };

package/src/components/_internal/base-button.tsx

@@ -16,22 +16,36 @@ import type { GetPropDefTypes } from '../../props/prop-def.js';
 
 type BaseButtonElement = React.ElementRef<'button'>;
 type BaseButtonOwnProps = GetPropDefTypes<typeof baseButtonPropDefs>;
-interface BaseButtonProps
-  extends ComponentPropsWithout<'button', RemovedProps>,
-    MarginProps,
-    BaseButtonOwnProps {}
+
+// Polymorphic types
+type PolymorphicBaseButtonProps<C extends React.ElementType = 'button'> = {
+  as?: C;
+} & BaseButtonOwnProps &
+  MarginProps &
+  Omit<React.ComponentPropsWithoutRef<C>, keyof BaseButtonOwnProps | keyof MarginProps | 'as'>;
+
+interface BaseButtonProps extends PolymorphicBaseButtonProps {}
+
 const BaseButton = React.forwardRef<BaseButtonElement, BaseButtonProps>((props, forwardedRef) => {
   const { size = baseButtonPropDefs.size.default } = props;
   const {
     className,
     children,
     asChild,
+    as,
     color,
     radius,
     disabled = props.loading,
     ...baseButtonProps
   } = extractProps(props, baseButtonPropDefs, marginPropDefs);
-  const Comp = asChild ? Slot.Root : 'button';
+
+  // asChild takes precedence over as prop
+  const Comp = asChild ? Slot.Root : as || 'button';
+
+  // Only pass disabled for elements that support it
+  const shouldPassDisabled =
+    asChild || !as || ['button', 'input', 'textarea', 'select'].includes(as);
+
   return (
     <Comp
       // The `data-disabled` attribute enables correct styles when doing `<Button asChild disabled>`
@@ -41,7 +55,7 @@ const BaseButton = React.forwardRef<BaseButtonElement, BaseButtonProps>((props,
       {...baseButtonProps}
       ref={forwardedRef}
       className={classNames('rt-reset', 'rt-BaseButton', className)}
-      disabled={disabled}
+      {...(shouldPassDisabled && { disabled })}
     >
       {props.loading ? (
         <>

package/src/components/button.tsx

@@ -2,14 +2,27 @@ import * as React from 'react';
 import classNames from 'classnames';
 
 import { BaseButton } from './_internal/base-button.js';
+import type { BaseButtonProps } from './_internal/base-button.js';
 
 type ButtonElement = React.ElementRef<typeof BaseButton>;
-interface ButtonProps extends React.ComponentPropsWithoutRef<typeof BaseButton> {}
-const Button = React.forwardRef<ButtonElement, ButtonProps>(
-  ({ className, ...props }, forwardedRef) => (
+
+// Polymorphic Button props
+type ButtonOwnProps = Omit<BaseButtonProps, 'as'>;
+
+type ButtonProps<C extends React.ElementType = 'button'> = ButtonOwnProps & {
+  as?: C;
+} & Omit<React.ComponentPropsWithoutRef<C>, keyof ButtonOwnProps>;
+
+type ButtonComponent = <C extends React.ElementType = 'button'>(
+  props: ButtonProps<C> & { ref?: React.ForwardedRef<ButtonElement> },
+) => React.ReactElement | null;
+
+const Button = React.forwardRef(
+  ({ className, ...props }: ButtonProps, forwardedRef: React.ForwardedRef<ButtonElement>) => (
     <BaseButton {...props} ref={forwardedRef} className={classNames('rt-Button', className)} />
-  )
-);
+  ),
+) as ButtonComponent & { displayName?: string };
+
 Button.displayName = 'Button';
 
 export { Button };

package/src/components/icon-button.tsx

@@ -2,14 +2,30 @@ import * as React from 'react';
 import classNames from 'classnames';
 
 import { BaseButton } from './_internal/base-button.js';
+import type { BaseButtonProps } from './_internal/base-button.js';
 
 type IconButtonElement = React.ElementRef<typeof BaseButton>;
-interface IconButtonProps extends React.ComponentPropsWithoutRef<typeof BaseButton> {}
-const IconButton = React.forwardRef<IconButtonElement, IconButtonProps>(
-  ({ className, ...props }, forwardedRef) => (
+
+// Polymorphic IconButton props
+type IconButtonOwnProps = Omit<BaseButtonProps, 'as'>;
+
+type IconButtonProps<C extends React.ElementType = 'button'> = IconButtonOwnProps & {
+  as?: C;
+} & Omit<React.ComponentPropsWithoutRef<C>, keyof IconButtonOwnProps>;
+
+type IconButtonComponent = <C extends React.ElementType = 'button'>(
+  props: IconButtonProps<C> & { ref?: React.ForwardedRef<IconButtonElement> },
+) => React.ReactElement | null;
+
+const IconButton = React.forwardRef(
+  (
+    { className, ...props }: IconButtonProps,
+    forwardedRef: React.ForwardedRef<IconButtonElement>,
+  ) => (
     <BaseButton {...props} ref={forwardedRef} className={classNames('rt-IconButton', className)} />
-  )
-);
+  ),
+) as IconButtonComponent & { displayName?: string };
+
 IconButton.displayName = 'IconButton';
 
 export { IconButton };

package/src/components/index.tsx

@@ -60,5 +60,7 @@ export * as TextField from './text-field.js';
 export { Text, type TextProps } from './text.js';
 export { ThemePanel, type ThemePanelProps } from './theme-panel.js';
 export { Theme, ThemeContext, type ThemeProps, useThemeContext } from './theme.js';
+export { ToggleButton, type ToggleButtonProps } from './toggle-button.js';
+export { ToggleIconButton, type ToggleIconButtonProps } from './toggle-icon-button.js';
 export { Tooltip, type TooltipProps } from './tooltip.js';
 export { VisuallyHidden, type VisuallyHiddenProps } from './visually-hidden.js';

package/src/components/toggle-button.tsx

@@ -0,0 +1,30 @@
+import * as React from 'react';
+import { Toggle } from 'radix-ui';
+import { Button } from './button.js';
+
+interface ToggleButtonProps extends React.ComponentPropsWithoutRef<typeof Button> {
+  pressed?: boolean;
+  onPressedChange?: (pressed: boolean) => void;
+  defaultPressed?: boolean;
+}
+
+type ToggleButtonElement = React.ElementRef<typeof Button>;
+
+const ToggleButton = React.forwardRef<ToggleButtonElement, ToggleButtonProps>(
+  ({ pressed, onPressedChange, defaultPressed, ...buttonProps }, forwardedRef) => {
+    return (
+      <Toggle.Root
+        pressed={pressed}
+        onPressedChange={onPressedChange}
+        defaultPressed={defaultPressed}
+        asChild
+      >
+        <Button {...buttonProps} ref={forwardedRef} />
+      </Toggle.Root>
+    );
+  },
+);
+ToggleButton.displayName = 'ToggleButton';
+
+export { ToggleButton };
+export type { ToggleButtonProps };

package/src/components/toggle-icon-button.tsx

@@ -0,0 +1,30 @@
+import * as React from 'react';
+import { Toggle } from 'radix-ui';
+import { IconButton } from './icon-button.js';
+
+interface ToggleIconButtonProps extends React.ComponentPropsWithoutRef<typeof IconButton> {
+  pressed?: boolean;
+  onPressedChange?: (pressed: boolean) => void;
+  defaultPressed?: boolean;
+}
+
+type ToggleIconButtonElement = React.ElementRef<typeof IconButton>;
+
+const ToggleIconButton = React.forwardRef<ToggleIconButtonElement, ToggleIconButtonProps>(
+  ({ pressed, onPressedChange, defaultPressed, ...iconButtonProps }, forwardedRef) => {
+    return (
+      <Toggle.Root
+        pressed={pressed}
+        onPressedChange={onPressedChange}
+        defaultPressed={defaultPressed}
+        asChild
+      >
+        <IconButton {...iconButtonProps} ref={forwardedRef} />
+      </Toggle.Root>
+    );
+  },
+);
+ToggleIconButton.displayName = 'ToggleIconButton';
+
+export { ToggleIconButton };
+export type { ToggleIconButtonProps };

package/styles.css

@@ -6553,6 +6553,10 @@
 .rt-BaseButton:where(.rt-loading) {
   position: relative;
 }
+.rt-BaseButton:where(.rt-full-width) {
+  display: flex;
+  width: 100%;
+}
 .rt-BaseButton:where(.rt-r-size-1) {
   --base-button-classic-active-padding-top: 1px;
   --base-button-height: var(--space-5);
@@ -6905,6 +6909,37 @@
   box-shadow: inset 0 0 0 1px var(--gray-a6);
   background-color: var(--gray-a2);
 }
+.rt-BaseButton:where([data-state='on']):where(.rt-variant-classic) {
+  background: linear-gradient(to bottom, var(--accent-10), var(--accent-11));
+  box-shadow: var(--base-button-classic-hover-shadow);
+}
+.rt-BaseButton:where([data-state='on']):where(.rt-variant-classic):where(.rt-high-contrast) {
+  background: linear-gradient(to bottom, var(--accent-11), var(--accent-12));
+  filter: contrast(0.88) saturate(1.1) brightness(1.1);
+}
+.rt-BaseButton:where([data-state='on']):where(.rt-variant-classic):where(.rt-high-contrast):where(:not([data-accent-color='gray'])) {
+  background: var(--accent-12);
+}
+.rt-BaseButton:where([data-state='on']):where(.rt-variant-solid) {
+  background-color: var(--accent-10);
+}
+.rt-BaseButton:where([data-state='on']):where(.rt-variant-solid):where(.rt-high-contrast) {
+  background-color: var(--accent-12);
+  filter: var(--base-button-solid-high-contrast-hover-filter);
+}
+.rt-BaseButton:where([data-state='on']):where(.rt-variant-soft) {
+  background-color: var(--accent-a5);
+}
+.rt-BaseButton:where([data-state='on']):where(.rt-variant-ghost) {
+  background-color: var(--accent-a4);
+}
+.rt-BaseButton:where([data-state='on']):where(.rt-variant-outline) {
+  background-color: var(--accent-a3);
+}
+.rt-BaseButton:where([data-state='on']):where(.rt-variant-surface) {
+  background-color: var(--accent-a3);
+  box-shadow: inset 0 0 0 1px var(--accent-a8);
+}
 .rt-Button:where(:not(.rt-variant-ghost)) :where(svg) {
   opacity: 0.9;
 }