@povio/ui 2.1.20 → 2.2.0

package/dist/MenuPopover.js

@@ -1,10 +1,10 @@
-import { UIStyle } from "./uiStyle.context.js";
 import { menuCva, menuPopoverCva, menuPopoverWrapperCva } from "./menu.cva.js";
+import { UIStyle } from "./uiStyle.context.js";
 import { MenuItem as MenuItem$1 } from "./MenuItem.js";
 import { jsx, jsxs } from "react/jsx-runtime";
 import { clsx } from "clsx";
-import { Menu, Popover, SubmenuTrigger } from "react-aria-components";
 import { useRef } from "react";
+import { Menu, Popover, SubmenuTrigger } from "react-aria-components";
 const MenuPopover = ({ items, className, onAction,...props }) => {
 	const lastEventRef = useRef(null);
 	const uiStyle = UIStyle.useConfig();

package/dist/NumberInput.js

@@ -5,8 +5,8 @@ import { TooltipWrapper } from "./TooltipWrapper.js";
 import { InputContent } from "./InputContent.js";
 import { jsx } from "react/jsx-runtime";
 import { clsx } from "clsx";
-import { Input, useLocale } from "react-aria-components";
 import { useCallback, useRef } from "react";
+import { Input, useLocale } from "react-aria-components";
 import { useFocusVisible, useNumberField } from "react-aria";
 import { mergeRefs } from "@react-aria/utils";
 import { Controller } from "react-hook-form";

package/dist/PasswordInput.js

@@ -1,5 +1,5 @@
-import { ViewIcon } from "./View.js";
-import { ViewOffIcon } from "./ViewOff.js";
+import { VisibilityIcon } from "./Visibility.js";
+import { VisibilityOffIcon } from "./VisibilityOff.js";
 import { ns } from "./i18n.js";
 import { TextInput } from "./TextInput.js";
 import { jsx } from "react/jsx-runtime";
@@ -12,7 +12,7 @@ const PasswordInput = (props) => {
 		...props,
 		type: isRevealed ? "text" : "password",
 		action: {
-			icon: isRevealed ? ViewIcon : ViewOffIcon,
+			icon: isRevealed ? VisibilityIcon : VisibilityOffIcon,
 			altText: t(($) => isRevealed ? $.ui.password.hide : $.ui.password.reveal),
 			onClick: () => setIsRevealed(!isRevealed)
 		}

package/dist/Segment.js

@@ -4,8 +4,8 @@ import { segmentCva } from "./segment.cva.js";
 import { SegmentItem } from "./SegmentItem.js";
 import { jsx, jsxs } from "react/jsx-runtime";
 import { clsx } from "clsx";
-import { ToggleButtonGroup } from "react-aria-components";
 import { Fragment as Fragment$1, useMemo, useRef } from "react";
+import { ToggleButtonGroup } from "react-aria-components";
 import { useToggleButtonGroup } from "react-aria";
 import { mergeRefs } from "@react-aria/utils";
 import { Controller } from "react-hook-form";

package/dist/SelectDesktop.js

@@ -6,8 +6,8 @@ import { SelectInput } from "./SelectInput.js";
 import { SelectListBox } from "./SelectListBox.js";
 import { jsx, jsxs } from "react/jsx-runtime";
 import { clsx } from "clsx";
-import { ComboBox, DialogTrigger, Popover } from "react-aria-components";
 import { Fragment as Fragment$1, useMemo, useRef } from "react";
+import { ComboBox, DialogTrigger, Popover } from "react-aria-components";
 import { useLabel } from "react-aria";
 import { mergeRefs } from "@react-aria/utils";
 import useMeasure from "react-use-measure";

package/dist/SelectInput.js

@@ -9,8 +9,8 @@ import { SelectInputTags } from "./SelectInputTags.js";
 import { SelectContext } from "./select.context.js";
 import { Fragment, jsx, jsxs } from "react/jsx-runtime";
 import { clsx } from "clsx";
-import { Button, ComboBoxStateContext, Input } from "react-aria-components";
 import { use, useMemo, useState } from "react";
+import { Button, ComboBoxStateContext, Input } from "react-aria-components";
 import { useFocusVisible, useFocusWithin, useHover } from "react-aria";
 import useMeasure from "react-use-measure";
 import { useTranslation } from "react-i18next";

package/dist/SelectListBox.js

@@ -48,7 +48,7 @@ const SelectListBox = ({ label, selectionMode, isSearchable, isScrollable = true
 			...props,
 			"aria-label": label,
 			selectionMode,
-			className: clsx("flex-1 outline-none [&>div:last-child>*]:border-b-0", isScrollable ? "overflow-y-auto overflow-x-hidden" : "overflow-hidden", className),
+			className: clsx("flex-1 outline-none [&>div:last-child>*]:border-b-0", isScrollable ? "max-h-full overflow-y-auto overflow-x-hidden" : "overflow-hidden", className),
 			items: listItems,
 			selectedKeys: selectedIds,
 			onSelectionChange,
@@ -61,7 +61,7 @@ const SelectListBox = ({ label, selectionMode, isSearchable, isScrollable = true
 		...props,
 		"aria-label": label,
 		selectionMode,
-		className: clsx("flex-1 outline-none [&>div:last-child]:border-b-0", isScrollable ? "overflow-y-auto overflow-x-hidden" : "overflow-hidden", className),
+		className: clsx("flex-1 outline-none [&>div:last-child]:border-b-0", isScrollable ? "max-h-full overflow-y-auto overflow-x-hidden" : "overflow-hidden", className),
 		items: listItems,
 		selectedKeys: selectedIds,
 		onSelectionChange,

package/dist/SelectListBoxItem.js

@@ -3,8 +3,8 @@ import { ns } from "./i18n.js";
 import { SelectContext } from "./select.context.js";
 import { jsx, jsxs } from "react/jsx-runtime";
 import { clsx } from "clsx";
-import { ListBoxItem } from "react-aria-components";
 import { useMemo, useRef } from "react";
+import { ListBoxItem } from "react-aria-components";
 import { useTranslation } from "react-i18next";
 const SelectListBoxItem = ({ isSearchable, isNewItem, newItemRender, id, label, content, isDisabled }) => {
 	const ref = useRef(null);
@@ -44,5 +44,5 @@ const SelectListBoxItem = ({ isSearchable, isNewItem, newItemRender, id, label,
 		]
 	});
 };
-const selectListBoxItemClass = clsx("group flex cursor-pointer items-center gap-2 px-list-side-item py-list-height-item", "border-b border-b-elevation-outline-default-1 outline-none", "font-labels-default text-interactive-text-secondary-idle text-label-2", "hover:text-interactive-text-secondary-hover", "focus-visible:bg-interactive-contained-primary-focus focus-visible:text-interactive-text-secondary-idle-inverted", "disabled:cursor-default disabled:text-interactive-text-secondary-disabled");
+const selectListBoxItemClass = clsx("group flex cursor-pointer items-center gap-2 px-list-side-item-left py-list-height-item", "border-b border-b-elevation-outline-default-1 outline-none", "font-labels-default text-interactive-text-secondary-idle text-label-2", "hover:text-interactive-text-secondary-hover", "focus-visible:bg-interactive-contained-primary-focus focus-visible:text-interactive-text-secondary-idle-inverted", "disabled:cursor-default disabled:text-interactive-text-secondary-disabled");
 export { SelectListBoxItem, selectListBoxItemClass };

package/dist/SelectListBoxItemSelectAll.js

@@ -3,8 +3,8 @@ import { ns } from "./i18n.js";
 import { SelectContext } from "./select.context.js";
 import { selectListBoxItemClass } from "./SelectListBoxItem.js";
 import { jsx, jsxs } from "react/jsx-runtime";
-import { ListBoxItem } from "react-aria-components";
 import { useRef } from "react";
+import { ListBoxItem } from "react-aria-components";
 import { useTranslation } from "react-i18next";
 const SelectListBoxItemSelectAll = ({ id, label, isDisabled }) => {
 	const ref = useRef(null);

package/dist/SelectListBoxLoadingItem.js

@@ -4,8 +4,8 @@ import { SelectContext } from "./select.context.js";
 import { selectListBoxItemClass } from "./SelectListBoxItem.js";
 import { useIntersectionObserver } from "./useIntersectionObserver.js";
 import { jsx } from "react/jsx-runtime";
-import { ListBoxItem } from "react-aria-components";
 import { useCallback } from "react";
+import { ListBoxItem } from "react-aria-components";
 import { useTranslation } from "react-i18next";
 const SelectListBoxLoadingItem = ({ id, label, onLoadMore }) => {
 	const { t } = useTranslation("ui");

package/dist/SelectMobile.js

@@ -9,8 +9,8 @@ import { TextInput } from "./TextInput.js";
 import { SelectListBoxSelectionBar } from "./SelectListBoxSelectionBar.js";
 import { jsx, jsxs } from "react/jsx-runtime";
 import { clsx } from "clsx";
-import { DialogTrigger } from "react-aria-components";
 import { useRef } from "react";
+import { DialogTrigger } from "react-aria-components";
 import { useLabel } from "react-aria";
 const SelectMobile = ({ ref, error, showSelectionContent, inputClassName, containerClassName, customTrigger, onBlur,...props }) => {
 	const { label, tooltipText, helperText, isRequired, rightContent, isHeaderHidden, headerClassName, errorClassName, placeholder, variant, isDisabled, className, hideLabel, hideDropdownIcon, isSearchable, isClearable, as, collapseAfter, selectedTagsType } = props;
@@ -83,7 +83,7 @@ const SelectMobile = ({ ref, error, showSelectionContent, inputClassName, contai
 				footer: isMultiple && /* @__PURE__ */ jsx(SelectListBoxSelectionBar, {}),
 				isDismissable: true,
 				children: (close) => /* @__PURE__ */ jsxs("div", {
-					className: "flex flex-col",
+					className: "flex max-h-full flex-col overflow-hidden",
 					children: [isSearchable ? /* @__PURE__ */ jsx(TextInput, {
 						ref: searchInputRef,
 						label,
@@ -96,7 +96,7 @@ const SelectMobile = ({ ref, error, showSelectionContent, inputClassName, contai
 					}) : /* @__PURE__ */ jsx(FormFieldHeader, {
 						label,
 						rightContent: /* @__PURE__ */ jsx(FormFieldHeaderClose, { onClose: close }),
-						className: "!mb-1-5 px-4 pt-3"
+						className: "mb-1-5! px-4 pt-3"
 					}), /* @__PURE__ */ jsx(SelectListBox, {
 						...props,
 						autoFocus: !isSearchable,

package/dist/Stepper.js

@@ -0,0 +1,32 @@
+import { UIStyle } from "./uiStyle.context.js";
+import { stepperCva } from "./stepper.cva.js";
+import { StepperItem } from "./StepperItem.js";
+import { StepperSeparator } from "./StepperSeparator.js";
+import { jsx, jsxs } from "react/jsx-runtime";
+import { Fragment as Fragment$1 } from "react";
+const Stepper = ({ steps, currentStep, orientation = "horizontal", contentOrientation = "horizontal", iconsOnly, titlesOnly, onStepClick, className }) => {
+	return /* @__PURE__ */ jsx("div", {
+		className: (UIStyle.useConfig()?.stepper?.cva ?? stepperCva)({
+			orientation,
+			className
+		}),
+		role: "group",
+		"aria-label": "Progress",
+		children: steps.map((step, index) => {
+			const status = index < currentStep ? "completed" : index === currentStep ? "active" : "todo";
+			return /* @__PURE__ */ jsxs(Fragment$1, { children: [/* @__PURE__ */ jsx(StepperItem, {
+				step,
+				stepNumber: index + 1,
+				status,
+				contentOrientation,
+				iconsOnly,
+				titlesOnly,
+				onPress: onStepClick && status === "completed" ? () => onStepClick(index) : void 0
+			}), index < steps.length - 1 && /* @__PURE__ */ jsx(StepperSeparator, {
+				orientation,
+				contentOrientation
+			})] }, step.id);
+		})
+	});
+};
+export { Stepper };

package/dist/StepperItem.js

@@ -0,0 +1,52 @@
+import { CheckIcon } from "./Check.js";
+import { UIStyle } from "./uiStyle.context.js";
+import { Typography } from "./Typography.js";
+import { stepperIconCva, stepperItemCva, stepperNumberCva, stepperSubtextCva, stepperTitleCva } from "./stepper.cva.js";
+import { Fragment, jsx, jsxs } from "react/jsx-runtime";
+import { clsx } from "clsx";
+import { Button } from "react-aria-components";
+const StepperItem = ({ step, stepNumber, status, contentOrientation, iconsOnly, titlesOnly, onPress }) => {
+	const uiStyle = UIStyle.useConfig();
+	const stepperItemCva$1 = uiStyle?.stepper?.itemCva ?? stepperItemCva;
+	const stepperIconCva$1 = uiStyle?.stepper?.iconCva ?? stepperIconCva;
+	const stepperNumberCva$1 = uiStyle?.stepper?.numberCva ?? stepperNumberCva;
+	const stepperTitleCva$1 = uiStyle?.stepper?.titleCva ?? stepperTitleCva;
+	const stepperSubtextCva$1 = uiStyle?.stepper?.subtextCva ?? stepperSubtextCva;
+	const showTitle = !iconsOnly;
+	const showSubtext = !iconsOnly && !titlesOnly && !!step.subtext;
+	const content = /* @__PURE__ */ jsxs(Fragment, { children: [/* @__PURE__ */ jsx("div", {
+		className: stepperIconCva$1({ status }),
+		children: status === "completed" ? /* @__PURE__ */ jsx(CheckIcon, { className: "size-5 text-interactive-contained-primary-on-idle" }) : /* @__PURE__ */ jsx(Typography, {
+			className: stepperNumberCva$1({ status }),
+			variant: "prominent-1",
+			size: "label-3",
+			children: stepNumber
+		})
+	}), showTitle && /* @__PURE__ */ jsxs("div", {
+		className: "flex flex-col gap-stepper-gap-text-to-subtext",
+		children: [/* @__PURE__ */ jsx(Typography, {
+			className: stepperTitleCva$1({ status }),
+			size: "label-2",
+			variant: "default",
+			children: step.title
+		}), showSubtext && /* @__PURE__ */ jsx(Typography, {
+			className: stepperSubtextCva$1({ status }),
+			size: "label-3",
+			variant: "default",
+			children: step.subtext
+		})]
+	})] });
+	const className = stepperItemCva$1({ contentOrientation });
+	if (onPress) return /* @__PURE__ */ jsx(Button, {
+		onPress,
+		className: clsx("group cursor-pointer", className),
+		"aria-current": status === "active" ? "step" : void 0,
+		children: content
+	});
+	return /* @__PURE__ */ jsx("div", {
+		className,
+		"aria-current": status === "active" ? "step" : void 0,
+		children: content
+	});
+};
+export { StepperItem };

package/dist/StepperSeparator.js

@@ -0,0 +1,10 @@
+import { UIStyle } from "./uiStyle.context.js";
+import { stepperSeparatorCva } from "./stepper.cva.js";
+import { jsx } from "react/jsx-runtime";
+const StepperSeparator = ({ orientation, contentOrientation }) => {
+	return /* @__PURE__ */ jsx("div", { className: (UIStyle.useConfig()?.stepper?.separatorCva ?? stepperSeparatorCva)({
+		orientation,
+		contentOrientation
+	}) });
+};
+export { StepperSeparator };

package/dist/Table.js

@@ -4,7 +4,7 @@ import { UIStyle } from "./uiStyle.context.js";
 import { InlineIconButton } from "./InlineIconButton.js";
 import { useIntersectionObserver } from "./useIntersectionObserver.js";
 import { CellText } from "./CellText.js";
-import { DragIcon } from "./Drag.js";
+import { DragIndicatorIcon } from "./DragIndicator.js";
 import { HeaderText } from "./HeaderText.js";
 import { useTableNav } from "./useTableNav.js";
 import { tableData, tableHeadData, tableHeadRow, tableRow } from "./table.cva.js";
@@ -36,7 +36,7 @@ const RowDragHandleCell = ({ rowId }) => {
 		...listeners,
 		className: "cursor-move p-1",
 		label: "Drag handle",
-		icon: DragIcon
+		icon: DragIndicatorIcon
 	});
 };
 var AutoDragHandleCell = ({ row }) => /* @__PURE__ */ jsx(RowDragHandleCell, { rowId: row.id });

package/dist/TextArea.js

@@ -7,8 +7,8 @@ import { FormField } from "./FormField.js";
 import { TooltipWrapper } from "./TooltipWrapper.js";
 import { jsx, jsxs } from "react/jsx-runtime";
 import { clsx } from "clsx";
-import { TextArea } from "react-aria-components";
 import { useRef } from "react";
+import { TextArea } from "react-aria-components";
 import { useTextField } from "react-aria";
 import { mergeRefs } from "@react-aria/utils";
 import { Controller } from "react-hook-form";

package/dist/TextInput.js

@@ -5,8 +5,8 @@ import { TooltipWrapper } from "./TooltipWrapper.js";
 import { InputContent } from "./InputContent.js";
 import { jsx } from "react/jsx-runtime";
 import { clsx } from "clsx";
-import { Input } from "react-aria-components";
 import { useRef } from "react";
+import { Input } from "react-aria-components";
 import { useFocusVisible, useTextField } from "react-aria";
 import { mergeRefs } from "@react-aria/utils";
 import { Controller } from "react-hook-form";

package/dist/TimePickerInput.js

@@ -8,8 +8,8 @@ import { InputClear } from "./InputClear.js";
 import { TimeField } from "./TimeField.js";
 import { jsx, jsxs } from "react/jsx-runtime";
 import { clsx } from "clsx";
-import { Button } from "react-aria-components";
 import { useMemo, useState } from "react";
+import { Button } from "react-aria-components";
 import { useFocusVisible, useFocusWithin, useHover } from "react-aria";
 import useMeasure from "react-use-measure";
 const TimePickerInput = ({ ref, as, fieldProps, state, isDisabled, isDirty, isInvalid, disableDropdown, variant, size, isClearable, headerProps, disableManualEntry, placeholder, onPress,...props }) => {

package/dist/Toast.js

@@ -1,6 +1,6 @@
-import { Loader } from "./Loader.js";
 import { UIStyle } from "./uiStyle.context.js";
 import { Typography } from "./Typography.js";
+import { Loader } from "./Loader.js";
 import { Button } from "./Button.js";
 import { statusIcon, statusSeparator } from "./status.cva.js";
 import { buttonColorVariant, toast as toast$1, toastContainer, toastWrapper } from "./toast.cva.js";

package/dist/Tooltip.js

@@ -1,11 +1,11 @@
 import { PointerHorizontalIcon } from "./PointerHorizontal.js";
 import { PointerVerticalIcon } from "./PointerVertical.js";
 import { UIStyle } from "./uiStyle.context.js";
-import { Typography } from "./Typography.js";
 import { tooltipCva, tooltipPointerHorizontalCva, tooltipPointerVerticalCva, tooltipTextCva } from "./tooltip.cva.js";
+import { Typography } from "./Typography.js";
 import { jsx, jsxs } from "react/jsx-runtime";
-import { OverlayArrow, Tooltip, TooltipTrigger } from "react-aria-components";
 import { Fragment as Fragment$1, useRef } from "react";
+import { OverlayArrow, Tooltip, TooltipTrigger } from "react-aria-components";
 import { useFocusable } from "react-aria";
 var CustomTrigger = ({ children, className, tabIndex }) => {
 	const ref = useRef(null);

package/dist/Typography.js

@@ -1,5 +1,5 @@
-import { typography } from "./typography.cva.js";
 import { UIStyle } from "./uiStyle.context.js";
+import { typography } from "./typography.cva.js";
 import { jsx } from "react/jsx-runtime";
 const Typography = ({ as = "p", className,...props }) => {
 	return /* @__PURE__ */ jsx(as, {

package/dist/Visibility.js

@@ -0,0 +1,13 @@
+import { jsx } from "react/jsx-runtime";
+const VisibilityIcon = (props) => /* @__PURE__ */ jsx("svg", {
+	xmlns: "http://www.w3.org/2000/svg",
+	fill: "none",
+	viewBox: "0 0 24 24",
+	className: "fill-current",
+	...props,
+	children: /* @__PURE__ */ jsx("path", {
+		fill: "currentColor",
+		d: "M12 5.02q3.102 0 5.66 1.667a12 12 0 0 1 4.04 4.399q.115.207.172.425a1.75 1.75 0 0 1 0 .894 1.8 1.8 0 0 1-.172.425 12 12 0 0 1-4.04 4.4q-2.558 1.666-5.66 1.666T6.34 17.23a12 12 0 0 1-4.04-4.4 1.751 1.751 0 0 1-.173-1.32q.057-.216.172-.424a12 12 0 0 1 4.041-4.4Q8.898 5.022 12 5.02m0 1.816q-2.626 0-4.823 1.383a9.1 9.1 0 0 0-3.36 3.73l-.003.009.004.009a9.1 9.1 0 0 0 3.359 3.73A8.88 8.88 0 0 0 12 17.081q2.627 0 4.823-1.384a9.1 9.1 0 0 0 3.359-3.73l.005-.009-.005-.009a9.1 9.1 0 0 0-3.358-3.73A8.88 8.88 0 0 0 12 6.836m0 .967q1.731 0 2.943 1.212t1.211 2.943-1.211 2.943T12 16.113t-2.943-1.212q-1.212-1.212-1.212-2.943t1.212-2.943T12 7.803m0 1.63q-1.051 0-1.789.737a2.44 2.44 0 0 0-.736 1.788q0 1.05.736 1.788.737.736 1.79.737 1.051 0 1.787-.737.737-.736.737-1.788t-.737-1.788A2.44 2.44 0 0 0 12 9.434"
+	})
+});
+export { VisibilityIcon };

package/dist/VisibilityOff.js

@@ -0,0 +1,13 @@
+import { jsx } from "react/jsx-runtime";
+const VisibilityOffIcon = (props) => /* @__PURE__ */ jsx("svg", {
+	xmlns: "http://www.w3.org/2000/svg",
+	fill: "none",
+	viewBox: "0 0 24 24",
+	className: "fill-current",
+	...props,
+	children: /* @__PURE__ */ jsx("path", {
+		fill: "currentColor",
+		d: "M3.482 3.52q.383 0 .632.249l15.699 15.699a.88.88 0 0 1 .26.62.84.84 0 0 1-.26.643.86.86 0 0 1-.632.25.86.86 0 0 1-.633-.25l-3.232-3.185-.008-.009-.012.004a11 11 0 0 1-3.318.507q-3.088 0-5.646-1.671a12 12 0 0 1-4.034-4.39l-.054-.094a1.5 1.5 0 0 1-.117-.306 1.7 1.7 0 0 1-.057-.445q0-.23.045-.435.046-.204.16-.41l.24-.456q.375-.677.833-1.308A9.4 9.4 0 0 1 4.74 7.001l.016-.014-.015-.015-1.916-1.939a.88.88 0 0 1-.237-.643.88.88 0 0 1 .26-.621.86.86 0 0 1 .633-.25m2.526 4.744a10 10 0 0 0-1.227 1.319q-.556.717-.949 1.55l-.004.009.005.008a9.05 9.05 0 0 0 3.343 3.714 8.84 8.84 0 0 0 4.802 1.377q.462 0 .902-.058t.901-.127l.039-.005-.027-.028-.832-.877-.008-.01-.011.004q-.253.069-.483.103a3 3 0 0 1-.481.034q-1.724 0-2.93-1.206t-1.206-2.93q0-.252.034-.48.035-.231.104-.483l.003-.012-.01-.008-1.938-1.893-.013-.013zm5.97-4.029q3.157 0 5.772 1.66t3.998 4.47a1.7 1.7 0 0 1 .183.777q0 .205-.034.4a1.4 1.4 0 0 1-.125.376 9 9 0 0 1-1.026 1.729q-.457.604-.987 1.131l-.361.343a.75.75 0 0 1-.63.203.82.82 0 0 1-.587-.361 1 1 0 0 1-.193-.691.93.93 0 0 1 .306-.622q.556-.531 1.018-1.157.463-.624.81-1.343l.004-.008-.004-.01A9.05 9.05 0 0 0 16.78 7.42a8.83 8.83 0 0 0-4.801-1.376q-.44 0-.857.034a6 6 0 0 0-.833.127.98.98 0 0 1-.69-.112.93.93 0 0 1-.418-.543.85.85 0 0 1 .079-.7.78.78 0 0 1 .552-.406q.53-.114 1.071-.16.542-.048 1.096-.048m-.322 2.794a3.8 3.8 0 0 1 1.723.218 4.1 4.1 0 0 1 1.517.977q.667.666.976 1.516.271.744.235 1.523l-.017.223v.002a.76.76 0 0 1-.248.575.82.82 0 0 1-.586.236.78.78 0 0 1-.575-.236.78.78 0 0 1-.236-.57 2.3 2.3 0 0 0-.07-1.166 2.4 2.4 0 0 0-.583-.954 2.6 2.6 0 0 0-.953-.604 2.2 2.2 0 0 0-1.188-.095.76.76 0 0 1-.57-.247.82.82 0 0 1-.238-.586q0-.34.236-.575a.78.78 0 0 1 .575-.237z"
+	})
+});
+export { VisibilityOffIcon };

package/dist/YearPicker.js

@@ -2,8 +2,8 @@ import { Typography } from "./Typography.js";
 import { useScrollableListBox } from "./useScrollableListBox.js";
 import { jsx } from "react/jsx-runtime";
 import { clsx } from "clsx";
-import { ListBox, ListBoxItem } from "react-aria-components";
 import { useMemo } from "react";
+import { ListBox, ListBoxItem } from "react-aria-components";
 import { today } from "@internationalized/date";
 import { useDateFormatter } from "@react-aria/i18n";
 const YearPicker = ({ state, onSelectionChange }) => {

package/dist/accordion.cva.js

@@ -0,0 +1,97 @@
+import { cva } from "class-variance-authority";
+const accordionCva = cva("flex w-full flex-col", {
+	variants: {
+		variant: {
+			filled: "gap-1",
+			outlined: ""
+		},
+		singleItem: {
+			true: "",
+			false: ""
+		}
+	},
+	defaultVariants: {
+		variant: "filled",
+		singleItem: false
+	},
+	compoundVariants: [{
+		variant: "outlined",
+		singleItem: false,
+		className: "rounded-global-rounding-s border border-elevation-outline-default-1"
+	}]
+});
+const accordionItemCva = cva("flex w-full flex-col", {
+	variants: {
+		variant: {
+			filled: "rounded-accordion-rounding-filled bg-elevation-fill-default-2",
+			outlined: ""
+		},
+		singleItem: {
+			true: "",
+			false: ""
+		}
+	},
+	defaultVariants: {
+		variant: "filled",
+		singleItem: false
+	},
+	compoundVariants: [{
+		singleItem: true,
+		variant: "outlined",
+		className: "border-elevation-outline-default-1 border-b"
+	}, {
+		singleItem: false,
+		variant: "outlined",
+		className: "not-last:border-elevation-outline-default-1 not-last:border-b"
+	}]
+});
+const accordionTriggerCva = cva([
+	"group flex w-full items-center gap-accordion-gap-content-to-arrow",
+	"px-accordion-side-accordion py-accordion-height-accordion",
+	"outline-none focus-visible:ring-2 focus-visible:ring-interactive-contained-primary-focus"
+], {
+	variants: {
+		variant: {
+			outlined: "rounded-accordion-rounding-outlined hover:bg-elevation-fill-default-2",
+			filled: "rounded-accordion-rounding-filled bg-elevation-fill-default-2 hover:bg-elevation-fill-default-3"
+		},
+		actionPosition: {
+			left: "flex-row-reverse",
+			right: "flex-row"
+		},
+		disabled: { true: "opacity-50" }
+	},
+	defaultVariants: {
+		variant: "filled",
+		actionPosition: "right"
+	}
+});
+const accordionHeadingCva = cva("flex flex-1 items-center justify-between gap-accordion-gap-content-to-arrow", {
+	variants: {},
+	defaultVariants: {}
+});
+const accordionHeadingTitleCva = cva("flex-1 text-left text-text-default-1", {
+	variants: {},
+	defaultVariants: {}
+});
+const accordionHeadingSubtitleCva = cva("flex-1 text-left text-text-default-2", {
+	variants: {},
+	defaultVariants: {}
+});
+const accordionChevronCva = cva("size-6 shrink-0 text-interactive-text-secondary-idle transition-transform duration-200", {
+	variants: { isExpanded: {
+		true: "rotate-180",
+		false: "rotate-0"
+	} },
+	defaultVariants: { isExpanded: false }
+});
+const accordionIconCva = cva("size-6 shrink-0 text-text-default-3", {
+	variants: {},
+	defaultVariants: {}
+});
+const accordionPanelCva = cva("", { variants: { isExpanded: { true: "px-accordion-side-accordion pt-0 pb-accordion-height-accordion" } } });
+const accordionPanelContentCva = cva("py-accordion-height-content", {
+	variants: {},
+	defaultVariants: {}
+});
+export { accordionChevronCva, accordionCva, accordionHeadingCva, accordionHeadingSubtitleCva, accordionHeadingTitleCva, accordionIconCva, accordionItemCva, accordionPanelContentCva, accordionPanelCva, accordionTriggerCva };

package/dist/assets/icons/{ViewOff.d.ts → Account.d.ts}

@@ -1,2 +1,2 @@
 import { SVGProps } from 'react';
-export declare const ViewOffIcon: (props: SVGProps<SVGSVGElement>) => import("react/jsx-runtime").JSX.Element;
+export declare const AccountIcon: (props: SVGProps<SVGSVGElement>) => import("react/jsx-runtime").JSX.Element;

package/dist/assets/icons/Board.d.ts

@@ -0,0 +1,2 @@
+import { SVGProps } from 'react';
+export declare const BoardIcon: (props: SVGProps<SVGSVGElement>) => import("react/jsx-runtime").JSX.Element;

package/dist/assets/icons/DragIndicator.d.ts

@@ -0,0 +1,2 @@
+import { SVGProps } from 'react';
+export declare const DragIndicatorIcon: (props: SVGProps<SVGSVGElement>) => import("react/jsx-runtime").JSX.Element;

package/dist/assets/icons/{Drag.d.ts → Edit.d.ts}

@@ -1,2 +1,2 @@
 import { SVGProps } from 'react';
-export declare const DragIcon: (props: SVGProps<SVGSVGElement>) => import("react/jsx-runtime").JSX.Element;
+export declare const EditIcon: (props: SVGProps<SVGSVGElement>) => import("react/jsx-runtime").JSX.Element;

package/dist/assets/icons/Emoji.d.ts

@@ -0,0 +1,2 @@
+import { SVGProps } from 'react';
+export declare const EmojiIcon: (props: SVGProps<SVGSVGElement>) => import("react/jsx-runtime").JSX.Element;

package/dist/assets/icons/{View.d.ts → Grid.d.ts}

@@ -1,2 +1,2 @@
 import { SVGProps } from 'react';
-export declare const ViewIcon: (props: SVGProps<SVGSVGElement>) => import("react/jsx-runtime").JSX.Element;
+export declare const GridIcon: (props: SVGProps<SVGSVGElement>) => import("react/jsx-runtime").JSX.Element;

package/dist/assets/icons/Home.d.ts

@@ -0,0 +1,2 @@
+import { SVGProps } from 'react';
+export declare const HomeIcon: (props: SVGProps<SVGSVGElement>) => import("react/jsx-runtime").JSX.Element;

package/dist/assets/icons/Image.d.ts

@@ -0,0 +1,2 @@
+import { SVGProps } from 'react';
+export declare const ImageIcon: (props: SVGProps<SVGSVGElement>) => import("react/jsx-runtime").JSX.Element;

package/dist/assets/icons/ImageError.d.ts

@@ -0,0 +1,2 @@
+import { SVGProps } from 'react';
+export declare const ImageErrorIcon: (props: SVGProps<SVGSVGElement>) => import("react/jsx-runtime").JSX.Element;

package/dist/assets/icons/Loader.d.ts

@@ -0,0 +1,2 @@
+import { SVGProps } from 'react';
+export declare const LoaderIcon: (props: SVGProps<SVGSVGElement>) => import("react/jsx-runtime").JSX.Element;

package/dist/assets/icons/MapPin.d.ts

@@ -0,0 +1,2 @@
+import { SVGProps } from 'react';
+export declare const MapPinIcon: (props: SVGProps<SVGSVGElement>) => import("react/jsx-runtime").JSX.Element;

package/dist/assets/icons/Minus.d.ts

@@ -0,0 +1,2 @@
+import { SVGProps } from 'react';
+export declare const MinusIcon: (props: SVGProps<SVGSVGElement>) => import("react/jsx-runtime").JSX.Element;

package/dist/assets/icons/MoreHoriz.d.ts

@@ -0,0 +1,2 @@
+import { SVGProps } from 'react';
+export declare const MoreHorizIcon: (props: SVGProps<SVGSVGElement>) => import("react/jsx-runtime").JSX.Element;

package/dist/assets/icons/Pause.d.ts

@@ -0,0 +1,2 @@
+import { SVGProps } from 'react';
+export declare const PauseIcon: (props: SVGProps<SVGSVGElement>) => import("react/jsx-runtime").JSX.Element;

package/dist/assets/icons/Plus.d.ts

@@ -0,0 +1,2 @@
+import { SVGProps } from 'react';
+export declare const PlusIcon: (props: SVGProps<SVGSVGElement>) => import("react/jsx-runtime").JSX.Element;

package/dist/assets/icons/Retry.d.ts

@@ -0,0 +1,2 @@
+import { SVGProps } from 'react';
+export declare const RetryIcon: (props: SVGProps<SVGSVGElement>) => import("react/jsx-runtime").JSX.Element;

package/dist/assets/icons/Search.d.ts

@@ -0,0 +1,2 @@
+import { SVGProps } from 'react';
+export declare const SearchIcon: (props: SVGProps<SVGSVGElement>) => import("react/jsx-runtime").JSX.Element;

package/dist/assets/icons/Share.d.ts

@@ -0,0 +1,2 @@
+import { SVGProps } from 'react';
+export declare const ShareIcon: (props: SVGProps<SVGSVGElement>) => import("react/jsx-runtime").JSX.Element;

package/dist/assets/icons/Slash.d.ts

@@ -0,0 +1,2 @@
+import { SVGProps } from 'react';
+export declare const SlashIcon: (props: SVGProps<SVGSVGElement>) => import("react/jsx-runtime").JSX.Element;

package/dist/assets/icons/Trash.d.ts

@@ -0,0 +1,2 @@
+import { SVGProps } from 'react';
+export declare const TrashIcon: (props: SVGProps<SVGSVGElement>) => import("react/jsx-runtime").JSX.Element;

package/dist/assets/icons/User.d.ts

@@ -0,0 +1,2 @@
+import { SVGProps } from 'react';
+export declare const UserIcon: (props: SVGProps<SVGSVGElement>) => import("react/jsx-runtime").JSX.Element;

package/dist/assets/icons/Visibility.d.ts

@@ -0,0 +1,2 @@
+import { SVGProps } from 'react';
+export declare const VisibilityIcon: (props: SVGProps<SVGSVGElement>) => import("react/jsx-runtime").JSX.Element;

package/dist/assets/icons/VisibilityOff.d.ts

@@ -0,0 +1,2 @@
+import { SVGProps } from 'react';
+export declare const VisibilityOffIcon: (props: SVGProps<SVGSVGElement>) => import("react/jsx-runtime").JSX.Element;

package/dist/assets/icons/WarningOutlined.d.ts

@@ -0,0 +1,2 @@
+import { SVGProps } from 'react';
+export declare const WarningOutlinedIcon: (props: SVGProps<SVGSVGElement>) => import("react/jsx-runtime").JSX.Element;

package/dist/breadcrumbs.cva.js

@@ -0,0 +1,22 @@
+import { cva } from "class-variance-authority";
+const breadcrumbsCva = cva(["flex items-center gap-breadcrumbs-gap-segment-to-segment"]);
+const breadcrumbSegment = cva(["flex items-center gap-breadcrumbs-gap-segment-to-segment"]);
+const breadcrumbChevron = cva(["size-6 shrink-0 text-interactive-text-secondary-idle"]);
+const breadcrumbIcon = cva(["size-4 shrink-0"]);
+const breadcrumbItem = cva(["inline-flex cursor-pointer items-center gap-breadcrumbs-gap-icon-to-text whitespace-nowrap font-inter font-medium text-label-3 no-underline"], {
+	variants: {
+		isCurrent: {
+			true: "text-interactive-text-primary-idle",
+			false: "text-interactive-text-secondary-idle hover:text-interactive-text-secondary-hover"
+		},
+		isEllipsis: {
+			true: "hover:text-interactive-text-primary-hover!",
+			false: ""
+		}
+	},
+	defaultVariants: {
+		isCurrent: false,
+		isEllipsis: false
+	}
+});
+export { breadcrumbChevron, breadcrumbIcon, breadcrumbItem, breadcrumbSegment, breadcrumbsCva };