ics-ui-kit 0.1.19 → 0.1.20

package/dist/components/calendar.js.map

@@ -1 +1 @@
-{"version":3,"file":"calendar.js","sources":["../../src/components/calendar/components/calendar-chevron/CalendarChevron.tsx","../../src/components/calendar/components/calendar-day-button/CalendarDayButton.tsx","../../src/components/calendar/components/calendar-next-month-button/CalendarNextMonthButton.tsx","../../src/components/calendar/components/calendar-previous-month-button/CalendarPreviousMonthButton.tsx","../../src/components/calendar/components/calendar-root/CalendarRoot.tsx","../../src/components/calendar/components/calendar-week-day/CalendarWeekDay.tsx","../../src/components/calendar/Calendar.tsx"],"sourcesContent":["import { ChevronDownIcon, ChevronLeftIcon, ChevronRightIcon, ChevronUpIcon } from \"lucide-react\";\nimport { ChevronProps } from \"react-day-picker\";\nimport { tv } from \"tailwind-variants\";\n\nconst calendarChevronStyles = tv({\n\tbase: \"size-4\"\n});\n\n/**\n * Компонент для отображения стрелок навигации в Calendar\n *\n * @param className - Дополнительные CSS классы\n * @param orientation - Направление стрелки ('left' | 'right' | 'up' | 'down')\n * @param props - Остальные пропсы от react-day-picker Chevron\n */\nexport const CalendarChevron = ({ className, orientation, ...props }: ChevronProps): React.JSX.Element => {\n\tif (orientation === \"left\") {\n\t\treturn <ChevronLeftIcon className={calendarChevronStyles({ className })} {...props} />;\n\t}\n\tif (orientation === \"right\") {\n\t\treturn <ChevronRightIcon className={calendarChevronStyles({ className })} {...props} />;\n\t}\n\tif (orientation === \"up\") {\n\t\treturn <ChevronUpIcon className={calendarChevronStyles({ className })} {...props} />;\n\t}\n\treturn <ChevronDownIcon className={calendarChevronStyles({ className })} {...props} />;\n};\n\nCalendarChevron.displayName = \"CalendarChevron\";\n","import { tv } from \"tailwind-variants\";\nimport { DayButton, DayButtonProps } from \"react-day-picker\";\n\nconst calendarDayButtonStyles = tv({\n\tbase: [\n\t\t\"inline-flex items-center justify-center gap-2\",\n\t\t\"aspect-square h-9 shrink-0 p-2.5\",\n\t\t\"text-xs font-medium text-foreground transition-all\",\n\t\t\"cursor-pointer select-none\",\n\t\t\"disabled:pointer-events-none disabled:text-muted-foreground disabled:opacity-50\",\n\t\t\"focus-visible:outline-none focus-visible:ring-1 focus-visible:ring-primary\",\n\t\t\"focus-visible:rounded-md\"\n\t],\n\tvariants: {\n\t\tselected: {\n\t\t\ttrue: \"bg-primary text-primary-foreground\"\n\t\t},\n\t\trange_middle: {\n\t\t\ttrue: \"bg-secondary-bg-hover text-card-foreground\"\n\t\t},\n\t\toutside: {\n\t\t\ttrue: \"text-muted-foreground\"\n\t\t},\n\t\ttoday: {\n\t\t\ttrue: \"relative after:absolute after:bottom-1 after:left-1/2 after:h-1 after:w-1 after:-translate-x-1/2 after:rounded-full after:bg-primary\"\n\t\t}\n\t},\n\tcompoundVariants: [\n\t\t{\n\t\t\tselected: false,\n\t\t\tclassName: \"hover:bg-secondary-bg-hover\"\n\t\t},\n\t\t{\n\t\t\tselected: true,\n\t\t\trange_start: false,\n\t\t\trange_end: false,\n\t\t\trange_middle: false,\n\t\t\tclassName: \"rounded-md\"\n\t\t},\n\t\t{\n\t\t\tselected: true,\n\t\t\trange_start: true,\n\t\t\tclassName: \"rounded-l-md\"\n\t\t},\n\t\t{\n\t\t\tselected: true,\n\t\t\trange_end: true,\n\t\t\tclassName: \"rounded-r-md\"\n\t\t},\n\t\t{\n\t\t\ttoday: true,\n\t\t\tselected: true,\n\t\t\trange_middle: false,\n\t\t\tclassName: \"after:bg-primary-foreground\"\n\t\t},\n\t\t{\n\t\t\toutside: true,\n\t\t\tselected: false,\n\t\t\tclassName: \"hover:text-primary-fg\"\n\t\t}\n\t]\n});\n\nexport interface ModifiersRdp {\n\tselected?: boolean;\n\tdisabled?: boolean;\n\thidden?: boolean;\n\ttoday?: boolean;\n\tfocused?: boolean;\n\toutside?: boolean;\n\n\trange_start?: boolean;\n\trange_end?: boolean;\n\trange_middle?: boolean;\n}\n\nexport type CalendarDayButtonProps = DayButtonProps & { modifiers: ModifiersRdp };\n\n/**\n * Кнопка для отображения дня в Calendar\n *\n * @param modifiers - Модификаторы состояния дня (selected, disabled, today, etc.)\n * @param className - Дополнительные CSS классы\n * @param props - Пропсы от react-day-picker DayButton\n */\nexport const CalendarDayButton = ({ modifiers, className, ...props }: CalendarDayButtonProps) => {\n\treturn (\n\t\t<DayButton\n\t\t\tmodifiers={modifiers}\n\t\t\tclassName={calendarDayButtonStyles({ ...modifiers, className })}\n\t\t\t{...props}\n\t\t\tdisabled={modifiers.disabled}\n\t\t/>\n\t);\n};\n\nCalendarDayButton.displayName = \"CalendarDayButton\";\n","import { Button } from \"@/components/button\";\nimport { NextMonthButtonProps } from \"react-day-picker\";\n\n/**\n * Кнопка для перехода к следующему месяцу в Calendar, оборачивает компонент day-picker-chevron\n *\n * @param className - Дополнительные CSS классы\n * @param props - Пропсы от react-day-picker NextMonthButton\n */\nexport const CalendarNextMonthButton = ({ className, ...props }: NextMonthButtonProps) => {\n\treturn <Button {...props} variant=\"ghost\" className={className} />;\n};\n\nCalendarNextMonthButton.displayName = \"CalendarNextMonthButton\";\n","import { Button } from \"@/components/button\";\nimport { PreviousMonthButtonProps } from \"react-day-picker\";\n\n/**\n * Кнопка для перехода к предыдущему месяцу в Calendar, оборачивает компонент day-picker-chevron\n *\n * @param className - Дополнительные CSS классы\n * @param props - Пропсы от react-day-picker PreviousMonthButton\n */\nexport const CalendarPreviousMonthButton = ({ className, ...props }: PreviousMonthButtonProps) => {\n\treturn <Button {...props} variant=\"ghost\" className={className} />;\n};\n\nCalendarPreviousMonthButton.displayName = \"CalendarPreviousMonthButton\";\n","import { Root, RootProps } from \"react-day-picker\";\nimport { tv } from \"tailwind-variants\";\n\nconst calendarRootStyles = tv({\n\tbase: [\n\t\t\"w-fit rounded-md border bg-background\",\n\t\t\"border border-solid border-secondary-border bg-secondary-bg shadow-soft-sm\"\n\t]\n});\n\n/**\n * Корневой контейнер для Calendar\n *\n * @param className - Дополнительные CSS классы\n * @param props - Пропсы от react-day-picker Root\n */\nexport const CalendarRoot = ({ className, ...props }: RootProps) => {\n\treturn <Root {...props} className={calendarRootStyles({ className })} />;\n};\n\nCalendarRoot.displayName = \"CalendarRoot\";\n","import { tv } from \"tailwind-variants\";\nimport { Weekday, WeekdayProps } from \"react-day-picker\";\n\nconst calendarWeekDayStyles = tv({\n\tbase: [\n\t\t\"inline-flex items-center justify-center gap-2\",\n\t\t\"transition-all\",\n\t\t\"text-xs font-medium text-muted-foreground\",\n\t\t\"w-9 shrink-0 rounded p-0\",\n\t\t\"opacity-70\"\n\t]\n});\n\n/**\n * Компонент для отображения дня недели в Calendar\n *\n * @param className - Дополнительные CSS классы\n * @param props - Пропсы от react-day-picker Weekday\n */\nexport const CalendarWeekDay = ({ className, ...props }: WeekdayProps) => {\n\treturn <Weekday className={calendarWeekDayStyles({ className })} {...props}></Weekday>;\n};\n\nCalendarWeekDay.displayName = \"CalendarWeekDay\";\n","import { useMemo } from \"react\";\nimport { tv } from \"tailwind-variants\";\nimport { CalendarChevron } from \"./components/calendar-chevron/CalendarChevron\";\nimport { CalendarDayButton } from \"./components/calendar-day-button/CalendarDayButton\";\nimport { CalendarNextMonthButton } from \"./components/calendar-next-month-button/CalendarNextMonthButton\";\nimport { CalendarPreviousMonthButton } from \"./components/calendar-previous-month-button/CalendarPreviousMonthButton\";\nimport { CalendarRoot } from \"./components/calendar-root/CalendarRoot\";\nimport { CalendarWeekDay } from \"./components/calendar-week-day/CalendarWeekDay\";\nimport { DayPicker, DayPickerProps } from \"react-day-picker\";\n\nconst CalendarStyles = tv({\n\tbase: [\n\t\t\"bg-background p-3 [[data-slot=card-content]_&]:bg-transparent [[data-slot=popover-content]_&]:bg-transparent\"\n\t],\n\tslots: {\n\t\tmonths: \"relative flex flex-col gap-4 md:flex-row\",\n\t\tmonth: \"flex w-full flex-col gap-4\",\n\t\tnav: \"absolute inset-x-0 top-0 flex w-full items-center justify-between gap-1\",\n\t\tmonth_caption: \"flex h-9 w-full items-center justify-center px-2 capitalize\",\n\t\tdropdowns: \"flex h-9 w-full items-center justify-center gap-1.5 text-sm font-medium\",\n\t\tdropdown_root: [\n\t\t\t\"has-focus:border-ring has-focus:ring-ring/50 has-focus:ring-[3px]\",\n\t\t\t\"shadow-xs relative rounded-md border border-input\"\n\t\t],\n\t\tdropdown: \"absolute inset-0 bg-background opacity-0\",\n\t\ttable: \"w-full border-collapse\",\n\t\tweekdays: \"flex\",\n\t\tweek: \"mt-1 flex\",\n\t\thidden: \"invisible\",\n\t\tday: \"border-0 p-0\"\n\t}\n});\n\nconst captionLabelStyle = tv({\n\tbase: \"select-none font-medium\",\n\tvariants: {\n\t\tlayout: {\n\t\t\tlabel: \"text-sm\",\n\t\t\tdropdown:\n\t\t\t\t\"flex h-8 items-center gap-1 rounded-md pl-2 pr-1 text-sm [&>svg]:size-3.5 [&>svg]:text-muted-foreground\"\n\t\t}\n\t},\n\tdefaultVariants: {\n\t\tlayout: \"label\"\n\t}\n});\n\nexport type CalendarProps = DayPickerProps;\n\n/**\n * Calendar компонент для выбора дат\n *\n * Основан на [react-day-picker](https://Calendar.dev/) с кастомной стилизацией.\n * Поддерживает выбор одной даты, множественный выбор и выбор диапазона дат.\n *\n * @see https://ui-kit.ics-it.ru/?path=/docs/components-day-picker-Calendar--docs\n */\nexport const Calendar = ({\n\tclassName,\n\tclassNames,\n\tshowOutsideDays = true,\n\tcaptionLayout = \"dropdown\",\n\tcomponents,\n\t...props\n}: CalendarProps) => {\n\tconst styles = CalendarStyles();\n\n\t/**\n\t * По умолчанию react-day-picker ограничивает выбор даты:\n\t * - Минимум - текущий год минус 100 лет\n\t * - Максимум - последний месяц текущего года\n\t * Переопределяем это поведение, чтобы можно было выбирать даты до 2100 года.\n\t */\n\tconst endMonth = useMemo(() => {\n\t\treturn new Date(2100, 11, 31);\n\t}, []);\n\n\tconst classNamesMemoized: CalendarProps[\"classNames\"] = useMemo(() => {\n\t\treturn {\n\t\t\tmonths: styles.months(),\n\t\t\tmonth: styles.month(),\n\t\t\tnav: styles.nav(),\n\t\t\tmonth_caption: styles.month_caption(),\n\t\t\tdropdowns: styles.dropdowns(),\n\t\t\tdropdown_root: styles.dropdown_root(),\n\t\t\tdropdown: styles.dropdown(),\n\t\t\tcaption_label: captionLabelStyle({\n\t\t\t\tlayout: captionLayout === \"label\" ? captionLayout : \"dropdown\"\n\t\t\t}),\n\t\t\ttable: styles.table(),\n\t\t\tweekdays: styles.weekdays(),\n\t\t\tweek: styles.week(),\n\t\t\thidden: styles.hidden(),\n\t\t\tday: styles.day(),\n\t\t\t...classNames\n\t\t};\n\t}, [classNames]);\n\n\tconst componentsMemoized: CalendarProps[\"components\"] = useMemo(() => {\n\t\treturn {\n\t\t\tRoot: CalendarRoot,\n\t\t\tChevron: CalendarChevron,\n\t\t\tDayButton: CalendarDayButton,\n\t\t\tWeekday: CalendarWeekDay,\n\t\t\tPreviousMonthButton: CalendarPreviousMonthButton,\n\t\t\tNextMonthButton: CalendarNextMonthButton,\n\t\t\t...components\n\t\t};\n\t}, [components]);\n\n\treturn (\n\t\t<DayPicker\n\t\t\tendMonth={endMonth}\n\t\t\tshowOutsideDays={showOutsideDays}\n\t\t\tclassName={styles.base({ className })}\n\t\t\tcaptionLayout={captionLayout}\n\t\t\tclassNames={classNamesMemoized}\n\t\t\tcomponents={componentsMemoized}\n\t\t\t{...props}\n\t\t/>\n\t);\n};\n\nCalendar.displayName = \"Calendar\";\n"],"names":["calendarChevronStyles","tv","CalendarChevron","className","orientation","props","jsx","ChevronLeftIcon","ChevronRightIcon","ChevronUpIcon","ChevronDownIcon","calendarDayButtonStyles","CalendarDayButton","modifiers","DayButton","CalendarNextMonthButton","Button","CalendarPreviousMonthButton","calendarRootStyles","CalendarRoot","Root","calendarWeekDayStyles","CalendarWeekDay","Weekday","CalendarStyles","captionLabelStyle","Calendar","classNames","showOutsideDays","captionLayout","components","styles","endMonth","useMemo","classNamesMemoized","componentsMemoized","DayPicker"],"mappings":"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"}
+{"version":3,"file":"calendar.js","sources":["../../src/components/calendar/components/calendar-root/CalendarRoot.tsx","../../src/components/calendar/components/calendar-week-day/CalendarWeekDay.tsx","../../src/components/calendar/Calendar.tsx"],"sourcesContent":["import { Root, RootProps } from \"react-day-picker\";\nimport { tv } from \"tailwind-variants\";\n\nconst calendarRootStyles = tv({\n\tbase: [\n\t\t\"w-fit rounded-md border bg-background\",\n\t\t\"border border-solid border-secondary-border bg-secondary-bg shadow-soft-sm\"\n\t]\n});\n\n/**\n * Корневой контейнер для Calendar\n *\n * @param className - Дополнительные CSS классы\n * @param props - Пропсы от react-day-picker Root\n */\nexport const CalendarRoot = ({ className, ...props }: RootProps) => {\n\treturn <Root {...props} className={calendarRootStyles({ className })} />;\n};\n\nCalendarRoot.displayName = \"CalendarRoot\";\n","import { tv } from \"tailwind-variants\";\nimport { Weekday, WeekdayProps } from \"react-day-picker\";\n\nconst calendarWeekDayStyles = tv({\n\tbase: [\n\t\t\"inline-flex items-center justify-center gap-2\",\n\t\t\"transition-all\",\n\t\t\"text-xs font-medium text-muted-foreground\",\n\t\t\"w-9 shrink-0 rounded p-0\",\n\t\t\"opacity-70\"\n\t]\n});\n\n/**\n * Компонент для отображения дня недели в Calendar\n *\n * @param className - Дополнительные CSS классы\n * @param props - Пропсы от react-day-picker Weekday\n */\nexport const CalendarWeekDay = ({ className, ...props }: WeekdayProps) => {\n\treturn <Weekday className={calendarWeekDayStyles({ className })} {...props}></Weekday>;\n};\n\nCalendarWeekDay.displayName = \"CalendarWeekDay\";\n","import { useMemo } from \"react\";\nimport { tv } from \"tailwind-variants\";\nimport { CalendarChevron } from \"./components/calendar-chevron/CalendarChevron\";\nimport { CalendarDayButton } from \"./components/calendar-day-button/CalendarDayButton\";\nimport { CalendarDropdown } from \"./components/calendar-dropdown/CalendarDropdown\";\nimport { CalendarNextMonthButton } from \"./components/calendar-next-month-button/CalendarNextMonthButton\";\nimport { CalendarPreviousMonthButton } from \"./components/calendar-previous-month-button/CalendarPreviousMonthButton\";\nimport { CalendarRoot } from \"./components/calendar-root/CalendarRoot\";\nimport { CalendarWeekDay } from \"./components/calendar-week-day/CalendarWeekDay\";\nimport { calendarDropdownStyles } from \"./styles\";\nimport { DayPicker, DayPickerProps } from \"react-day-picker\";\n\nconst CalendarStyles = tv({\n\tbase: [\n\t\t\"bg-background p-3 [[data-slot=card-content]_&]:bg-transparent [[data-slot=popover-content]_&]:bg-transparent\"\n\t],\n\tslots: {\n\t\tmonths: \"relative flex flex-col gap-4 md:flex-row\",\n\t\tmonth: \"flex w-full flex-col gap-4\",\n\t\tnav: \"absolute inset-x-0 top-0 flex w-full items-center justify-between gap-1\",\n\t\tmonth_caption: \"flex h-9 w-full items-center justify-center px-2 capitalize\",\n\t\tdropdowns: \"flex h-9 w-full items-center justify-center gap-1.5 text-sm font-medium\",\n\t\ttable: \"w-full border-collapse\",\n\t\tweekdays: \"flex\",\n\t\tweek: \"mt-1 flex\",\n\t\thidden: \"invisible\",\n\t\tday: \"border-0 p-0\"\n\t}\n});\n\nconst captionLabelStyle = tv({\n\tbase: \"select-none text-sm font-medium\"\n});\n\nexport type CalendarProps = DayPickerProps;\n\n/**\n * Calendar компонент для выбора дат\n *\n * Основан на [react-day-picker](https://Calendar.dev/) с кастомной стилизацией.\n * Поддерживает выбор одной даты, множественный выбор и выбор диапазона дат.\n *\n * @see https://ui-kit.ics-it.ru/?path=/docs/components-day-picker-Calendar--docs\n */\nexport const Calendar = ({\n\tclassName,\n\tclassNames,\n\tshowOutsideDays = true,\n\tcaptionLayout = \"dropdown\",\n\tcomponents,\n\t...props\n}: CalendarProps) => {\n\tconst styles = CalendarStyles();\n\tconst dropdownStyles = calendarDropdownStyles();\n\n\t/**\n\t * По умолчанию react-day-picker ограничивает выбор даты:\n\t * - Минимум - текущий год минус 100 лет\n\t * - Максимум - последний месяц текущего года\n\t * Переопределяем это поведение, чтобы можно было выбирать даты до 2100 года.\n\t */\n\tconst endMonth = useMemo(() => {\n\t\treturn new Date(2100, 11, 31);\n\t}, []);\n\n\tconst classNamesMemoized: CalendarProps[\"classNames\"] = useMemo(() => {\n\t\treturn {\n\t\t\tmonths: styles.months(),\n\t\t\tmonth: styles.month(),\n\t\t\tnav: styles.nav(),\n\t\t\tmonth_caption: styles.month_caption(),\n\t\t\tdropdowns: styles.dropdowns(),\n\t\t\tdropdown_root: dropdownStyles.root(),\n\t\t\tdropdown: dropdownStyles.select(),\n\t\t\tcaption_label: captionLayout === \"label\" ? captionLabelStyle() : dropdownStyles.label(),\n\t\t\ttable: styles.table(),\n\t\t\tweekdays: styles.weekdays(),\n\t\t\tweek: styles.week(),\n\t\t\thidden: styles.hidden(),\n\t\t\tday: styles.day(),\n\t\t\t...classNames\n\t\t};\n\t}, [classNames]);\n\n\tconst componentsMemoized: CalendarProps[\"components\"] = useMemo(() => {\n\t\treturn {\n\t\t\tRoot: CalendarRoot,\n\t\t\tChevron: CalendarChevron,\n\t\t\tDayButton: CalendarDayButton,\n\t\t\tDropdown: CalendarDropdown,\n\t\t\tWeekday: CalendarWeekDay,\n\t\t\tPreviousMonthButton: CalendarPreviousMonthButton,\n\t\t\tNextMonthButton: CalendarNextMonthButton,\n\t\t\t...components\n\t\t};\n\t}, [components]);\n\n\treturn (\n\t\t<DayPicker\n\t\t\tendMonth={endMonth}\n\t\t\tshowOutsideDays={showOutsideDays}\n\t\t\tclassName={styles.base({ className })}\n\t\t\tcaptionLayout={captionLayout}\n\t\t\tclassNames={classNamesMemoized}\n\t\t\tcomponents={componentsMemoized}\n\t\t\t{...props}\n\t\t/>\n\t);\n};\n\nCalendar.displayName = \"Calendar\";\n"],"names":["calendarRootStyles","tv","CalendarRoot","className","props","jsx","Root","calendarWeekDayStyles","CalendarWeekDay","Weekday","CalendarStyles","captionLabelStyle","Calendar","classNames","showOutsideDays","captionLayout","components","styles","dropdownStyles","calendarDropdownStyles","endMonth","useMemo","classNamesMemoized","componentsMemoized","CalendarChevron","CalendarDayButton","CalendarDropdown","CalendarPreviousMonthButton","CalendarNextMonthButton","DayPicker"],"mappings":";;;;;AAGA,MAAMA,IAAqBC,EAAG;AAAA,EAC7B,MAAM;AAAA,IACL;AAAA,IACA;AAAA,EAAA;AAEF,CAAC,GAQYC,IAAe,CAAC,EAAE,WAAAC,GAAW,GAAGC,QACrC,gBAAAC,EAACC,KAAM,GAAGF,GAAO,WAAWJ,EAAmB,EAAE,WAAAG,EAAW,CAAA,GAAG;AAGvED,EAAa,cAAc;ACjB3B,MAAMK,IAAwBN,EAAG;AAAA,EAChC,MAAM;AAAA,IACL;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,EAAA;AAEF,CAAC,GAQYO,IAAkB,CAAC,EAAE,WAAAL,GAAW,GAAGC,QACxC,gBAAAC,EAACI,KAAQ,WAAWF,EAAsB,EAAE,WAAAJ,EAAW,CAAA,GAAI,GAAGC,GAAO;AAG7EI,EAAgB,cAAc;ACX9B,MAAME,IAAiBT,EAAG;AAAA,EACzB,MAAM;AAAA,IACL;AAAA,EACD;AAAA,EACA,OAAO;AAAA,IACN,QAAQ;AAAA,IACR,OAAO;AAAA,IACP,KAAK;AAAA,IACL,eAAe;AAAA,IACf,WAAW;AAAA,IACX,OAAO;AAAA,IACP,UAAU;AAAA,IACV,MAAM;AAAA,IACN,QAAQ;AAAA,IACR,KAAK;AAAA,EAAA;AAEP,CAAC,GAEKU,IAAoBV,EAAG;AAAA,EAC5B,MAAM;AACP,CAAC,GAYYW,IAAW,CAAC;AAAA,EACxB,WAAAT;AAAA,EACA,YAAAU;AAAA,EACA,iBAAAC,IAAkB;AAAA,EAClB,eAAAC,IAAgB;AAAA,EAChB,YAAAC;AAAA,EACA,GAAGZ;AACJ,MAAqB;AACpB,QAAMa,IAASP,EAAe,GACxBQ,IAAiBC,EAAuB,GAQxCC,IAAWC,EAAQ,MACjB,IAAI,KAAK,MAAM,IAAI,EAAE,GAC1B,EAAE,GAECC,IAAkDD,EAAQ,OACxD;AAAA,IACN,QAAQJ,EAAO,OAAO;AAAA,IACtB,OAAOA,EAAO,MAAM;AAAA,IACpB,KAAKA,EAAO,IAAI;AAAA,IAChB,eAAeA,EAAO,cAAc;AAAA,IACpC,WAAWA,EAAO,UAAU;AAAA,IAC5B,eAAeC,EAAe,KAAK;AAAA,IACnC,UAAUA,EAAe,OAAO;AAAA,IAChC,eAAeH,MAAkB,UAAUJ,EAAkB,IAAIO,EAAe,MAAM;AAAA,IACtF,OAAOD,EAAO,MAAM;AAAA,IACpB,UAAUA,EAAO,SAAS;AAAA,IAC1B,MAAMA,EAAO,KAAK;AAAA,IAClB,QAAQA,EAAO,OAAO;AAAA,IACtB,KAAKA,EAAO,IAAI;AAAA,IAChB,GAAGJ;AAAA,EACJ,IACE,CAACA,CAAU,CAAC,GAETU,IAAkDF,EAAQ,OACxD;AAAA,IACN,MAAMnB;AAAA,IACN,SAASsB;AAAA,IACT,WAAWC;AAAA,IACX,UAAUC;AAAA,IACV,SAASlB;AAAA,IACT,qBAAqBmB;AAAA,IACrB,iBAAiBC;AAAA,IACjB,GAAGZ;AAAA,EACJ,IACE,CAACA,CAAU,CAAC;AAGd,SAAA,gBAAAX;AAAA,IAACwB;AAAA,IAAA;AAAA,MACA,UAAAT;AAAA,MACA,iBAAAN;AAAA,MACA,WAAWG,EAAO,KAAK,EAAE,WAAAd,GAAW;AAAA,MACpC,eAAAY;AAAA,MACA,YAAYO;AAAA,MACZ,YAAYC;AAAA,MACX,GAAGnB;AAAA,IAAA;AAAA,EACL;AAEF;AAEAQ,EAAS,cAAc;"}

package/dist/styles-scoped.css

@@ -1358,6 +1358,10 @@
 	left: 0px;
 	right: 0px;
 }
+.ui-kit .inset-x-3 {
+	left: 0.75rem;
+	right: 0.75rem;
+}
 .ui-kit .inset-y-0 {
 	top: 0px;
 	bottom: 0px;
@@ -1804,6 +1808,10 @@
 	width: 2rem;
 	height: 2rem;
 }
+.ui-kit .size-9 {
+	width: 2.25rem;
+	height: 2.25rem;
+}
 .ui-kit .h-1 {
 	height: 0.25rem;
 }
@@ -1936,6 +1944,9 @@
 .ui-kit .h-\[22px\] {
 	height: 22px;
 }
+.ui-kit .h-\[280px\] {
+	height: 280px;
+}
 .ui-kit .h-\[3\.25rem\] {
 	height: 3.25rem;
 }
@@ -1960,6 +1971,9 @@
 .ui-kit .h-\[40px\] {
 	height: 40px;
 }
+.ui-kit .h-\[420px\] {
+	height: 420px;
+}
 .ui-kit .h-\[5\.5rem\] {
 	height: 5.5rem;
 }
@@ -2834,6 +2848,9 @@
 .ui-kit .overflow-y-hidden {
 	overflow-y: hidden;
 }
+.ui-kit .overscroll-contain {
+	overscroll-behavior: contain;
+}
 .ui-kit .truncate {
 	overflow: hidden;
 	text-overflow: ellipsis;
@@ -4068,22 +4085,22 @@
 	box-shadow: var(--tw-ring-offset-shadow, 0 0 #0000), var(--tw-ring-shadow, 0 0 #0000), var(--tw-shadow);
 }
 .ui-kit .shadow-soft-base {
-	--tw-shadow: 0 1px 3px 0 hsl(var(--primary-fg) / 0.12), 0 1px 2px -1px hsl(var(--primary-fg) / 0.12);
+	--tw-shadow: 0 1px 3px 0 rgba(0, 0, 0, 0.12), 0 1px 2px -1px rgba(0, 0, 0, 0.12);
 	--tw-shadow-colored: 0 1px 3px 0 var(--tw-shadow-color), 0 1px 2px -1px var(--tw-shadow-color);
 	box-shadow: var(--tw-ring-offset-shadow, 0 0 #0000), var(--tw-ring-shadow, 0 0 #0000), var(--tw-shadow);
 }
 .ui-kit .shadow-soft-lg {
-	--tw-shadow: 0 10px 15px -3px hsl(var(--primary-fg) / 0.12), 0 4px 6px -4px hsl(var(--primary-fg) / 0.12);
+	--tw-shadow: 0 10px 15px -3px rgba(0, 0, 0, 0.12), 0 4px 6px -4px rgba(0, 0, 0, 0.12);
 	--tw-shadow-colored: 0 10px 15px -3px var(--tw-shadow-color), 0 4px 6px -4px var(--tw-shadow-color);
 	box-shadow: var(--tw-ring-offset-shadow, 0 0 #0000), var(--tw-ring-shadow, 0 0 #0000), var(--tw-shadow);
 }
 .ui-kit .shadow-soft-md {
-	--tw-shadow: 0 4px 6px -1px hsl(var(--primary-fg) / 0.12), 0 2px 4px -2px hsl(var(--primary-fg) / 0.12);
+	--tw-shadow: 0 4px 6px -1px rgba(0, 0, 0, 0.12), 0 2px 4px -2px rgba(0, 0, 0, 0.12);
 	--tw-shadow-colored: 0 4px 6px -1px var(--tw-shadow-color), 0 2px 4px -2px var(--tw-shadow-color);
 	box-shadow: var(--tw-ring-offset-shadow, 0 0 #0000), var(--tw-ring-shadow, 0 0 #0000), var(--tw-shadow);
 }
 .ui-kit .shadow-soft-sm {
-	--tw-shadow: 0 1px 2px 0 hsl(var(--primary-fg) / 0.06);
+	--tw-shadow: 0 1px 2px 0 rgba(0, 0, 0, 0.06);
 	--tw-shadow-colored: 0 1px 2px 0 var(--tw-shadow-color);
 	box-shadow: var(--tw-ring-offset-shadow, 0 0 #0000), var(--tw-ring-shadow, 0 0 #0000), var(--tw-shadow);
 }
@@ -4336,6 +4353,9 @@
 .ui-kit .\[filter\:url\(\#shadow-folder\)\] {
 	filter: url(#shadow-folder);
 }
+.ui-kit .\[grid-area\:1\/1\] {
+	grid-area: 1/1;
+}
 .ui-kit .\[mask-image\:linear-gradient\(to_left\2c rgba\(255\2c 255\2c 255\2c 0\)\2c \#fff_15\%\)\] {
 	mask-image: linear-gradient(to left,rgba(255,255,255,0),#fff 15%);
 }
@@ -4520,7 +4540,7 @@
 	border-color: hsl(var(--status-error-secondary-border));
 }
 .ui-kit .invalid\:shadow-soft-base:invalid {
-	--tw-shadow: 0 1px 3px 0 hsl(var(--primary-fg) / 0.12), 0 1px 2px -1px hsl(var(--primary-fg) / 0.12);
+	--tw-shadow: 0 1px 3px 0 rgba(0, 0, 0, 0.12), 0 1px 2px -1px rgba(0, 0, 0, 0.12);
 	--tw-shadow-colored: 0 1px 3px 0 var(--tw-shadow-color), 0 1px 2px -1px var(--tw-shadow-color);
 	box-shadow: var(--tw-ring-offset-shadow, 0 0 #0000), var(--tw-ring-shadow, 0 0 #0000), var(--tw-shadow);
 }
@@ -4711,12 +4731,12 @@
 		box-shadow: var(--tw-ring-offset-shadow, 0 0 #0000), var(--tw-ring-shadow, 0 0 #0000), var(--tw-shadow);
 	}
 	.ui-kit .hover\:shadow-soft-base:hover {
-		--tw-shadow: 0 1px 3px 0 hsl(var(--primary-fg) / 0.12), 0 1px 2px -1px hsl(var(--primary-fg) / 0.12);
+		--tw-shadow: 0 1px 3px 0 rgba(0, 0, 0, 0.12), 0 1px 2px -1px rgba(0, 0, 0, 0.12);
 		--tw-shadow-colored: 0 1px 3px 0 var(--tw-shadow-color), 0 1px 2px -1px var(--tw-shadow-color);
 		box-shadow: var(--tw-ring-offset-shadow, 0 0 #0000), var(--tw-ring-shadow, 0 0 #0000), var(--tw-shadow);
 	}
 	.ui-kit .hover\:shadow-soft-sm:hover {
-		--tw-shadow: 0 1px 2px 0 hsl(var(--primary-fg) / 0.06);
+		--tw-shadow: 0 1px 2px 0 rgba(0, 0, 0, 0.06);
 		--tw-shadow-colored: 0 1px 2px 0 var(--tw-shadow-color);
 		box-shadow: var(--tw-ring-offset-shadow, 0 0 #0000), var(--tw-ring-shadow, 0 0 #0000), var(--tw-shadow);
 	}
@@ -4798,7 +4818,7 @@
 	box-shadow: var(--tw-ring-offset-shadow, 0 0 #0000), var(--tw-ring-shadow, 0 0 #0000), var(--tw-shadow);
 }
 .ui-kit .focus\:shadow-soft-sm:focus {
-	--tw-shadow: 0 1px 2px 0 hsl(var(--primary-fg) / 0.06);
+	--tw-shadow: 0 1px 2px 0 rgba(0, 0, 0, 0.06);
 	--tw-shadow-colored: 0 1px 2px 0 var(--tw-shadow-color);
 	box-shadow: var(--tw-ring-offset-shadow, 0 0 #0000), var(--tw-ring-shadow, 0 0 #0000), var(--tw-shadow);
 }
@@ -5046,7 +5066,7 @@
 	box-shadow: var(--tw-ring-offset-shadow, 0 0 #0000), var(--tw-ring-shadow, 0 0 #0000), var(--tw-shadow);
 }
 .ui-kit .disabled\:shadow-soft-sm:disabled {
-	--tw-shadow: 0 1px 2px 0 hsl(var(--primary-fg) / 0.06);
+	--tw-shadow: 0 1px 2px 0 rgba(0, 0, 0, 0.06);
 	--tw-shadow-colored: 0 1px 2px 0 var(--tw-shadow-color);
 	box-shadow: var(--tw-ring-offset-shadow, 0 0 #0000), var(--tw-ring-shadow, 0 0 #0000), var(--tw-shadow);
 }
@@ -5187,7 +5207,7 @@
 	box-shadow: var(--tw-ring-offset-shadow, 0 0 #0000), var(--tw-ring-shadow, 0 0 #0000), var(--tw-shadow);
 }
 .ui-kit .has-\[input\:disabled\]\:shadow-soft-sm:has(input:disabled) {
-	--tw-shadow: 0 1px 2px 0 hsl(var(--primary-fg) / 0.06);
+	--tw-shadow: 0 1px 2px 0 rgba(0, 0, 0, 0.06);
 	--tw-shadow-colored: 0 1px 2px 0 var(--tw-shadow-color);
 	box-shadow: var(--tw-ring-offset-shadow, 0 0 #0000), var(--tw-ring-shadow, 0 0 #0000), var(--tw-shadow);
 }
@@ -5202,7 +5222,7 @@
 	box-shadow: var(--tw-ring-offset-shadow, 0 0 #0000), var(--tw-ring-shadow, 0 0 #0000), var(--tw-shadow);
 }
 .ui-kit .has-\[input\:invalid\]\:shadow-soft-base:has(input:invalid) {
-	--tw-shadow: 0 1px 3px 0 hsl(var(--primary-fg) / 0.12), 0 1px 2px -1px hsl(var(--primary-fg) / 0.12);
+	--tw-shadow: 0 1px 3px 0 rgba(0, 0, 0, 0.12), 0 1px 2px -1px rgba(0, 0, 0, 0.12);
 	--tw-shadow-colored: 0 1px 3px 0 var(--tw-shadow-color), 0 1px 2px -1px var(--tw-shadow-color);
 	box-shadow: var(--tw-ring-offset-shadow, 0 0 #0000), var(--tw-ring-shadow, 0 0 #0000), var(--tw-shadow);
 }
@@ -5222,7 +5242,7 @@
 	box-shadow: var(--tw-ring-offset-shadow, 0 0 #0000), var(--tw-ring-shadow, 0 0 #0000), var(--tw-shadow);
 }
 .ui-kit .has-\[input\[aria-invalid\=true\]\]\:shadow-soft-base:has(input[aria-invalid=true]) {
-	--tw-shadow: 0 1px 3px 0 hsl(var(--primary-fg) / 0.12), 0 1px 2px -1px hsl(var(--primary-fg) / 0.12);
+	--tw-shadow: 0 1px 3px 0 rgba(0, 0, 0, 0.12), 0 1px 2px -1px rgba(0, 0, 0, 0.12);
 	--tw-shadow-colored: 0 1px 3px 0 var(--tw-shadow-color), 0 1px 2px -1px var(--tw-shadow-color);
 	box-shadow: var(--tw-ring-offset-shadow, 0 0 #0000), var(--tw-ring-shadow, 0 0 #0000), var(--tw-shadow);
 }
@@ -5250,7 +5270,7 @@
 	border-color: hsl(var(--status-error-secondary-border));
 }
 .ui-kit .aria-\[invalid\=true\]\:shadow-soft-base[aria-invalid="true"] {
-	--tw-shadow: 0 1px 3px 0 hsl(var(--primary-fg) / 0.12), 0 1px 2px -1px hsl(var(--primary-fg) / 0.12);
+	--tw-shadow: 0 1px 3px 0 rgba(0, 0, 0, 0.12), 0 1px 2px -1px rgba(0, 0, 0, 0.12);
 	--tw-shadow-colored: 0 1px 3px 0 var(--tw-shadow-color), 0 1px 2px -1px var(--tw-shadow-color);
 	box-shadow: var(--tw-ring-offset-shadow, 0 0 #0000), var(--tw-ring-shadow, 0 0 #0000), var(--tw-shadow);
 }
@@ -5494,7 +5514,7 @@
 	box-shadow: var(--tw-ring-offset-shadow, 0 0 #0000), var(--tw-ring-shadow, 0 0 #0000), var(--tw-shadow) !important;
 }
 .ui-kit .data-\[state\=active\]\:shadow-soft-base[data-state="active"] {
-	--tw-shadow: 0 1px 3px 0 hsl(var(--primary-fg) / 0.12), 0 1px 2px -1px hsl(var(--primary-fg) / 0.12);
+	--tw-shadow: 0 1px 3px 0 rgba(0, 0, 0, 0.12), 0 1px 2px -1px rgba(0, 0, 0, 0.12);
 	--tw-shadow-colored: 0 1px 3px 0 var(--tw-shadow-color), 0 1px 2px -1px var(--tw-shadow-color);
 	box-shadow: var(--tw-ring-offset-shadow, 0 0 #0000), var(--tw-ring-shadow, 0 0 #0000), var(--tw-shadow);
 }
@@ -5711,12 +5731,12 @@
 	opacity: 0.5;
 }
 .ui-kit .data-\[state\=checked\]\:disabled\:shadow-soft-sm:disabled[data-state="checked"] {
-	--tw-shadow: 0 1px 2px 0 hsl(var(--primary-fg) / 0.06);
+	--tw-shadow: 0 1px 2px 0 rgba(0, 0, 0, 0.06);
 	--tw-shadow-colored: 0 1px 2px 0 var(--tw-shadow-color);
 	box-shadow: var(--tw-ring-offset-shadow, 0 0 #0000), var(--tw-ring-shadow, 0 0 #0000), var(--tw-shadow);
 }
 .ui-kit .data-\[state\=indeterminate\]\:disabled\:shadow-soft-sm:disabled[data-state="indeterminate"] {
-	--tw-shadow: 0 1px 2px 0 hsl(var(--primary-fg) / 0.06);
+	--tw-shadow: 0 1px 2px 0 rgba(0, 0, 0, 0.06);
 	--tw-shadow-colored: 0 1px 2px 0 var(--tw-shadow-color);
 	box-shadow: var(--tw-ring-offset-shadow, 0 0 #0000), var(--tw-ring-shadow, 0 0 #0000), var(--tw-shadow);
 }
@@ -5857,7 +5877,7 @@
 	opacity: 1;
 }
 .ui-kit :is(.group[data-variant="floating"] .group-data-\[variant\=floating\]\:shadow-soft-xl) {
-	--tw-shadow: 0 20px 25px -5px hsl(var(--primary-fg) / 0.12), 0 8px 10px -6px hsl(var(--primary-fg) / 0.12);
+	--tw-shadow: 0 20px 25px -5px rgba(0, 0, 0, 0.12), 0 8px 10px -6px rgba(0, 0, 0, 0.12);
 	--tw-shadow-colored: 0 20px 25px -5px var(--tw-shadow-color), 0 8px 10px -6px var(--tw-shadow-color);
 	box-shadow: var(--tw-ring-offset-shadow, 0 0 #0000), var(--tw-ring-shadow, 0 0 #0000), var(--tw-shadow);
 }
@@ -6305,7 +6325,7 @@
 		box-shadow: var(--tw-ring-offset-shadow, 0 0 #0000), var(--tw-ring-shadow, 0 0 #0000), var(--tw-shadow);
 	}
 	.ui-kit .lg\:shadow-soft-sm {
-		--tw-shadow: 0 1px 2px 0 hsl(var(--primary-fg) / 0.06);
+		--tw-shadow: 0 1px 2px 0 rgba(0, 0, 0, 0.06);
 		--tw-shadow-colored: 0 1px 2px 0 var(--tw-shadow-color);
 		box-shadow: var(--tw-ring-offset-shadow, 0 0 #0000), var(--tw-ring-shadow, 0 0 #0000), var(--tw-shadow);
 	}

package/dist/styles.css

@@ -1343,6 +1343,10 @@ body {
 	left: 0px;
 	right: 0px;
 }
+.inset-x-3 {
+	left: 0.75rem;
+	right: 0.75rem;
+}
 .inset-y-0 {
 	top: 0px;
 	bottom: 0px;
@@ -1789,6 +1793,10 @@ body {
 	width: 2rem;
 	height: 2rem;
 }
+.size-9 {
+	width: 2.25rem;
+	height: 2.25rem;
+}
 .h-1 {
 	height: 0.25rem;
 }
@@ -1921,6 +1929,9 @@ body {
 .h-\[22px\] {
 	height: 22px;
 }
+.h-\[280px\] {
+	height: 280px;
+}
 .h-\[3\.25rem\] {
 	height: 3.25rem;
 }
@@ -1945,6 +1956,9 @@ body {
 .h-\[40px\] {
 	height: 40px;
 }
+.h-\[420px\] {
+	height: 420px;
+}
 .h-\[5\.5rem\] {
 	height: 5.5rem;
 }
@@ -2819,6 +2833,9 @@ body {
 .overflow-y-hidden {
 	overflow-y: hidden;
 }
+.overscroll-contain {
+	overscroll-behavior: contain;
+}
 .truncate {
 	overflow: hidden;
 	text-overflow: ellipsis;
@@ -4053,22 +4070,22 @@ body {
 	box-shadow: var(--tw-ring-offset-shadow, 0 0 #0000), var(--tw-ring-shadow, 0 0 #0000), var(--tw-shadow);
 }
 .shadow-soft-base {
-	--tw-shadow: 0 1px 3px 0 hsl(var(--primary-fg) / 0.12), 0 1px 2px -1px hsl(var(--primary-fg) / 0.12);
+	--tw-shadow: 0 1px 3px 0 rgba(0, 0, 0, 0.12), 0 1px 2px -1px rgba(0, 0, 0, 0.12);
 	--tw-shadow-colored: 0 1px 3px 0 var(--tw-shadow-color), 0 1px 2px -1px var(--tw-shadow-color);
 	box-shadow: var(--tw-ring-offset-shadow, 0 0 #0000), var(--tw-ring-shadow, 0 0 #0000), var(--tw-shadow);
 }
 .shadow-soft-lg {
-	--tw-shadow: 0 10px 15px -3px hsl(var(--primary-fg) / 0.12), 0 4px 6px -4px hsl(var(--primary-fg) / 0.12);
+	--tw-shadow: 0 10px 15px -3px rgba(0, 0, 0, 0.12), 0 4px 6px -4px rgba(0, 0, 0, 0.12);
 	--tw-shadow-colored: 0 10px 15px -3px var(--tw-shadow-color), 0 4px 6px -4px var(--tw-shadow-color);
 	box-shadow: var(--tw-ring-offset-shadow, 0 0 #0000), var(--tw-ring-shadow, 0 0 #0000), var(--tw-shadow);
 }
 .shadow-soft-md {
-	--tw-shadow: 0 4px 6px -1px hsl(var(--primary-fg) / 0.12), 0 2px 4px -2px hsl(var(--primary-fg) / 0.12);
+	--tw-shadow: 0 4px 6px -1px rgba(0, 0, 0, 0.12), 0 2px 4px -2px rgba(0, 0, 0, 0.12);
 	--tw-shadow-colored: 0 4px 6px -1px var(--tw-shadow-color), 0 2px 4px -2px var(--tw-shadow-color);
 	box-shadow: var(--tw-ring-offset-shadow, 0 0 #0000), var(--tw-ring-shadow, 0 0 #0000), var(--tw-shadow);
 }
 .shadow-soft-sm {
-	--tw-shadow: 0 1px 2px 0 hsl(var(--primary-fg) / 0.06);
+	--tw-shadow: 0 1px 2px 0 rgba(0, 0, 0, 0.06);
 	--tw-shadow-colored: 0 1px 2px 0 var(--tw-shadow-color);
 	box-shadow: var(--tw-ring-offset-shadow, 0 0 #0000), var(--tw-ring-shadow, 0 0 #0000), var(--tw-shadow);
 }
@@ -4325,6 +4342,9 @@ body {
 .\[filter\:url\(\#shadow-folder\)\] {
 	filter: url(#shadow-folder);
 }
+.\[grid-area\:1\/1\] {
+	grid-area: 1/1;
+}
 .\[mask-image\:linear-gradient\(to_left\2c rgba\(255\2c 255\2c 255\2c 0\)\2c \#fff_15\%\)\] {
 	mask-image: linear-gradient(to left,rgba(255,255,255,0),#fff 15%);
 }
@@ -4509,7 +4529,7 @@ body {
 	border-color: hsl(var(--status-error-secondary-border));
 }
 .invalid\:shadow-soft-base:invalid {
-	--tw-shadow: 0 1px 3px 0 hsl(var(--primary-fg) / 0.12), 0 1px 2px -1px hsl(var(--primary-fg) / 0.12);
+	--tw-shadow: 0 1px 3px 0 rgba(0, 0, 0, 0.12), 0 1px 2px -1px rgba(0, 0, 0, 0.12);
 	--tw-shadow-colored: 0 1px 3px 0 var(--tw-shadow-color), 0 1px 2px -1px var(--tw-shadow-color);
 	box-shadow: var(--tw-ring-offset-shadow, 0 0 #0000), var(--tw-ring-shadow, 0 0 #0000), var(--tw-shadow);
 }
@@ -4700,12 +4720,12 @@ body {
 		box-shadow: var(--tw-ring-offset-shadow, 0 0 #0000), var(--tw-ring-shadow, 0 0 #0000), var(--tw-shadow);
 	}
 	.hover\:shadow-soft-base:hover {
-		--tw-shadow: 0 1px 3px 0 hsl(var(--primary-fg) / 0.12), 0 1px 2px -1px hsl(var(--primary-fg) / 0.12);
+		--tw-shadow: 0 1px 3px 0 rgba(0, 0, 0, 0.12), 0 1px 2px -1px rgba(0, 0, 0, 0.12);
 		--tw-shadow-colored: 0 1px 3px 0 var(--tw-shadow-color), 0 1px 2px -1px var(--tw-shadow-color);
 		box-shadow: var(--tw-ring-offset-shadow, 0 0 #0000), var(--tw-ring-shadow, 0 0 #0000), var(--tw-shadow);
 	}
 	.hover\:shadow-soft-sm:hover {
-		--tw-shadow: 0 1px 2px 0 hsl(var(--primary-fg) / 0.06);
+		--tw-shadow: 0 1px 2px 0 rgba(0, 0, 0, 0.06);
 		--tw-shadow-colored: 0 1px 2px 0 var(--tw-shadow-color);
 		box-shadow: var(--tw-ring-offset-shadow, 0 0 #0000), var(--tw-ring-shadow, 0 0 #0000), var(--tw-shadow);
 	}
@@ -4787,7 +4807,7 @@ body {
 	box-shadow: var(--tw-ring-offset-shadow, 0 0 #0000), var(--tw-ring-shadow, 0 0 #0000), var(--tw-shadow);
 }
 .focus\:shadow-soft-sm:focus {
-	--tw-shadow: 0 1px 2px 0 hsl(var(--primary-fg) / 0.06);
+	--tw-shadow: 0 1px 2px 0 rgba(0, 0, 0, 0.06);
 	--tw-shadow-colored: 0 1px 2px 0 var(--tw-shadow-color);
 	box-shadow: var(--tw-ring-offset-shadow, 0 0 #0000), var(--tw-ring-shadow, 0 0 #0000), var(--tw-shadow);
 }
@@ -5035,7 +5055,7 @@ body {
 	box-shadow: var(--tw-ring-offset-shadow, 0 0 #0000), var(--tw-ring-shadow, 0 0 #0000), var(--tw-shadow);
 }
 .disabled\:shadow-soft-sm:disabled {
-	--tw-shadow: 0 1px 2px 0 hsl(var(--primary-fg) / 0.06);
+	--tw-shadow: 0 1px 2px 0 rgba(0, 0, 0, 0.06);
 	--tw-shadow-colored: 0 1px 2px 0 var(--tw-shadow-color);
 	box-shadow: var(--tw-ring-offset-shadow, 0 0 #0000), var(--tw-ring-shadow, 0 0 #0000), var(--tw-shadow);
 }
@@ -5176,7 +5196,7 @@ body {
 	box-shadow: var(--tw-ring-offset-shadow, 0 0 #0000), var(--tw-ring-shadow, 0 0 #0000), var(--tw-shadow);
 }
 .has-\[input\:disabled\]\:shadow-soft-sm:has(input:disabled) {
-	--tw-shadow: 0 1px 2px 0 hsl(var(--primary-fg) / 0.06);
+	--tw-shadow: 0 1px 2px 0 rgba(0, 0, 0, 0.06);
 	--tw-shadow-colored: 0 1px 2px 0 var(--tw-shadow-color);
 	box-shadow: var(--tw-ring-offset-shadow, 0 0 #0000), var(--tw-ring-shadow, 0 0 #0000), var(--tw-shadow);
 }
@@ -5191,7 +5211,7 @@ body {
 	box-shadow: var(--tw-ring-offset-shadow, 0 0 #0000), var(--tw-ring-shadow, 0 0 #0000), var(--tw-shadow);
 }
 .has-\[input\:invalid\]\:shadow-soft-base:has(input:invalid) {
-	--tw-shadow: 0 1px 3px 0 hsl(var(--primary-fg) / 0.12), 0 1px 2px -1px hsl(var(--primary-fg) / 0.12);
+	--tw-shadow: 0 1px 3px 0 rgba(0, 0, 0, 0.12), 0 1px 2px -1px rgba(0, 0, 0, 0.12);
 	--tw-shadow-colored: 0 1px 3px 0 var(--tw-shadow-color), 0 1px 2px -1px var(--tw-shadow-color);
 	box-shadow: var(--tw-ring-offset-shadow, 0 0 #0000), var(--tw-ring-shadow, 0 0 #0000), var(--tw-shadow);
 }
@@ -5211,7 +5231,7 @@ body {
 	box-shadow: var(--tw-ring-offset-shadow, 0 0 #0000), var(--tw-ring-shadow, 0 0 #0000), var(--tw-shadow);
 }
 .has-\[input\[aria-invalid\=true\]\]\:shadow-soft-base:has(input[aria-invalid=true]) {
-	--tw-shadow: 0 1px 3px 0 hsl(var(--primary-fg) / 0.12), 0 1px 2px -1px hsl(var(--primary-fg) / 0.12);
+	--tw-shadow: 0 1px 3px 0 rgba(0, 0, 0, 0.12), 0 1px 2px -1px rgba(0, 0, 0, 0.12);
 	--tw-shadow-colored: 0 1px 3px 0 var(--tw-shadow-color), 0 1px 2px -1px var(--tw-shadow-color);
 	box-shadow: var(--tw-ring-offset-shadow, 0 0 #0000), var(--tw-ring-shadow, 0 0 #0000), var(--tw-shadow);
 }
@@ -5239,7 +5259,7 @@ body {
 	border-color: hsl(var(--status-error-secondary-border));
 }
 .aria-\[invalid\=true\]\:shadow-soft-base[aria-invalid="true"] {
-	--tw-shadow: 0 1px 3px 0 hsl(var(--primary-fg) / 0.12), 0 1px 2px -1px hsl(var(--primary-fg) / 0.12);
+	--tw-shadow: 0 1px 3px 0 rgba(0, 0, 0, 0.12), 0 1px 2px -1px rgba(0, 0, 0, 0.12);
 	--tw-shadow-colored: 0 1px 3px 0 var(--tw-shadow-color), 0 1px 2px -1px var(--tw-shadow-color);
 	box-shadow: var(--tw-ring-offset-shadow, 0 0 #0000), var(--tw-ring-shadow, 0 0 #0000), var(--tw-shadow);
 }
@@ -5483,7 +5503,7 @@ body {
 	box-shadow: var(--tw-ring-offset-shadow, 0 0 #0000), var(--tw-ring-shadow, 0 0 #0000), var(--tw-shadow) !important;
 }
 .data-\[state\=active\]\:shadow-soft-base[data-state="active"] {
-	--tw-shadow: 0 1px 3px 0 hsl(var(--primary-fg) / 0.12), 0 1px 2px -1px hsl(var(--primary-fg) / 0.12);
+	--tw-shadow: 0 1px 3px 0 rgba(0, 0, 0, 0.12), 0 1px 2px -1px rgba(0, 0, 0, 0.12);
 	--tw-shadow-colored: 0 1px 3px 0 var(--tw-shadow-color), 0 1px 2px -1px var(--tw-shadow-color);
 	box-shadow: var(--tw-ring-offset-shadow, 0 0 #0000), var(--tw-ring-shadow, 0 0 #0000), var(--tw-shadow);
 }
@@ -5700,12 +5720,12 @@ body {
 	opacity: 0.5;
 }
 .data-\[state\=checked\]\:disabled\:shadow-soft-sm:disabled[data-state="checked"] {
-	--tw-shadow: 0 1px 2px 0 hsl(var(--primary-fg) / 0.06);
+	--tw-shadow: 0 1px 2px 0 rgba(0, 0, 0, 0.06);
 	--tw-shadow-colored: 0 1px 2px 0 var(--tw-shadow-color);
 	box-shadow: var(--tw-ring-offset-shadow, 0 0 #0000), var(--tw-ring-shadow, 0 0 #0000), var(--tw-shadow);
 }
 .data-\[state\=indeterminate\]\:disabled\:shadow-soft-sm:disabled[data-state="indeterminate"] {
-	--tw-shadow: 0 1px 2px 0 hsl(var(--primary-fg) / 0.06);
+	--tw-shadow: 0 1px 2px 0 rgba(0, 0, 0, 0.06);
 	--tw-shadow-colored: 0 1px 2px 0 var(--tw-shadow-color);
 	box-shadow: var(--tw-ring-offset-shadow, 0 0 #0000), var(--tw-ring-shadow, 0 0 #0000), var(--tw-shadow);
 }
@@ -5846,7 +5866,7 @@ body {
 	opacity: 1;
 }
 .group[data-variant="floating"] .group-data-\[variant\=floating\]\:shadow-soft-xl {
-	--tw-shadow: 0 20px 25px -5px hsl(var(--primary-fg) / 0.12), 0 8px 10px -6px hsl(var(--primary-fg) / 0.12);
+	--tw-shadow: 0 20px 25px -5px rgba(0, 0, 0, 0.12), 0 8px 10px -6px rgba(0, 0, 0, 0.12);
 	--tw-shadow-colored: 0 20px 25px -5px var(--tw-shadow-color), 0 8px 10px -6px var(--tw-shadow-color);
 	box-shadow: var(--tw-ring-offset-shadow, 0 0 #0000), var(--tw-ring-shadow, 0 0 #0000), var(--tw-shadow);
 }
@@ -6294,7 +6314,7 @@ body {
 		box-shadow: var(--tw-ring-offset-shadow, 0 0 #0000), var(--tw-ring-shadow, 0 0 #0000), var(--tw-shadow);
 	}
 	.lg\:shadow-soft-sm {
-		--tw-shadow: 0 1px 2px 0 hsl(var(--primary-fg) / 0.06);
+		--tw-shadow: 0 1px 2px 0 rgba(0, 0, 0, 0.06);
 		--tw-shadow-colored: 0 1px 2px 0 var(--tw-shadow-color);
 		box-shadow: var(--tw-ring-offset-shadow, 0 0 #0000), var(--tw-ring-shadow, 0 0 #0000), var(--tw-shadow);
 	}

package/dist/vendors/react-day-picker.js

@@ -1,5 +1,5 @@
-import { M as a, W as e, u as s } from "../DayPicker-4hE1QEvO.js";
-import { a8 as d, B as D, C as b, a as p, b as m, f, g as y, D as k, h as u, i as h, a6 as C, w as M, j as W, k as c, F as N, l as g, m as v, n as w, o as B, N as x, p as L, O as P, P as R, R as T, S as I, a7 as O, T as Y, a5 as A, s as G, t as H, q as S, r as F, v as j, Y as U, aa as Z, c as q, ab as z, a9 as E, d as J, e as K, x as Q, z as V, y as X, A as _, G as $, H as aa, E as ea, J as sa, I as ta, K as oa, ak as ra, al as na, ag as la, ai as ia, aj as da, an as Da, am as ba, ac as pa, V as ma, Q as fa, L as ya, U as ka, X as ua, Z as ha, _ as Ca, $ as Ma, a0 as Wa, a2 as ca, a3 as Na, a1 as ga, a4 as va, ad as wa, ae as Ba, af as xa, ah as La } from "../DayPicker-4hE1QEvO.js";
+import { g as a, W as e, u as s } from "../DayPicker-Cu2Kn-he.js";
+import { aa as d, B as D, C as b, h as p, i as m, n as f, o as y, j as k, p as u, q as h, a8 as C, D as M, r as W, s as c, F as N, t as g, v, M as w, w as B, N as x, x as L, O as P, P as R, R as T, S as I, a9 as O, T as Y, a7 as A, A as G, E as H, y as S, z as F, G as j, Y as U, ac as Z, m as q, ad as z, ab as E, k as J, e as K, H as Q, J as V, I as X, K as _, Q as $, U as aa, L as ea, X as sa, V as ta, Z as oa, am as ra, an as na, ai as la, ak as ia, al as da, ap as Da, ao as ba, ae as pa, a1 as ma, $ as fa, _ as ya, a0 as ka, a2 as ua, b as ha, a3 as Ca, d as Ma, l as Wa, a5 as ca, a6 as Na, a4 as ga, c as va, af as wa, ag as Ba, ah as xa, aj as La } from "../DayPicker-Cu2Kn-he.js";
 const o = a, r = e, n = s;
 export {
   d as Animation,

package/package.json

@@ -1,6 +1,6 @@
 {
 	"name": "ics-ui-kit",
-	"version": "0.1.19",
+	"version": "0.1.20",
 	"packageManager": "pnpm@10.17.1",
 	"repository": {
 		"type": "git",

package/tailwind.preset.js

@@ -230,11 +230,11 @@ export default {
 				xs: "calc(var(--radius) - 6px)" /** 2px */
 			},
 			boxShadow: {
-				"soft-base": "0 1px 3px 0 hsl(var(--primary-fg) / 0.12), 0 1px 2px -1px hsl(var(--primary-fg) / 0.12)",
-				"soft-sm": "0 1px 2px 0 hsl(var(--primary-fg) / 0.06)",
-				"soft-md": "0 4px 6px -1px hsl(var(--primary-fg) / 0.12), 0 2px 4px -2px hsl(var(--primary-fg) / 0.12)",
-				"soft-lg": "0 10px 15px -3px hsl(var(--primary-fg) / 0.12), 0 4px 6px -4px hsl(var(--primary-fg) / 0.12)",
-				"soft-xl": "0 20px 25px -5px hsl(var(--primary-fg) / 0.12), 0 8px 10px -6px hsl(var(--primary-fg) / 0.12)",
+				"soft-base": "0 1px 3px 0 rgba(0, 0, 0, 0.12), 0 1px 2px -1px rgba(0, 0, 0, 0.12)",
+				"soft-sm": "0 1px 2px 0 rgba(0, 0, 0, 0.06)",
+				"soft-md": "0 4px 6px -1px rgba(0, 0, 0, 0.12), 0 2px 4px -2px rgba(0, 0, 0, 0.12)",
+				"soft-lg": "0 10px 15px -3px rgba(0, 0, 0, 0.12), 0 4px 6px -4px rgba(0, 0, 0, 0.12)",
+				"soft-xl": "0 20px 25px -5px rgba(0, 0, 0, 0.12), 0 8px 10px -6px rgba(0, 0, 0, 0.12)",
 				"soft-2xl": "0 24px 48px -12px rgba(15, 23, 42, 0.24)",
 
 				focus: "0 0 0 0.5px hsl(var(--primary-bg)), 0 0 0 1px hsl(var(--focus))",