@spark-ui/components 18.1.0 → 18.1.2

package/dist/toggle-group/index.mjs.map

@@ -1 +1 @@
-{"version":3,"file":"index.mjs","names":[],"sources":["../../src/toggle-group/useRenderSlot.tsx","../../src/toggle-group/ToggleGroup.tsx","../../src/toggle-group/ToggleGroupToggle.tsx","../../src/toggle-group/index.ts"],"sourcesContent":["import { Slot } from '../slot'\n\nexport function useRenderSlot(asChild: boolean) {\n  return asChild ? ({ ...props }: object) => <Slot {...props} /> : undefined\n}\n","import { ToggleGroup as BaseToggleGroup } from '@base-ui/react/toggle-group'\nimport { cx } from 'class-variance-authority'\nimport { type ComponentPropsWithoutRef, type PropsWithChildren, Ref } from 'react'\n\nimport { useRenderSlot } from './useRenderSlot'\n\nexport interface ToggleGroupProps extends PropsWithChildren, ComponentPropsWithoutRef<'div'> {\n  /**\n   * Change the component to the HTML tag or custom component of the only child. This will merge the original component props with the props of the supplied element/component and change the underlying DOM node.\n   * @default false\n   */\n  asChild?: boolean\n  /**\n   * Whether multiple toggles can be pressed at the same time.\n   * @default false\n   */\n  multiple?: boolean\n  /**\n   * The default value(s) of the toggle group when it is initially rendered.\n   * Use when you do not need to control its value(s).\n   * Must be an array even for single selection mode.\n   */\n  defaultValue?: readonly any[]\n  /**\n   * The controlled value(s) of the toggle group.\n   * Must be used in conjunction with `onValueChange`.\n   * Must be an array even for single selection mode.\n   */\n  value?: readonly any[]\n  /**\n   * Event handler called when the value changes.\n   * Always receives an array, even for single selection mode.\n   */\n  onValueChange?: (value: readonly any[]) => void\n  ref?: Ref<HTMLDivElement>\n}\n\nexport const ToggleGroup = ({\n  /**\n   * Default Base UI Primitive values\n   * see https://base-ui.com/react/components/toggle-group\n   */\n  asChild = false,\n  multiple = false,\n  children,\n  className,\n  ref,\n  ...rest\n}: ToggleGroupProps) => {\n  const renderSlot = useRenderSlot(asChild)\n\n  return (\n    <BaseToggleGroup\n      {...rest}\n      ref={ref}\n      multiple={multiple}\n      className={cx('gap-none inline-flex', className)}\n      data-spark-component=\"toggle-group\"\n      {...(asChild && { render: renderSlot })}\n    >\n      {children}\n    </BaseToggleGroup>\n  )\n}\n\nToggleGroup.displayName = 'ToggleGroup'\n","import { Toggle } from '@base-ui/react/toggle'\nimport { cx } from 'class-variance-authority'\nimport { type ComponentPropsWithoutRef, Ref } from 'react'\n\nimport { useRenderSlot } from './useRenderSlot'\n\nexport interface ToggleGroupToggleProps extends ComponentPropsWithoutRef<'button'> {\n  /**\n   * A unique value that identifies the toggle within the group.\n   */\n  value: any\n  /**\n   * Change the component to the HTML tag or custom component of the only child. This will merge the original component props with the props of the supplied element/component and change the underlying DOM node.\n   * @default false\n   */\n  asChild?: boolean\n  /**\n   * When true, prevents the user from interacting with the toggle.\n   * @default false\n   */\n  disabled?: boolean\n  ref?: Ref<HTMLButtonElement>\n}\n\n/** A toggle button within a toggle group. Renders a <button> element. */\nexport const ToggleGroupToggle = ({\n  /**\n   * Default Base UI Primitive values\n   * see https://base-ui.com/react/components/toggle\n   */\n  asChild = false,\n  value,\n  disabled = false,\n  children,\n  className,\n  ref,\n  ...rest\n}: ToggleGroupToggleProps) => {\n  const renderSlot = useRenderSlot(asChild)\n\n  return (\n    <Toggle\n      data-spark-component=\"toggle-group-toggle\"\n      ref={ref}\n      className={cx(\n        'focus-visible:u-outline-inset',\n        'disabled:cursor-not-allowed disabled:opacity-dim-3',\n        className\n      )}\n      {...(asChild && { render: renderSlot })}\n      disabled={disabled}\n      value={value}\n      {...rest}\n    >\n      {children}\n    </Toggle>\n  )\n}\n\nToggleGroupToggle.displayName = 'ToggleGroup.Toggle'\n","import { ToggleGroup as Root } from './ToggleGroup'\nimport { ToggleGroupToggle as Toggle } from './ToggleGroupToggle'\n\n/**\n * A set of two-state buttons that can be toggled on or off within a group context.\n */\nexport const ToggleGroup: typeof Root & {\n  Toggle: typeof Toggle\n} = Object.assign(Root, {\n  Toggle,\n})\n\nToggleGroup.displayName = 'ToggleGroup'\nToggle.displayName = 'ToggleGroup.Toggle'\n\nexport { type ToggleGroupProps } from './ToggleGroup'\nexport { type ToggleGroupToggleProps } from './ToggleGroupToggle'\n"],"mappings":";;;;;;AAEA,SAAgB,EAAc,GAAkB;CAC9C,OAAO,KAAW,EAAE,GAAG,QAAoB,kBAAC,GAAD,EAAM,GAAI,EAAQ,CAAA,IAAI,KAAA;AACnE;;;ACiCA,IAAa,KAAe,EAK1B,aAAU,IACV,cAAW,IACX,aACA,cACA,QACA,GAAG,QACmB;CACtB,IAAM,IAAa,EAAc,CAAO;CAExC,OACE,kBAAC,GAAD;EACE,GAAI;EACC;EACK;EACV,WAAW,EAAG,wBAAwB,CAAS;EAC/C,wBAAqB;EACrB,GAAK,KAAW,EAAE,QAAQ,EAAW;EAEpC;CACc,CAAA;AAErB;AAEA,EAAY,cAAc;;;ACxC1B,IAAa,KAAqB,EAKhC,aAAU,IACV,UACA,cAAW,IACX,aACA,cACA,QACA,GAAG,QACyB;CAC5B,IAAM,IAAa,EAAc,CAAO;CAExC,OACE,kBAAC,GAAD;EACE,wBAAqB;EAChB;EACL,WAAW,EACT,iCACA,sDACA,CACF;EACA,GAAK,KAAW,EAAE,QAAQ,EAAW;EAC3B;EACH;EACP,GAAI;EAEH;CACK,CAAA;AAEZ;AAEA,EAAkB,cAAc;;;ACrDhC,IAAa,IAET,OAAO,OAAO,GAAM,EACtB,QAAA,EACF,CAAC;AAED,EAAY,cAAc,eAC1B,EAAO,cAAc"}
+{"version":3,"file":"index.mjs","names":[],"sources":["../../src/toggle-group/ToggleGroup.tsx","../../src/toggle-group/ToggleGroupToggle.tsx","../../src/toggle-group/index.ts"],"sourcesContent":["import { ToggleGroup as BaseToggleGroup } from '@base-ui/react/toggle-group'\nimport { createRenderSlot } from '@spark-ui/internal-utils'\nimport { cx } from 'class-variance-authority'\nimport { type ComponentPropsWithoutRef, type PropsWithChildren, Ref } from 'react'\n\nexport interface ToggleGroupProps extends PropsWithChildren, ComponentPropsWithoutRef<'div'> {\n  /**\n   * Change the component to the HTML tag or custom component of the only child. This will merge the original component props with the props of the supplied element/component and change the underlying DOM node.\n   * @default false\n   */\n  asChild?: boolean\n  /**\n   * Whether multiple toggles can be pressed at the same time.\n   * @default false\n   */\n  multiple?: boolean\n  /**\n   * The default value(s) of the toggle group when it is initially rendered.\n   * Use when you do not need to control its value(s).\n   * Must be an array even for single selection mode.\n   */\n  defaultValue?: readonly any[]\n  /**\n   * The controlled value(s) of the toggle group.\n   * Must be used in conjunction with `onValueChange`.\n   * Must be an array even for single selection mode.\n   */\n  value?: readonly any[]\n  /**\n   * Event handler called when the value changes.\n   * Always receives an array, even for single selection mode.\n   */\n  onValueChange?: (value: readonly any[]) => void\n  ref?: Ref<HTMLDivElement>\n}\n\nexport const ToggleGroup = ({\n  /**\n   * Default Base UI Primitive values\n   * see https://base-ui.com/react/components/toggle-group\n   */\n  asChild = false,\n  multiple = false,\n  children,\n  className,\n  ref,\n  ...rest\n}: ToggleGroupProps) => {\n  const { renderProp, innerChildren } = createRenderSlot(asChild, children)\n\n  return (\n    <BaseToggleGroup\n      {...rest}\n      ref={ref}\n      multiple={multiple}\n      className={cx('gap-none inline-flex', className)}\n      data-spark-component=\"toggle-group\"\n      {...(asChild && { render: renderProp })}\n    >\n      {innerChildren}\n    </BaseToggleGroup>\n  )\n}\n\nToggleGroup.displayName = 'ToggleGroup'\n","import { Toggle } from '@base-ui/react/toggle'\nimport { createRenderSlot } from '@spark-ui/internal-utils'\nimport { cx } from 'class-variance-authority'\nimport { type ComponentPropsWithoutRef, Ref } from 'react'\n\nexport interface ToggleGroupToggleProps extends ComponentPropsWithoutRef<'button'> {\n  /**\n   * A unique value that identifies the toggle within the group.\n   */\n  value: any\n  /**\n   * Change the component to the HTML tag or custom component of the only child. This will merge the original component props with the props of the supplied element/component and change the underlying DOM node.\n   * @default false\n   */\n  asChild?: boolean\n  /**\n   * When true, prevents the user from interacting with the toggle.\n   * @default false\n   */\n  disabled?: boolean\n  ref?: Ref<HTMLButtonElement>\n}\n\n/** A toggle button within a toggle group. Renders a <button> element. */\nexport const ToggleGroupToggle = ({\n  /**\n   * Default Base UI Primitive values\n   * see https://base-ui.com/react/components/toggle\n   */\n  asChild = false,\n  value,\n  disabled = false,\n  children,\n  className,\n  ref,\n  ...rest\n}: ToggleGroupToggleProps) => {\n  const { renderProp, innerChildren } = createRenderSlot(asChild, children)\n\n  return (\n    <Toggle\n      data-spark-component=\"toggle-group-toggle\"\n      ref={ref}\n      className={cx(\n        'focus-visible:u-outline-inset',\n        'disabled:cursor-not-allowed disabled:opacity-dim-3',\n        className\n      )}\n      {...(asChild && { render: renderProp })}\n      disabled={disabled}\n      value={value}\n      {...rest}\n    >\n      {innerChildren}\n    </Toggle>\n  )\n}\n\nToggleGroupToggle.displayName = 'ToggleGroup.Toggle'\n","import { ToggleGroup as Root } from './ToggleGroup'\nimport { ToggleGroupToggle as Toggle } from './ToggleGroupToggle'\n\n/**\n * A set of two-state buttons that can be toggled on or off within a group context.\n */\nexport const ToggleGroup: typeof Root & {\n  Toggle: typeof Toggle\n} = Object.assign(Root, {\n  Toggle,\n})\n\nToggleGroup.displayName = 'ToggleGroup'\nToggle.displayName = 'ToggleGroup.Toggle'\n\nexport { type ToggleGroupProps } from './ToggleGroup'\nexport { type ToggleGroupToggleProps } from './ToggleGroupToggle'\n"],"mappings":";;;;;;AAoCA,IAAa,KAAe,EAK1B,aAAU,IACV,cAAW,IACX,aACA,cACA,QACA,GAAG,QACmB;CACtB,IAAM,EAAE,eAAY,qBAAkB,EAAiB,GAAS,CAAQ;CAExE,OACE,kBAAC,GAAD;EACE,GAAI;EACC;EACK;EACV,WAAW,EAAG,wBAAwB,CAAS;EAC/C,wBAAqB;EACrB,GAAK,KAAW,EAAE,QAAQ,EAAW;YAEpC;CACc,CAAA;AAErB;AAEA,EAAY,cAAc;;;ACxC1B,IAAa,KAAqB,EAKhC,aAAU,IACV,UACA,cAAW,IACX,aACA,cACA,QACA,GAAG,QACyB;CAC5B,IAAM,EAAE,eAAY,qBAAkB,EAAiB,GAAS,CAAQ;CAExE,OACE,kBAAC,GAAD;EACE,wBAAqB;EAChB;EACL,WAAW,EACT,iCACA,sDACA,CACF;EACA,GAAK,KAAW,EAAE,QAAQ,EAAW;EAC3B;EACH;EACP,GAAI;YAEH;CACK,CAAA;AAEZ;AAEA,EAAkB,cAAc;;;ACpDhC,IAAa,IAET,OAAO,OAAO,GAAM,EACtB,QAAA,EACF,CAAC;AAED,EAAY,cAAc,eAC1B,EAAO,cAAc"}

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@spark-ui/components",
-  "version": "18.1.0",
+  "version": "18.1.2",
   "license": "MIT",
   "description": "Spark (Leboncoin design system) components.",
   "exports": {
@@ -47,15 +47,15 @@
     "build": "NODE_OPTIONS='--max-old-space-size=8192' vite build"
   },
   "dependencies": {
-    "@base-ui/react": "^1.6.0",
+    "@base-ui/react": "1.7.0",
     "@react-aria/utils": "^3.34.1",
     "@react-stately/collections": "^3.13.1",
     "@react-types/checkbox": "^3.11.0",
     "@react-types/grid": "^3.4.0",
     "@react-types/shared": "^3.36.0",
-    "@spark-ui/hooks": "18.1.0",
-    "@spark-ui/icons": "18.1.0",
-    "@spark-ui/internal-utils": "18.1.0",
+    "@spark-ui/hooks": "18.1.2",
+    "@spark-ui/icons": "18.1.2",
+    "@spark-ui/internal-utils": "18.1.2",
     "@zag-js/pagination": "1.30.0",
     "@zag-js/react": "1.30.0",
     "class-variance-authority": "0.7.1",
@@ -67,7 +67,7 @@
     "react-snap-carousel": "0.5.1"
   },
   "peerDependencies": {
-    "@spark-ui/theme-utils": "18.1.0",
+    "@spark-ui/theme-utils": "18.1.2",
     "react": "19.2.4",
     "react-dom": "19.2.4",
     "tailwindcss": "4.1.18"

package/dist/accordion/useRenderSlot.d.ts

@@ -1,3 +0,0 @@
-export declare function useRenderSlot(asChild: boolean, defaultTag: string): (({ ...props }: {
-    [x: string]: any;
-}) => import("react").JSX.Element) | undefined;

package/dist/alert-dialog/useRenderSlot.d.ts

@@ -1,3 +0,0 @@
-export declare function useRenderSlot(asChild: boolean, defaultTag: string): (({ ...props }: {
-    [x: string]: any;
-}) => import("react").JSX.Element) | undefined;

package/dist/collapsible/useRenderSlot.d.ts

@@ -1,3 +0,0 @@
-export declare function useRenderSlot(asChild: boolean, defaultTag: string): (({ ...props }: {
-    [x: string]: any;
-}) => import("react").JSX.Element) | undefined;

package/dist/drawer/useRenderSlot.d.ts

@@ -1,3 +0,0 @@
-export declare function useRenderSlot(asChild: boolean, defaultTag: string): (({ ...props }: {
-    [x: string]: any;
-}) => import("react").JSX.Element) | undefined;

package/dist/icon-DY4l9nsc.js

@@ -1,2 +0,0 @@
-const e=require("./visually-hidden/index.js");let t=require("class-variance-authority"),n=require("react"),r=require("react/jsx-runtime"),i=require("@spark-ui/internal-utils");var a=(0,t.cva)([`fill-current shrink-0`],{variants:{intent:(0,i.makeVariants)({current:[`text-current`],main:[`text-main`],support:[`text-support`],accent:[`text-accent`],success:[`text-success`],alert:[`text-alert`],error:[`text-error`],info:[`text-info`],neutral:[`text-neutral`]}),size:(0,i.makeVariants)({current:[`u-current-font-size`],sm:[`w-sz-16`,`h-sz-16`],md:[`w-sz-24`,`h-sz-24`],lg:[`w-sz-32`,`h-sz-32`],xl:[`w-sz-40`,`h-sz-40`]})}}),o=({label:t,className:i,size:o=`current`,intent:s=`current`,children:c,...l})=>(0,r.jsxs)(r.Fragment,{children:[(0,n.cloneElement)(n.Children.only(c),{className:a({className:i,size:o,intent:s}),"data-spark-component":`icon`,"aria-hidden":`true`,focusable:`false`,...l}),t&&(0,r.jsx)(e.VisuallyHidden,{children:t})]});o.displayName=`Icon`,Object.defineProperty(exports,"t",{enumerable:!0,get:function(){return o}});
-//# sourceMappingURL=icon-DY4l9nsc.js.map

package/dist/icon-button-C1ThqdK1.mjs

@@ -1,29 +0,0 @@
-import { t as e } from "./button-DwLTXeJX.mjs";
-import { cva as t } from "class-variance-authority";
-import { jsx as n } from "react/jsx-runtime";
-import { makeVariants as r } from "@spark-ui/internal-utils";
-//#region src/icon-button/IconButton.styles.tsx
-var i = t(["pl-0 pr-0"], { variants: { size: r({
-	sm: ["text-body-1"],
-	md: ["text-body-1"],
-	lg: ["text-display-3"]
-}) } }), a = ({ appearance: t, design: r = "filled", disabled: a = !1, intent: o = "main", shape: s = "pill", size: c = "md", className: l, ref: u, ...d }) => /* @__PURE__ */ n(e, {
-	"data-spark-component": "icon-button",
-	ref: u,
-	className: i({
-		size: c,
-		className: l
-	}),
-	appearance: t,
-	design: r,
-	disabled: a,
-	intent: o,
-	shape: s,
-	size: c,
-	...d
-});
-a.displayName = "IconButton";
-//#endregion
-export { a as t };
-
-//# sourceMappingURL=icon-button-C1ThqdK1.mjs.map

package/dist/icon-button-DRFf308H.js

@@ -1,2 +0,0 @@
-const e=require("./button-D0s-21qo.js");let t=require("class-variance-authority"),n=require("react/jsx-runtime"),r=require("@spark-ui/internal-utils");var i=(0,t.cva)([`pl-0 pr-0`],{variants:{size:(0,r.makeVariants)({sm:[`text-body-1`],md:[`text-body-1`],lg:[`text-display-3`]})}}),a=({appearance:t,design:r=`filled`,disabled:a=!1,intent:o=`main`,shape:s=`pill`,size:c=`md`,className:l,ref:u,...d})=>(0,n.jsx)(e.t,{"data-spark-component":`icon-button`,ref:u,className:i({size:c,className:l}),appearance:t,design:r,disabled:a,intent:o,shape:s,size:c,...d});a.displayName=`IconButton`,Object.defineProperty(exports,"t",{enumerable:!0,get:function(){return a}});
-//# sourceMappingURL=icon-button-DRFf308H.js.map

package/dist/menu/useRenderSlot.d.ts

@@ -1 +0,0 @@
-export declare function useRenderSlot(asChild: boolean): (({ ...props }: object) => import("react").JSX.Element) | undefined;

package/dist/tabs/useRenderSlot.d.ts

@@ -1 +0,0 @@
-export declare function useRenderSlot(asChild: boolean): (({ ...props }: object) => import("react").JSX.Element) | undefined;

package/dist/toast/useRenderSlot.d.ts

@@ -1,3 +0,0 @@
-export declare function useRenderSlot(asChild: boolean, defaultTag: string): (({ ...props }: {
-    [x: string]: any;
-}) => import("react").JSX.Element) | undefined;

package/dist/toggle-group/useRenderSlot.d.ts

@@ -1 +0,0 @@
-export declare function useRenderSlot(asChild: boolean): (({ ...props }: object) => import("react").JSX.Element) | undefined;

package/dist/useRenderSlot-5CPC9Lkj.mjs

@@ -1,11 +0,0 @@
-import { Slot as e } from "./slot/index.mjs";
-import { jsx as t } from "react/jsx-runtime";
-//#region src/drawer/useRenderSlot.tsx
-function n(n, r) {
-	let i = n ? e : r;
-	return n ? ({ ...e }) => /* @__PURE__ */ t(i, { ...e }) : void 0;
-}
-//#endregion
-export { n as t };
-
-//# sourceMappingURL=useRenderSlot-5CPC9Lkj.mjs.map

package/dist/useRenderSlot-5CPC9Lkj.mjs.map

@@ -1 +0,0 @@
-{"version":3,"file":"useRenderSlot-5CPC9Lkj.mjs","names":[],"sources":["../src/drawer/useRenderSlot.tsx"],"sourcesContent":["import { Slot } from '../slot'\n\nexport function useRenderSlot(asChild: boolean, defaultTag: string) {\n  const Component = asChild ? Slot : defaultTag\n\n  return asChild ? ({ ...props }) => <Component {...props} /> : undefined\n}\n"],"mappings":";;;AAEA,SAAgB,EAAc,GAAkB,GAAoB;CAClE,IAAM,IAAY,IAAU,IAAO;CAEnC,OAAO,KAAW,EAAE,GAAG,QAAY,kBAAC,GAAD,EAAW,GAAI,EAAQ,CAAA,IAAI,KAAA;AAChE"}

package/dist/useRenderSlot-DHV0CegV.js

@@ -1,2 +0,0 @@
-const e=require("./slot/index.js");let t=require("react/jsx-runtime");function n(n,r){let i=n?e.Slot:r;return n?({...e})=>(0,t.jsx)(i,{...e}):void 0}Object.defineProperty(exports,"t",{enumerable:!0,get:function(){return n}});
-//# sourceMappingURL=useRenderSlot-DHV0CegV.js.map

package/dist/useRenderSlot-DHV0CegV.js.map

@@ -1 +0,0 @@
-{"version":3,"file":"useRenderSlot-DHV0CegV.js","names":[],"sources":["../src/drawer/useRenderSlot.tsx"],"sourcesContent":["import { Slot } from '../slot'\n\nexport function useRenderSlot(asChild: boolean, defaultTag: string) {\n  const Component = asChild ? Slot : defaultTag\n\n  return asChild ? ({ ...props }) => <Component {...props} /> : undefined\n}\n"],"mappings":"sEAEA,SAAgB,EAAc,EAAkB,EAAoB,CAClE,IAAM,EAAY,EAAU,EAAA,KAAO,EAEnC,OAAO,GAAW,CAAE,GAAG,MAAY,EAAA,EAAA,IAAA,CAAC,EAAD,CAAW,GAAI,CAAQ,CAAA,EAAI,IAAA,EAChE"}