@raystack/apsara 0.49.1 → 0.50.1

package/dist/components/calendar/range-picker.js

@@ -1,7 +1,8 @@
-import { j as jsxRuntimeExports } from '../../node_modules/.pnpm/react@18.2.0/node_modules/react/jsx-runtime.js';
-import { CalendarIcon } from '../../node_modules/.pnpm/@radix-ui_react-icons@1.3.0_react@18.2.0/node_modules/@radix-ui/react-icons/dist/react-icons.esm.js';
+"use client";
+import { jsxs, jsx } from 'react/jsx-runtime';
+import { CalendarIcon } from '../../node_modules/.pnpm/@radix-ui_react-icons@1.3.2_react@19.1.1/node_modules/@radix-ui/react-icons/dist/react-icons.esm.js';
 import dayjs from '../../node_modules/.pnpm/dayjs@1.11.11/node_modules/dayjs/dayjs.min.js';
-import { useState, useRef, useMemo } from 'react';
+import { useState, useMemo, useCallback } from 'react';
 import { Flex } from '../flex/flex.js';
 import { InputField } from '../input-field/input-field.js';
 import { Popover } from '../popover/popover.js';
@@ -17,7 +18,6 @@ function RangePicker({ side = 'top', dateFormat = 'DD/MM/YYYY', inputFieldsProps
     const [internalValue, setInternalValue] = useState(value ?? defaultValue);
     const [currentMonth, setCurrentMonth] = useState(internalValue?.from);
     const selectedRange = value ?? internalValue;
-    const prevSelectedRangeRef = useRef(selectedRange);
     const startDate = selectedRange.from
         ? dayjs(selectedRange.from).format(dateFormat)
         : '';
@@ -37,52 +37,56 @@ function RangePicker({ side = 'top', dateFormat = 'DD/MM/YYYY', inputFieldsProps
         }
         return month;
     }, [currentMonth, calendarProps?.endMonth]);
-    // 1st click will select the start date.
-    // 2nd click will select the end date.
-    // 3rd click will select the start date again.
-    const handleSelect = (range, selectedDay) => {
-        // TODO: Remove custom logic and reuse the default logic from react-day-picker
-        let newRange;
-        if (currentRangeField === 'from') {
-            // First click - set from date and prepare for to date selection
-            newRange = { from: selectedDay };
-            setCurrentRangeField('to');
+    const onTriggerClick = useCallback((e) => {
+        const field = e.currentTarget.dataset.rangeField;
+        if (field === 'start') {
+            setCurrentRangeField('from');
         }
         else {
-            // Second click - setting to date
-            const from = selectedRange.from;
-            if (dayjs(selectedDay).isBefore(dayjs(from))) {
-                // If selected date is before current from date, start new range
+            setCurrentRangeField('to');
+        }
+        if (showCalendar) {
+            e.preventDefault();
+            e.stopPropagation();
+        }
+    }, [showCalendar]);
+    // Handle date selection with custom logic
+    const handleSelect = (_, selectedDay) => {
+        let newRange = { ...selectedRange };
+        let newCurrentRangeField = currentRangeField;
+        if (currentRangeField === 'from') {
+            // If selecting start date and it's after the current end date
+            if (selectedRange?.to &&
+                dayjs(selectedDay).isAfter(dayjs(selectedRange.to))) {
                 newRange = { from: selectedDay };
-                setCurrentRangeField('to');
+                newCurrentRangeField = 'to';
             }
             else {
-                // Set the to date
-                newRange = { from, to: selectedDay };
-                setCurrentRangeField('from');
+                newRange.from = selectedDay;
+                if (!selectedRange?.to)
+                    newCurrentRangeField = 'to';
             }
         }
+        else {
+            // If selecting end date and it's before the current start date
+            if (selectedRange?.from &&
+                dayjs(selectedDay).isBefore(dayjs(selectedRange.from))) {
+                newRange = { from: selectedDay };
+                newCurrentRangeField = 'to';
+            }
+            else
+                newRange.to = selectedDay;
+        }
+        if (newCurrentRangeField !== currentRangeField)
+            setCurrentRangeField(newCurrentRangeField);
         setInternalValue(newRange);
         onSelect(newRange);
     };
-    function onOpenChange(open) {
-        const currOpen = Boolean(open);
-        setShowCalendar(currOpen);
-        // Reset selected range if calendar is closed and start or end date is empty
-        if (!currOpen && (!startDate.length || !endDate.length)) {
-            setInternalValue(prevSelectedRangeRef.current);
-            onSelect(prevSelectedRangeRef.current);
-        }
-        // Update previous selected range reference when both start and end dates are selected
-        if (!currOpen && startDate.length && endDate.length) {
-            prevSelectedRangeRef.current = selectedRange;
-        }
-    }
-    const defaultTrigger = (jsxRuntimeExports.jsxs(Flex, { gap: 'medium', className: pickerGroupClassName, children: [jsxRuntimeExports.jsx(InputField, { size: 'small', placeholder: 'Select start date', trailingIcon: showCalendarIcon ? jsxRuntimeExports.jsx(CalendarIcon, {}) : undefined, className: styles.datePickerInput, ...(inputFieldsProps.startDate ?? {}), value: startDate, readOnly: true }), jsxRuntimeExports.jsx(InputField, { size: 'small', placeholder: 'Select end date', trailingIcon: showCalendarIcon ? jsxRuntimeExports.jsx(CalendarIcon, {}) : undefined, className: styles.datePickerInput, ...(inputFieldsProps.endDate ?? {}), value: endDate, readOnly: true })] }));
+    const defaultTrigger = (jsxs(Flex, { gap: 'medium', className: pickerGroupClassName, children: [jsx(InputField, { size: 'small', placeholder: 'Select start date', trailingIcon: showCalendarIcon ? jsx(CalendarIcon, {}) : undefined, className: styles.datePickerInput, ...(inputFieldsProps.startDate ?? {}), value: startDate, readOnly: true, "data-range-field": 'start', "data-active": showCalendar && currentRangeField === 'from', onClick: onTriggerClick }), jsx(InputField, { size: 'small', placeholder: 'Select end date', trailingIcon: showCalendarIcon ? jsx(CalendarIcon, {}) : undefined, className: styles.datePickerInput, ...(inputFieldsProps.endDate ?? {}), value: endDate, readOnly: true, "data-range-field": 'end', "data-active": showCalendar && currentRangeField === 'to', onClick: onTriggerClick })] }));
     const trigger = typeof children === 'function'
         ? children({ startDate, endDate })
         : children || defaultTrigger;
-    return (jsxRuntimeExports.jsxs(Popover, { open: showCalendar, onOpenChange: onOpenChange, children: [jsxRuntimeExports.jsx(Popover.Trigger, { asChild: true, children: trigger }), jsxRuntimeExports.jsxs(Popover.Content, { side: side, className: styles.calendarPopover, children: [jsxRuntimeExports.jsx(Calendar, { showOutsideDays: false, numberOfMonths: 2, defaultMonth: selectedRange.from, required: true, ...calendarProps, timeZone: timeZone, mode: 'range', month: computedDefaultMonth, selected: selectedRange, onSelect: handleSelect, onMonthChange: setCurrentMonth }), footer && (jsxRuntimeExports.jsx(Flex, { align: 'center', justify: 'center', className: styles.calendarFooter, children: footer }))] })] }));
+    return (jsxs(Popover, { open: showCalendar, onOpenChange: setShowCalendar, children: [jsx(Popover.Trigger, { asChild: true, children: trigger }), jsxs(Popover.Content, { side: side, className: styles.calendarPopover, children: [jsx(Calendar, { showOutsideDays: false, numberOfMonths: 2, defaultMonth: selectedRange.from, required: true, ...calendarProps, timeZone: timeZone, mode: 'range', month: computedDefaultMonth, selected: selectedRange, onSelect: handleSelect, onMonthChange: setCurrentMonth }), footer && (jsx(Flex, { align: 'center', justify: 'center', className: styles.calendarFooter, children: footer }))] })] }));
 }
 
 export { RangePicker };

package/dist/components/calendar/range-picker.js.map

@@ -1 +1 @@
-{"version":3,"file":"range-picker.js","sources":["../../../components/calendar/range-picker.tsx"],"sourcesContent":["import { CalendarIcon } from '@radix-ui/react-icons';\nimport dayjs from 'dayjs';\nimport { useMemo, useRef, useState } from 'react';\nimport { DateRange, PropsBase, PropsRangeRequired } from 'react-day-picker';\n\nimport { Flex } from '../flex';\nimport { InputField } from '../input-field';\nimport { InputFieldProps } from '../input-field/input-field';\nimport { Popover } from '../popover';\nimport { Calendar } from './calendar';\nimport styles from './calendar.module.css';\n\ninterface RangePickerProps {\n  side?: 'top' | 'right' | 'bottom' | 'left';\n  dateFormat?: string;\n  inputFieldsProps?: { startDate?: InputFieldProps; endDate?: InputFieldProps };\n  calendarProps?: PropsRangeRequired & PropsBase;\n  onSelect?: (date: DateRange) => void;\n  pickerGroupClassName?: string;\n  value?: DateRange;\n  defaultValue?: DateRange;\n  children?:\n    | React.ReactNode\n    | ((props: { startDate: string; endDate: string }) => React.ReactNode);\n  showCalendarIcon?: boolean;\n  footer?: React.ReactNode;\n  timeZone?: string;\n}\n\ntype RangeFields = keyof DateRange;\n\nexport function RangePicker({\n  side = 'top',\n  dateFormat = 'DD/MM/YYYY',\n  inputFieldsProps = {},\n  calendarProps,\n  onSelect = () => {},\n  value,\n  defaultValue = {\n    to: new Date(),\n    from: new Date()\n  },\n  pickerGroupClassName,\n  children,\n  showCalendarIcon = true,\n  footer,\n  timeZone\n}: RangePickerProps) {\n  const [showCalendar, setShowCalendar] = useState(false);\n  const [currentRangeField, setCurrentRangeField] =\n    useState<RangeFields>('from');\n  const [internalValue, setInternalValue] = useState(value ?? defaultValue);\n  const [currentMonth, setCurrentMonth] = useState(internalValue?.from);\n\n  const selectedRange = value ?? internalValue;\n\n  const prevSelectedRangeRef = useRef(selectedRange);\n\n  const startDate = selectedRange.from\n    ? dayjs(selectedRange.from).format(dateFormat)\n    : '';\n  const endDate = selectedRange.to\n    ? dayjs(selectedRange.to).format(dateFormat)\n    : '';\n\n  // Ensures two months are visible even when\n  // current month is the last allowed month (endMonth).\n  const computedDefaultMonth = useMemo(() => {\n    let month = currentMonth;\n    if (calendarProps?.endMonth) {\n      const endMonth = dayjs(calendarProps.endMonth);\n      const fromMonth = dayjs(currentMonth);\n\n      if (fromMonth.isSame(endMonth, 'month')) {\n        month = endMonth.subtract(1, 'month').toDate();\n      }\n    }\n    return month;\n  }, [currentMonth, calendarProps?.endMonth]);\n\n  // 1st click will select the start date.\n  // 2nd click will select the end date.\n  // 3rd click will select the start date again.\n  const handleSelect = (range: DateRange, selectedDay: Date) => {\n    // TODO: Remove custom logic and reuse the default logic from react-day-picker\n    let newRange: DateRange;\n\n    if (currentRangeField === 'from') {\n      // First click - set from date and prepare for to date selection\n      newRange = { from: selectedDay };\n      setCurrentRangeField('to');\n    } else {\n      // Second click - setting to date\n      const from = selectedRange.from;\n\n      if (dayjs(selectedDay).isBefore(dayjs(from))) {\n        // If selected date is before current from date, start new range\n        newRange = { from: selectedDay };\n        setCurrentRangeField('to');\n      } else {\n        // Set the to date\n        newRange = { from, to: selectedDay };\n        setCurrentRangeField('from');\n      }\n    }\n\n    setInternalValue(newRange);\n    onSelect(newRange);\n  };\n\n  function onOpenChange(open?: boolean) {\n    const currOpen = Boolean(open);\n\n    setShowCalendar(currOpen);\n\n    // Reset selected range if calendar is closed and start or end date is empty\n    if (!currOpen && (!startDate.length || !endDate.length)) {\n      setInternalValue(prevSelectedRangeRef.current);\n      onSelect(prevSelectedRangeRef.current);\n    }\n\n    // Update previous selected range reference when both start and end dates are selected\n    if (!currOpen && startDate.length && endDate.length) {\n      prevSelectedRangeRef.current = selectedRange;\n    }\n  }\n\n  const defaultTrigger = (\n    <Flex gap='medium' className={pickerGroupClassName}>\n      <InputField\n        size='small'\n        placeholder='Select start date'\n        trailingIcon={showCalendarIcon ? <CalendarIcon /> : undefined}\n        className={styles.datePickerInput}\n        {...(inputFieldsProps.startDate ?? {})}\n        value={startDate}\n        readOnly\n      />\n\n      <InputField\n        size='small'\n        placeholder='Select end date'\n        trailingIcon={showCalendarIcon ? <CalendarIcon /> : undefined}\n        className={styles.datePickerInput}\n        {...(inputFieldsProps.endDate ?? {})}\n        value={endDate}\n        readOnly\n      />\n    </Flex>\n  );\n\n  const trigger =\n    typeof children === 'function'\n      ? children({ startDate, endDate })\n      : children || defaultTrigger;\n\n  return (\n    <Popover open={showCalendar} onOpenChange={onOpenChange}>\n      <Popover.Trigger asChild>{trigger}</Popover.Trigger>\n      <Popover.Content side={side} className={styles.calendarPopover}>\n        <Calendar\n          showOutsideDays={false}\n          numberOfMonths={2}\n          defaultMonth={selectedRange.from}\n          required={true}\n          {...calendarProps}\n          timeZone={timeZone}\n          mode='range'\n          month={computedDefaultMonth}\n          selected={selectedRange}\n          onSelect={handleSelect}\n          onMonthChange={setCurrentMonth}\n        />\n        {footer && (\n          <Flex\n            align='center'\n            justify='center'\n            className={styles.calendarFooter}\n          >\n            {footer}\n          </Flex>\n        )}\n      </Popover.Content>\n    </Popover>\n  );\n}\n"],"names":["_jsxs","_jsx"],"mappings":"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"}
+{"version":3,"file":"range-picker.js","sources":["../../../components/calendar/range-picker.tsx"],"sourcesContent":["'use client';\n\nimport { CalendarIcon } from '@radix-ui/react-icons';\nimport dayjs from 'dayjs';\nimport { useCallback, useMemo, useState } from 'react';\nimport { DateRange, PropsBase, PropsRangeRequired } from 'react-day-picker';\nimport { Flex } from '../flex';\nimport { InputField } from '../input-field';\nimport { InputFieldProps } from '../input-field/input-field';\nimport { Popover } from '../popover';\nimport { Calendar } from './calendar';\nimport styles from './calendar.module.css';\n\ninterface RangePickerProps {\n  side?: 'top' | 'right' | 'bottom' | 'left';\n  dateFormat?: string;\n  inputFieldsProps?: { startDate?: InputFieldProps; endDate?: InputFieldProps };\n  calendarProps?: PropsRangeRequired & PropsBase;\n  onSelect?: (date: DateRange) => void;\n  pickerGroupClassName?: string;\n  value?: DateRange;\n  defaultValue?: DateRange;\n  children?:\n    | React.ReactNode\n    | ((props: { startDate: string; endDate: string }) => React.ReactNode);\n  showCalendarIcon?: boolean;\n  footer?: React.ReactNode;\n  timeZone?: string;\n}\n\ntype RangeFields = keyof DateRange;\n\nexport function RangePicker({\n  side = 'top',\n  dateFormat = 'DD/MM/YYYY',\n  inputFieldsProps = {},\n  calendarProps,\n  onSelect = () => {},\n  value,\n  defaultValue = {\n    to: new Date(),\n    from: new Date()\n  },\n  pickerGroupClassName,\n  children,\n  showCalendarIcon = true,\n  footer,\n  timeZone\n}: RangePickerProps) {\n  const [showCalendar, setShowCalendar] = useState(false);\n  const [currentRangeField, setCurrentRangeField] =\n    useState<RangeFields>('from');\n  const [internalValue, setInternalValue] = useState(value ?? defaultValue);\n  const [currentMonth, setCurrentMonth] = useState(internalValue?.from);\n\n  const selectedRange = value ?? internalValue;\n\n  const startDate = selectedRange.from\n    ? dayjs(selectedRange.from).format(dateFormat)\n    : '';\n  const endDate = selectedRange.to\n    ? dayjs(selectedRange.to).format(dateFormat)\n    : '';\n\n  // Ensures two months are visible even when\n  // current month is the last allowed month (endMonth).\n  const computedDefaultMonth = useMemo(() => {\n    let month = currentMonth;\n    if (calendarProps?.endMonth) {\n      const endMonth = dayjs(calendarProps.endMonth);\n      const fromMonth = dayjs(currentMonth);\n\n      if (fromMonth.isSame(endMonth, 'month')) {\n        month = endMonth.subtract(1, 'month').toDate();\n      }\n    }\n    return month;\n  }, [currentMonth, calendarProps?.endMonth]);\n\n  const onTriggerClick = useCallback(\n    (e: React.MouseEvent<HTMLInputElement>) => {\n      const field = e.currentTarget.dataset.rangeField;\n      if (field === 'start') {\n        setCurrentRangeField('from');\n      } else {\n        setCurrentRangeField('to');\n      }\n      if (showCalendar) {\n        e.preventDefault();\n        e.stopPropagation();\n      }\n    },\n    [showCalendar]\n  );\n\n  // Handle date selection with custom logic\n  const handleSelect = (_: DateRange, selectedDay: Date) => {\n    let newRange = { ...selectedRange };\n    let newCurrentRangeField = currentRangeField;\n\n    if (currentRangeField === 'from') {\n      // If selecting start date and it's after the current end date\n      if (\n        selectedRange?.to &&\n        dayjs(selectedDay).isAfter(dayjs(selectedRange.to))\n      ) {\n        newRange = { from: selectedDay };\n        newCurrentRangeField = 'to';\n      } else {\n        newRange.from = selectedDay;\n        if (!selectedRange?.to) newCurrentRangeField = 'to';\n      }\n    } else {\n      // If selecting end date and it's before the current start date\n      if (\n        selectedRange?.from &&\n        dayjs(selectedDay).isBefore(dayjs(selectedRange.from))\n      ) {\n        newRange = { from: selectedDay };\n        newCurrentRangeField = 'to';\n      } else newRange.to = selectedDay;\n    }\n\n    if (newCurrentRangeField !== currentRangeField)\n      setCurrentRangeField(newCurrentRangeField);\n\n    setInternalValue(newRange);\n    onSelect(newRange);\n  };\n\n  const defaultTrigger = (\n    <Flex gap='medium' className={pickerGroupClassName}>\n      <InputField\n        size='small'\n        placeholder='Select start date'\n        trailingIcon={showCalendarIcon ? <CalendarIcon /> : undefined}\n        className={styles.datePickerInput}\n        {...(inputFieldsProps.startDate ?? {})}\n        value={startDate}\n        readOnly\n        data-range-field='start'\n        data-active={showCalendar && currentRangeField === 'from'}\n        onClick={onTriggerClick}\n      />\n\n      <InputField\n        size='small'\n        placeholder='Select end date'\n        trailingIcon={showCalendarIcon ? <CalendarIcon /> : undefined}\n        className={styles.datePickerInput}\n        {...(inputFieldsProps.endDate ?? {})}\n        value={endDate}\n        readOnly\n        data-range-field='end'\n        data-active={showCalendar && currentRangeField === 'to'}\n        onClick={onTriggerClick}\n      />\n    </Flex>\n  );\n\n  const trigger =\n    typeof children === 'function'\n      ? children({ startDate, endDate })\n      : children || defaultTrigger;\n\n  return (\n    <Popover open={showCalendar} onOpenChange={setShowCalendar}>\n      <Popover.Trigger asChild>{trigger}</Popover.Trigger>\n      <Popover.Content side={side} className={styles.calendarPopover}>\n        <Calendar\n          showOutsideDays={false}\n          numberOfMonths={2}\n          defaultMonth={selectedRange.from}\n          required={true}\n          {...calendarProps}\n          timeZone={timeZone}\n          mode='range'\n          month={computedDefaultMonth}\n          selected={selectedRange}\n          onSelect={handleSelect}\n          onMonthChange={setCurrentMonth}\n        />\n        {footer && (\n          <Flex\n            align='center'\n            justify='center'\n            className={styles.calendarFooter}\n          >\n            {footer}\n          </Flex>\n        )}\n      </Popover.Content>\n    </Popover>\n  );\n}\n"],"names":[],"mappings":";;;;;;;;;;;AAgCgB;;;;;;AAoBd;AACA;AAEA;AAEA;;;AAGA;;;;;AAMA;;AAEE;;AAEE;;AAGE;;;AAGJ;;AAGF;;AAGI;;;;;;;;;;AASF;;AAKF;AACE;;AAGA;;;AAII;AAEA;;;;AAGA;;;;;;;;AAOA;AAEA;;;;AAEK;;;;;;AAQX;AAEA;AA8BA;;AAGI;;AA+BN;;"}

package/dist/components/callout/callout.cjs

@@ -1,7 +1,8 @@
+"use client";
 'use strict';
 
-var jsxRuntime = require('../../node_modules/.pnpm/react@18.2.0/node_modules/react/jsx-runtime.cjs');
-var reactIcons_esm = require('../../node_modules/.pnpm/@radix-ui_react-icons@1.3.0_react@18.2.0/node_modules/@radix-ui/react-icons/dist/react-icons.esm.cjs');
+var jsxRuntime = require('react/jsx-runtime');
+var reactIcons_esm = require('../../node_modules/.pnpm/@radix-ui_react-icons@1.3.2_react@19.1.1/node_modules/@radix-ui/react-icons/dist/react-icons.esm.cjs');
 var index = require('../../node_modules/.pnpm/class-variance-authority@0.7.1/node_modules/class-variance-authority/dist/index.cjs');
 var React = require('react');
 var callout_module = require('./callout.module.css.cjs');
@@ -34,23 +35,23 @@ const callout = index.cva(callout_module.default.callout, {
             gradient: callout_module.default['callout-gradient'],
             accent: callout_module.default['callout-accent'],
             attention: callout_module.default['callout-attention'],
-            normal: callout_module.default['callout-normal'],
+            normal: callout_module.default['callout-normal']
         },
         outline: {
-            true: callout_module.default['callout-outline'],
+            true: callout_module.default['callout-outline']
         },
         highContrast: {
-            true: callout_module.default['callout-high-contrast'],
-        },
+            true: callout_module.default['callout-high-contrast']
+        }
     },
     defaultVariants: {
-        type: 'grey',
-    },
+        type: 'grey'
+    }
 });
 const Callout = React__namespace.forwardRef(({ className, type = 'grey', outline, highContrast, children, action, dismissible, onDismiss, width, style, icon, ...props }, ref) => {
     const combinedStyle = {
         ...style,
-        ...(width && { width: typeof width === 'number' ? `${width}px` : width }),
+        ...(width && { width: typeof width === 'number' ? `${width}px` : width })
     };
     const getRole = () => {
         switch (type) {
@@ -62,7 +63,7 @@ const Callout = React__namespace.forwardRef(({ className, type = 'grey', outline
                 return 'status';
         }
     };
-    return (jsxRuntime.jsxRuntimeExports.jsx("div", { ref: ref, className: `${callout({ type, outline, highContrast })} ${className || ''}`, style: combinedStyle, role: getRole(), "aria-live": type === 'alert' ? 'assertive' : 'polite', ...props, children: jsxRuntime.jsxRuntimeExports.jsxs("div", { className: callout_module.default.container, children: [jsxRuntime.jsxRuntimeExports.jsxs("div", { className: callout_module.default.messageContainer, children: [icon !== undefined ? (jsxRuntime.jsxRuntimeExports.jsx("div", { className: callout_module.default.icon, "aria-hidden": "true", children: icon })) : (jsxRuntime.jsxRuntimeExports.jsx(reactIcons_esm.InfoCircledIcon, { className: callout_module.default.icon, "aria-hidden": "true" })), jsxRuntime.jsxRuntimeExports.jsx("div", { className: callout_module.default.message, children: children })] }), jsxRuntime.jsxRuntimeExports.jsxs("div", { className: callout_module.default.actionsContainer, children: [action && (jsxRuntime.jsxRuntimeExports.jsx("div", { className: callout_module.default.action, children: action })), dismissible && (jsxRuntime.jsxRuntimeExports.jsx("button", { className: callout_module.default.dismiss, onClick: onDismiss, "aria-label": "Dismiss message", type: "button", children: jsxRuntime.jsxRuntimeExports.jsx("svg", { width: "12", height: "12", viewBox: "0 0 12 12", fill: "none", xmlns: "http://www.w3.org/2000/svg", "aria-hidden": "true", role: "presentation", children: jsxRuntime.jsxRuntimeExports.jsx("path", { fillRule: "evenodd", clipRule: "evenodd", d: "M9.5066 3.3066C9.73115 3.08205 9.73115 2.71798 9.5066 2.49343C9.28205 2.26887 8.91798 2.26887 8.69343 2.49343L6.00001 5.18684L3.3066 2.49343C3.08205 2.26887 2.71798 2.26887 2.49343 2.49343C2.26887 2.71798 2.26887 3.08205 2.49343 3.3066L5.18684 6.00001L2.49343 8.69343C2.26887 8.91798 2.26887 9.28205 2.49343 9.5066C2.71798 9.73115 3.08205 9.73115 3.3066 9.5066L6.00001 6.81318L8.69343 9.5066C8.91798 9.73115 9.28205 9.73115 9.5066 9.5066C9.73115 9.28205 9.73115 8.91798 9.5066 8.69343L6.81318 6.00001L9.5066 3.3066Z", fill: "currentColor" }) }) }))] })] }) }));
+    return (jsxRuntime.jsx("div", { ref: ref, className: `${callout({ type, outline, highContrast })} ${className || ''}`, style: combinedStyle, role: getRole(), "aria-live": type === 'alert' ? 'assertive' : 'polite', ...props, children: jsxRuntime.jsxs("div", { className: callout_module.default.container, children: [jsxRuntime.jsxs("div", { className: callout_module.default.messageContainer, children: [icon !== undefined ? (jsxRuntime.jsx("div", { className: callout_module.default.icon, "aria-hidden": 'true', children: icon })) : (jsxRuntime.jsx(reactIcons_esm.InfoCircledIcon, { className: callout_module.default.icon, "aria-hidden": 'true' })), jsxRuntime.jsx("div", { className: callout_module.default.message, children: children })] }), jsxRuntime.jsxs("div", { className: callout_module.default.actionsContainer, children: [action && jsxRuntime.jsx("div", { className: callout_module.default.action, children: action }), dismissible && (jsxRuntime.jsx("button", { className: callout_module.default.dismiss, onClick: onDismiss, "aria-label": 'Dismiss message', type: 'button', children: jsxRuntime.jsx("svg", { width: '12', height: '12', viewBox: '0 0 12 12', fill: 'none', xmlns: 'http://www.w3.org/2000/svg', "aria-hidden": 'true', role: 'presentation', children: jsxRuntime.jsx("path", { fillRule: 'evenodd', clipRule: 'evenodd', d: 'M9.5066 3.3066C9.73115 3.08205 9.73115 2.71798 9.5066 2.49343C9.28205 2.26887 8.91798 2.26887 8.69343 2.49343L6.00001 5.18684L3.3066 2.49343C3.08205 2.26887 2.71798 2.26887 2.49343 2.49343C2.26887 2.71798 2.26887 3.08205 2.49343 3.3066L5.18684 6.00001L2.49343 8.69343C2.26887 8.91798 2.26887 9.28205 2.49343 9.5066C2.71798 9.73115 3.08205 9.73115 3.3066 9.5066L6.00001 6.81318L8.69343 9.5066C8.91798 9.73115 9.28205 9.73115 9.5066 9.5066C9.73115 9.28205 9.73115 8.91798 9.5066 8.69343L6.81318 6.00001L9.5066 3.3066Z', fill: 'currentColor' }) }) }))] })] }) }));
 });
 Callout.displayName = 'Callout';
 

package/dist/components/callout/callout.cjs.map

@@ -1 +1 @@
-{"version":3,"file":"callout.cjs","sources":["../../../components/callout/callout.tsx"],"sourcesContent":["import { InfoCircledIcon } from '@radix-ui/react-icons';\nimport { cva, type VariantProps } from 'class-variance-authority';\nimport { type ComponentPropsWithoutRef } from 'react';\nimport * as React from 'react';\n\nimport styles from './callout.module.css';\n\nconst callout = cva(styles.callout, {\n  variants: {\n    type: {\n      grey: styles['callout-grey'],\n      success: styles['callout-success'],\n      alert: styles['callout-alert'],\n      gradient: styles['callout-gradient'],\n      accent: styles['callout-accent'],\n      attention: styles['callout-attention'],\n      normal: styles['callout-normal'],\n    },\n    outline: {\n      true: styles['callout-outline'],\n    },\n    highContrast: {\n      true: styles['callout-high-contrast'],\n    },\n  },\n  defaultVariants: {\n    type: 'grey',\n  },\n});\n\nexport interface CalloutProps extends ComponentPropsWithoutRef<'div'>, VariantProps<typeof callout> {\n  children: React.ReactNode;\n  action?: React.ReactNode;\n  dismissible?: boolean;\n  onDismiss?: () => void;\n  width?: string | number;\n  style?: React.CSSProperties;\n  icon?: React.ReactNode;\n}\n\nexport const Callout = React.forwardRef<HTMLDivElement, CalloutProps>(\n  ({ \n    className,\n    type = 'grey',\n    outline,\n    highContrast,\n    children,\n    action,\n    dismissible,\n    onDismiss,\n    width,\n    style,\n    icon,\n    ...props\n  }, ref) => {\n    const combinedStyle = {\n      ...style,\n      ...(width && { width: typeof width === 'number' ? `${width}px` : width }),\n    };\n\n    const getRole = () => {\n      switch (type) {\n        case 'alert':\n          return 'alert';\n        case 'success':\n          return 'status';\n        default:\n          return 'status';\n      }\n    };\n\n    return (\n      <div\n        ref={ref}\n        className={`${callout({ type, outline, highContrast })} ${className || ''}`}\n        style={combinedStyle}\n        role={getRole()}\n        aria-live={type === 'alert' ? 'assertive' : 'polite'}\n        {...props}\n      >\n        <div className={styles.container}>\n          <div className={styles.messageContainer}>\n            {icon !== undefined ? (\n              <div className={styles.icon} aria-hidden=\"true\">\n                {icon}\n              </div>\n            ) : (\n              <InfoCircledIcon \n                className={styles.icon} \n                aria-hidden=\"true\"\n              />\n            )}\n            <div className={styles.message}>{children}</div>\n          </div>\n          \n          <div className={styles.actionsContainer}>\n            {action && (\n              <div className={styles.action}>\n                {action}\n              </div>\n            )}\n            {dismissible && (\n              <button \n                className={styles.dismiss} \n                onClick={onDismiss}\n                aria-label=\"Dismiss message\"\n                type=\"button\"\n              >\n                <svg \n                  width=\"12\" \n                  height=\"12\" \n                  viewBox=\"0 0 12 12\" \n                  fill=\"none\" \n                  xmlns=\"http://www.w3.org/2000/svg\"\n                  aria-hidden=\"true\"\n                  role=\"presentation\"\n                >\n                  <path \n                    fillRule=\"evenodd\" \n                    clipRule=\"evenodd\" \n                    d=\"M9.5066 3.3066C9.73115 3.08205 9.73115 2.71798 9.5066 2.49343C9.28205 2.26887 8.91798 2.26887 8.69343 2.49343L6.00001 5.18684L3.3066 2.49343C3.08205 2.26887 2.71798 2.26887 2.49343 2.49343C2.26887 2.71798 2.26887 3.08205 2.49343 3.3066L5.18684 6.00001L2.49343 8.69343C2.26887 8.91798 2.26887 9.28205 2.49343 9.5066C2.71798 9.73115 3.08205 9.73115 3.3066 9.5066L6.00001 6.81318L8.69343 9.5066C8.91798 9.73115 9.28205 9.73115 9.5066 9.5066C9.73115 9.28205 9.73115 8.91798 9.5066 8.69343L6.81318 6.00001L9.5066 3.3066Z\" \n                    fill=\"currentColor\"\n                  />\n                </svg>\n              </button>\n            )}\n          </div>\n        </div>\n      </div>\n    );\n  }\n);\n\nCallout.displayName = 'Callout';"],"names":["cva","styles","React","_jsx","_jsxs","InfoCircledIcon"],"mappings":"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"}
+{"version":3,"file":"callout.cjs","sources":["../../../components/callout/callout.tsx"],"sourcesContent":["'use client';\n\nimport { InfoCircledIcon } from '@radix-ui/react-icons';\nimport { type VariantProps, cva } from 'class-variance-authority';\nimport { type ComponentPropsWithoutRef } from 'react';\nimport * as React from 'react';\n\nimport styles from './callout.module.css';\n\nconst callout = cva(styles.callout, {\n  variants: {\n    type: {\n      grey: styles['callout-grey'],\n      success: styles['callout-success'],\n      alert: styles['callout-alert'],\n      gradient: styles['callout-gradient'],\n      accent: styles['callout-accent'],\n      attention: styles['callout-attention'],\n      normal: styles['callout-normal']\n    },\n    outline: {\n      true: styles['callout-outline']\n    },\n    highContrast: {\n      true: styles['callout-high-contrast']\n    }\n  },\n  defaultVariants: {\n    type: 'grey'\n  }\n});\n\nexport interface CalloutProps\n  extends ComponentPropsWithoutRef<'div'>,\n    VariantProps<typeof callout> {\n  children: React.ReactNode;\n  action?: React.ReactNode;\n  dismissible?: boolean;\n  onDismiss?: () => void;\n  width?: string | number;\n  style?: React.CSSProperties;\n  icon?: React.ReactNode;\n}\n\nexport const Callout = React.forwardRef<HTMLDivElement, CalloutProps>(\n  (\n    {\n      className,\n      type = 'grey',\n      outline,\n      highContrast,\n      children,\n      action,\n      dismissible,\n      onDismiss,\n      width,\n      style,\n      icon,\n      ...props\n    },\n    ref\n  ) => {\n    const combinedStyle = {\n      ...style,\n      ...(width && { width: typeof width === 'number' ? `${width}px` : width })\n    };\n\n    const getRole = () => {\n      switch (type) {\n        case 'alert':\n          return 'alert';\n        case 'success':\n          return 'status';\n        default:\n          return 'status';\n      }\n    };\n\n    return (\n      <div\n        ref={ref}\n        className={`${callout({ type, outline, highContrast })} ${className || ''}`}\n        style={combinedStyle}\n        role={getRole()}\n        aria-live={type === 'alert' ? 'assertive' : 'polite'}\n        {...props}\n      >\n        <div className={styles.container}>\n          <div className={styles.messageContainer}>\n            {icon !== undefined ? (\n              <div className={styles.icon} aria-hidden='true'>\n                {icon}\n              </div>\n            ) : (\n              <InfoCircledIcon className={styles.icon} aria-hidden='true' />\n            )}\n            <div className={styles.message}>{children}</div>\n          </div>\n\n          <div className={styles.actionsContainer}>\n            {action && <div className={styles.action}>{action}</div>}\n            {dismissible && (\n              <button\n                className={styles.dismiss}\n                onClick={onDismiss}\n                aria-label='Dismiss message'\n                type='button'\n              >\n                <svg\n                  width='12'\n                  height='12'\n                  viewBox='0 0 12 12'\n                  fill='none'\n                  xmlns='http://www.w3.org/2000/svg'\n                  aria-hidden='true'\n                  role='presentation'\n                >\n                  <path\n                    fillRule='evenodd'\n                    clipRule='evenodd'\n                    d='M9.5066 3.3066C9.73115 3.08205 9.73115 2.71798 9.5066 2.49343C9.28205 2.26887 8.91798 2.26887 8.69343 2.49343L6.00001 5.18684L3.3066 2.49343C3.08205 2.26887 2.71798 2.26887 2.49343 2.49343C2.26887 2.71798 2.26887 3.08205 2.49343 3.3066L5.18684 6.00001L2.49343 8.69343C2.26887 8.91798 2.26887 9.28205 2.49343 9.5066C2.71798 9.73115 3.08205 9.73115 3.3066 9.5066L6.00001 6.81318L8.69343 9.5066C8.91798 9.73115 9.28205 9.73115 9.5066 9.5066C9.73115 9.28205 9.73115 8.91798 9.5066 8.69343L6.81318 6.00001L9.5066 3.3066Z'\n                    fill='currentColor'\n                  />\n                </svg>\n              </button>\n            )}\n          </div>\n        </div>\n      </div>\n    );\n  }\n);\n\nCallout.displayName = 'Callout';\n"],"names":[],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;AASA;AACE;AACE;AACE;AACA;AACA;AACA;AACA;AACA;AACA;AACD;AACD;AACE;AACD;AACD;AACE;AACD;AACF;AACD;AACE;AACD;AACF;AAcY;AAkBT;AACE;;;;;AAME;AACE;AACF;AACE;AACF;AACE;;AAEN;;AAsDF;AAGF;;"}

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

@@ -1 +1 @@
-{"version":3,"file":"callout.d.ts","sourceRoot":"","sources":["../../../components/callout/callout.tsx"],"names":[],"mappings":"AACA,OAAO,EAAO,KAAK,YAAY,EAAE,MAAM,0BAA0B,CAAC;AAClE,OAAO,EAAE,KAAK,wBAAwB,EAAE,MAAM,OAAO,CAAC;AACtD,OAAO,KAAK,KAAK,MAAM,OAAO,CAAC;AAI/B,QAAA,MAAM,OAAO;;;;8EAqBX,CAAC;AAEH,MAAM,WAAW,YAAa,SAAQ,wBAAwB,CAAC,KAAK,CAAC,EAAE,YAAY,CAAC,OAAO,OAAO,CAAC;IACjG,QAAQ,EAAE,KAAK,CAAC,SAAS,CAAC;IAC1B,MAAM,CAAC,EAAE,KAAK,CAAC,SAAS,CAAC;IACzB,WAAW,CAAC,EAAE,OAAO,CAAC;IACtB,SAAS,CAAC,EAAE,MAAM,IAAI,CAAC;IACvB,KAAK,CAAC,EAAE,MAAM,GAAG,MAAM,CAAC;IACxB,KAAK,CAAC,EAAE,KAAK,CAAC,aAAa,CAAC;IAC5B,IAAI,CAAC,EAAE,KAAK,CAAC,SAAS,CAAC;CACxB;AAED,eAAO,MAAM,OAAO,qFA2FnB,CAAC"}
+{"version":3,"file":"callout.d.ts","sourceRoot":"","sources":["../../../components/callout/callout.tsx"],"names":[],"mappings":"AAGA,OAAO,EAAE,KAAK,YAAY,EAAO,MAAM,0BAA0B,CAAC;AAClE,OAAO,EAAE,KAAK,wBAAwB,EAAE,MAAM,OAAO,CAAC;AACtD,OAAO,KAAK,KAAK,MAAM,OAAO,CAAC;AAI/B,QAAA,MAAM,OAAO;;;;8EAqBX,CAAC;AAEH,MAAM,WAAW,YACf,SAAQ,wBAAwB,CAAC,KAAK,CAAC,EACrC,YAAY,CAAC,OAAO,OAAO,CAAC;IAC9B,QAAQ,EAAE,KAAK,CAAC,SAAS,CAAC;IAC1B,MAAM,CAAC,EAAE,KAAK,CAAC,SAAS,CAAC;IACzB,WAAW,CAAC,EAAE,OAAO,CAAC;IACtB,SAAS,CAAC,EAAE,MAAM,IAAI,CAAC;IACvB,KAAK,CAAC,EAAE,MAAM,GAAG,MAAM,CAAC;IACxB,KAAK,CAAC,EAAE,KAAK,CAAC,aAAa,CAAC;IAC5B,IAAI,CAAC,EAAE,KAAK,CAAC,SAAS,CAAC;CACxB;AAED,eAAO,MAAM,OAAO,qFAuFnB,CAAC"}

package/dist/components/callout/callout.js

@@ -1,5 +1,6 @@
-import { j as jsxRuntimeExports } from '../../node_modules/.pnpm/react@18.2.0/node_modules/react/jsx-runtime.js';
-import { InfoCircledIcon } from '../../node_modules/.pnpm/@radix-ui_react-icons@1.3.0_react@18.2.0/node_modules/@radix-ui/react-icons/dist/react-icons.esm.js';
+"use client";
+import { jsx, jsxs } from 'react/jsx-runtime';
+import { InfoCircledIcon } from '../../node_modules/.pnpm/@radix-ui_react-icons@1.3.2_react@19.1.1/node_modules/@radix-ui/react-icons/dist/react-icons.esm.js';
 import { cva } from '../../node_modules/.pnpm/class-variance-authority@0.7.1/node_modules/class-variance-authority/dist/index.js';
 import * as React from 'react';
 import styles from './callout.module.css.js';
@@ -13,23 +14,23 @@ const callout = cva(styles.callout, {
             gradient: styles['callout-gradient'],
             accent: styles['callout-accent'],
             attention: styles['callout-attention'],
-            normal: styles['callout-normal'],
+            normal: styles['callout-normal']
         },
         outline: {
-            true: styles['callout-outline'],
+            true: styles['callout-outline']
         },
         highContrast: {
-            true: styles['callout-high-contrast'],
-        },
+            true: styles['callout-high-contrast']
+        }
     },
     defaultVariants: {
-        type: 'grey',
-    },
+        type: 'grey'
+    }
 });
 const Callout = React.forwardRef(({ className, type = 'grey', outline, highContrast, children, action, dismissible, onDismiss, width, style, icon, ...props }, ref) => {
     const combinedStyle = {
         ...style,
-        ...(width && { width: typeof width === 'number' ? `${width}px` : width }),
+        ...(width && { width: typeof width === 'number' ? `${width}px` : width })
     };
     const getRole = () => {
         switch (type) {
@@ -41,7 +42,7 @@ const Callout = React.forwardRef(({ className, type = 'grey', outline, highContr
                 return 'status';
         }
     };
-    return (jsxRuntimeExports.jsx("div", { ref: ref, className: `${callout({ type, outline, highContrast })} ${className || ''}`, style: combinedStyle, role: getRole(), "aria-live": type === 'alert' ? 'assertive' : 'polite', ...props, children: jsxRuntimeExports.jsxs("div", { className: styles.container, children: [jsxRuntimeExports.jsxs("div", { className: styles.messageContainer, children: [icon !== undefined ? (jsxRuntimeExports.jsx("div", { className: styles.icon, "aria-hidden": "true", children: icon })) : (jsxRuntimeExports.jsx(InfoCircledIcon, { className: styles.icon, "aria-hidden": "true" })), jsxRuntimeExports.jsx("div", { className: styles.message, children: children })] }), jsxRuntimeExports.jsxs("div", { className: styles.actionsContainer, children: [action && (jsxRuntimeExports.jsx("div", { className: styles.action, children: action })), dismissible && (jsxRuntimeExports.jsx("button", { className: styles.dismiss, onClick: onDismiss, "aria-label": "Dismiss message", type: "button", children: jsxRuntimeExports.jsx("svg", { width: "12", height: "12", viewBox: "0 0 12 12", fill: "none", xmlns: "http://www.w3.org/2000/svg", "aria-hidden": "true", role: "presentation", children: jsxRuntimeExports.jsx("path", { fillRule: "evenodd", clipRule: "evenodd", d: "M9.5066 3.3066C9.73115 3.08205 9.73115 2.71798 9.5066 2.49343C9.28205 2.26887 8.91798 2.26887 8.69343 2.49343L6.00001 5.18684L3.3066 2.49343C3.08205 2.26887 2.71798 2.26887 2.49343 2.49343C2.26887 2.71798 2.26887 3.08205 2.49343 3.3066L5.18684 6.00001L2.49343 8.69343C2.26887 8.91798 2.26887 9.28205 2.49343 9.5066C2.71798 9.73115 3.08205 9.73115 3.3066 9.5066L6.00001 6.81318L8.69343 9.5066C8.91798 9.73115 9.28205 9.73115 9.5066 9.5066C9.73115 9.28205 9.73115 8.91798 9.5066 8.69343L6.81318 6.00001L9.5066 3.3066Z", fill: "currentColor" }) }) }))] })] }) }));
+    return (jsx("div", { ref: ref, className: `${callout({ type, outline, highContrast })} ${className || ''}`, style: combinedStyle, role: getRole(), "aria-live": type === 'alert' ? 'assertive' : 'polite', ...props, children: jsxs("div", { className: styles.container, children: [jsxs("div", { className: styles.messageContainer, children: [icon !== undefined ? (jsx("div", { className: styles.icon, "aria-hidden": 'true', children: icon })) : (jsx(InfoCircledIcon, { className: styles.icon, "aria-hidden": 'true' })), jsx("div", { className: styles.message, children: children })] }), jsxs("div", { className: styles.actionsContainer, children: [action && jsx("div", { className: styles.action, children: action }), dismissible && (jsx("button", { className: styles.dismiss, onClick: onDismiss, "aria-label": 'Dismiss message', type: 'button', children: jsx("svg", { width: '12', height: '12', viewBox: '0 0 12 12', fill: 'none', xmlns: 'http://www.w3.org/2000/svg', "aria-hidden": 'true', role: 'presentation', children: jsx("path", { fillRule: 'evenodd', clipRule: 'evenodd', d: 'M9.5066 3.3066C9.73115 3.08205 9.73115 2.71798 9.5066 2.49343C9.28205 2.26887 8.91798 2.26887 8.69343 2.49343L6.00001 5.18684L3.3066 2.49343C3.08205 2.26887 2.71798 2.26887 2.49343 2.49343C2.26887 2.71798 2.26887 3.08205 2.49343 3.3066L5.18684 6.00001L2.49343 8.69343C2.26887 8.91798 2.26887 9.28205 2.49343 9.5066C2.71798 9.73115 3.08205 9.73115 3.3066 9.5066L6.00001 6.81318L8.69343 9.5066C8.91798 9.73115 9.28205 9.73115 9.5066 9.5066C9.73115 9.28205 9.73115 8.91798 9.5066 8.69343L6.81318 6.00001L9.5066 3.3066Z', fill: 'currentColor' }) }) }))] })] }) }));
 });
 Callout.displayName = 'Callout';
 

package/dist/components/callout/callout.js.map

@@ -1 +1 @@
-{"version":3,"file":"callout.js","sources":["../../../components/callout/callout.tsx"],"sourcesContent":["import { InfoCircledIcon } from '@radix-ui/react-icons';\nimport { cva, type VariantProps } from 'class-variance-authority';\nimport { type ComponentPropsWithoutRef } from 'react';\nimport * as React from 'react';\n\nimport styles from './callout.module.css';\n\nconst callout = cva(styles.callout, {\n  variants: {\n    type: {\n      grey: styles['callout-grey'],\n      success: styles['callout-success'],\n      alert: styles['callout-alert'],\n      gradient: styles['callout-gradient'],\n      accent: styles['callout-accent'],\n      attention: styles['callout-attention'],\n      normal: styles['callout-normal'],\n    },\n    outline: {\n      true: styles['callout-outline'],\n    },\n    highContrast: {\n      true: styles['callout-high-contrast'],\n    },\n  },\n  defaultVariants: {\n    type: 'grey',\n  },\n});\n\nexport interface CalloutProps extends ComponentPropsWithoutRef<'div'>, VariantProps<typeof callout> {\n  children: React.ReactNode;\n  action?: React.ReactNode;\n  dismissible?: boolean;\n  onDismiss?: () => void;\n  width?: string | number;\n  style?: React.CSSProperties;\n  icon?: React.ReactNode;\n}\n\nexport const Callout = React.forwardRef<HTMLDivElement, CalloutProps>(\n  ({ \n    className,\n    type = 'grey',\n    outline,\n    highContrast,\n    children,\n    action,\n    dismissible,\n    onDismiss,\n    width,\n    style,\n    icon,\n    ...props\n  }, ref) => {\n    const combinedStyle = {\n      ...style,\n      ...(width && { width: typeof width === 'number' ? `${width}px` : width }),\n    };\n\n    const getRole = () => {\n      switch (type) {\n        case 'alert':\n          return 'alert';\n        case 'success':\n          return 'status';\n        default:\n          return 'status';\n      }\n    };\n\n    return (\n      <div\n        ref={ref}\n        className={`${callout({ type, outline, highContrast })} ${className || ''}`}\n        style={combinedStyle}\n        role={getRole()}\n        aria-live={type === 'alert' ? 'assertive' : 'polite'}\n        {...props}\n      >\n        <div className={styles.container}>\n          <div className={styles.messageContainer}>\n            {icon !== undefined ? (\n              <div className={styles.icon} aria-hidden=\"true\">\n                {icon}\n              </div>\n            ) : (\n              <InfoCircledIcon \n                className={styles.icon} \n                aria-hidden=\"true\"\n              />\n            )}\n            <div className={styles.message}>{children}</div>\n          </div>\n          \n          <div className={styles.actionsContainer}>\n            {action && (\n              <div className={styles.action}>\n                {action}\n              </div>\n            )}\n            {dismissible && (\n              <button \n                className={styles.dismiss} \n                onClick={onDismiss}\n                aria-label=\"Dismiss message\"\n                type=\"button\"\n              >\n                <svg \n                  width=\"12\" \n                  height=\"12\" \n                  viewBox=\"0 0 12 12\" \n                  fill=\"none\" \n                  xmlns=\"http://www.w3.org/2000/svg\"\n                  aria-hidden=\"true\"\n                  role=\"presentation\"\n                >\n                  <path \n                    fillRule=\"evenodd\" \n                    clipRule=\"evenodd\" \n                    d=\"M9.5066 3.3066C9.73115 3.08205 9.73115 2.71798 9.5066 2.49343C9.28205 2.26887 8.91798 2.26887 8.69343 2.49343L6.00001 5.18684L3.3066 2.49343C3.08205 2.26887 2.71798 2.26887 2.49343 2.49343C2.26887 2.71798 2.26887 3.08205 2.49343 3.3066L5.18684 6.00001L2.49343 8.69343C2.26887 8.91798 2.26887 9.28205 2.49343 9.5066C2.71798 9.73115 3.08205 9.73115 3.3066 9.5066L6.00001 6.81318L8.69343 9.5066C8.91798 9.73115 9.28205 9.73115 9.5066 9.5066C9.73115 9.28205 9.73115 8.91798 9.5066 8.69343L6.81318 6.00001L9.5066 3.3066Z\" \n                    fill=\"currentColor\"\n                  />\n                </svg>\n              </button>\n            )}\n          </div>\n        </div>\n      </div>\n    );\n  }\n);\n\nCallout.displayName = 'Callout';"],"names":["_jsx","_jsxs"],"mappings":"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"}
+{"version":3,"file":"callout.js","sources":["../../../components/callout/callout.tsx"],"sourcesContent":["'use client';\n\nimport { InfoCircledIcon } from '@radix-ui/react-icons';\nimport { type VariantProps, cva } from 'class-variance-authority';\nimport { type ComponentPropsWithoutRef } from 'react';\nimport * as React from 'react';\n\nimport styles from './callout.module.css';\n\nconst callout = cva(styles.callout, {\n  variants: {\n    type: {\n      grey: styles['callout-grey'],\n      success: styles['callout-success'],\n      alert: styles['callout-alert'],\n      gradient: styles['callout-gradient'],\n      accent: styles['callout-accent'],\n      attention: styles['callout-attention'],\n      normal: styles['callout-normal']\n    },\n    outline: {\n      true: styles['callout-outline']\n    },\n    highContrast: {\n      true: styles['callout-high-contrast']\n    }\n  },\n  defaultVariants: {\n    type: 'grey'\n  }\n});\n\nexport interface CalloutProps\n  extends ComponentPropsWithoutRef<'div'>,\n    VariantProps<typeof callout> {\n  children: React.ReactNode;\n  action?: React.ReactNode;\n  dismissible?: boolean;\n  onDismiss?: () => void;\n  width?: string | number;\n  style?: React.CSSProperties;\n  icon?: React.ReactNode;\n}\n\nexport const Callout = React.forwardRef<HTMLDivElement, CalloutProps>(\n  (\n    {\n      className,\n      type = 'grey',\n      outline,\n      highContrast,\n      children,\n      action,\n      dismissible,\n      onDismiss,\n      width,\n      style,\n      icon,\n      ...props\n    },\n    ref\n  ) => {\n    const combinedStyle = {\n      ...style,\n      ...(width && { width: typeof width === 'number' ? `${width}px` : width })\n    };\n\n    const getRole = () => {\n      switch (type) {\n        case 'alert':\n          return 'alert';\n        case 'success':\n          return 'status';\n        default:\n          return 'status';\n      }\n    };\n\n    return (\n      <div\n        ref={ref}\n        className={`${callout({ type, outline, highContrast })} ${className || ''}`}\n        style={combinedStyle}\n        role={getRole()}\n        aria-live={type === 'alert' ? 'assertive' : 'polite'}\n        {...props}\n      >\n        <div className={styles.container}>\n          <div className={styles.messageContainer}>\n            {icon !== undefined ? (\n              <div className={styles.icon} aria-hidden='true'>\n                {icon}\n              </div>\n            ) : (\n              <InfoCircledIcon className={styles.icon} aria-hidden='true' />\n            )}\n            <div className={styles.message}>{children}</div>\n          </div>\n\n          <div className={styles.actionsContainer}>\n            {action && <div className={styles.action}>{action}</div>}\n            {dismissible && (\n              <button\n                className={styles.dismiss}\n                onClick={onDismiss}\n                aria-label='Dismiss message'\n                type='button'\n              >\n                <svg\n                  width='12'\n                  height='12'\n                  viewBox='0 0 12 12'\n                  fill='none'\n                  xmlns='http://www.w3.org/2000/svg'\n                  aria-hidden='true'\n                  role='presentation'\n                >\n                  <path\n                    fillRule='evenodd'\n                    clipRule='evenodd'\n                    d='M9.5066 3.3066C9.73115 3.08205 9.73115 2.71798 9.5066 2.49343C9.28205 2.26887 8.91798 2.26887 8.69343 2.49343L6.00001 5.18684L3.3066 2.49343C3.08205 2.26887 2.71798 2.26887 2.49343 2.49343C2.26887 2.71798 2.26887 3.08205 2.49343 3.3066L5.18684 6.00001L2.49343 8.69343C2.26887 8.91798 2.26887 9.28205 2.49343 9.5066C2.71798 9.73115 3.08205 9.73115 3.3066 9.5066L6.00001 6.81318L8.69343 9.5066C8.91798 9.73115 9.28205 9.73115 9.5066 9.5066C9.73115 9.28205 9.73115 8.91798 9.5066 8.69343L6.81318 6.00001L9.5066 3.3066Z'\n                    fill='currentColor'\n                  />\n                </svg>\n              </button>\n            )}\n          </div>\n        </div>\n      </div>\n    );\n  }\n);\n\nCallout.displayName = 'Callout';\n"],"names":[],"mappings":";;;;;;;AASA;AACE;AACE;AACE;AACA;AACA;AACA;AACA;AACA;AACA;AACD;AACD;AACE;AACD;AACD;AACE;AACD;AACF;AACD;AACE;AACD;AACF;AAcY;AAkBT;AACE;;;;;AAME;AACE;AACF;AACE;AACF;AACE;;AAEN;;AAsDF;AAGF;;"}

package/dist/components/checkbox/checkbox.cjs

@@ -1,17 +1,18 @@
+"use client";
 'use strict';
 
-var jsxRuntime = require('../../node_modules/.pnpm/react@18.2.0/node_modules/react/jsx-runtime.cjs');
+var jsxRuntime = require('react/jsx-runtime');
 var index$1 = require('../../node_modules/.pnpm/class-variance-authority@0.7.1/node_modules/class-variance-authority/dist/index.cjs');
 var React = require('react');
 var checkbox_module = require('./checkbox.module.css.cjs');
-var index = require('../../node_modules/.pnpm/@radix-ui_react-checkbox@1.3.2_@types_react-dom@18.0.11_@types_react@18.2.12_react-dom@18.3.1_react@18.2.0__react@18.2.0/node_modules/@radix-ui/react-checkbox/dist/index.cjs');
+var index = require('../../node_modules/.pnpm/@radix-ui_react-checkbox@1.3.2_@types_react-dom@19.1.7_@types_react@19.1.9__@types_react@19.1_eacxjqfuvkgmutrevmrsnebo6u/node_modules/@radix-ui/react-checkbox/dist/index.cjs');
 
-const CheckMarkIcon = () => (jsxRuntime.jsxRuntimeExports.jsx("svg", { xmlns: 'http://www.w3.org/2000/svg', width: '16', height: '16', viewBox: '0 0 16 16', fill: 'none', className: checkbox_module.default.icon, children: jsxRuntime.jsxRuntimeExports.jsx("path", { fillRule: 'evenodd', clipRule: 'evenodd', d: 'M11.9005 4.9671C12.0894 4.6782 12.0083 4.29086 11.7194 4.10197C11.4305 3.91307 11.0432 3.99414 10.8543 4.28304L7.15577 9.93961L5.04542 8.02112C4.79001 7.78893 4.39473 7.80775 4.16254 8.06316C3.93035 8.31857 3.94917 8.71385 4.20458 8.94605L6.85731 11.3576C6.99274 11.4807 7.17532 11.5383 7.35686 11.5151C7.53841 11.492 7.70068 11.3904 7.80084 11.2372L11.9005 4.9671Z', fill: 'currentColor' }) }));
-const IndeterminateIcon = () => (jsxRuntime.jsxRuntimeExports.jsx("svg", { xmlns: 'http://www.w3.org/2000/svg', width: '16', height: '16', viewBox: '0 0 16 16', fill: 'none', className: checkbox_module.default.icon, children: jsxRuntime.jsxRuntimeExports.jsx("path", { fillRule: 'evenodd', clipRule: 'evenodd', d: 'M11.5 8.5H4.5C4.22386 8.5 4 8.27614 4 8C4 7.72386 4.22386 7.5 4.5 7.5H11.5C11.7761 7.5 12 7.72386 12 8C12 8.27614 11.7761 8.5 11.5 8.5Z', fill: 'currentColor' }) }));
+const CheckMarkIcon = () => (jsxRuntime.jsx("svg", { xmlns: 'http://www.w3.org/2000/svg', width: '16', height: '16', viewBox: '0 0 16 16', fill: 'none', className: checkbox_module.default.icon, children: jsxRuntime.jsx("path", { fillRule: 'evenodd', clipRule: 'evenodd', d: 'M11.9005 4.9671C12.0894 4.6782 12.0083 4.29086 11.7194 4.10197C11.4305 3.91307 11.0432 3.99414 10.8543 4.28304L7.15577 9.93961L5.04542 8.02112C4.79001 7.78893 4.39473 7.80775 4.16254 8.06316C3.93035 8.31857 3.94917 8.71385 4.20458 8.94605L6.85731 11.3576C6.99274 11.4807 7.17532 11.5383 7.35686 11.5151C7.53841 11.492 7.70068 11.3904 7.80084 11.2372L11.9005 4.9671Z', fill: 'currentColor' }) }));
+const IndeterminateIcon = () => (jsxRuntime.jsx("svg", { xmlns: 'http://www.w3.org/2000/svg', width: '16', height: '16', viewBox: '0 0 16 16', fill: 'none', className: checkbox_module.default.icon, children: jsxRuntime.jsx("path", { fillRule: 'evenodd', clipRule: 'evenodd', d: 'M11.5 8.5H4.5C4.22386 8.5 4 8.27614 4 8C4 7.72386 4.22386 7.5 4.5 7.5H11.5C11.7761 7.5 12 7.72386 12 8C12 8.27614 11.7761 8.5 11.5 8.5Z', fill: 'currentColor' }) }));
 const checkbox = index$1.cva(checkbox_module.default.checkbox);
 const Checkbox = React.forwardRef(({ className, disabled, checked, defaultChecked, onCheckedChange, ...props }, forwardedRef) => {
     const isIndeterminate = checked === 'indeterminate' || defaultChecked === 'indeterminate';
-    return (jsxRuntime.jsxRuntimeExports.jsx(index.Checkbox, { className: checkbox({
+    return (jsxRuntime.jsx(index.Checkbox, { className: checkbox({
             className: index$1.cx(className, {
                 [checkbox_module.default['checkbox-disabled']]: disabled,
                 [checkbox_module.default['checkbox-indeterminate']]: isIndeterminate
@@ -26,7 +27,7 @@ const Checkbox = React.forwardRef(({ className, disabled, checked, defaultChecke
                     onCheckedChange(value);
                 }
             }
-        }, disabled: disabled, ref: forwardedRef, ...props, children: jsxRuntime.jsxRuntimeExports.jsx(index.CheckboxIndicator, { className: checkbox_module.default.indicator, children: isIndeterminate ? jsxRuntime.jsxRuntimeExports.jsx(IndeterminateIcon, {}) : jsxRuntime.jsxRuntimeExports.jsx(CheckMarkIcon, {}) }) }));
+        }, disabled: disabled, ref: forwardedRef, ...props, children: jsxRuntime.jsx(index.CheckboxIndicator, { className: checkbox_module.default.indicator, children: isIndeterminate ? jsxRuntime.jsx(IndeterminateIcon, {}) : jsxRuntime.jsx(CheckMarkIcon, {}) }) }));
 });
 Checkbox.displayName = 'Checkbox';
 

package/dist/components/checkbox/checkbox.cjs.map

@@ -1 +1 @@
-{"version":3,"file":"checkbox.cjs","sources":["../../../components/checkbox/checkbox.tsx"],"sourcesContent":["import { VariantProps, cva, cx } from 'class-variance-authority';\nimport { Checkbox as CheckboxPrimitive } from 'radix-ui';\nimport { ComponentPropsWithoutRef, ElementRef, forwardRef } from 'react';\n\nimport styles from './checkbox.module.css';\n\nconst CheckMarkIcon = () => (\n  <svg\n    xmlns='http://www.w3.org/2000/svg'\n    width='16'\n    height='16'\n    viewBox='0 0 16 16'\n    fill='none'\n    className={styles.icon}\n  >\n    <path\n      fillRule='evenodd'\n      clipRule='evenodd'\n      d='M11.9005 4.9671C12.0894 4.6782 12.0083 4.29086 11.7194 4.10197C11.4305 3.91307 11.0432 3.99414 10.8543 4.28304L7.15577 9.93961L5.04542 8.02112C4.79001 7.78893 4.39473 7.80775 4.16254 8.06316C3.93035 8.31857 3.94917 8.71385 4.20458 8.94605L6.85731 11.3576C6.99274 11.4807 7.17532 11.5383 7.35686 11.5151C7.53841 11.492 7.70068 11.3904 7.80084 11.2372L11.9005 4.9671Z'\n      fill='currentColor'\n    />\n  </svg>\n);\n\nconst IndeterminateIcon = () => (\n  <svg\n    xmlns='http://www.w3.org/2000/svg'\n    width='16'\n    height='16'\n    viewBox='0 0 16 16'\n    fill='none'\n    className={styles.icon}\n  >\n    <path\n      fillRule='evenodd'\n      clipRule='evenodd'\n      d='M11.5 8.5H4.5C4.22386 8.5 4 8.27614 4 8C4 7.72386 4.22386 7.5 4.5 7.5H11.5C11.7761 7.5 12 7.72386 12 8C12 8.27614 11.7761 8.5 11.5 8.5Z'\n      fill='currentColor'\n    />\n  </svg>\n);\n\nconst checkbox = cva(styles.checkbox);\n\ntype CheckboxVariants = VariantProps<typeof checkbox>;\ntype CheckedState = boolean | 'indeterminate';\n\nexport interface CheckboxProps\n  extends Omit<\n      ComponentPropsWithoutRef<typeof CheckboxPrimitive.Root>,\n      keyof CheckboxVariants\n    >,\n    CheckboxVariants {\n  checked?: CheckedState;\n  defaultChecked?: CheckedState;\n  onCheckedChange?: (checked: CheckedState) => void;\n}\n\nexport const Checkbox = forwardRef<\n  ElementRef<typeof CheckboxPrimitive.Root>,\n  CheckboxProps\n>(\n  (\n    { className, disabled, checked, defaultChecked, onCheckedChange, ...props },\n    forwardedRef\n  ) => {\n    const isIndeterminate =\n      checked === 'indeterminate' || defaultChecked === 'indeterminate';\n\n    return (\n      <CheckboxPrimitive.Root\n        className={checkbox({\n          className: cx(className, {\n            [styles['checkbox-disabled']]: disabled,\n            [styles['checkbox-indeterminate']]: isIndeterminate\n          })\n        })}\n        checked={isIndeterminate || checked === true}\n        defaultChecked={defaultChecked === true}\n        onCheckedChange={value => {\n          if (onCheckedChange) {\n            // If it's currently indeterminate, next state will be unchecked\n            if (checked === 'indeterminate') {\n              onCheckedChange(false);\n            } else {\n              onCheckedChange(value);\n            }\n          }\n        }}\n        disabled={disabled}\n        ref={forwardedRef}\n        {...props}\n      >\n        <CheckboxPrimitive.Indicator className={styles.indicator}>\n          {isIndeterminate ? <IndeterminateIcon /> : <CheckMarkIcon />}\n        </CheckboxPrimitive.Indicator>\n      </CheckboxPrimitive.Root>\n    );\n  }\n);\n\nCheckbox.displayName = 'Checkbox';\n"],"names":["_jsx","styles","cva","forwardRef","CheckboxPrimitive.Root","cx","CheckboxPrimitive.Indicator"],"mappings":";;;;;;;;AAMA,MAAM,aAAa,GAAG,OACpBA,gCACE,CAAA,KAAA,EAAA,EAAA,KAAK,EAAC,4BAA4B,EAClC,KAAK,EAAC,IAAI,EACV,MAAM,EAAC,IAAI,EACX,OAAO,EAAC,WAAW,EACnB,IAAI,EAAC,MAAM,EACX,SAAS,EAAEC,uBAAM,CAAC,IAAI,EAAA,QAAA,EAEtBD,2CACE,QAAQ,EAAC,SAAS,EAClB,QAAQ,EAAC,SAAS,EAClB,CAAC,EAAC,+WAA+W,EACjX,IAAI,EAAC,cAAc,EAAA,CACnB,EACE,CAAA,CACP,CAAC;AAEF,MAAM,iBAAiB,GAAG,OACxBA,gCACE,CAAA,KAAA,EAAA,EAAA,KAAK,EAAC,4BAA4B,EAClC,KAAK,EAAC,IAAI,EACV,MAAM,EAAC,IAAI,EACX,OAAO,EAAC,WAAW,EACnB,IAAI,EAAC,MAAM,EACX,SAAS,EAAEC,uBAAM,CAAC,IAAI,EAAA,QAAA,EAEtBD,2CACE,QAAQ,EAAC,SAAS,EAClB,QAAQ,EAAC,SAAS,EAClB,CAAC,EAAC,yIAAyI,EAC3I,IAAI,EAAC,cAAc,EAAA,CACnB,EACE,CAAA,CACP,CAAC;AAEF,MAAM,QAAQ,GAAGE,WAAG,CAACD,uBAAM,CAAC,QAAQ,CAAC,CAAC;AAgBzB,MAAA,QAAQ,GAAGE,gBAAU,CAIhC,CACE,EAAE,SAAS,EAAE,QAAQ,EAAE,OAAO,EAAE,cAAc,EAAE,eAAe,EAAE,GAAG,KAAK,EAAE,EAC3E,YAAY,KACV;IACF,MAAM,eAAe,GACnB,OAAO,KAAK,eAAe,IAAI,cAAc,KAAK,eAAe,CAAC;IAEpE,QACEH,iCAACI,cAAsB,EACrB,EAAA,SAAS,EAAE,QAAQ,CAAC;AAClB,YAAA,SAAS,EAAEC,UAAE,CAAC,SAAS,EAAE;AACvB,gBAAA,CAACJ,uBAAM,CAAC,mBAAmB,CAAC,GAAG,QAAQ;AACvC,gBAAA,CAACA,uBAAM,CAAC,wBAAwB,CAAC,GAAG,eAAe;aACpD,CAAC;AACH,SAAA,CAAC,EACF,OAAO,EAAE,eAAe,IAAI,OAAO,KAAK,IAAI,EAC5C,cAAc,EAAE,cAAc,KAAK,IAAI,EACvC,eAAe,EAAE,KAAK,IAAG;YACvB,IAAI,eAAe,EAAE;;AAEnB,gBAAA,IAAI,OAAO,KAAK,eAAe,EAAE;oBAC/B,eAAe,CAAC,KAAK,CAAC,CAAC;iBACxB;qBAAM;oBACL,eAAe,CAAC,KAAK,CAAC,CAAC;iBACxB;aACF;AACH,SAAC,EACD,QAAQ,EAAE,QAAQ,EAClB,GAAG,EAAE,YAAY,EACb,GAAA,KAAK,YAETD,gCAAC,CAAAM,uBAA2B,EAAA,EAAC,SAAS,EAAEL,uBAAM,CAAC,SAAS,YACrD,eAAe,GAAGD,iCAAC,iBAAiB,EAAA,EAAA,CAAG,GAAGA,gCAAC,CAAA,aAAa,KAAG,EAChC,CAAA,EAAA,CACP,EACzB;AACJ,CAAC,EACD;AAEF,QAAQ,CAAC,WAAW,GAAG,UAAU;;;;"}
+{"version":3,"file":"checkbox.cjs","sources":["../../../components/checkbox/checkbox.tsx"],"sourcesContent":["'use client';\n\nimport { VariantProps, cva, cx } from 'class-variance-authority';\nimport { Checkbox as CheckboxPrimitive } from 'radix-ui';\nimport { ComponentPropsWithoutRef, ElementRef, forwardRef } from 'react';\n\nimport styles from './checkbox.module.css';\n\nconst CheckMarkIcon = () => (\n  <svg\n    xmlns='http://www.w3.org/2000/svg'\n    width='16'\n    height='16'\n    viewBox='0 0 16 16'\n    fill='none'\n    className={styles.icon}\n  >\n    <path\n      fillRule='evenodd'\n      clipRule='evenodd'\n      d='M11.9005 4.9671C12.0894 4.6782 12.0083 4.29086 11.7194 4.10197C11.4305 3.91307 11.0432 3.99414 10.8543 4.28304L7.15577 9.93961L5.04542 8.02112C4.79001 7.78893 4.39473 7.80775 4.16254 8.06316C3.93035 8.31857 3.94917 8.71385 4.20458 8.94605L6.85731 11.3576C6.99274 11.4807 7.17532 11.5383 7.35686 11.5151C7.53841 11.492 7.70068 11.3904 7.80084 11.2372L11.9005 4.9671Z'\n      fill='currentColor'\n    />\n  </svg>\n);\n\nconst IndeterminateIcon = () => (\n  <svg\n    xmlns='http://www.w3.org/2000/svg'\n    width='16'\n    height='16'\n    viewBox='0 0 16 16'\n    fill='none'\n    className={styles.icon}\n  >\n    <path\n      fillRule='evenodd'\n      clipRule='evenodd'\n      d='M11.5 8.5H4.5C4.22386 8.5 4 8.27614 4 8C4 7.72386 4.22386 7.5 4.5 7.5H11.5C11.7761 7.5 12 7.72386 12 8C12 8.27614 11.7761 8.5 11.5 8.5Z'\n      fill='currentColor'\n    />\n  </svg>\n);\n\nconst checkbox = cva(styles.checkbox);\n\ntype CheckboxVariants = VariantProps<typeof checkbox>;\ntype CheckedState = boolean | 'indeterminate';\n\nexport interface CheckboxProps\n  extends Omit<\n      ComponentPropsWithoutRef<typeof CheckboxPrimitive.Root>,\n      keyof CheckboxVariants\n    >,\n    CheckboxVariants {\n  checked?: CheckedState;\n  defaultChecked?: CheckedState;\n  onCheckedChange?: (checked: CheckedState) => void;\n}\n\nexport const Checkbox = forwardRef<\n  ElementRef<typeof CheckboxPrimitive.Root>,\n  CheckboxProps\n>(\n  (\n    { className, disabled, checked, defaultChecked, onCheckedChange, ...props },\n    forwardedRef\n  ) => {\n    const isIndeterminate =\n      checked === 'indeterminate' || defaultChecked === 'indeterminate';\n\n    return (\n      <CheckboxPrimitive.Root\n        className={checkbox({\n          className: cx(className, {\n            [styles['checkbox-disabled']]: disabled,\n            [styles['checkbox-indeterminate']]: isIndeterminate\n          })\n        })}\n        checked={isIndeterminate || checked === true}\n        defaultChecked={defaultChecked === true}\n        onCheckedChange={value => {\n          if (onCheckedChange) {\n            // If it's currently indeterminate, next state will be unchecked\n            if (checked === 'indeterminate') {\n              onCheckedChange(false);\n            } else {\n              onCheckedChange(value);\n            }\n          }\n        }}\n        disabled={disabled}\n        ref={forwardedRef}\n        {...props}\n      >\n        <CheckboxPrimitive.Indicator className={styles.indicator}>\n          {isIndeterminate ? <IndeterminateIcon /> : <CheckMarkIcon />}\n        </CheckboxPrimitive.Indicator>\n      </CheckboxPrimitive.Root>\n    );\n  }\n);\n\nCheckbox.displayName = 'Checkbox';\n"],"names":[],"mappings":";;;;;;;;;AAQA;AAkBA;AAkBA;AAgBa;;;AAcH;AACE;AACA;;AAEH;;;AAMG;;;;;;;AAMJ;AAUN;AAGF;;"}

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

@@ -1 +1 @@
-{"version":3,"file":"checkbox.d.ts","sourceRoot":"","sources":["../../../components/checkbox/checkbox.tsx"],"names":[],"mappings":"AAAA,OAAO,EAAE,YAAY,EAAW,MAAM,0BAA0B,CAAC;AACjE,OAAO,EAAE,QAAQ,IAAI,iBAAiB,EAAE,MAAM,UAAU,CAAC;AACzD,OAAO,EAAE,wBAAwB,EAA0B,MAAM,OAAO,CAAC;AAwCzE,QAAA,MAAM,QAAQ,oFAAuB,CAAC;AAEtC,KAAK,gBAAgB,GAAG,YAAY,CAAC,OAAO,QAAQ,CAAC,CAAC;AACtD,KAAK,YAAY,GAAG,OAAO,GAAG,eAAe,CAAC;AAE9C,MAAM,WAAW,aACf,SAAQ,IAAI,CACR,wBAAwB,CAAC,OAAO,iBAAiB,CAAC,IAAI,CAAC,EACvD,MAAM,gBAAgB,CACvB,EACD,gBAAgB;IAClB,OAAO,CAAC,EAAE,YAAY,CAAC;IACvB,cAAc,CAAC,EAAE,YAAY,CAAC;IAC9B,eAAe,CAAC,EAAE,CAAC,OAAO,EAAE,YAAY,KAAK,IAAI,CAAC;CACnD;AAED,eAAO,MAAM,QAAQ,6GAyCpB,CAAC"}
+{"version":3,"file":"checkbox.d.ts","sourceRoot":"","sources":["../../../components/checkbox/checkbox.tsx"],"names":[],"mappings":"AAEA,OAAO,EAAE,YAAY,EAAW,MAAM,0BAA0B,CAAC;AACjE,OAAO,EAAE,QAAQ,IAAI,iBAAiB,EAAE,MAAM,UAAU,CAAC;AACzD,OAAO,EAAE,wBAAwB,EAA0B,MAAM,OAAO,CAAC;AAwCzE,QAAA,MAAM,QAAQ,oFAAuB,CAAC;AAEtC,KAAK,gBAAgB,GAAG,YAAY,CAAC,OAAO,QAAQ,CAAC,CAAC;AACtD,KAAK,YAAY,GAAG,OAAO,GAAG,eAAe,CAAC;AAE9C,MAAM,WAAW,aACf,SAAQ,IAAI,CACR,wBAAwB,CAAC,OAAO,iBAAiB,CAAC,IAAI,CAAC,EACvD,MAAM,gBAAgB,CACvB,EACD,gBAAgB;IAClB,OAAO,CAAC,EAAE,YAAY,CAAC;IACvB,cAAc,CAAC,EAAE,YAAY,CAAC;IAC9B,eAAe,CAAC,EAAE,CAAC,OAAO,EAAE,YAAY,KAAK,IAAI,CAAC;CACnD;AAED,eAAO,MAAM,QAAQ,6GAyCpB,CAAC"}

package/dist/components/checkbox/checkbox.js

@@ -1,15 +1,16 @@
-import { j as jsxRuntimeExports } from '../../node_modules/.pnpm/react@18.2.0/node_modules/react/jsx-runtime.js';
+"use client";
+import { jsx } from 'react/jsx-runtime';
 import { cx, cva } from '../../node_modules/.pnpm/class-variance-authority@0.7.1/node_modules/class-variance-authority/dist/index.js';
 import { forwardRef } from 'react';
 import styles from './checkbox.module.css.js';
-import { Checkbox as Checkbox$1, CheckboxIndicator } from '../../node_modules/.pnpm/@radix-ui_react-checkbox@1.3.2_@types_react-dom@18.0.11_@types_react@18.2.12_react-dom@18.3.1_react@18.2.0__react@18.2.0/node_modules/@radix-ui/react-checkbox/dist/index.js';
+import { Checkbox as Checkbox$1, CheckboxIndicator } from '../../node_modules/.pnpm/@radix-ui_react-checkbox@1.3.2_@types_react-dom@19.1.7_@types_react@19.1.9__@types_react@19.1_eacxjqfuvkgmutrevmrsnebo6u/node_modules/@radix-ui/react-checkbox/dist/index.js';
 
-const CheckMarkIcon = () => (jsxRuntimeExports.jsx("svg", { xmlns: 'http://www.w3.org/2000/svg', width: '16', height: '16', viewBox: '0 0 16 16', fill: 'none', className: styles.icon, children: jsxRuntimeExports.jsx("path", { fillRule: 'evenodd', clipRule: 'evenodd', d: 'M11.9005 4.9671C12.0894 4.6782 12.0083 4.29086 11.7194 4.10197C11.4305 3.91307 11.0432 3.99414 10.8543 4.28304L7.15577 9.93961L5.04542 8.02112C4.79001 7.78893 4.39473 7.80775 4.16254 8.06316C3.93035 8.31857 3.94917 8.71385 4.20458 8.94605L6.85731 11.3576C6.99274 11.4807 7.17532 11.5383 7.35686 11.5151C7.53841 11.492 7.70068 11.3904 7.80084 11.2372L11.9005 4.9671Z', fill: 'currentColor' }) }));
-const IndeterminateIcon = () => (jsxRuntimeExports.jsx("svg", { xmlns: 'http://www.w3.org/2000/svg', width: '16', height: '16', viewBox: '0 0 16 16', fill: 'none', className: styles.icon, children: jsxRuntimeExports.jsx("path", { fillRule: 'evenodd', clipRule: 'evenodd', d: 'M11.5 8.5H4.5C4.22386 8.5 4 8.27614 4 8C4 7.72386 4.22386 7.5 4.5 7.5H11.5C11.7761 7.5 12 7.72386 12 8C12 8.27614 11.7761 8.5 11.5 8.5Z', fill: 'currentColor' }) }));
+const CheckMarkIcon = () => (jsx("svg", { xmlns: 'http://www.w3.org/2000/svg', width: '16', height: '16', viewBox: '0 0 16 16', fill: 'none', className: styles.icon, children: jsx("path", { fillRule: 'evenodd', clipRule: 'evenodd', d: 'M11.9005 4.9671C12.0894 4.6782 12.0083 4.29086 11.7194 4.10197C11.4305 3.91307 11.0432 3.99414 10.8543 4.28304L7.15577 9.93961L5.04542 8.02112C4.79001 7.78893 4.39473 7.80775 4.16254 8.06316C3.93035 8.31857 3.94917 8.71385 4.20458 8.94605L6.85731 11.3576C6.99274 11.4807 7.17532 11.5383 7.35686 11.5151C7.53841 11.492 7.70068 11.3904 7.80084 11.2372L11.9005 4.9671Z', fill: 'currentColor' }) }));
+const IndeterminateIcon = () => (jsx("svg", { xmlns: 'http://www.w3.org/2000/svg', width: '16', height: '16', viewBox: '0 0 16 16', fill: 'none', className: styles.icon, children: jsx("path", { fillRule: 'evenodd', clipRule: 'evenodd', d: 'M11.5 8.5H4.5C4.22386 8.5 4 8.27614 4 8C4 7.72386 4.22386 7.5 4.5 7.5H11.5C11.7761 7.5 12 7.72386 12 8C12 8.27614 11.7761 8.5 11.5 8.5Z', fill: 'currentColor' }) }));
 const checkbox = cva(styles.checkbox);
 const Checkbox = forwardRef(({ className, disabled, checked, defaultChecked, onCheckedChange, ...props }, forwardedRef) => {
     const isIndeterminate = checked === 'indeterminate' || defaultChecked === 'indeterminate';
-    return (jsxRuntimeExports.jsx(Checkbox$1, { className: checkbox({
+    return (jsx(Checkbox$1, { className: checkbox({
             className: cx(className, {
                 [styles['checkbox-disabled']]: disabled,
                 [styles['checkbox-indeterminate']]: isIndeterminate
@@ -24,7 +25,7 @@ const Checkbox = forwardRef(({ className, disabled, checked, defaultChecked, onC
                     onCheckedChange(value);
                 }
             }
-        }, disabled: disabled, ref: forwardedRef, ...props, children: jsxRuntimeExports.jsx(CheckboxIndicator, { className: styles.indicator, children: isIndeterminate ? jsxRuntimeExports.jsx(IndeterminateIcon, {}) : jsxRuntimeExports.jsx(CheckMarkIcon, {}) }) }));
+        }, disabled: disabled, ref: forwardedRef, ...props, children: jsx(CheckboxIndicator, { className: styles.indicator, children: isIndeterminate ? jsx(IndeterminateIcon, {}) : jsx(CheckMarkIcon, {}) }) }));
 });
 Checkbox.displayName = 'Checkbox';
 

package/dist/components/checkbox/checkbox.js.map

@@ -1 +1 @@
-{"version":3,"file":"checkbox.js","sources":["../../../components/checkbox/checkbox.tsx"],"sourcesContent":["import { VariantProps, cva, cx } from 'class-variance-authority';\nimport { Checkbox as CheckboxPrimitive } from 'radix-ui';\nimport { ComponentPropsWithoutRef, ElementRef, forwardRef } from 'react';\n\nimport styles from './checkbox.module.css';\n\nconst CheckMarkIcon = () => (\n  <svg\n    xmlns='http://www.w3.org/2000/svg'\n    width='16'\n    height='16'\n    viewBox='0 0 16 16'\n    fill='none'\n    className={styles.icon}\n  >\n    <path\n      fillRule='evenodd'\n      clipRule='evenodd'\n      d='M11.9005 4.9671C12.0894 4.6782 12.0083 4.29086 11.7194 4.10197C11.4305 3.91307 11.0432 3.99414 10.8543 4.28304L7.15577 9.93961L5.04542 8.02112C4.79001 7.78893 4.39473 7.80775 4.16254 8.06316C3.93035 8.31857 3.94917 8.71385 4.20458 8.94605L6.85731 11.3576C6.99274 11.4807 7.17532 11.5383 7.35686 11.5151C7.53841 11.492 7.70068 11.3904 7.80084 11.2372L11.9005 4.9671Z'\n      fill='currentColor'\n    />\n  </svg>\n);\n\nconst IndeterminateIcon = () => (\n  <svg\n    xmlns='http://www.w3.org/2000/svg'\n    width='16'\n    height='16'\n    viewBox='0 0 16 16'\n    fill='none'\n    className={styles.icon}\n  >\n    <path\n      fillRule='evenodd'\n      clipRule='evenodd'\n      d='M11.5 8.5H4.5C4.22386 8.5 4 8.27614 4 8C4 7.72386 4.22386 7.5 4.5 7.5H11.5C11.7761 7.5 12 7.72386 12 8C12 8.27614 11.7761 8.5 11.5 8.5Z'\n      fill='currentColor'\n    />\n  </svg>\n);\n\nconst checkbox = cva(styles.checkbox);\n\ntype CheckboxVariants = VariantProps<typeof checkbox>;\ntype CheckedState = boolean | 'indeterminate';\n\nexport interface CheckboxProps\n  extends Omit<\n      ComponentPropsWithoutRef<typeof CheckboxPrimitive.Root>,\n      keyof CheckboxVariants\n    >,\n    CheckboxVariants {\n  checked?: CheckedState;\n  defaultChecked?: CheckedState;\n  onCheckedChange?: (checked: CheckedState) => void;\n}\n\nexport const Checkbox = forwardRef<\n  ElementRef<typeof CheckboxPrimitive.Root>,\n  CheckboxProps\n>(\n  (\n    { className, disabled, checked, defaultChecked, onCheckedChange, ...props },\n    forwardedRef\n  ) => {\n    const isIndeterminate =\n      checked === 'indeterminate' || defaultChecked === 'indeterminate';\n\n    return (\n      <CheckboxPrimitive.Root\n        className={checkbox({\n          className: cx(className, {\n            [styles['checkbox-disabled']]: disabled,\n            [styles['checkbox-indeterminate']]: isIndeterminate\n          })\n        })}\n        checked={isIndeterminate || checked === true}\n        defaultChecked={defaultChecked === true}\n        onCheckedChange={value => {\n          if (onCheckedChange) {\n            // If it's currently indeterminate, next state will be unchecked\n            if (checked === 'indeterminate') {\n              onCheckedChange(false);\n            } else {\n              onCheckedChange(value);\n            }\n          }\n        }}\n        disabled={disabled}\n        ref={forwardedRef}\n        {...props}\n      >\n        <CheckboxPrimitive.Indicator className={styles.indicator}>\n          {isIndeterminate ? <IndeterminateIcon /> : <CheckMarkIcon />}\n        </CheckboxPrimitive.Indicator>\n      </CheckboxPrimitive.Root>\n    );\n  }\n);\n\nCheckbox.displayName = 'Checkbox';\n"],"names":["_jsx","CheckboxPrimitive.Root","CheckboxPrimitive.Indicator"],"mappings":";;;;;;AAMA,MAAM,aAAa,GAAG,OACpBA,qBACE,CAAA,KAAA,EAAA,EAAA,KAAK,EAAC,4BAA4B,EAClC,KAAK,EAAC,IAAI,EACV,MAAM,EAAC,IAAI,EACX,OAAO,EAAC,WAAW,EACnB,IAAI,EAAC,MAAM,EACX,SAAS,EAAE,MAAM,CAAC,IAAI,EAAA,QAAA,EAEtBA,gCACE,QAAQ,EAAC,SAAS,EAClB,QAAQ,EAAC,SAAS,EAClB,CAAC,EAAC,+WAA+W,EACjX,IAAI,EAAC,cAAc,EAAA,CACnB,EACE,CAAA,CACP,CAAC;AAEF,MAAM,iBAAiB,GAAG,OACxBA,qBACE,CAAA,KAAA,EAAA,EAAA,KAAK,EAAC,4BAA4B,EAClC,KAAK,EAAC,IAAI,EACV,MAAM,EAAC,IAAI,EACX,OAAO,EAAC,WAAW,EACnB,IAAI,EAAC,MAAM,EACX,SAAS,EAAE,MAAM,CAAC,IAAI,EAAA,QAAA,EAEtBA,gCACE,QAAQ,EAAC,SAAS,EAClB,QAAQ,EAAC,SAAS,EAClB,CAAC,EAAC,yIAAyI,EAC3I,IAAI,EAAC,cAAc,EAAA,CACnB,EACE,CAAA,CACP,CAAC;AAEF,MAAM,QAAQ,GAAG,GAAG,CAAC,MAAM,CAAC,QAAQ,CAAC,CAAC;AAgBzB,MAAA,QAAQ,GAAG,UAAU,CAIhC,CACE,EAAE,SAAS,EAAE,QAAQ,EAAE,OAAO,EAAE,cAAc,EAAE,eAAe,EAAE,GAAG,KAAK,EAAE,EAC3E,YAAY,KACV;IACF,MAAM,eAAe,GACnB,OAAO,KAAK,eAAe,IAAI,cAAc,KAAK,eAAe,CAAC;IAEpE,QACEA,sBAACC,UAAsB,EACrB,EAAA,SAAS,EAAE,QAAQ,CAAC;AAClB,YAAA,SAAS,EAAE,EAAE,CAAC,SAAS,EAAE;AACvB,gBAAA,CAAC,MAAM,CAAC,mBAAmB,CAAC,GAAG,QAAQ;AACvC,gBAAA,CAAC,MAAM,CAAC,wBAAwB,CAAC,GAAG,eAAe;aACpD,CAAC;AACH,SAAA,CAAC,EACF,OAAO,EAAE,eAAe,IAAI,OAAO,KAAK,IAAI,EAC5C,cAAc,EAAE,cAAc,KAAK,IAAI,EACvC,eAAe,EAAE,KAAK,IAAG;YACvB,IAAI,eAAe,EAAE;;AAEnB,gBAAA,IAAI,OAAO,KAAK,eAAe,EAAE;oBAC/B,eAAe,CAAC,KAAK,CAAC,CAAC;iBACxB;qBAAM;oBACL,eAAe,CAAC,KAAK,CAAC,CAAC;iBACxB;aACF;AACH,SAAC,EACD,QAAQ,EAAE,QAAQ,EAClB,GAAG,EAAE,YAAY,EACb,GAAA,KAAK,YAETD,qBAAC,CAAAE,iBAA2B,EAAA,EAAC,SAAS,EAAE,MAAM,CAAC,SAAS,YACrD,eAAe,GAAGF,sBAAC,iBAAiB,EAAA,EAAA,CAAG,GAAGA,qBAAC,CAAA,aAAa,KAAG,EAChC,CAAA,EAAA,CACP,EACzB;AACJ,CAAC,EACD;AAEF,QAAQ,CAAC,WAAW,GAAG,UAAU;;;;"}
+{"version":3,"file":"checkbox.js","sources":["../../../components/checkbox/checkbox.tsx"],"sourcesContent":["'use client';\n\nimport { VariantProps, cva, cx } from 'class-variance-authority';\nimport { Checkbox as CheckboxPrimitive } from 'radix-ui';\nimport { ComponentPropsWithoutRef, ElementRef, forwardRef } from 'react';\n\nimport styles from './checkbox.module.css';\n\nconst CheckMarkIcon = () => (\n  <svg\n    xmlns='http://www.w3.org/2000/svg'\n    width='16'\n    height='16'\n    viewBox='0 0 16 16'\n    fill='none'\n    className={styles.icon}\n  >\n    <path\n      fillRule='evenodd'\n      clipRule='evenodd'\n      d='M11.9005 4.9671C12.0894 4.6782 12.0083 4.29086 11.7194 4.10197C11.4305 3.91307 11.0432 3.99414 10.8543 4.28304L7.15577 9.93961L5.04542 8.02112C4.79001 7.78893 4.39473 7.80775 4.16254 8.06316C3.93035 8.31857 3.94917 8.71385 4.20458 8.94605L6.85731 11.3576C6.99274 11.4807 7.17532 11.5383 7.35686 11.5151C7.53841 11.492 7.70068 11.3904 7.80084 11.2372L11.9005 4.9671Z'\n      fill='currentColor'\n    />\n  </svg>\n);\n\nconst IndeterminateIcon = () => (\n  <svg\n    xmlns='http://www.w3.org/2000/svg'\n    width='16'\n    height='16'\n    viewBox='0 0 16 16'\n    fill='none'\n    className={styles.icon}\n  >\n    <path\n      fillRule='evenodd'\n      clipRule='evenodd'\n      d='M11.5 8.5H4.5C4.22386 8.5 4 8.27614 4 8C4 7.72386 4.22386 7.5 4.5 7.5H11.5C11.7761 7.5 12 7.72386 12 8C12 8.27614 11.7761 8.5 11.5 8.5Z'\n      fill='currentColor'\n    />\n  </svg>\n);\n\nconst checkbox = cva(styles.checkbox);\n\ntype CheckboxVariants = VariantProps<typeof checkbox>;\ntype CheckedState = boolean | 'indeterminate';\n\nexport interface CheckboxProps\n  extends Omit<\n      ComponentPropsWithoutRef<typeof CheckboxPrimitive.Root>,\n      keyof CheckboxVariants\n    >,\n    CheckboxVariants {\n  checked?: CheckedState;\n  defaultChecked?: CheckedState;\n  onCheckedChange?: (checked: CheckedState) => void;\n}\n\nexport const Checkbox = forwardRef<\n  ElementRef<typeof CheckboxPrimitive.Root>,\n  CheckboxProps\n>(\n  (\n    { className, disabled, checked, defaultChecked, onCheckedChange, ...props },\n    forwardedRef\n  ) => {\n    const isIndeterminate =\n      checked === 'indeterminate' || defaultChecked === 'indeterminate';\n\n    return (\n      <CheckboxPrimitive.Root\n        className={checkbox({\n          className: cx(className, {\n            [styles['checkbox-disabled']]: disabled,\n            [styles['checkbox-indeterminate']]: isIndeterminate\n          })\n        })}\n        checked={isIndeterminate || checked === true}\n        defaultChecked={defaultChecked === true}\n        onCheckedChange={value => {\n          if (onCheckedChange) {\n            // If it's currently indeterminate, next state will be unchecked\n            if (checked === 'indeterminate') {\n              onCheckedChange(false);\n            } else {\n              onCheckedChange(value);\n            }\n          }\n        }}\n        disabled={disabled}\n        ref={forwardedRef}\n        {...props}\n      >\n        <CheckboxPrimitive.Indicator className={styles.indicator}>\n          {isIndeterminate ? <IndeterminateIcon /> : <CheckMarkIcon />}\n        </CheckboxPrimitive.Indicator>\n      </CheckboxPrimitive.Root>\n    );\n  }\n);\n\nCheckbox.displayName = 'Checkbox';\n"],"names":[],"mappings":";;;;;;;AAQA;AAkBA;AAkBA;AAgBa;;;AAcH;AACE;AACA;;AAEH;;;AAMG;;;;;;;AAMJ;AAUN;AAGF;;"}

package/dist/components/chip/chip.cjs

@@ -1,38 +1,39 @@
+"use client";
 'use strict';
 
-var jsxRuntime = require('../../node_modules/.pnpm/react@18.2.0/node_modules/react/jsx-runtime.cjs');
+var jsxRuntime = require('react/jsx-runtime');
 var index = require('../../node_modules/.pnpm/class-variance-authority@0.7.1/node_modules/class-variance-authority/dist/index.cjs');
 var chip_module = require('./chip.module.css.cjs');
 
 const chip = index.cva(chip_module.default.chip, {
     variants: {
         variant: {
-            outline: chip_module.default["chip-variant-outline"],
-            filled: chip_module.default["chip-variant-filled"],
+            outline: chip_module.default['chip-variant-outline'],
+            filled: chip_module.default['chip-variant-filled']
         },
         size: {
-            large: chip_module.default["chip-size-large"],
-            small: chip_module.default["chip-size-small"],
+            large: chip_module.default['chip-size-large'],
+            small: chip_module.default['chip-size-small']
         },
         color: {
-            neutral: chip_module.default["chip-color-neutral"],
-            accent: chip_module.default["chip-color-accent"],
-        },
+            neutral: chip_module.default['chip-color-neutral'],
+            accent: chip_module.default['chip-color-accent']
+        }
     },
     defaultVariants: {
-        variant: "outline",
-        size: "small",
-        color: "neutral",
-    },
+        variant: 'outline',
+        size: 'small',
+        color: 'neutral'
+    }
 });
-const Chip = ({ variant, size, color, trailingIcon, leadingIcon, isDismissible, children, className, onDismiss, onClick, role = "status", ariaLabel, "data-state": dataState, }) => {
+const Chip = ({ variant, size, color, trailingIcon, leadingIcon, isDismissible, children, className, onDismiss, onClick, role = 'status', ariaLabel, 'data-state': dataState }) => {
     const handleDismiss = (e) => {
         e.stopPropagation();
         onDismiss?.();
     };
-    return (jsxRuntime.jsxRuntimeExports.jsxs("span", { className: chip({ variant, size, color, className }), role: role, "aria-label": ariaLabel || (typeof children === "string" ? children : undefined), onClick: onClick, "data-state": dataState, children: [leadingIcon && (jsxRuntime.jsxRuntimeExports.jsx("span", { className: chip_module.default["leading-icon"], "aria-hidden": "true", role: "presentation", children: leadingIcon })), children, isDismissible ? (jsxRuntime.jsxRuntimeExports.jsx("button", { onClick: handleDismiss, className: chip_module.default["dismiss-button"], "aria-label": `Remove ${typeof children === "string" ? children : "item"}`, type: "button", children: jsxRuntime.jsxRuntimeExports.jsx("svg", { width: "12", height: "12", viewBox: "0 0 12 12", fill: "none", xmlns: "http://www.w3.org/2000/svg", "aria-hidden": "true", role: "presentation", children: jsxRuntime.jsxRuntimeExports.jsx("path", { fillRule: "evenodd", clipRule: "evenodd", d: "M9.5066 3.3066C9.73115 3.08205 9.73115 2.71798 9.5066 2.49343C9.28205 2.26887 8.91798 2.26887 8.69343 2.49343L6.00001 5.18684L3.3066 2.49343C3.08205 2.26887 2.71798 2.26887 2.49343 2.49343C2.26887 2.71798 2.26887 3.08205 2.49343 3.3066L5.18684 6.00001L2.49343 8.69343C2.26887 8.91798 2.26887 9.28205 2.49343 9.5066C2.71798 9.73115 3.08205 9.73115 3.3066 9.5066L6.00001 6.81318L8.69343 9.5066C8.91798 9.73115 9.28205 9.73115 9.5066 9.5066C9.73115 9.28205 9.73115 8.91798 9.5066 8.69343L6.81318 6.00001L9.5066 3.3066Z", fill: "currentColor" }) }) })) : trailingIcon ? (jsxRuntime.jsxRuntimeExports.jsx("span", { className: chip_module.default["trailing-icon"], "aria-hidden": "true", role: "presentation", children: trailingIcon })) : null] }));
+    return (jsxRuntime.jsxs("span", { className: chip({ variant, size, color, className }), role: role, "aria-label": ariaLabel || (typeof children === 'string' ? children : undefined), onClick: onClick, "data-state": dataState, children: [leadingIcon && (jsxRuntime.jsx("span", { className: chip_module.default['leading-icon'], "aria-hidden": 'true', role: 'presentation', children: leadingIcon })), children, isDismissible ? (jsxRuntime.jsx("button", { onClick: handleDismiss, className: chip_module.default['dismiss-button'], "aria-label": `Remove ${typeof children === 'string' ? children : 'item'}`, type: 'button', children: jsxRuntime.jsx("svg", { width: '12', height: '12', viewBox: '0 0 12 12', fill: 'none', xmlns: 'http://www.w3.org/2000/svg', "aria-hidden": 'true', role: 'presentation', children: jsxRuntime.jsx("path", { fillRule: 'evenodd', clipRule: 'evenodd', d: 'M9.5066 3.3066C9.73115 3.08205 9.73115 2.71798 9.5066 2.49343C9.28205 2.26887 8.91798 2.26887 8.69343 2.49343L6.00001 5.18684L3.3066 2.49343C3.08205 2.26887 2.71798 2.26887 2.49343 2.49343C2.26887 2.71798 2.26887 3.08205 2.49343 3.3066L5.18684 6.00001L2.49343 8.69343C2.26887 8.91798 2.26887 9.28205 2.49343 9.5066C2.71798 9.73115 3.08205 9.73115 3.3066 9.5066L6.00001 6.81318L8.69343 9.5066C8.91798 9.73115 9.28205 9.73115 9.5066 9.5066C9.73115 9.28205 9.73115 8.91798 9.5066 8.69343L6.81318 6.00001L9.5066 3.3066Z', fill: 'currentColor' }) }) })) : trailingIcon ? (jsxRuntime.jsx("span", { className: chip_module.default['trailing-icon'], "aria-hidden": 'true', role: 'presentation', children: trailingIcon })) : null] }));
 };
-Chip.displayName = "Chip";
+Chip.displayName = 'Chip';
 
 exports.Chip = Chip;
 //# sourceMappingURL=chip.cjs.map