@dreamcommerce/aurora 3.0.0-98 → 3.0.0

package/build/esm/packages/aurora/src/components/multiselect/components/multiselect_item.js

@@ -3,13 +3,14 @@ import { objectWithoutProperties as _objectWithoutProperties, objectSpread2 as _
 import { cn } from '../../../utilities/cn.js';
 import { Item } from '@radix-ui/react-dropdown-menu';
 import { Box } from '../../box/box.js';
-import { Typography } from '../../typography/typography.js';
 import { Checkbox } from '../../checkbox/checkbox.js';
 
-var _excluded = ["option", "isSelected", "toggleOption", "className"];
+var _excluded = ["option", "isSelected", "isDisabled", "isReadonly", "toggleOption", "className"];
 var MultiSelectItem = /*#__PURE__*/React.forwardRef(function (_ref, ref) {
   var option = _ref.option,
     isSelected = _ref.isSelected,
+    isDisabled = _ref.isDisabled,
+    isReadonly = _ref.isReadonly,
     toggleOption = _ref.toggleOption,
     className = _ref.className,
     props = _objectWithoutProperties(_ref, _excluded);
@@ -19,9 +20,14 @@ var MultiSelectItem = /*#__PURE__*/React.forwardRef(function (_ref, ref) {
   };
   return /*#__PURE__*/React.createElement(Item, _objectSpread2(_objectSpread2({
     onSelect: handleSelect,
-    className: cn('aurora-relative aurora-flex aurora-w-full aurora-select-none aurora-rounded-sm aurora-p-2 aurora-outline-none focus:aurora-bg-accent data-[disabled]:aurora-pointer-events-none data-[disabled]:aurora-opacity-50 data-[state=checked]:aurora-font-semibold data-[highlighted]:aurora-font-semibold data-[highlighted]:aurora-bg-hover aurora-cursor-pointer aurora-rounded-6', {
-      'aurora-bg-hover': isSelected
-    }, className)
+    className: cn('aurora-relative aurora-flex aurora-w-full aurora-rounded-6 aurora-cursor-default aurora-select-none aurora-items-center aurora-rounded-sm aurora-p-2 aurora-text-s aurora-outline-none aurora-break-words aurora-text-wrap focus:aurora-bg-hover focus:aurora-text-accent-foreground data-[disabled]:aurora-pointer-events-none data-[disabled]:aurora-opacity-50', {
+      'aurora-bg-hover aurora-font-semibold': isSelected,
+      'aurora-cursor-pointer active:aurora-bg-active': !isDisabled && !isReadonly
+    }, className),
+    style: {
+      wordBreak: 'break-word'
+    },
+    disabled: isDisabled || isReadonly
   }, props), {}, {
     ref: ref
   }), /*#__PURE__*/React.createElement(Box, {
@@ -30,10 +36,11 @@ var MultiSelectItem = /*#__PURE__*/React.forwardRef(function (_ref, ref) {
     backgroundColor: "transparent"
   }, /*#__PURE__*/React.createElement(Checkbox, {
     checked: isSelected
-  }), /*#__PURE__*/React.createElement(Typography, {
-    size: "s",
-    weight: "medium"
-  }, option.label)));
+  }), /*#__PURE__*/React.createElement("div", {
+    className: "aurora-flex aurora-flex-col"
+  }, /*#__PURE__*/React.createElement("p", null, option.text), !!option.additionalInfo && /*#__PURE__*/React.createElement("p", {
+    className: "aurora-text-xs aurora-text-subtle-light"
+  }, option.additionalInfo))));
 });
 MultiSelectItem.displayName = 'MultiSelectItem';
 

package/build/esm/packages/aurora/src/components/multiselect/components/multiselect_item.js.map

@@ -1 +1 @@
-{"version":3,"file":null,"sources":[null],"sourcesContent":[null],"names":[],"mappings":"AAAA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;"}
+{"version":3,"file":null,"sources":[null],"sourcesContent":[null],"names":[],"mappings":"AAAA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;"}

package/build/esm/packages/aurora/src/components/multiselect/components/multiselect_search.d.ts

@@ -0,0 +1,3 @@
+import React from 'react';
+import { TInputProps } from "../../input/input_types";
+export declare const MultiSelectSearch: (props: TInputProps) => React.JSX.Element;

package/build/esm/packages/aurora/src/components/multiselect/components/multiselect_search.js

@@ -0,0 +1,16 @@
+import React from 'react';
+import { objectSpread2 as _objectSpread2 } from '../../../../../../_virtual/_rollupPluginBabelHelpers.js';
+import { Input } from '../../input/input.js';
+import { SearchLineIcon } from '../../../assets/icons/search_icon.js';
+
+var MultiSelectSearch = function MultiSelectSearch(props) {
+  return /*#__PURE__*/React.createElement(Input, _objectSpread2({
+    type: "text",
+    preElement: /*#__PURE__*/React.createElement(SearchLineIcon, {
+      className: "aurora-h-4 aurora-w-4 aurora-text-inverse-subtle-light"
+    })
+  }, props));
+};
+
+export { MultiSelectSearch };
+//# sourceMappingURL=multiselect_search.js.map

package/build/esm/packages/aurora/src/components/multiselect/components/multiselect_search.js.map

@@ -0,0 +1 @@
+{"version":3,"file":null,"sources":[null],"sourcesContent":[null],"names":[],"mappings":"AAAA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;"}

package/build/esm/packages/aurora/src/components/multiselect/components/multiselect_trigger.js

@@ -3,24 +3,21 @@ import { objectWithoutProperties as _objectWithoutProperties, objectSpread2 as _
 import { cn } from '../../../utilities/cn.js';
 import { Trigger } from '@radix-ui/react-dropdown-menu';
 
-var _excluded = ["selectedOptions", "placeholder", "hasErrors", "className"];
+var _excluded = ["hasErrors", "className", "children"];
 var MultiSelectTrigger = /*#__PURE__*/React.forwardRef(function (_ref, ref) {
-  var selectedOptions = _ref.selectedOptions,
-    placeholder = _ref.placeholder,
-    hasErrors = _ref.hasErrors,
+  var hasErrors = _ref.hasErrors,
     className = _ref.className,
+    children = _ref.children,
     props = _objectWithoutProperties(_ref, _excluded);
   return /*#__PURE__*/React.createElement(Trigger, _objectSpread2(_objectSpread2({
     asChild: true
   }, props), {}, {
     ref: ref
   }), /*#__PURE__*/React.createElement("button", {
-    className: cn('aurora-flex aurora-h-10 aurora-w-full aurora-items-center aurora-justify-between aurora-rounded-8 aurora-border aurora-border-input aurora-bg-neutral-0 aurora-px-3 aurora-py-2 aurora-text-s hover:aurora-border-strong focus:focus disabled:aurora-cursor-not-allowed disabled:aurora-bg-subtle disabled:aurora-text-subtle-light disabled:aurora-border-subtle [&>span]:aurora-line-clamp-1 focus:aurora-border-active focus:aurora-border-2 active:aurora-border-active active:aurora-border-2', {
+    className: cn('aurora-flex aurora-h-10 aurora-w-full aurora-items-center aurora-justify-between aurora-rounded-8 aurora-border aurora-border-input aurora-bg-neutral-0 aurora-px-3 aurora-py-2 aurora-text-s hover:aurora-border-strong focus-visible:focus disabled:aurora-cursor-not-allowed disabled:aurora-bg-subtle disabled:aurora-text-subtle-light disabled:aurora-border-subtle [&>span]:aurora-text-ellipsis [&>span]:aurora-whitespace-nowrap [&>span]:aurora-overflow-hidden focus-visible:aurora-border-active -visible:aurora-border-2 data-[state=open]:aurora-border-active data-[state=open]:aurora-border-2', {
       '!aurora-border-danger aurora-border-2': hasErrors
     }, className)
-  }, selectedOptions.length > 0 ? selectedOptions.map(function (option) {
-    return option.label;
-  }).join(', ') : placeholder !== null && placeholder !== void 0 ? placeholder : ''));
+  }, children));
 });
 MultiSelectTrigger.displayName = 'MultiSelectTrigger';
 

package/build/esm/packages/aurora/src/components/multiselect/components/multiselect_trigger.js.map

@@ -1 +1 @@
-{"version":3,"file":null,"sources":[null],"sourcesContent":[null],"names":[],"mappings":"AAAA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;"}
+{"version":3,"file":null,"sources":[null],"sourcesContent":[null],"names":[],"mappings":"AAAA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;"}

package/build/esm/packages/aurora/src/components/multiselect/hooks/use_multiselect_value.d.ts

@@ -0,0 +1,5 @@
+import { Option, TUseMultiSelectValueProps } from "../multiselect_types";
+export declare const useMultiSelectValue: ({ values, options }: TUseMultiSelectValueProps) => {
+    selectedOptions: Option[];
+    setSelectedOptions: (options: Option[]) => void;
+};

package/build/esm/packages/aurora/src/components/multiselect/hooks/use_multiselect_value.js

@@ -0,0 +1,38 @@
+import { useMemo, useState, useRef, useCallback, useEffect } from 'react';
+import { slicedToArray as _slicedToArray } from '../../../../../../_virtual/_rollupPluginBabelHelpers.js';
+import { MultiSelectUtils } from '../multiselect_utils.js';
+
+var useMultiSelectValue = function useMultiSelectValue(_ref) {
+  var values = _ref.values,
+    options = _ref.options;
+  // Przechowanie aktualnie wybranych opcji w razie jakby ktoras aktualna opcja zniknela z listy options
+  var _useState = useState(function () {
+      return MultiSelectUtils.findValuesInOptions(values, options);
+    }),
+    _useState2 = _slicedToArray(_useState, 2),
+    selectedOptions = _useState2[0],
+    _setSelectedOptions = _useState2[1];
+  var selectedOptionsRef = useRef(selectedOptions);
+  var setSelectedOptions = useCallback(function (options) {
+    selectedOptionsRef.current = options;
+    _setSelectedOptions(options);
+  }, []);
+  useEffect(function () {
+    if (MultiSelectUtils.areValuesEqual(values, selectedOptionsRef.current.map(function (o) {
+      return o.value;
+    }))) {
+      return;
+    }
+    var newOptions = MultiSelectUtils.findValuesInOptions(values, options);
+    setSelectedOptions(newOptions);
+  }, [options, setSelectedOptions, values]);
+  return useMemo(function () {
+    return {
+      selectedOptions: selectedOptions,
+      setSelectedOptions: setSelectedOptions
+    };
+  }, [selectedOptions, setSelectedOptions]);
+};
+
+export { useMultiSelectValue };
+//# sourceMappingURL=use_multiselect_value.js.map

package/build/esm/packages/aurora/src/components/multiselect/hooks/use_multiselect_value.js.map

@@ -0,0 +1 @@
+{"version":3,"file":null,"sources":[null],"sourcesContent":[null],"names":[],"mappings":"AAAA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;"}

package/build/esm/packages/aurora/src/components/multiselect/multiselect.d.ts

@@ -1,6 +1,6 @@
-import { TMultiSelectProps } from './multiselect_types';
 import React, { PropsWithChildren } from 'react';
+import { TMultiSelectProps } from './multiselect_types';
 export declare const MultiSelect: {
-    ({ id, options, isGrouped, placeholder, disabled, hasSearch, searchPlaceholder, hasErrors, onValueChange, ...props }: PropsWithChildren<TMultiSelectProps>): React.JSX.Element;
+    ({ id, options, placeholder, disabled, hasSearch, searchPlaceholder, onValueChange, errors, value, searchNotFoundContent, ...props }: PropsWithChildren<TMultiSelectProps>): React.JSX.Element;
     displayName: string;
 };

package/build/esm/packages/aurora/src/components/multiselect/multiselect.js

@@ -1,70 +1,57 @@
-import React, { useRef, useEffect } from 'react';
-import { objectWithoutProperties as _objectWithoutProperties, slicedToArray as _slicedToArray, objectSpread2 as _objectSpread2, toConsumableArray as _toConsumableArray } from '../../../../../_virtual/_rollupPluginBabelHelpers.js';
+import React from 'react';
+import { objectWithoutProperties as _objectWithoutProperties, objectSpread2 as _objectSpread2, toConsumableArray as _toConsumableArray } from '../../../../../_virtual/_rollupPluginBabelHelpers.js';
+import { cn } from '../../utilities/cn.js';
 import { Root, Portal } from '@radix-ui/react-dropdown-menu';
 import { MultiSelectContent } from './components/multiselect_content.js';
 import { MultiSelectTrigger } from './components/multiselect_trigger.js';
+import { useMultiSelectValue } from './hooks/use_multiselect_value.js';
 
-var _excluded = ["id", "options", "isGrouped", "placeholder", "disabled", "hasSearch", "searchPlaceholder", "hasErrors", "onValueChange"];
+var _excluded = ["id", "options", "placeholder", "disabled", "hasSearch", "searchPlaceholder", "onValueChange", "errors", "value", "searchNotFoundContent"];
 var MultiSelect = function MultiSelect(_ref) {
   var id = _ref.id,
     options = _ref.options,
-    _ref$isGrouped = _ref.isGrouped,
-    isGrouped = _ref$isGrouped === void 0 ? false : _ref$isGrouped,
     placeholder = _ref.placeholder,
     disabled = _ref.disabled,
     hasSearch = _ref.hasSearch,
     searchPlaceholder = _ref.searchPlaceholder,
-    hasErrors = _ref.hasErrors,
     onValueChange = _ref.onValueChange,
+    errors = _ref.errors,
+    value = _ref.value,
+    searchNotFoundContent = _ref.searchNotFoundContent,
     props = _objectWithoutProperties(_ref, _excluded);
-  var _React$useState = React.useState([]),
-    _React$useState2 = _slicedToArray(_React$useState, 2),
-    selectedOptions = _React$useState2[0],
-    setSelectedOptions = _React$useState2[1];
-  var _React$useState3 = React.useState(0),
-    _React$useState4 = _slicedToArray(_React$useState3, 2),
-    triggerWidth = _React$useState4[0],
-    settriggerWidth = _React$useState4[1];
-  var triggerRef = useRef(null);
-  useEffect(function () {
-    if (triggerRef.current) settriggerWidth(triggerRef.current.offsetWidth);
-    var handleResize = function handleResize() {
-      if (triggerRef.current) {
-        settriggerWidth(triggerRef.current.offsetWidth);
-      }
-    };
-    window.addEventListener('resize', handleResize);
-    return function () {
-      window.removeEventListener('resize', handleResize);
-    };
-  }, []);
-  useEffect(function () {
-    onValueChange === null || onValueChange === void 0 ? void 0 : onValueChange(selectedOptions);
-  }, [selectedOptions]);
-  var toggleOption = function toggleOption(option) {
-    setSelectedOptions(function (prev) {
-      return prev.some(function (selected) {
-        return selected.value === option.value;
-      }) ? prev.filter(function (selected) {
-        return selected.value !== option.value;
-      }) : [].concat(_toConsumableArray(prev), [option]);
-    });
+  var _useMultiSelectValue = useMultiSelectValue({
+      values: value,
+      options: options
+    }),
+    selectedOptions = _useMultiSelectValue.selectedOptions,
+    setSelectedOptions = _useMultiSelectValue.setSelectedOptions;
+  var handleChange = function handleChange(option) {
+    var newOptions = selectedOptions.some(function (selected) {
+      return selected.value === option.value;
+    }) ? selectedOptions.filter(function (selected) {
+      return selected.value !== option.value;
+    }) : [].concat(_toConsumableArray(selectedOptions), [option]);
+    setSelectedOptions(newOptions);
+    onValueChange === null || onValueChange === void 0 ? void 0 : onValueChange(newOptions.map(function (o) {
+      return o.value;
+    }));
   };
+  var showPlaceholder = selectedOptions.length === 0;
   return /*#__PURE__*/React.createElement(Root, _objectSpread2({}, props), /*#__PURE__*/React.createElement(MultiSelectTrigger, {
     id: id,
-    selectedOptions: selectedOptions,
-    placeholder: placeholder,
     disabled: disabled,
-    ref: triggerRef,
-    hasErrors: hasErrors
-  }), /*#__PURE__*/React.createElement(Portal, null, /*#__PURE__*/React.createElement(MultiSelectContent, {
+    hasErrors: !!(errors !== null && errors !== void 0 && errors.length)
+  }, /*#__PURE__*/React.createElement("span", {
+    className: cn('aurora-pointer-events-none aurora-select-none', showPlaceholder && 'aurora-text-subtle')
+  }, !showPlaceholder ? selectedOptions.map(function (option) {
+    return option.text;
+  }).join(', ') : placeholder !== null && placeholder !== void 0 ? placeholder : '')), /*#__PURE__*/React.createElement(Portal, null, /*#__PURE__*/React.createElement(MultiSelectContent, {
     options: options,
-    isGrouped: isGrouped,
     selectedOptions: selectedOptions,
-    toggleOption: toggleOption,
-    triggerWidth: triggerWidth,
+    toggleOption: handleChange,
     hasSearch: hasSearch,
-    searchPlaceholder: searchPlaceholder
+    searchPlaceholder: searchPlaceholder,
+    searchNotFoundContent: searchNotFoundContent
   })));
 };
 MultiSelect.displayName = 'MultiSelect';

package/build/esm/packages/aurora/src/components/multiselect/multiselect.js.map

@@ -1 +1 @@
-{"version":3,"file":null,"sources":[null],"sourcesContent":[null],"names":[],"mappings":"AAAA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;"}
+{"version":3,"file":null,"sources":[null],"sourcesContent":[null],"names":[],"mappings":"AAAA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;"}

package/build/esm/packages/aurora/src/components/multiselect/multiselect_types.d.ts

@@ -1,45 +1,45 @@
 import * as DropdownMenu from '@radix-ui/react-dropdown-menu';
-import React from 'react';
+import React, { ReactNode } from 'react';
 export declare type Option = {
+    text: string;
     value: string;
-    label: string;
-};
-export declare type OptionGroup = {
-    label: string;
-    options: Option[];
+    additionalInfo?: string;
+    isHeader?: boolean;
+    isDisabled?: boolean;
+    isReadonly?: boolean;
 };
 export interface TMultiSelectProps extends React.ComponentPropsWithoutRef<typeof DropdownMenu.Root> {
     id?: string;
-    options: Option[] | OptionGroup[];
-    isGrouped?: boolean;
+    options: Option[];
     placeholder?: string;
     disabled?: boolean;
     hasSearch?: boolean;
     searchPlaceholder?: string;
-    hasErrors?: boolean;
-    onValueChange?: (selectedOption: Option[]) => void;
+    searchNotFoundContent?: ReactNode;
+    errors?: string | string[];
+    onValueChange?: (value: string[]) => void;
+    value?: string[];
 }
 export interface TMultiSelectTriggerProps extends React.ComponentPropsWithoutRef<typeof DropdownMenu.Trigger> {
-    selectedOptions: Option[];
-    placeholder?: string;
     hasErrors?: boolean;
 }
 export interface TMultiSelectContentProps extends React.ComponentPropsWithoutRef<typeof DropdownMenu.Content> {
-    options: Option[] | OptionGroup[];
-    isGrouped?: boolean;
+    options: Option[];
     selectedOptions: Option[];
     toggleOption: (option: Option) => void;
     triggerWidth?: number;
     hasSearch?: boolean;
     searchPlaceholder?: string;
-}
-export interface TMultiSelectGroupProps extends React.ComponentPropsWithoutRef<typeof DropdownMenu.Group> {
-    group: OptionGroup;
-    selectedOptions: Option[];
-    toggleOption: (option: Option) => void;
+    searchNotFoundContent?: ReactNode;
 }
 export interface TMultiSelectItemProps extends React.ComponentPropsWithoutRef<typeof DropdownMenu.Item> {
     option: Option;
     isSelected: boolean;
     toggleOption: (option: Option) => void;
+    isDisabled?: boolean;
+    isReadonly?: boolean;
+}
+export interface TUseMultiSelectValueProps {
+    values?: string[];
+    options: Option[];
 }

package/build/esm/packages/aurora/src/components/multiselect/multiselect_types.js.map

@@ -1 +1 @@
-{"version":3,"file":"multiselect_types.js","sourceRoot":"","sources":["../../../../../../../src/components/multiselect/multiselect_types.ts"],"names":[],"mappings":"AAAA,OAA8B,+BAA+B,CAAC;AAE9D,OAAkB,OAAO,CAAC"}
+{"version":3,"file":"multiselect_types.js","sourceRoot":"","sources":["../../../../../../../src/components/multiselect/multiselect_types.ts"],"names":[],"mappings":"AAAA,OAA8B,+BAA+B,CAAC;AAE9D,OAAiC,OAAO,CAAC"}

package/build/esm/packages/aurora/src/components/multiselect/multiselect_utils.d.ts

@@ -0,0 +1,7 @@
+import { Option } from "./multiselect_types";
+export declare class MultiSelectUtils {
+    static isOptionVisible: (option: Option, search: string) => boolean;
+    static isHeaderVisible: (search: string, options: Option[], index: number) => boolean;
+    static findValuesInOptions: (values: string[] | undefined, options: Option[]) => Option[];
+    static areValuesEqual: (oldValues?: string[], newValues?: string[]) => boolean | undefined;
+}

package/build/esm/packages/aurora/src/components/multiselect/multiselect_utils.js

@@ -0,0 +1,47 @@
+import { createClass as _createClass, classCallCheck as _classCallCheck, defineProperty as _defineProperty } from '../../../../../_virtual/_rollupPluginBabelHelpers.js';
+
+var _MultiSelectUtils;
+var MultiSelectUtils = /*#__PURE__*/_createClass(function MultiSelectUtils() {
+  _classCallCheck(this, MultiSelectUtils);
+});
+_MultiSelectUtils = MultiSelectUtils;
+_defineProperty(MultiSelectUtils, "isOptionVisible", function (option, search) {
+  var normalizePolish = function normalizePolish(str) {
+    return str.normalize('NFD').replace(/[\u0300-\u036f]/g, '').replace(/[\u0141-\u0142]/g, 'l').toLowerCase();
+  };
+  return normalizePolish(option.text).includes(normalizePolish(search));
+});
+_defineProperty(MultiSelectUtils, "isHeaderVisible", function (search, options, index) {
+  var visible = false;
+  var i = index + 1;
+  while (options[i]) {
+    var curr = options[i];
+    if (curr.isHeader) {
+      break;
+    }
+    if (_MultiSelectUtils.isOptionVisible(curr, search)) {
+      visible = true;
+      break;
+    }
+    i++;
+  }
+  return visible;
+});
+_defineProperty(MultiSelectUtils, "findValuesInOptions", function (values, options) {
+  if (!(values !== null && values !== void 0 && values.length)) return [];
+  return options.filter(function (opt) {
+    return values.includes(opt.value);
+  });
+});
+_defineProperty(MultiSelectUtils, "areValuesEqual", function (oldValues, newValues) {
+  var oldSet = new Set(oldValues);
+  var newSet = new Set(newValues);
+  return (oldValues === null || oldValues === void 0 ? void 0 : oldValues.every(function (item) {
+    return newSet.has(item);
+  })) && (newValues === null || newValues === void 0 ? void 0 : newValues.every(function (item) {
+    return oldSet.has(item);
+  }));
+});
+
+export { MultiSelectUtils };
+//# sourceMappingURL=multiselect_utils.js.map

package/build/esm/packages/aurora/src/components/multiselect/multiselect_utils.js.map

@@ -0,0 +1 @@
+{"version":3,"file":null,"sources":[null],"sourcesContent":[null],"names":[],"mappings":"AAAA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;"}

package/build/esm/packages/aurora/src/components/radio_group/components/radio_group_item.js

@@ -1,8 +1,10 @@
 import { forwardRef, createElement } from 'react';
 import { objectWithoutProperties as _objectWithoutProperties, objectSpread2 as _objectSpread2 } from '../../../../../../_virtual/_rollupPluginBabelHelpers.js';
+import { CSS_TEXT_COLOR_TOKENS } from '../../../constants/css_tokens/css_text_color_tokens.js';
 import { cn } from '../../../utilities/cn.js';
-import { Label } from '../../label/label.js';
+import { Stack } from '../../stack/stack.js';
 import { HelperText } from '../../helper_text/helper_text.js';
+import { Label } from '../../label/label.js';
 import { Item, Indicator } from '@radix-ui/react-radio-group';
 import { CircleFillIcon } from '../../../assets/icons/circle_icon.js';
 
@@ -18,30 +20,34 @@ var RadioGroupItem = /*#__PURE__*/forwardRef(function (_ref, ref) {
     errors = _ref.errors,
     className = _ref.className,
     props = _objectWithoutProperties(_ref, _excluded);
-  return /*#__PURE__*/createElement("div", {
-    className: "aurora-flex aurora-gap-2"
+  return /*#__PURE__*/createElement(Stack, {
+    spacing: "2",
+    align: "start"
   }, /*#__PURE__*/createElement(Item, _objectSpread2({
     id: id,
     ref: ref,
     value: value,
     disabled: disabled,
     required: required,
-    className: cn('aurora-h-5 aurora-w-5 aurora-rounded-full aurora-border focus data-[state=checked]:aurora-bg-primary', {
+    className: cn('aurora-transition-[background-color] aurora-shrink-0 aurora-h-5 aurora-w-5 aurora-rounded-full aurora-border focus data-[state=checked]:aurora-bg-primary', {
       '!aurora-bg-active aurora-cursor-not-allowed': disabled,
-      '!aurora-bg-neutral-0 aurora-border-danger aurora-border-2': errors
+      '!aurora-bg-neutral-0 aurora-border-danger aurora-border-2': !!(errors !== null && errors !== void 0 && errors.length)
     }, className)
   }, props), /*#__PURE__*/createElement(Indicator, {
     className: "aurora-flex aurora-items-center aurora-justify-center"
   }, /*#__PURE__*/createElement(CircleFillIcon, {
     className: "aurora-h-2.5 aurora-w-2.5 aurora-fill-inverse"
-  }))), /*#__PURE__*/createElement("div", {
-    className: "aurora-flex aurora-flex-col aurora-gap-1"
-  }, label && (/*#__PURE__*/createElement(Label, {
+  }))), /*#__PURE__*/createElement(Stack, {
+    spacing: "1",
+    direction: "column"
+  }, label ? (/*#__PURE__*/createElement(Label, {
     htmlFor: id,
     disabled: disabled,
     tooltip: tooltip,
-    className: "aurora-text"
-  }, label)), helperText && /*#__PURE__*/createElement(HelperText, null, helperText)));
+    required: required
+  }, label)) : null, helperText ? /*#__PURE__*/createElement(HelperText, {
+    color: disabled ? CSS_TEXT_COLOR_TOKENS.subtleLight : undefined
+  }, helperText) : null));
 });
 RadioGroupItem.displayName = Item.displayName;
 

package/build/esm/packages/aurora/src/components/radio_group/components/radio_group_item.js.map

@@ -1 +1 @@
-{"version":3,"file":null,"sources":[null],"sourcesContent":[null],"names":[],"mappings":"AAAA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;"}
+{"version":3,"file":null,"sources":[null],"sourcesContent":[null],"names":[],"mappings":"AAAA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;"}

package/build/esm/packages/aurora/src/components/radio_group/radio_group_types.d.ts

@@ -7,5 +7,5 @@ export interface TRadioGroupItemProps extends React.ComponentPropsWithoutRef<typ
     label?: string | React.ReactNode;
     tooltip?: string | React.ReactNode;
     helperText?: string | React.ReactNode;
-    errors?: boolean;
+    errors?: string | string[];
 }

package/build/esm/packages/aurora/src/components/segmented_control/components/segmented_control_item.d.ts

@@ -1,7 +1,6 @@
 import React from 'react';
 import * as ToggleGroupPrimitive from '@radix-ui/react-toggle-group';
-import { VariantProps } from 'class-variance-authority';
-export declare const SegmentedControlItem: React.ForwardRefExoticComponent<Omit<ToggleGroupPrimitive.ToggleGroupItemProps & React.RefAttributes<HTMLButtonElement>, "ref"> & VariantProps<(props?: ({
+export declare const SegmentedControlItem: React.ForwardRefExoticComponent<Omit<ToggleGroupPrimitive.ToggleGroupItemProps & React.RefAttributes<HTMLButtonElement>, "ref"> & import("class-variance-authority").VariantProps<(props?: ({
     size?: "s" | "basic" | null | undefined;
     variant?: "basic" | "icon-only" | null | undefined;
     type?: "single" | null | undefined;

package/build/esm/packages/aurora/src/components/segmented_control/components/segmented_control_item.js

@@ -16,7 +16,7 @@ var SegmentedControlItem = /*#__PURE__*/React.forwardRef(function (_ref, ref) {
   var context = React.useContext(SegmentedControlContext);
   return /*#__PURE__*/React.createElement(Item, _objectSpread2({
     ref: ref,
-    className: cn("[&:not(:last-child)]:after:aurora-content-[''] focus last:aurora-rounded-r-4 first:aurora-rounded-l-4 [&:not(:last-child)]:after:aurora-absolute [&:not(:last-child)]:after:aurora-block [&:not(:last-child)]:after:aurora-w-px [&:not(:last-child)]:after:aurora-bg-active [&:not(:last-child)]:after:aurora--right-px [&:not(:last-child)]:after:aurora-h-3/6\n                aurora-relative aurora-flex aurora-item aurora-basis-full aurora-items-center aurora-justify-center aurora-gap-2 hover:aurora-bg-active aurora-cursor-pointer aurora-transition-[background-color] aurora-duration-300\n                data-[state=on]:aurora-bg data-[state=on]:aurora-font-semibold\n                data-[state=on]:before:aurora-content-[''] data-[state=on]:before:aurora-block data-[state=on]:before:aurora-absolute data-[state=on]:before:aurora--left-px data-[state=on]:before:aurora--right-px data-[state=on]:before:aurora--top-px data-[state=on]:before:aurora--bottom-px data-[state=on]:before:aurora-border-active data-[state=on]:before:aurora-border data-[state=on]:before:aurora-rounded-4 data-[state=on]:before:aurora-z-10\n                [&[data-state=off]>svg]:!aurora-fill-subtle", segmentedControlItemVariants({
+    className: cn("[&:not(:last-child)]:after:aurora-content-[''] focus last:aurora-rounded-r-4 first:aurora-rounded-l-4 [&:not(:last-child)]:after:aurora-absolute [&:not(:last-child)]:after:aurora-block [&:not(:last-child)]:after:aurora-w-px [&:not(:last-child)]:after:aurora-bg-active [&:not(:last-child)]:after:aurora--right-px [&:not(:last-child)]:after:aurora-h-3/6\n                aurora-relative aurora-flex aurora-item aurora-basis-full aurora-items-center aurora-justify-center aurora-gap-2 hover:aurora-bg-active aurora-cursor-pointer aurora-transition-[background-color] aurora-duration-300\n                data-[state=on]:aurora-bg data-[state=on]:aurora-font-semibold\n                data-[state=on]:before:aurora-content-[''] data-[state=on]:before:aurora-block data-[state=on]:before:aurora-absolute data-[state=on]:before:aurora--left-px data-[state=on]:before:aurora--right-px data-[state=on]:before:aurora--top-px data-[state=on]:before:aurora--bottom-px data-[state=on]:before:aurora-border-active data-[state=on]:before:aurora-border-2 data-[state=on]:before:aurora-rounded-4 data-[state=on]:before:aurora-z-10\n                [&[data-state=off]_svg]:!aurora-fill aurora-whitespace-nowrap", segmentedControlItemVariants({
       size: (_context$size = context.size) !== null && _context$size !== void 0 ? _context$size : size,
       variant: (_context$variant = context.variant) !== null && _context$variant !== void 0 ? _context$variant : variant
     }), className)

package/build/esm/packages/aurora/src/components/segmented_control/segmented_control.d.ts

@@ -1,7 +1,6 @@
 import React from 'react';
 import * as ToggleGroupPrimitive from '@radix-ui/react-toggle-group';
-import { VariantProps } from 'class-variance-authority';
-export declare const SegmentedControl: React.ForwardRefExoticComponent<Omit<ToggleGroupPrimitive.ToggleGroupSingleProps, "type"> & VariantProps<(props?: ({
+export declare const SegmentedControl: React.ForwardRefExoticComponent<Omit<ToggleGroupPrimitive.ToggleGroupSingleProps, "type"> & import("class-variance-authority").VariantProps<(props?: ({
     size?: "s" | "basic" | null | undefined;
     variant?: "basic" | "icon-only" | null | undefined;
     type?: "single" | null | undefined;

package/build/esm/packages/aurora/src/components/segmented_control/segmented_control_type.d.ts

@@ -1,3 +1,12 @@
 import { SEGMENTED_CONTROL_TYPE } from "./segmented_control_constants";
 import { Any } from 'ts-toolbelt';
+import React, { ComponentType } from 'react';
+import { ToggleGroupSingleProps } from '@radix-ui/react-toggle-group';
+import { VariantProps } from 'class-variance-authority';
+import { segmentedControlItemVariants } from "./components/segmented_control_item_variants";
+import * as ToggleGroupPrimitive from '@radix-ui/react-toggle-group';
 export declare type TSegmentedControlType = Any.Keys<typeof SEGMENTED_CONTROL_TYPE>;
+export declare type TSegmentedControlProps = Omit<React.ComponentPropsWithoutRef<ComponentType<ToggleGroupSingleProps>>, 'type'> & VariantProps<typeof segmentedControlItemVariants> & {
+    type?: TSegmentedControlType;
+};
+export declare type TSegmentedControlItemProps = React.ComponentPropsWithoutRef<typeof ToggleGroupPrimitive.Item> & VariantProps<typeof segmentedControlItemVariants>;

package/build/esm/packages/aurora/src/components/segmented_control/segmented_control_type.js

@@ -1,3 +1,8 @@
 import '@auroraComponents/segmented_control/segmented_control_constants';
 import 'ts-toolbelt';
+import 'react';
+import '@radix-ui/react-toggle-group';
+import 'class-variance-authority';
+import '@auroraComponents/segmented_control/components/segmented_control_item_variants';
+import '@radix-ui/react-toggle-group';
 //# sourceMappingURL=segmented_control_type.js.map

package/build/esm/packages/aurora/src/components/segmented_control/segmented_control_type.js.map

@@ -1 +1 @@
-{"version":3,"file":"segmented_control_type.js","sourceRoot":"","sources":["../../../../../../../src/components/segmented_control/segmented_control_type.ts"],"names":[],"mappings":"AAAA,OAAuC,iEAAiE,CAAC;AACzG,OAAoB,aAAa,CAAC"}
+{"version":3,"file":"segmented_control_type.js","sourceRoot":"","sources":["../../../../../../../src/components/segmented_control/segmented_control_type.ts"],"names":[],"mappings":"AAAA,OAAuC,iEAAiE,CAAC;AACzG,OAAoB,aAAa,CAAC;AAClC,OAAqC,OAAO,CAAC;AAC7C,OAAuC,8BAA8B,CAAC;AACtE,OAA6B,0BAA0B,CAAC;AACxD,OAA6C,gFAAgF,CAAC;AAC9H,OAAsC,8BAA8B,CAAC"}