@vibe/core 4.4.0-alpha-26200.0 → 4.4.0

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
Files changed (53) hide show
  1. package/dist/components/Dropdown/Dropdown.types.d.ts +0 -12
  2. package/dist/components/Dropdown/components/MultiSelectedValues/MultiSelectedValues.d.ts +1 -5
  3. package/dist/components/Dropdown/components/Trigger/DropdownInput.d.ts +2 -4
  4. package/dist/components/Dropdown/context/DropdownContext.types.d.ts +0 -6
  5. package/dist/components/Dropdown/hooks/useDropdownMultiCombobox.d.ts +1 -1
  6. package/dist/components/Modal/Modal/Modal.types.d.ts +6 -0
  7. package/dist/metadata/components.json +11 -18
  8. package/dist/metadata.json +11 -18
  9. package/dist/mocked_classnames/components/Dropdown/Dropdown.types.d.ts +0 -12
  10. package/dist/mocked_classnames/components/Dropdown/components/MultiSelectedValues/MultiSelectedValues.d.ts +1 -5
  11. package/dist/mocked_classnames/components/Dropdown/components/Trigger/DropdownInput.d.ts +2 -4
  12. package/dist/mocked_classnames/components/Dropdown/context/DropdownContext.types.d.ts +0 -6
  13. package/dist/mocked_classnames/components/Dropdown/hooks/useDropdownMultiCombobox.d.ts +1 -1
  14. package/dist/mocked_classnames/components/Modal/Modal/Modal.types.d.ts +6 -0
  15. package/dist/mocked_classnames/src/components/Dropdown/components/MultiSelectedValues/MultiSelectedValues.js +1 -1
  16. package/dist/mocked_classnames/src/components/Dropdown/components/MultiSelectedValues/MultiSelectedValues.js.map +1 -1
  17. package/dist/mocked_classnames/src/components/Dropdown/components/Trigger/DropdownInput.js +1 -1
  18. package/dist/mocked_classnames/src/components/Dropdown/components/Trigger/DropdownInput.js.map +1 -1
  19. package/dist/mocked_classnames/src/components/Dropdown/components/Trigger/MultiSelectTrigger.js +1 -1
  20. package/dist/mocked_classnames/src/components/Dropdown/components/Trigger/MultiSelectTrigger.js.map +1 -1
  21. package/dist/mocked_classnames/src/components/Dropdown/components/Trigger/SingleSelectTrigger.js +1 -1
  22. package/dist/mocked_classnames/src/components/Dropdown/components/Trigger/SingleSelectTrigger.js.map +1 -1
  23. package/dist/mocked_classnames/src/components/Dropdown/components/Trigger/Trigger.module.scss.js +1 -1
  24. package/dist/mocked_classnames/src/components/Dropdown/hooks/useDropdownCombobox.js +1 -1
  25. package/dist/mocked_classnames/src/components/Dropdown/hooks/useDropdownCombobox.js.map +1 -1
  26. package/dist/mocked_classnames/src/components/Dropdown/hooks/useDropdownMultiCombobox.js +1 -1
  27. package/dist/mocked_classnames/src/components/Dropdown/hooks/useDropdownMultiCombobox.js.map +1 -1
  28. package/dist/mocked_classnames/src/components/Dropdown/modes/DropdownMultiComboboxController.js +1 -1
  29. package/dist/mocked_classnames/src/components/Dropdown/modes/DropdownMultiComboboxController.js.map +1 -1
  30. package/dist/mocked_classnames/src/components/Modal/Modal/Modal.js +1 -1
  31. package/dist/mocked_classnames/src/components/Modal/Modal/Modal.js.map +1 -1
  32. package/dist/mocked_classnames/src/components/Modal/Modal/Modal.module.scss.js +1 -1
  33. package/dist/src/components/Dropdown/components/MultiSelectedValues/MultiSelectedValues.js +1 -1
  34. package/dist/src/components/Dropdown/components/MultiSelectedValues/MultiSelectedValues.js.map +1 -1
  35. package/dist/src/components/Dropdown/components/Trigger/DropdownInput.js +1 -1
  36. package/dist/src/components/Dropdown/components/Trigger/DropdownInput.js.map +1 -1
  37. package/dist/src/components/Dropdown/components/Trigger/MultiSelectTrigger.js +1 -1
  38. package/dist/src/components/Dropdown/components/Trigger/MultiSelectTrigger.js.map +1 -1
  39. package/dist/src/components/Dropdown/components/Trigger/SingleSelectTrigger.js +1 -1
  40. package/dist/src/components/Dropdown/components/Trigger/SingleSelectTrigger.js.map +1 -1
  41. package/dist/src/components/Dropdown/components/Trigger/Trigger.module.scss.js +1 -1
  42. package/dist/src/components/Dropdown/hooks/useDropdownCombobox.js +1 -1
  43. package/dist/src/components/Dropdown/hooks/useDropdownCombobox.js.map +1 -1
  44. package/dist/src/components/Dropdown/hooks/useDropdownMultiCombobox.js +1 -1
  45. package/dist/src/components/Dropdown/hooks/useDropdownMultiCombobox.js.map +1 -1
  46. package/dist/src/components/Dropdown/modes/DropdownMultiComboboxController.js +1 -1
  47. package/dist/src/components/Dropdown/modes/DropdownMultiComboboxController.js.map +1 -1
  48. package/dist/src/components/Modal/Modal/Modal.js +1 -1
  49. package/dist/src/components/Modal/Modal/Modal.js.map +1 -1
  50. package/dist/src/components/Modal/Modal/Modal.module.scss.js +1 -1
  51. package/package.json +2 -2
  52. package/dist/metadata/examples/DropdownMultiSelectA11y.md +0 -50
  53. package/dist/metadata/examples/DropdownSearchableSingleSelect.md +0 -379
@@ -1 +1 @@
1
- {"version":3,"file":"useDropdownCombobox.js","sources":["../../../../../src/components/Dropdown/hooks/useDropdownCombobox.ts"],"sourcesContent":["import { useCallback, useMemo, useRef, useState } from \"react\";\nimport { useCombobox } from \"downshift\";\nimport useDropdownFiltering from \"./useDropdownFiltering\";\nimport { type BaseItemData } from \"../../BaseItem\";\nimport { type DropdownGroupOption } from \"../Dropdown.types\";\n\nfunction useDropdownCombobox<T extends BaseItemData<Record<string, unknown>>>(\n options: DropdownGroupOption<T>,\n isMenuOpen?: boolean,\n autoFocus?: boolean,\n closeMenuOnSelect?: boolean,\n defaultValue?: T,\n value?: T,\n inputValueProp?: string,\n onChange?: (option: T | T[] | null) => void,\n onInputChange?: (value: string | null) => void,\n onMenuOpen?: () => void,\n onMenuClose?: () => void,\n onOptionSelect?: (option: T) => void,\n filterOption?: (option: T, inputValue: string) => boolean,\n showSelectedOptions?: boolean,\n id?: string\n) {\n const [currentSelectedItem, setCurrentSelectedItem] = useState<T | null>(defaultValue || null);\n const inputRef = useRef<HTMLInputElement | null>(null);\n\n // Use controlled value if provided, otherwise use internal state\n const selectedItem = value !== undefined ? value : currentSelectedItem;\n\n const memoizedSelectedItemForFiltering = useMemo(() => {\n return selectedItem ? [selectedItem] : [];\n }, [selectedItem]);\n\n const { filteredOptions, filterOptions } = useDropdownFiltering<T>(\n options,\n filterOption,\n showSelectedOptions,\n memoizedSelectedItemForFiltering\n );\n\n const flatOptions = useMemo(() => filteredOptions.flatMap(group => group.options), [filteredOptions]);\n const {\n isOpen,\n inputValue,\n highlightedIndex,\n getToggleButtonProps,\n getLabelProps,\n getMenuProps,\n getInputProps,\n getItemProps,\n reset,\n openMenu,\n toggleMenu,\n closeMenu\n } = useCombobox<T>({\n items: flatOptions,\n itemToString: item => item?.label ?? \"\",\n itemToKey: item => (item?.value !== undefined ? String(item.value) : \"\"),\n isItemDisabled: item => Boolean(item.disabled),\n // Seed the input with the selected item's label so a defaultValue/value is visible (and exposed to\n // assistive technologies) on mount, now that the selection lives inside the input rather than in an overlay.\n initialInputValue: inputValueProp || selectedItem?.label || \"\",\n selectedItem: selectedItem,\n isOpen: isMenuOpen,\n initialIsOpen: autoFocus,\n id,\n onIsOpenChange: ({ isOpen }) => {\n // Reset the text filter when the menu closes so reopening always shows the full option list,\n // even though the input keeps displaying the selected item's label.\n if (!isOpen) {\n filterOptions(\"\");\n }\n isOpen ? onMenuClose?.() : onMenuOpen?.();\n },\n\n onInputValueChange: useCallback(\n ({ inputValue, type }) => {\n // Only filter on actual user typing. Downshift also writes the selected item's label into the\n // input on selection/blur — those changes must not filter the list.\n if (type === useCombobox.stateChangeTypes.InputChange) {\n filterOptions(inputValue || \"\");\n }\n onInputChange?.(inputValue);\n },\n [onInputChange, filterOptions]\n ),\n onSelectedItemChange: useCallback(\n ({ selectedItem }) => {\n if (value === undefined) {\n setCurrentSelectedItem(selectedItem || null);\n }\n if (selectedItem) {\n onOptionSelect?.(selectedItem);\n onChange?.(selectedItem);\n filterOptions(\"\");\n } else {\n onChange?.(null);\n filterOptions(\"\");\n }\n },\n [value, onOptionSelect, filterOptions, onChange]\n ),\n onStateChange: useCallback(\n ({ type }) => {\n // Blur input after selection via click or Enter key\n if (\n closeMenuOnSelect &&\n (type === useCombobox.stateChangeTypes.ItemClick || type === useCombobox.stateChangeTypes.InputKeyDownEnter)\n ) {\n inputRef.current?.blur();\n }\n },\n [closeMenuOnSelect]\n ),\n stateReducer: (state, actionAndChanges) => {\n switch (actionAndChanges.type) {\n case useCombobox.stateChangeTypes.InputKeyDownEnter:\n case useCombobox.stateChangeTypes.ItemClick:\n // Keep Downshift's default inputValue (the selected item's label) so the selection lives inside\n // the input and is exposed to assistive technologies. Only override the open state.\n return { ...actionAndChanges.changes, isOpen: !closeMenuOnSelect };\n\n default:\n return actionAndChanges.changes;\n }\n }\n });\n\n return {\n isOpen,\n inputValue,\n highlightedIndex,\n selectedItem,\n getToggleButtonProps,\n getLabelProps,\n getMenuProps,\n getInputProps: (options?: Parameters<typeof getInputProps>[0]) => getInputProps({ ...options, ref: inputRef }),\n getItemProps,\n reset: () => {\n if (value === undefined) {\n setCurrentSelectedItem(null);\n }\n reset();\n filterOptions(\"\");\n },\n filteredOptions,\n openMenu,\n toggleMenu,\n closeMenu\n };\n}\n\nexport default useDropdownCombobox;\n"],"names":["useDropdownCombobox","options","isMenuOpen","autoFocus","closeMenuOnSelect","defaultValue","value","inputValueProp","onChange","onInputChange","onMenuOpen","onMenuClose","onOptionSelect","filterOption","showSelectedOptions","id","_useState","useState","_useState2","_slicedToArray","currentSelectedItem","setCurrentSelectedItem","inputRef","useRef","selectedItem","undefined","memoizedSelectedItemForFiltering","useMemo","_useDropdownFiltering","useDropdownFiltering","filteredOptions","filterOptions","flatOptions","flatMap","group","_useCombobox","useCombobox","items","itemToString","item","_a","label","itemToKey","String","isItemDisabled","disabled","initialInputValue","isOpen","initialIsOpen","onIsOpenChange","_ref","onInputValueChange","useCallback","_ref2","inputValue","type","stateChangeTypes","InputChange","onSelectedItemChange","_ref3","onStateChange","_ref4","ItemClick","InputKeyDownEnter","current","blur","stateReducer","state","actionAndChanges","Object","assign","changes","getInputProps","reset","highlightedIndex","getToggleButtonProps","getLabelProps","getMenuProps","ref","getItemProps","openMenu","toggleMenu","closeMenu"],"mappings":"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"}
1
+ {"version":3,"file":"useDropdownCombobox.js","sources":["../../../../../src/components/Dropdown/hooks/useDropdownCombobox.ts"],"sourcesContent":["import { useCallback, useMemo, useRef, useState } from \"react\";\nimport { useCombobox } from \"downshift\";\nimport useDropdownFiltering from \"./useDropdownFiltering\";\nimport { type BaseItemData } from \"../../BaseItem\";\nimport { type DropdownGroupOption } from \"../Dropdown.types\";\n\nfunction useDropdownCombobox<T extends BaseItemData<Record<string, unknown>>>(\n options: DropdownGroupOption<T>,\n isMenuOpen?: boolean,\n autoFocus?: boolean,\n closeMenuOnSelect?: boolean,\n defaultValue?: T,\n value?: T,\n inputValueProp?: string,\n onChange?: (option: T | T[] | null) => void,\n onInputChange?: (value: string | null) => void,\n onMenuOpen?: () => void,\n onMenuClose?: () => void,\n onOptionSelect?: (option: T) => void,\n filterOption?: (option: T, inputValue: string) => boolean,\n showSelectedOptions?: boolean,\n id?: string\n) {\n const [currentSelectedItem, setCurrentSelectedItem] = useState<T | null>(defaultValue || null);\n const inputRef = useRef<HTMLInputElement | null>(null);\n\n // Use controlled value if provided, otherwise use internal state\n const selectedItem = value !== undefined ? value : currentSelectedItem;\n\n const memoizedSelectedItemForFiltering = useMemo(() => {\n return selectedItem ? [selectedItem] : [];\n }, [selectedItem]);\n\n const { filteredOptions, filterOptions } = useDropdownFiltering<T>(\n options,\n filterOption,\n showSelectedOptions,\n memoizedSelectedItemForFiltering\n );\n\n const flatOptions = useMemo(() => filteredOptions.flatMap(group => group.options), [filteredOptions]);\n const {\n isOpen,\n inputValue,\n highlightedIndex,\n getToggleButtonProps,\n getLabelProps,\n getMenuProps,\n getInputProps,\n getItemProps,\n reset,\n openMenu,\n toggleMenu,\n closeMenu\n } = useCombobox<T>({\n items: flatOptions,\n itemToString: item => item?.label ?? \"\",\n itemToKey: item => (item?.value !== undefined ? String(item.value) : \"\"),\n isItemDisabled: item => Boolean(item.disabled),\n initialInputValue: inputValueProp || \"\",\n selectedItem: selectedItem,\n isOpen: isMenuOpen,\n initialIsOpen: autoFocus,\n id,\n onIsOpenChange: ({ isOpen }) => {\n isOpen ? onMenuClose?.() : onMenuOpen?.();\n },\n\n onInputValueChange: useCallback(\n ({ inputValue }) => {\n filterOptions(inputValue || \"\");\n onInputChange?.(inputValue);\n },\n [onInputChange, filterOptions]\n ),\n onSelectedItemChange: useCallback(\n ({ selectedItem }) => {\n if (value === undefined) {\n setCurrentSelectedItem(selectedItem || null);\n }\n if (selectedItem) {\n onOptionSelect?.(selectedItem);\n onChange?.(selectedItem);\n filterOptions(\"\");\n } else {\n onChange?.(null);\n filterOptions(\"\");\n }\n },\n [value, onOptionSelect, filterOptions, onChange]\n ),\n onStateChange: useCallback(\n ({ type }) => {\n // Blur input after selection via click or Enter key\n if (\n closeMenuOnSelect &&\n (type === useCombobox.stateChangeTypes.ItemClick || type === useCombobox.stateChangeTypes.InputKeyDownEnter)\n ) {\n inputRef.current?.blur();\n }\n },\n [closeMenuOnSelect]\n ),\n stateReducer: (state, actionAndChanges) => {\n switch (actionAndChanges.type) {\n case useCombobox.stateChangeTypes.InputKeyDownEnter:\n case useCombobox.stateChangeTypes.ItemClick:\n return { ...actionAndChanges.changes, inputValue: null, isOpen: !closeMenuOnSelect };\n case useCombobox.stateChangeTypes.InputBlur:\n case useCombobox.stateChangeTypes.ControlledPropUpdatedSelectedItem:\n return { ...actionAndChanges.changes, inputValue: null };\n\n default:\n return actionAndChanges.changes;\n }\n }\n });\n\n return {\n isOpen,\n inputValue,\n highlightedIndex,\n selectedItem,\n getToggleButtonProps,\n getLabelProps,\n getMenuProps,\n getInputProps: (options?: Parameters<typeof getInputProps>[0]) => getInputProps({ ...options, ref: inputRef }),\n getItemProps,\n reset: () => {\n if (value === undefined) {\n setCurrentSelectedItem(null);\n }\n reset();\n filterOptions(\"\");\n },\n filteredOptions,\n openMenu,\n toggleMenu,\n closeMenu\n };\n}\n\nexport default useDropdownCombobox;\n"],"names":["useDropdownCombobox","options","isMenuOpen","autoFocus","closeMenuOnSelect","defaultValue","value","inputValueProp","onChange","onInputChange","onMenuOpen","onMenuClose","onOptionSelect","filterOption","showSelectedOptions","id","_useState","useState","_useState2","_slicedToArray","currentSelectedItem","setCurrentSelectedItem","inputRef","useRef","selectedItem","undefined","memoizedSelectedItemForFiltering","useMemo","_useDropdownFiltering","useDropdownFiltering","filteredOptions","filterOptions","flatOptions","flatMap","group","_useCombobox","useCombobox","items","itemToString","item","_a","label","itemToKey","String","isItemDisabled","disabled","initialInputValue","isOpen","initialIsOpen","onIsOpenChange","_ref","onInputValueChange","useCallback","_ref2","inputValue","onSelectedItemChange","_ref3","onStateChange","_ref4","type","stateChangeTypes","ItemClick","InputKeyDownEnter","current","blur","stateReducer","state","actionAndChanges","Object","assign","changes","InputBlur","ControlledPropUpdatedSelectedItem","getInputProps","reset","highlightedIndex","getToggleButtonProps","getLabelProps","getMenuProps","ref","getItemProps","openMenu","toggleMenu","closeMenu"],"mappings":"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"}
@@ -1,2 +1,2 @@
1
- import{toConsumableArray as e}from"../../../../_virtual/_rollupPluginBabelHelpers.js";import{useRef as t,useMemo as n,useCallback as l}from"react";import u from"./useDropdownFiltering.js";import{useMultipleSelection as i,useCombobox as a}from"downshift";function o(o,r,s,p,c,d,g,m,f,v,I,h,O,C,y,b,P,S,j){var T=void 0!==g?g:r,w=t(null),D=S,M=u(o,C,y,T),V=M.filteredOptions,x=M.filterOptions,B=n((function(){return V.flatMap((function(e){return e.options}))}),[V]),K=i({selectedItems:T,initialSelectedItems:d,onSelectedItemsChange:function(e){var t=e.selectedItems;void 0===g&&s(t||[]),null==f||f(t||[])},onStateChange:function(e){var t=e.type,n=e.selectedItems;if((t===i.stateChangeTypes.SelectedItemKeyDownBackspace||t===i.stateChangeTypes.SelectedItemKeyDownDelete)&&n){var l=T.find((function(e){return!n.some((function(t){return t.value===e.value}))}));l&&(null==P||P(l))}}}),k=K.getSelectedItemProps,E=K.getDropdownProps,L=K.addSelectedItem,_=K.removeSelectedItem,A=a({items:B,itemToString:function(e){var t;return null!==(t=null==e?void 0:e.label)&&void 0!==t?t:""},itemToKey:function(e){return void 0!==(null==e?void 0:e.value)?e.value+"":""},isItemDisabled:function(e){return!!e.disabled},isOpen:p,initialIsOpen:c,initialInputValue:null!=m?m:S?T.map((function(e){return e.label})).join(", "):"",id:b,onIsOpenChange:function(e){var t=e.isOpen;x(""),t?null==h||h():null==I||I()},onInputValueChange:l((function(e){var t=e.inputValue;e.type===a.stateChangeTypes.InputChange&&x(t||""),null==v||v(t)}),[v,x]),onSelectedItemChange:function(e){var t=e.selectedItem;if(!D&&t){var n=T.find((function(e){return e.value===t.value}));n?(_(n),null==P||P(n)):L(t),null==O||O(t),x("")}},onStateChange:function(e){var t=e.type;if(D&&(t===a.stateChangeTypes.ItemClick||t===a.stateChangeTypes.InputKeyDownEnter)){var n=w.current;if(w.current=null,n){var l=T.find((function(e){return e.value===n.value}));l?(_(l),null==P||P(l)):L(n),null==O||O(n),x("")}}},stateReducer:function(t,n){var l,u,i,o,r=n.type,s=n.changes,p=S?T.map((function(e){return e.label})).join(", "):null;switch(r){case a.stateChangeTypes.InputKeyDownEnter:case a.stateChangeTypes.ItemClick:if(D){var c=s.selectedItem;w.current=null!=c?c:null;var d=c?T.some((function(e){return e.value===c.value}))?T.filter((function(e){return e.value!==c.value})):[].concat(e(T),[c]):T,g=S?d.map((function(e){return e.label})).join(", "):null;return Object.assign(Object.assign({},s),{selectedItem:null,inputValue:g,isOpen:!0,highlightedIndex:null!==(u=null===(l=s.selectedItem)||void 0===l?void 0:l.index)&&void 0!==u?u:0})}return Object.assign(Object.assign({},s),{inputValue:null,isOpen:!0,highlightedIndex:null!==(o=null===(i=s.selectedItem)||void 0===i?void 0:i.index)&&void 0!==o?o:0});case a.stateChangeTypes.InputBlur:case a.stateChangeTypes.ControlledPropUpdatedSelectedItem:return Object.assign(Object.assign({},s),{inputValue:p});default:return!s.isOpen&&t.isOpen?Object.assign(Object.assign({},s),{inputValue:p}):s}}}),F=A.isOpen,H=A.inputValue,R=A.highlightedIndex,U=A.getToggleButtonProps,q=A.getLabelProps,z=A.getMenuProps,G=A.getInputProps,J=A.getItemProps,N=A.reset,Q=A.openMenu,W=A.toggleMenu,X=A.closeMenu,Y=l((function(){void 0===g&&s([]),N(),null==f||f([])}),[g,s,N,f]);return{isOpen:F,inputValue:H,highlightedIndex:R,selectedItems:T,getSelectedItemProps:k,getDropdownProps:E,addSelectedItem:L,getToggleButtonProps:U,getLabelProps:q,getMenuProps:z,getInputProps:G,getItemProps:J,reset:Y,removeSelectedItem:_,filteredOptions:V,openMenu:Q,toggleMenu:W,closeMenu:X}}export{o as default};
1
+ import{useMemo as e,useCallback as t}from"react";import n from"./useDropdownFiltering.js";import{useMultipleSelection as l,useCombobox as i}from"downshift";function o(o,s,u,r,a,d,p,c,g,m,I,f,h,v,P,O){var S=void 0!==p?p:s,C=n(o,v,P,S),b=C.filteredOptions,M=C.filterOptions,T=e((function(){return b.flatMap((function(e){return e.options}))}),[b]),y=l({selectedItems:S,initialSelectedItems:d,onSelectedItemsChange:function(e){var t=e.selectedItems;void 0===p&&u(t||[]),null==g||g(t||[])}}),V=y.getSelectedItemProps,w=y.getDropdownProps,j=y.addSelectedItem,x=y.removeSelectedItem,D=i({items:T,itemToString:function(e){var t;return null!==(t=null==e?void 0:e.label)&&void 0!==t?t:""},itemToKey:function(e){return void 0!==(null==e?void 0:e.value)?e.value+"":""},isItemDisabled:function(e){return!!e.disabled},isOpen:r,initialIsOpen:a,initialInputValue:c||"",id:O,onIsOpenChange:function(e){e.isOpen?null==f||f():null==I||I()},onInputValueChange:function(e){var t=e.inputValue;M(t||""),null==m||m(t)},onSelectedItemChange:function(e){var t=e.selectedItem;if(t){var n=S.find((function(e){return e.value===t.value}));n?x(n):j(t),null==h||h(t),M("")}},stateReducer:function(e,t){var n,l;switch(t.type){case i.stateChangeTypes.InputKeyDownEnter:case i.stateChangeTypes.ItemClick:return Object.assign(Object.assign({},t.changes),{inputValue:null,isOpen:!0,highlightedIndex:null!==(l=null===(n=t.changes.selectedItem)||void 0===n?void 0:n.index)&&void 0!==l?l:0});case i.stateChangeTypes.InputBlur:case i.stateChangeTypes.ControlledPropUpdatedSelectedItem:return Object.assign(Object.assign({},t.changes),{inputValue:null});default:return t.changes}}}),B=D.isOpen,K=D.inputValue,L=D.highlightedIndex,k=D.getToggleButtonProps,E=D.getLabelProps,F=D.getMenuProps,R=D.getInputProps,U=D.getItemProps,q=D.reset,z=D.openMenu,A=D.toggleMenu,G=D.closeMenu,H=t((function(){void 0===p&&u([]),q(),null==g||g([])}),[p,u,q,g]);return{isOpen:B,inputValue:K,highlightedIndex:L,selectedItems:S,getSelectedItemProps:V,getDropdownProps:w,addSelectedItem:j,getToggleButtonProps:k,getLabelProps:E,getMenuProps:F,getInputProps:R,getItemProps:U,reset:H,removeSelectedItem:x,filteredOptions:b,openMenu:z,toggleMenu:A,closeMenu:G}}export{o as default};
2
2
  //# sourceMappingURL=useDropdownMultiCombobox.js.map
@@ -1 +1 @@
1
- {"version":3,"file":"useDropdownMultiCombobox.js","sources":["../../../../../src/components/Dropdown/hooks/useDropdownMultiCombobox.ts"],"sourcesContent":["import { useMemo, useCallback, useRef } from \"react\";\nimport useDropdownFiltering from \"./useDropdownFiltering\";\nimport { useMultipleSelection, useCombobox } from \"downshift\";\nimport { type DropdownGroupOption } from \"../Dropdown.types\";\nimport { type BaseItemData } from \"../../BaseItem\";\n\nfunction useDropdownMultiCombobox<T extends BaseItemData<Record<string, unknown>>>(\n options: DropdownGroupOption<T>,\n selectedItems: T[],\n setSelectedItems: (items: T[]) => void,\n isMenuOpen: boolean,\n autoFocus?: boolean,\n defaultValue?: T[],\n value?: T[],\n inputValueProp?: string,\n onChange?: (options: T[]) => void,\n onInputChange?: (value: string | null) => void,\n onMenuOpen?: () => void,\n onMenuClose?: () => void,\n onOptionSelect?: (option: T) => void,\n filterOption?: (option: T, inputValue: string) => boolean,\n showSelectedOptions?: boolean,\n id?: string,\n onOptionRemove?: (option: T) => void,\n textInput?: boolean,\n interactiveChips?: boolean\n) {\n // Use controlled value if provided, otherwise use internal state\n const currentSelectedItems = value !== undefined ? value : selectedItems;\n // Used only in textInput/interactiveChips modes. The stateReducer resets selectedItem to null so\n // onStateChange fires even on repeat clicks; this ref carries the original item across that reset.\n const pendingToggleRef = useRef<T | null>(null);\n // textInput only: carries the clicked item across stateReducer's selectedItem:null reset.\n const enableToggle = textInput;\n\n const { filteredOptions, filterOptions } = useDropdownFiltering<T>(\n options,\n filterOption,\n showSelectedOptions,\n currentSelectedItems\n );\n const flatOptions = useMemo(() => filteredOptions.flatMap(group => group.options), [filteredOptions]);\n const { getSelectedItemProps, getDropdownProps, addSelectedItem, removeSelectedItem } = useMultipleSelection<T>({\n selectedItems: currentSelectedItems,\n initialSelectedItems: defaultValue,\n onSelectedItemsChange: ({ selectedItems }) => {\n if (value === undefined) {\n setSelectedItems(selectedItems || []);\n }\n onChange?.(selectedItems || []);\n },\n onStateChange: ({ type, selectedItems: newSelectedItems }) => {\n // Notify onOptionRemove for keyboard-driven chip deletion (× button uses contextOnOptionRemove).\n if (\n (type === useMultipleSelection.stateChangeTypes.SelectedItemKeyDownBackspace ||\n type === useMultipleSelection.stateChangeTypes.SelectedItemKeyDownDelete) &&\n newSelectedItems\n ) {\n const removedItem = currentSelectedItems.find(\n item => !newSelectedItems.some(si => si.value === item.value)\n );\n if (removedItem) onOptionRemove?.(removedItem);\n }\n }\n });\n\n const {\n isOpen,\n inputValue,\n highlightedIndex,\n getToggleButtonProps,\n getLabelProps,\n getMenuProps,\n getInputProps,\n getItemProps,\n reset: downshiftReset,\n openMenu,\n toggleMenu,\n closeMenu\n } = useCombobox<T>({\n items: flatOptions,\n itemToString: item => item?.label ?? \"\",\n itemToKey: item => (item?.value !== undefined ? String(item.value) : \"\"),\n isItemDisabled: item => Boolean(item.disabled),\n isOpen: isMenuOpen,\n initialIsOpen: autoFocus,\n initialInputValue: inputValueProp ?? (textInput ? currentSelectedItems.map(i => i.label).join(\", \") : \"\"),\n id,\n onIsOpenChange: ({ isOpen }) => {\n // Reset the text filter on any open/close change so the full list is always ready.\n filterOptions(\"\");\n isOpen ? onMenuClose?.() : onMenuOpen?.();\n },\n onInputValueChange: useCallback(\n ({ inputValue, type }) => {\n // Only filter on actual user typing. Downshift also writes values into the input on\n // open/close/selection — those changes must not filter the list.\n if (type === useCombobox.stateChangeTypes.InputChange) {\n filterOptions(inputValue || \"\");\n }\n onInputChange?.(inputValue);\n },\n [onInputChange, filterOptions]\n ),\n // When enableToggle (textInput), stateReducer resets selectedItem to null so this fires with\n // null and exits early; onStateChange + pendingToggleRef handle selection instead.\n onSelectedItemChange: ({ selectedItem: newSelectedItem }) => {\n if (enableToggle || !newSelectedItem) return;\n const existingItem = currentSelectedItems.find(item => item.value === newSelectedItem.value);\n if (existingItem) {\n removeSelectedItem(existingItem);\n onOptionRemove?.(existingItem);\n } else {\n addSelectedItem(newSelectedItem);\n }\n onOptionSelect?.(newSelectedItem);\n filterOptions(\"\");\n },\n onStateChange: ({ type }) => {\n if (!enableToggle) return;\n if (\n type !== useCombobox.stateChangeTypes.ItemClick &&\n type !== useCombobox.stateChangeTypes.InputKeyDownEnter\n )\n return;\n\n const clickedItem = pendingToggleRef.current;\n pendingToggleRef.current = null;\n if (!clickedItem) return;\n const existingItem = currentSelectedItems.find(i => i.value === clickedItem.value);\n if (existingItem) {\n removeSelectedItem(existingItem);\n onOptionRemove?.(existingItem);\n } else {\n addSelectedItem(clickedItem);\n }\n onOptionSelect?.(clickedItem);\n filterOptions(\"\");\n },\n stateReducer: (state, actionAndChanges) => {\n const { type, changes } = actionAndChanges;\n // null clears the input and restores the placeholder (original multi-select behavior).\n // textInput mode shows a comma-separated summary instead.\n const closedInputValue = textInput ? currentSelectedItems.map(i => i.label).join(\", \") : null;\n\n switch (type) {\n case useCombobox.stateChangeTypes.InputKeyDownEnter:\n case useCombobox.stateChangeTypes.ItemClick: {\n if (enableToggle) {\n const clickedItem = changes.selectedItem;\n pendingToggleRef.current = clickedItem ?? null;\n const newItems = clickedItem\n ? currentSelectedItems.some(i => i.value === clickedItem.value)\n ? currentSelectedItems.filter(i => i.value !== clickedItem.value)\n : [...currentSelectedItems, clickedItem]\n : currentSelectedItems;\n const newInputValue = textInput ? newItems.map(i => i.label).join(\", \") : null;\n return {\n ...changes,\n selectedItem: null,\n inputValue: newInputValue,\n isOpen: true,\n highlightedIndex: (changes.selectedItem?.index as number) ?? 0\n };\n }\n // Default mode: original behavior — keep the menu open, clear input to restore placeholder.\n return {\n ...changes,\n inputValue: null,\n isOpen: true,\n highlightedIndex: (changes.selectedItem?.index as number) ?? 0\n };\n }\n case useCombobox.stateChangeTypes.InputBlur:\n case useCombobox.stateChangeTypes.ControlledPropUpdatedSelectedItem:\n return { ...changes, inputValue: closedInputValue };\n default:\n if (!changes.isOpen && state.isOpen) {\n return { ...changes, inputValue: closedInputValue };\n }\n return changes;\n }\n }\n });\n\n const reset = useCallback(() => {\n if (value === undefined) {\n setSelectedItems([]);\n }\n downshiftReset();\n onChange?.([]);\n }, [value, setSelectedItems, downshiftReset, onChange]);\n\n return {\n isOpen,\n inputValue,\n highlightedIndex,\n selectedItems: currentSelectedItems,\n getSelectedItemProps,\n getDropdownProps,\n addSelectedItem,\n getToggleButtonProps,\n getLabelProps,\n getMenuProps,\n getInputProps,\n getItemProps,\n reset,\n removeSelectedItem,\n filteredOptions,\n openMenu,\n toggleMenu,\n closeMenu\n };\n}\n\nexport default useDropdownMultiCombobox;\n"],"names":["useDropdownMultiCombobox","options","selectedItems","setSelectedItems","isMenuOpen","autoFocus","defaultValue","value","inputValueProp","onChange","onInputChange","onMenuOpen","onMenuClose","onOptionSelect","filterOption","showSelectedOptions","id","onOptionRemove","textInput","interactiveChips","currentSelectedItems","undefined","pendingToggleRef","useRef","enableToggle","_useDropdownFiltering","useDropdownFiltering","filteredOptions","filterOptions","flatOptions","useMemo","flatMap","group","_useMultipleSelection","useMultipleSelection","initialSelectedItems","onSelectedItemsChange","_ref","onStateChange","_ref2","type","newSelectedItems","stateChangeTypes","SelectedItemKeyDownBackspace","SelectedItemKeyDownDelete","removedItem","find","item","some","si","getSelectedItemProps","getDropdownProps","addSelectedItem","removeSelectedItem","_useCombobox","useCombobox","items","itemToString","_a","label","itemToKey","String","isItemDisabled","disabled","isOpen","initialIsOpen","initialInputValue","map","i","join","onIsOpenChange","_ref3","onInputValueChange","useCallback","_ref4","inputValue","InputChange","onSelectedItemChange","_ref5","newSelectedItem","selectedItem","existingItem","_ref6","ItemClick","InputKeyDownEnter","clickedItem","current","stateReducer","state","actionAndChanges","changes","closedInputValue","newItems","filter","concat","_toConsumableArray","newInputValue","Object","assign","highlightedIndex","_b","index","_d","_c","InputBlur","ControlledPropUpdatedSelectedItem","getToggleButtonProps","getLabelProps","getMenuProps","getInputProps","getItemProps","downshiftReset","reset","openMenu","toggleMenu","closeMenu"],"mappings":"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"}
1
+ {"version":3,"file":"useDropdownMultiCombobox.js","sources":["../../../../../src/components/Dropdown/hooks/useDropdownMultiCombobox.ts"],"sourcesContent":["import { useMemo, useCallback } from \"react\";\nimport useDropdownFiltering from \"./useDropdownFiltering\";\nimport { useMultipleSelection, useCombobox } from \"downshift\";\nimport { type DropdownGroupOption } from \"../Dropdown.types\";\nimport { type BaseItemData } from \"../../BaseItem\";\n\nfunction useDropdownMultiCombobox<T extends BaseItemData<Record<string, unknown>>>(\n options: DropdownGroupOption<T>,\n selectedItems: T[],\n setSelectedItems: (items: T[]) => void,\n isMenuOpen: boolean,\n autoFocus?: boolean,\n defaultValue?: T[],\n value?: T[],\n inputValueProp?: string,\n onChange?: (options: T[]) => void,\n onInputChange?: (value: string | null) => void,\n onMenuOpen?: () => void,\n onMenuClose?: () => void,\n onOptionSelect?: (option: T) => void,\n filterOption?: (option: T, inputValue: string) => boolean,\n showSelectedOptions?: boolean,\n id?: string\n) {\n // Use controlled value if provided, otherwise use internal state\n const currentSelectedItems = value !== undefined ? value : selectedItems;\n\n const { filteredOptions, filterOptions } = useDropdownFiltering<T>(\n options,\n filterOption,\n showSelectedOptions,\n currentSelectedItems\n );\n const flatOptions = useMemo(() => filteredOptions.flatMap(group => group.options), [filteredOptions]);\n const { getSelectedItemProps, getDropdownProps, addSelectedItem, removeSelectedItem } = useMultipleSelection<T>({\n selectedItems: currentSelectedItems,\n initialSelectedItems: defaultValue,\n onSelectedItemsChange: ({ selectedItems }) => {\n if (value === undefined) {\n setSelectedItems(selectedItems || []);\n }\n onChange?.(selectedItems || []);\n }\n });\n\n const {\n isOpen,\n inputValue,\n highlightedIndex,\n getToggleButtonProps,\n getLabelProps,\n getMenuProps,\n getInputProps,\n getItemProps,\n reset: downshiftReset,\n openMenu,\n toggleMenu,\n closeMenu\n } = useCombobox<T>({\n items: flatOptions,\n itemToString: item => item?.label ?? \"\",\n itemToKey: item => (item?.value !== undefined ? String(item.value) : \"\"),\n isItemDisabled: item => Boolean(item.disabled),\n isOpen: isMenuOpen,\n initialIsOpen: autoFocus,\n initialInputValue: inputValueProp || \"\",\n id,\n onIsOpenChange: ({ isOpen }) => {\n isOpen ? onMenuClose?.() : onMenuOpen?.();\n },\n onInputValueChange: ({ inputValue }) => {\n filterOptions(inputValue || \"\");\n onInputChange?.(inputValue);\n },\n onSelectedItemChange: ({ selectedItem: newSelectedItem }) => {\n if (!newSelectedItem) return;\n const existingItem = currentSelectedItems.find(item => item.value === newSelectedItem.value);\n if (existingItem) {\n removeSelectedItem(existingItem);\n } else {\n addSelectedItem(newSelectedItem);\n }\n onOptionSelect?.(newSelectedItem);\n filterOptions(\"\");\n },\n stateReducer: (state, actionAndChanges) => {\n switch (actionAndChanges.type) {\n case useCombobox.stateChangeTypes.InputKeyDownEnter:\n case useCombobox.stateChangeTypes.ItemClick:\n return {\n ...actionAndChanges.changes,\n inputValue: null,\n isOpen: true,\n highlightedIndex: (actionAndChanges.changes.selectedItem?.index as number) ?? 0\n };\n case useCombobox.stateChangeTypes.InputBlur:\n case useCombobox.stateChangeTypes.ControlledPropUpdatedSelectedItem:\n return { ...actionAndChanges.changes, inputValue: null };\n default:\n return actionAndChanges.changes;\n }\n }\n });\n\n const reset = useCallback(() => {\n if (value === undefined) {\n setSelectedItems([]);\n }\n downshiftReset();\n onChange?.([]);\n }, [value, setSelectedItems, downshiftReset, onChange]);\n\n return {\n isOpen,\n inputValue,\n highlightedIndex,\n selectedItems: currentSelectedItems,\n getSelectedItemProps,\n getDropdownProps,\n addSelectedItem,\n getToggleButtonProps,\n getLabelProps,\n getMenuProps,\n getInputProps,\n getItemProps,\n reset,\n removeSelectedItem,\n filteredOptions,\n openMenu,\n toggleMenu,\n closeMenu\n };\n}\n\nexport default useDropdownMultiCombobox;\n"],"names":["useDropdownMultiCombobox","options","selectedItems","setSelectedItems","isMenuOpen","autoFocus","defaultValue","value","inputValueProp","onChange","onInputChange","onMenuOpen","onMenuClose","onOptionSelect","filterOption","showSelectedOptions","id","currentSelectedItems","undefined","_useDropdownFiltering","useDropdownFiltering","filteredOptions","filterOptions","flatOptions","useMemo","flatMap","group","_useMultipleSelection","useMultipleSelection","initialSelectedItems","onSelectedItemsChange","_ref","getSelectedItemProps","getDropdownProps","addSelectedItem","removeSelectedItem","_useCombobox","useCombobox","items","itemToString","item","_a","label","itemToKey","String","isItemDisabled","disabled","isOpen","initialIsOpen","initialInputValue","onIsOpenChange","_ref2","onInputValueChange","_ref3","inputValue","onSelectedItemChange","_ref4","newSelectedItem","selectedItem","existingItem","find","stateReducer","state","actionAndChanges","type","stateChangeTypes","InputKeyDownEnter","ItemClick","Object","assign","changes","highlightedIndex","_b","index","InputBlur","ControlledPropUpdatedSelectedItem","getToggleButtonProps","getLabelProps","getMenuProps","getInputProps","getItemProps","downshiftReset","reset","openMenu","toggleMenu","closeMenu","useCallback"],"mappings":"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"}
@@ -1,2 +1,2 @@
1
- import{slicedToArray as e}from"../../../../_virtual/_rollupPluginBabelHelpers.js";import o,{useState as n}from"react";import t from"../hooks/useDropdownMultiCombobox.js";import l from"../components/DropdownWrapperUI.js";var i=function(i){var r=i.options,u=i.isMenuOpen,s=i.autoFocus,d=i.defaultValue,a=i.value,p=i.inputValue,c=i.onChange,g=i.onInputChange,m=i.onMenuClose,v=i.onMenuOpen,O=i.onOptionSelect,f=i.filterOption,I=i.showSelectedOptions,b=void 0===I||I,P=i.clearable,h=void 0===P||P,M=i.searchable,w=void 0===M||M,x=i.multi,S=void 0===x||x,C=i.closeMenuOnSelect,j=void 0===C||C,y=i.dropdownRef,D=i.onFocus,B=i.onBlur,F=i.onKeyDown,V=i.onClear,R=i.onOptionRemove,A=i.loading,K=void 0!==A&&A,T=i.size,z=void 0===T?"medium":T,L=i.id,_=i.boxMode,k=void 0!==_&&_,E=i.textInput,H=i.interactiveChips,U=n(Array.isArray(d)?d:[]),W=e(U,2),q=W[0],G=W[1],J=n(!1),N=e(J,2),Q=N[0],X=N[1],Y=t(r,q,G,k?void 0:u,s,d,a,p,c,g,m,v,O,f,b,L,R,E),Z=Y.isOpen,$=Y.inputValue,ee=Y.highlightedIndex,oe=Y.getToggleButtonProps,ne=Y.getLabelProps,te=Y.getMenuProps,le=Y.getItemProps,ie=Y.getInputProps,re=Y.reset,ue=Y.toggleMenu,se=Y.filteredOptions,de=Y.selectedItems,ae=Y.addSelectedItem,pe=Y.removeSelectedItem,ce=Y.getDropdownProps,ge=Y.getSelectedItemProps,me=Object.assign(Object.assign({},i),{isOpen:!!k||Z,inputValue:null!=$?$:null,highlightedIndex:ee,selectedItems:de||[],filteredOptions:se,getToggleButtonProps:oe,getLabelProps:ne,getMenuProps:te,getItemProps:le,getInputProps:function(e){return ie(Object.assign(Object.assign({},e||{}),{disabled:i.readOnly||i.disabled,onFocus:function(o){var n;X(!0),null==D||D(o),null===(n=null==e?void 0:e.onFocus)||void 0===n||n.call(e,o)},onBlur:function(o){var n;X(!1),null==B||B(o),null===(n=null==e?void 0:e.onBlur)||void 0===n||n.call(e,o)},onKeyDown:function(o){var n;null==F||F(o),null===(n=null==e?void 0:e.onKeyDown)||void 0===n||n.call(e,o)}}))},reset:re,contextOnClear:function(){re(),void 0===a&&G([]),null==V||V()},contextOnOptionRemove:function(e){pe&&pe(e),null==R||R(e)},addSelectedItem:ae,removeSelectedItem:pe,getSelectedItemProps:ge,isFocused:Q,clearable:h,searchable:w,multi:S,closeMenuOnSelect:j,size:z,getDropdownProps:ce,toggleMenu:ue,loading:K,textInput:E,interactiveChips:H});return o.createElement(l,{contextValue:me,dropdownRef:y})};export{i as default};
1
+ import{slicedToArray as e}from"../../../../_virtual/_rollupPluginBabelHelpers.js";import o,{useState as n}from"react";import t from"../hooks/useDropdownMultiCombobox.js";import l from"../components/DropdownWrapperUI.js";var i=function(i){var r=i.options,u=i.isMenuOpen,s=i.autoFocus,d=i.defaultValue,a=i.value,p=i.inputValue,c=i.onChange,g=i.onInputChange,m=i.onMenuClose,v=i.onMenuOpen,O=i.onOptionSelect,f=i.filterOption,b=i.showSelectedOptions,I=void 0===b||b,P=i.clearable,h=void 0===P||P,M=i.searchable,w=void 0===M||M,x=i.multi,S=void 0===x||x,j=i.closeMenuOnSelect,y=void 0===j||j,D=i.dropdownRef,B=i.onFocus,C=i.onBlur,F=i.onKeyDown,V=i.onClear,R=i.onOptionRemove,A=i.loading,K=void 0!==A&&A,T=i.size,z=void 0===T?"medium":T,L=i.id,_=i.boxMode,k=void 0!==_&&_,E=n(Array.isArray(d)?d:[]),H=e(E,2),U=H[0],W=H[1],q=n(!1),G=e(q,2),J=G[0],N=G[1],Q=t(r,U,W,k?void 0:u,s,d,a,p,c,g,m,v,O,f,I,L),X=Q.isOpen,Y=Q.inputValue,Z=Q.highlightedIndex,$=Q.getToggleButtonProps,ee=Q.getLabelProps,oe=Q.getMenuProps,ne=Q.getItemProps,te=Q.getInputProps,le=Q.reset,ie=Q.toggleMenu,re=Q.filteredOptions,ue=Q.selectedItems,se=Q.addSelectedItem,de=Q.removeSelectedItem,ae=Q.getDropdownProps,pe=Object.assign(Object.assign({},i),{isOpen:!!k||X,inputValue:null!=Y?Y:null,highlightedIndex:Z,selectedItems:ue||[],filteredOptions:re,getToggleButtonProps:$,getLabelProps:ee,getMenuProps:oe,getItemProps:ne,getInputProps:function(e){return te(Object.assign(Object.assign({},e||{}),{disabled:i.readOnly||i.disabled,onFocus:function(o){var n;N(!0),null==B||B(o),null===(n=null==e?void 0:e.onFocus)||void 0===n||n.call(e,o)},onBlur:function(o){var n;N(!1),null==C||C(o),null===(n=null==e?void 0:e.onBlur)||void 0===n||n.call(e,o)},onKeyDown:function(o){var n;null==F||F(o),null===(n=null==e?void 0:e.onKeyDown)||void 0===n||n.call(e,o)}}))},reset:le,contextOnClear:function(){le(),void 0===a&&W([]),null==V||V()},contextOnOptionRemove:function(e){de&&de(e),null==R||R(e)},addSelectedItem:se,removeSelectedItem:de,isFocused:J,clearable:h,searchable:w,multi:S,closeMenuOnSelect:y,size:z,getDropdownProps:ae,toggleMenu:ie,loading:K});return o.createElement(l,{contextValue:pe,dropdownRef:D})};export{i as default};
2
2
  //# sourceMappingURL=DropdownMultiComboboxController.js.map
@@ -1 +1 @@
1
- {"version":3,"file":"DropdownMultiComboboxController.js","sources":["../../../../../src/components/Dropdown/modes/DropdownMultiComboboxController.tsx"],"sourcesContent":["import React, { useState } from \"react\";\nimport { type DropdownMultiControllerProps } from \"../Dropdown.types\";\nimport useDropdownMultiCombobox from \"../hooks/useDropdownMultiCombobox\";\nimport { type BaseItemData } from \"../../BaseItem\";\nimport { type DropdownContextProps } from \"../context/DropdownContext.types\";\nimport DropdownWrapperUI from \"../components/DropdownWrapperUI\";\n\nconst DropdownMultiComboboxController = <Item extends BaseItemData<Record<string, unknown>>>(\n props: DropdownMultiControllerProps<Item>\n) => {\n const {\n options,\n isMenuOpen: isMenuOpenProp,\n autoFocus,\n defaultValue,\n value,\n inputValue: inputValueProp,\n onChange,\n onInputChange,\n onMenuClose,\n onMenuOpen,\n onOptionSelect,\n filterOption,\n showSelectedOptions = true,\n clearable = true,\n searchable = true,\n multi = true,\n closeMenuOnSelect = true,\n dropdownRef,\n onFocus,\n onBlur,\n onKeyDown,\n onClear,\n onOptionRemove,\n loading = false,\n size = \"medium\",\n id,\n boxMode = false,\n textInput,\n interactiveChips\n } = props;\n\n const initialMultiSelectedItems = Array.isArray(defaultValue) ? defaultValue : [];\n const [multiSelectedItemsState, setMultiSelectedItemsState] = useState<Item[]>(initialMultiSelectedItems);\n const [isFocused, setIsFocused] = useState(false);\n\n const {\n isOpen,\n inputValue: hookInputValue,\n highlightedIndex,\n getToggleButtonProps,\n getLabelProps,\n getMenuProps,\n getItemProps,\n getInputProps: hookGetInputProps,\n reset: hookReset,\n toggleMenu,\n filteredOptions,\n selectedItems: hookSelectedItems,\n addSelectedItem: hookAddSelectedItem,\n removeSelectedItem: hookRemoveSelectedItem,\n getDropdownProps,\n getSelectedItemProps: hookGetSelectedItemProps\n } = useDropdownMultiCombobox<Item>(\n options,\n multiSelectedItemsState,\n setMultiSelectedItemsState,\n boxMode ? undefined : isMenuOpenProp,\n autoFocus,\n defaultValue,\n value,\n inputValueProp,\n onChange,\n onInputChange,\n onMenuClose,\n onMenuOpen,\n onOptionSelect,\n filterOption,\n showSelectedOptions,\n id,\n onOptionRemove,\n textInput,\n interactiveChips\n );\n\n const contextValue: DropdownContextProps<Item> = {\n ...props,\n isOpen: boxMode ? true : isOpen,\n inputValue: hookInputValue ?? null,\n highlightedIndex,\n selectedItems: hookSelectedItems || [],\n filteredOptions,\n getToggleButtonProps,\n getLabelProps,\n getMenuProps,\n getItemProps,\n getInputProps: (inputOptions?: any) => {\n return hookGetInputProps!({\n ...(inputOptions || {}),\n disabled: props.readOnly || props.disabled,\n onFocus: (event: React.FocusEvent<HTMLInputElement>) => {\n setIsFocused(true);\n onFocus?.(event as any);\n inputOptions?.onFocus?.(event);\n },\n onBlur: (event: React.FocusEvent<HTMLInputElement>) => {\n setIsFocused(false);\n onBlur?.(event);\n inputOptions?.onBlur?.(event);\n },\n onKeyDown: (event: React.KeyboardEvent<HTMLInputElement>) => {\n onKeyDown?.(event);\n inputOptions?.onKeyDown?.(event);\n }\n });\n },\n reset: hookReset,\n contextOnClear: () => {\n hookReset();\n if (value === undefined) {\n setMultiSelectedItemsState([]);\n }\n onClear?.();\n },\n contextOnOptionRemove: (option: Item) => {\n if (hookRemoveSelectedItem) {\n hookRemoveSelectedItem(option);\n }\n onOptionRemove?.(option);\n },\n addSelectedItem: hookAddSelectedItem,\n removeSelectedItem: hookRemoveSelectedItem,\n getSelectedItemProps: hookGetSelectedItemProps,\n isFocused,\n clearable,\n searchable,\n multi,\n closeMenuOnSelect,\n size,\n getDropdownProps,\n toggleMenu,\n loading,\n textInput,\n interactiveChips\n };\n\n return <DropdownWrapperUI contextValue={contextValue} dropdownRef={dropdownRef} />;\n};\n\nexport default DropdownMultiComboboxController;\n"],"names":["DropdownMultiComboboxController","props","options","isMenuOpenProp","isMenuOpen","autoFocus","defaultValue","value","inputValueProp","inputValue","onChange","onInputChange","onMenuClose","onMenuOpen","onOptionSelect","filterOption","_props$showSelectedOp","showSelectedOptions","_props$clearable","clearable","_props$searchable","searchable","_props$multi","multi","_props$closeMenuOnSel","closeMenuOnSelect","dropdownRef","onFocus","onBlur","onKeyDown","onClear","onOptionRemove","_props$loading","loading","_props$size","size","id","_props$boxMode","boxMode","textInput","interactiveChips","_useState","useState","Array","isArray","_useState2","_slicedToArray","multiSelectedItemsState","setMultiSelectedItemsState","_useState3","_useState4","isFocused","setIsFocused","_useDropdownMultiComb","useDropdownMultiCombobox","undefined","isOpen","hookInputValue","highlightedIndex","getToggleButtonProps","getLabelProps","getMenuProps","getItemProps","hookGetInputProps","getInputProps","hookReset","reset","toggleMenu","filteredOptions","hookSelectedItems","selectedItems","hookAddSelectedItem","addSelectedItem","hookRemoveSelectedItem","removeSelectedItem","getDropdownProps","hookGetSelectedItemProps","getSelectedItemProps","contextValue","Object","assign","inputOptions","disabled","readOnly","event","_a","call","contextOnClear","contextOnOptionRemove","option","React","createElement","DropdownWrapperUI"],"mappings":"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"}
1
+ {"version":3,"file":"DropdownMultiComboboxController.js","sources":["../../../../../src/components/Dropdown/modes/DropdownMultiComboboxController.tsx"],"sourcesContent":["import React, { useState } from \"react\";\nimport { type DropdownMultiControllerProps } from \"../Dropdown.types\";\nimport useDropdownMultiCombobox from \"../hooks/useDropdownMultiCombobox\";\nimport { type BaseItemData } from \"../../BaseItem\";\nimport { type DropdownContextProps } from \"../context/DropdownContext.types\";\nimport DropdownWrapperUI from \"../components/DropdownWrapperUI\";\n\nconst DropdownMultiComboboxController = <Item extends BaseItemData<Record<string, unknown>>>(\n props: DropdownMultiControllerProps<Item>\n) => {\n const {\n options,\n isMenuOpen: isMenuOpenProp,\n autoFocus,\n defaultValue,\n value,\n inputValue: inputValueProp,\n onChange,\n onInputChange,\n onMenuClose,\n onMenuOpen,\n onOptionSelect,\n filterOption,\n showSelectedOptions = true,\n clearable = true,\n searchable = true,\n multi = true,\n closeMenuOnSelect = true,\n dropdownRef,\n onFocus,\n onBlur,\n onKeyDown,\n onClear,\n onOptionRemove,\n loading = false,\n size = \"medium\",\n id,\n boxMode = false\n } = props;\n\n const initialMultiSelectedItems = Array.isArray(defaultValue) ? defaultValue : [];\n const [multiSelectedItemsState, setMultiSelectedItemsState] = useState<Item[]>(initialMultiSelectedItems);\n const [isFocused, setIsFocused] = useState(false);\n\n const {\n isOpen,\n inputValue: hookInputValue,\n highlightedIndex,\n getToggleButtonProps,\n getLabelProps,\n getMenuProps,\n getItemProps,\n getInputProps: hookGetInputProps,\n reset: hookReset,\n toggleMenu,\n filteredOptions,\n selectedItems: hookSelectedItems,\n addSelectedItem: hookAddSelectedItem,\n removeSelectedItem: hookRemoveSelectedItem,\n getDropdownProps\n } = useDropdownMultiCombobox<Item>(\n options,\n multiSelectedItemsState,\n setMultiSelectedItemsState,\n boxMode ? undefined : isMenuOpenProp,\n autoFocus,\n defaultValue,\n value,\n inputValueProp,\n onChange,\n onInputChange,\n onMenuClose,\n onMenuOpen,\n onOptionSelect,\n filterOption,\n showSelectedOptions,\n id\n );\n\n const contextValue: DropdownContextProps<Item> = {\n ...props,\n isOpen: boxMode ? true : isOpen,\n inputValue: hookInputValue ?? null,\n highlightedIndex,\n selectedItems: hookSelectedItems || [],\n filteredOptions,\n getToggleButtonProps,\n getLabelProps,\n getMenuProps,\n getItemProps,\n getInputProps: (inputOptions?: any) => {\n return hookGetInputProps!({\n ...(inputOptions || {}),\n disabled: props.readOnly || props.disabled,\n onFocus: (event: React.FocusEvent<HTMLInputElement>) => {\n setIsFocused(true);\n onFocus?.(event as any);\n inputOptions?.onFocus?.(event);\n },\n onBlur: (event: React.FocusEvent<HTMLInputElement>) => {\n setIsFocused(false);\n onBlur?.(event);\n inputOptions?.onBlur?.(event);\n },\n onKeyDown: (event: React.KeyboardEvent<HTMLInputElement>) => {\n onKeyDown?.(event);\n inputOptions?.onKeyDown?.(event);\n }\n });\n },\n reset: hookReset,\n contextOnClear: () => {\n hookReset();\n if (value === undefined) {\n setMultiSelectedItemsState([]);\n }\n onClear?.();\n },\n contextOnOptionRemove: (option: Item) => {\n if (hookRemoveSelectedItem) {\n hookRemoveSelectedItem(option);\n }\n onOptionRemove?.(option);\n },\n addSelectedItem: hookAddSelectedItem,\n removeSelectedItem: hookRemoveSelectedItem,\n isFocused,\n clearable,\n searchable,\n multi,\n closeMenuOnSelect,\n size,\n getDropdownProps,\n toggleMenu,\n loading\n };\n\n return <DropdownWrapperUI contextValue={contextValue} dropdownRef={dropdownRef} />;\n};\n\nexport default DropdownMultiComboboxController;\n"],"names":["DropdownMultiComboboxController","props","options","isMenuOpenProp","isMenuOpen","autoFocus","defaultValue","value","inputValueProp","inputValue","onChange","onInputChange","onMenuClose","onMenuOpen","onOptionSelect","filterOption","_props$showSelectedOp","showSelectedOptions","_props$clearable","clearable","_props$searchable","searchable","_props$multi","multi","_props$closeMenuOnSel","closeMenuOnSelect","dropdownRef","onFocus","onBlur","onKeyDown","onClear","onOptionRemove","_props$loading","loading","_props$size","size","id","_props$boxMode","boxMode","_useState","useState","Array","isArray","_useState2","_slicedToArray","multiSelectedItemsState","setMultiSelectedItemsState","_useState3","_useState4","isFocused","setIsFocused","_useDropdownMultiComb","useDropdownMultiCombobox","undefined","isOpen","hookInputValue","highlightedIndex","getToggleButtonProps","getLabelProps","getMenuProps","getItemProps","hookGetInputProps","getInputProps","hookReset","reset","toggleMenu","filteredOptions","hookSelectedItems","selectedItems","hookAddSelectedItem","addSelectedItem","hookRemoveSelectedItem","removeSelectedItem","getDropdownProps","contextValue","Object","assign","inputOptions","disabled","readOnly","event","_a","call","contextOnClear","contextOnOptionRemove","option","React","createElement","DropdownWrapperUI"],"mappings":"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"}
@@ -1,2 +1,2 @@
1
- import{slicedToArray as e,defineProperty as t}from"../../../../_virtual/_rollupPluginBabelHelpers.js";import o,{forwardRef as r,useRef as a,useState as s,useCallback as i,useMemo as n}from"react";import l from"classnames";import{RemoveScroll as c}from"react-remove-scroll";import d from"react-focus-lock";import{CSSTransition as m}from"react-transition-group";import{getTestId as u}from"../../../tests/testIds.js";import{ComponentDefaultTestId as f,ComponentVibeId as p}from"../../../tests/constants.js";import v from"./Modal.module.scss.js";import y from"../ModalTopActions/ModalTopActions.js";import{camelCase as E}from"es-toolkit";import{ModalProvider as A}from"../context/ModalContext.js";import{keyCodes as h}from"../../../constants/keyCodes.js";import"../../../constants/sizes.js";import{createPortal as b}from"react-dom";import j from"../hooks/usePortalTarget/usePortalTarget.js";import g from"../hooks/useFocusEscapeTargets/useFocusEscapeTargets.js";import x from"../../../../components/layer/dist/LayerProvider/LayerProvider.js";import{useMergeRef as M}from"../../../../shared/dist/hooks/useMergeRef.js";import{getStyle as T}from"../../../../shared/dist/utils/typesciptCssModulesHelper.js";var L=d.default||d,P=r((function(r,d){var P,w=r.id,k=r.show,C=r.size,F=void 0===C?"medium":C,O=r.renderHeaderAction,I=r.closeButtonTheme,R=r.closeButtonAriaLabel,z=r.onClose,B=void 0===z?function(){}:z,D=r.autoFocus,H=void 0===D||D,N=r.allowFocusEscapeTo,_=r.onFocusAttempt,V=r.anchorElementRef,K=r.alertModal,S=r.container,Y=void 0===S?document.body:S,q=r.children,G=r.style,J=r.zIndex,Q=r.className,U=r["data-testid"],W=r["aria-labelledby"],X=r["aria-describedby"],Z=j(Y),$=a(null),ee=M(d,$),te=a(null),oe=s(),re=e(oe,2),ae=re[0],se=re[1],ie=s(),ne=e(ie,2),le=ne[0],ce=ne[1],de=i((function(e){W||se(e)}),[W]),me=i((function(e){X||ce(e)}),[X]),ue=n((function(){return{modalId:w,setTitleId:de,setDescriptionId:me,autoFocus:H}}),[w,de,me,H]),fe=i((function(e){k&&!K&&B(e)}),[k,K,B]),pe=i((function(e){e.key===h.ESCAPE&&k&&!K&&B(e)}),[K,B,k]),ve="full-view"===F?"fullView":(null==V?void 0:V.current)?"anchorPop":"centerPop",ye=null===(P=null==V?void 0:V.current)||void 0===P?void 0:P.getBoundingClientRect(),Ee=ye?{"--modal-start-x":"".concat(ye.left+ye.width/2,"px"),"--modal-start-y":"".concat(ye.top+ye.height/2,"px")}:{},Ae=J?{"--monday-modal-z-index":J}:{},he=g(N),be=i((function(e){if(_){var t=_(e);return!0===t||t instanceof HTMLElement&&(t.focus(),!1)}return!he(e)}),[_,he]);return o.createElement(m,{in:k,nodeRef:te,timeout:{enter:250,exit:150},unmountOnExit:!0,classNames:{enter:v.containerEnter,enterActive:v.containerEnterActive,exitActive:v.containerExitActive}},o.createElement(x,{layerRef:te},o.createElement(A,{value:ue},b(o.createElement(L,{returnFocus:!0,autoFocus:H,whiteList:be},o.createElement("div",{ref:te,className:v.container,style:Ae,onKeyDown:pe},o.createElement("div",{"data-testid":u(f.MODAL_OVERLAY,w),className:v.overlay,onClick:fe,"aria-hidden":!0}),o.createElement(c,{forwardProps:!0,ref:ee},o.createElement("div",{className:l(v.modal,v[ve],T(v,E("size-"+F)),t({},v.withHeaderAction,!!O),Q),id:w,"data-testid":U||u(f.MODAL,w),"data-vibe":p.MODAL,role:"dialog","aria-modal":!0,"aria-labelledby":W||ae,"aria-describedby":X||le,style:Object.assign(Object.assign({},G),Ee),tabIndex:-1},q,o.createElement(y,{renderAction:O,theme:I,closeButtonAriaLabel:R,onClose:B}))))),Z))))}));export{P as default};
1
+ import{slicedToArray as e,defineProperty as t}from"../../../../_virtual/_rollupPluginBabelHelpers.js";import o,{forwardRef as r,useRef as i,useState as a,useCallback as s,useMemo as n}from"react";import l from"classnames";import{RemoveScroll as c}from"react-remove-scroll";import d from"react-focus-lock";import{CSSTransition as m}from"react-transition-group";import{getTestId as u}from"../../../tests/testIds.js";import{ComponentDefaultTestId as f,ComponentVibeId as p}from"../../../tests/constants.js";import v from"./Modal.module.scss.js";import y from"../ModalTopActions/ModalTopActions.js";import{camelCase as E}from"es-toolkit";import{ModalProvider as A}from"../context/ModalContext.js";import{keyCodes as h}from"../../../constants/keyCodes.js";import"../../../constants/sizes.js";import{createPortal as b}from"react-dom";import j from"../hooks/usePortalTarget/usePortalTarget.js";import x from"../hooks/useFocusEscapeTargets/useFocusEscapeTargets.js";import g from"../../../../components/layer/dist/LayerProvider/LayerProvider.js";import{useMergeRef as P}from"../../../../shared/dist/hooks/useMergeRef.js";import{getStyle as M}from"../../../../shared/dist/utils/typesciptCssModulesHelper.js";var T=d.default||d,L=r((function(r,d){var L,w=r.id,F=r.show,k=r.size,C=void 0===k?"medium":k,O=r.renderHeaderAction,I=r.closeButtonTheme,R=r.closeButtonAriaLabel,z=r.onClose,B=void 0===z?function(){}:z,D=r.autoFocus,H=void 0===D||D,N=r.allowFocusEscapeTo,_=r.onFocusAttempt,V=r.anchorElementRef,K=r.alertModal,S=r.container,Y=void 0===S?document.body:S,q=r.children,G=r.style,J=r.zIndex,Q=r.useFixedPosition,U=void 0!==Q&&Q,W=r.className,X=r["data-testid"],Z=r["aria-labelledby"],$=r["aria-describedby"],ee=j(Y),te=i(null),oe=P(d,te),re=i(null),ie=a(),ae=e(ie,2),se=ae[0],ne=ae[1],le=a(),ce=e(le,2),de=ce[0],me=ce[1],ue=s((function(e){Z||ne(e)}),[Z]),fe=s((function(e){$||me(e)}),[$]),pe=n((function(){return{modalId:w,setTitleId:ue,setDescriptionId:fe,autoFocus:H}}),[w,ue,fe,H]),ve=s((function(e){F&&!K&&B(e)}),[F,K,B]),ye=s((function(e){e.key===h.ESCAPE&&F&&!K&&B(e)}),[K,B,F]),Ee="full-view"===C?"fullView":(null==V?void 0:V.current)?"anchorPop":"centerPop",Ae=null===(L=null==V?void 0:V.current)||void 0===L?void 0:L.getBoundingClientRect(),he=Ae?{"--modal-start-x":"".concat(Ae.left+Ae.width/2,"px"),"--modal-start-y":"".concat(Ae.top+Ae.height/2,"px")}:{},be=J?{"--monday-modal-z-index":J}:{},je=x(N),xe=s((function(e){if(_){var t=_(e);return!0===t||t instanceof HTMLElement&&(t.focus(),!1)}return!je(e)}),[_,je]);return o.createElement(m,{in:F,nodeRef:re,timeout:{enter:250,exit:150},unmountOnExit:!0,classNames:{enter:v.containerEnter,enterActive:v.containerEnterActive,exitActive:v.containerExitActive}},o.createElement(g,{layerRef:re},o.createElement(A,{value:pe},b(o.createElement(T,{returnFocus:!0,autoFocus:H,whiteList:xe},o.createElement("div",{ref:re,className:v.container,style:be,onKeyDown:ye},o.createElement("div",{"data-testid":u(f.MODAL_OVERLAY,w),className:v.overlay,onClick:ve,"aria-hidden":!0}),o.createElement(c,{forwardProps:!0,ref:oe},o.createElement("div",{className:l(v.modal,v[Ee],M(v,E("size-"+C)),t({},v.withHeaderAction,!!O),t({},v.fixedPosition,U),W),id:w,"data-testid":X||u(f.MODAL,w),"data-vibe":p.MODAL,role:"dialog","aria-modal":!0,"aria-labelledby":Z||se,"aria-describedby":$||de,style:Object.assign(Object.assign({},G),he),tabIndex:-1},q,o.createElement(y,{renderAction:O,theme:I,closeButtonAriaLabel:R,onClose:B}))))),ee))))}));export{L as default};
2
2
  //# sourceMappingURL=Modal.js.map
@@ -1 +1 @@
1
- {"version":3,"file":"Modal.js","sources":["../../../../../src/components/Modal/Modal/Modal.tsx"],"sourcesContent":["import React, { forwardRef, useCallback, useMemo, useRef, useState } from \"react\";\nimport cx from \"classnames\";\nimport { RemoveScroll } from \"react-remove-scroll\";\nimport FocusLock from \"react-focus-lock\";\nimport { CSSTransition } from \"react-transition-group\";\nimport { getTestId } from \"../../../tests/test-ids-utils\";\nimport { ComponentDefaultTestId, ComponentVibeId } from \"../../../tests/constants\";\nimport styles from \"./Modal.module.scss\";\nimport { type ModalProps } from \"./Modal.types\";\nimport ModalTopActions from \"../ModalTopActions/ModalTopActions\";\nimport { getStyle, useMergeRef } from \"@vibe/shared\";\nimport { camelCase } from \"es-toolkit\";\nimport { ModalProvider } from \"../context/ModalContext\";\nimport { type ModalProviderValue } from \"../context/ModalContext.types\";\nimport { keyCodes } from \"../../../constants\";\nimport { createPortal } from \"react-dom\";\nimport usePortalTarget from \"../hooks/usePortalTarget/usePortalTarget\";\nimport useFocusEscapeTargets from \"../hooks/useFocusEscapeTargets/useFocusEscapeTargets\";\nimport { LayerProvider } from \"@vibe/layer\";\n\n// @ts-expect-error This is a precaution to support all possible module systems (ESM/CJS)\nconst FocusLockComponent = (FocusLock.default || FocusLock) as typeof FocusLock;\n\nconst Modal = forwardRef(\n (\n {\n id,\n show,\n size = \"medium\",\n renderHeaderAction,\n closeButtonTheme,\n closeButtonAriaLabel,\n onClose = () => {},\n autoFocus = true,\n allowFocusEscapeTo,\n onFocusAttempt,\n anchorElementRef,\n alertModal,\n container = document.body,\n children,\n style,\n zIndex,\n className,\n \"data-testid\": dataTestId,\n \"aria-labelledby\": ariaLabelledby,\n \"aria-describedby\": ariaDescribedby\n }: ModalProps,\n ref: React.ForwardedRef<HTMLDivElement>\n ) => {\n const portalTargetElement = usePortalTarget(container);\n\n const modalRef = useRef<HTMLDivElement>(null);\n const modalMergedRef = useMergeRef<HTMLDivElement>(ref, modalRef);\n const containerRef = useRef<HTMLDivElement>(null);\n\n const [titleId, setTitleId] = useState<string>();\n const [descriptionId, setDescriptionId] = useState<string>();\n\n const setTitleIdCallback = useCallback(\n (newId: string) => {\n if (ariaLabelledby) return;\n setTitleId(newId);\n },\n [ariaLabelledby]\n );\n const setDescriptionIdCallback = useCallback(\n (newId: string) => {\n if (ariaDescribedby) return;\n setDescriptionId(newId);\n },\n [ariaDescribedby]\n );\n\n const contextValue = useMemo<ModalProviderValue>(\n () => ({\n modalId: id,\n setTitleId: setTitleIdCallback,\n setDescriptionId: setDescriptionIdCallback,\n autoFocus\n }),\n [id, setTitleIdCallback, setDescriptionIdCallback, autoFocus]\n );\n\n const onBackdropClick = useCallback<React.MouseEventHandler<HTMLDivElement>>(\n e => {\n if (!show || alertModal) return;\n onClose(e);\n },\n [show, alertModal, onClose]\n );\n\n const onModalKeyDown = useCallback<React.KeyboardEventHandler<HTMLDivElement>>(\n e => {\n if (e.key !== keyCodes.ESCAPE || !show || alertModal) return;\n onClose(e);\n },\n [alertModal, onClose, show]\n );\n\n const animationType = size === \"full-view\" ? \"fullView\" : anchorElementRef?.current ? \"anchorPop\" : \"centerPop\";\n\n const anchorRect = anchorElementRef?.current?.getBoundingClientRect();\n const anchorVars = anchorRect\n ? ({\n \"--modal-start-x\": `${anchorRect.left + anchorRect.width / 2}px`,\n \"--modal-start-y\": `${anchorRect.top + anchorRect.height / 2}px`\n } as React.CSSProperties)\n : {};\n\n const zIndexStyle = zIndex ? ({ \"--monday-modal-z-index\": zIndex } as React.CSSProperties) : {};\n\n const shouldAllowFocusEscape = useFocusEscapeTargets(allowFocusEscapeTo);\n\n /**\n * Returning true means that the focus-lock is allowed to manage the element.\n * Returning false means that the focus-lock would surrender control to the element.\n */\n const handleFocusLockWhiteList = useCallback(\n (nextFocusedElement?: HTMLElement) => {\n if (onFocusAttempt) {\n const outcome = onFocusAttempt(nextFocusedElement);\n\n if (outcome === true) return true;\n\n if (outcome instanceof HTMLElement) {\n outcome.focus();\n return false;\n }\n\n return false;\n }\n\n return !shouldAllowFocusEscape(nextFocusedElement);\n },\n [onFocusAttempt, shouldAllowFocusEscape]\n );\n\n return (\n <CSSTransition\n in={show}\n nodeRef={containerRef}\n timeout={{ enter: 250, exit: 150 }}\n unmountOnExit\n classNames={{\n enter: styles.containerEnter,\n enterActive: styles.containerEnterActive,\n exitActive: styles.containerExitActive\n }}\n >\n <LayerProvider layerRef={containerRef}>\n <ModalProvider value={contextValue}>\n {createPortal(\n <FocusLockComponent returnFocus autoFocus={autoFocus} whiteList={handleFocusLockWhiteList}>\n <div ref={containerRef} className={styles.container} style={zIndexStyle} onKeyDown={onModalKeyDown}>\n <div\n data-testid={getTestId(ComponentDefaultTestId.MODAL_OVERLAY, id)}\n className={styles.overlay}\n onClick={onBackdropClick}\n aria-hidden\n />\n <RemoveScroll forwardProps ref={modalMergedRef}>\n <div\n className={cx(\n styles.modal,\n styles[animationType],\n getStyle(styles, camelCase(\"size-\" + size)),\n { [styles.withHeaderAction]: !!renderHeaderAction },\n className\n )}\n id={id}\n data-testid={dataTestId || getTestId(ComponentDefaultTestId.MODAL, id)}\n data-vibe={ComponentVibeId.MODAL}\n role=\"dialog\"\n aria-modal\n aria-labelledby={ariaLabelledby || titleId}\n aria-describedby={ariaDescribedby || descriptionId}\n style={{ ...style, ...anchorVars }}\n tabIndex={-1}\n >\n {children}\n <ModalTopActions\n renderAction={renderHeaderAction}\n theme={closeButtonTheme}\n closeButtonAriaLabel={closeButtonAriaLabel}\n onClose={onClose}\n />\n </div>\n </RemoveScroll>\n </div>\n </FocusLockComponent>,\n portalTargetElement\n )}\n </ModalProvider>\n </LayerProvider>\n </CSSTransition>\n );\n }\n);\n\nexport default Modal;\n"],"names":["FocusLockComponent","FocusLock","default","Modal","forwardRef","_ref","ref","id","show","_ref$size","size","renderHeaderAction","closeButtonTheme","closeButtonAriaLabel","_ref$onClose","onClose","_ref$autoFocus","autoFocus","allowFocusEscapeTo","onFocusAttempt","anchorElementRef","alertModal","_ref$container","container","document","body","children","style","zIndex","className","dataTestId","ariaLabelledby","ariaDescribedby","portalTargetElement","usePortalTarget","modalRef","useRef","modalMergedRef","useMergeRef","containerRef","_useState","useState","_useState2","_slicedToArray","titleId","setTitleId","_useState3","_useState4","descriptionId","setDescriptionId","setTitleIdCallback","useCallback","newId","setDescriptionIdCallback","contextValue","useMemo","modalId","onBackdropClick","e","onModalKeyDown","key","keyCodes","ESCAPE","animationType","current","anchorRect","_a","getBoundingClientRect","anchorVars","concat","left","width","top","height","zIndexStyle","shouldAllowFocusEscape","useFocusEscapeTargets","handleFocusLockWhiteList","nextFocusedElement","outcome","HTMLElement","focus","React","createElement","CSSTransition","in","nodeRef","timeout","enter","exit","unmountOnExit","classNames","styles","containerEnter","enterActive","containerEnterActive","exitActive","containerExitActive","LayerProvider","layerRef","ModalProvider","value","createPortal","returnFocus","whiteList","onKeyDown","getTestId","ComponentDefaultTestId","MODAL_OVERLAY","overlay","onClick","RemoveScroll","forwardProps","cx","modal","getStyle","camelCase","_defineProperty","withHeaderAction","MODAL","ComponentVibeId","role","Object","assign","tabIndex","ModalTopActions","renderAction","theme"],"mappings":"+qCAqBA,IAAMA,EAAsBC,EAAUC,SAAWD,EAE3CE,EAAQC,GACZ,SAAAC,EAuBEC,GACE,MAtBAC,EAAEF,EAAFE,GACAC,EAAIH,EAAJG,KAAIC,EAAAJ,EACJK,KAAAA,OAAO,IAAHD,EAAG,SAAQA,EACfE,EAAkBN,EAAlBM,mBACAC,EAAgBP,EAAhBO,iBACAC,EAAoBR,EAApBQ,qBAAoBC,EAAAT,EACpBU,QAAAA,OAAO,IAAAD,EAAG,WAAQ,EAAAA,EAAAE,EAAAX,EAClBY,UAAAA,OAAY,IAAHD,GAAOA,EAChBE,EAAkBb,EAAlBa,mBACAC,EAAcd,EAAdc,eACAC,EAAgBf,EAAhBe,iBACAC,EAAUhB,EAAVgB,WAAUC,EAAAjB,EACVkB,UAAAA,OAAS,IAAAD,EAAGE,SAASC,KAAIH,EACzBI,EAAQrB,EAARqB,SACAC,EAAKtB,EAALsB,MACAC,EAAMvB,EAANuB,OACAC,EAASxB,EAATwB,UACeC,EAAUzB,EAAzB,eACmB0B,EAAc1B,EAAjC,mBACoB2B,EAAe3B,EAAnC,oBAII4B,EAAsBC,EAAgBX,GAEtCY,EAAWC,EAAuB,MAClCC,GAAiBC,EAA4BhC,EAAK6B,GAClDI,GAAeH,EAAuB,MAE5CI,GAA8BC,IAAkBC,GAAAC,EAAAH,GAAA,GAAzCI,GAAOF,GAAA,GAAEG,GAAUH,GAAA,GAC1BI,GAA0CL,IAAkBM,GAAAJ,EAAAG,GAAA,GAArDE,GAAaD,GAAA,GAAEE,GAAgBF,GAAA,GAEhCG,GAAqBC,GACzB,SAACC,GACKrB,GACJc,GAAWO,EACb,GACA,CAACrB,IAEGsB,GAA2BF,GAC/B,SAACC,GACKpB,GACJiB,GAAiBG,EACnB,GACA,CAACpB,IAGGsB,GAAeC,GACnB,WAAA,MAAO,CACLC,QAASjD,EACTsC,WAAYK,GACZD,iBAAkBI,GAClBpC,UAAAA,EACA,GACF,CAACV,EAAI2C,GAAoBG,GAA0BpC,IAG/CwC,GAAkBN,GACtB,SAAAO,GACOlD,IAAQa,GACbN,EAAQ2C,EACT,GACD,CAAClD,EAAMa,EAAYN,IAGf4C,GAAiBR,GACrB,SAAAO,GACMA,EAAEE,MAAQC,EAASC,QAAWtD,IAAQa,GAC1CN,EAAQ2C,EACT,GACD,CAACrC,EAAYN,EAASP,IAGlBuD,GAAyB,cAATrD,EAAuB,YAAaU,aAAA,EAAAA,EAAkB4C,SAAU,YAAc,YAE9FC,GAAwC,QAA3BC,EAAA9C,aAAA,EAAAA,EAAkB4C,eAAS,IAAAE,OAAA,EAAAA,EAAAC,wBACxCC,GAAaH,GACd,CACC,kBAAiBI,GAAAA,OAAKJ,GAAWK,KAAOL,GAAWM,MAAQ,EAAK,MAChE,kBAAiB,GAAAF,OAAKJ,GAAWO,IAAMP,GAAWQ,OAAS,EAAC,OAE9D,GAEEC,GAAc9C,EAAU,CAAE,yBAA0BA,GAAmC,GAEvF+C,GAAyBC,EAAsB1D,GAM/C2D,GAA2B1B,GAC/B,SAAC2B,GACC,GAAI3D,EAAgB,CAClB,IAAM4D,EAAU5D,EAAe2D,GAE/B,OAAgB,IAAZC,GAEAA,aAAmBC,cACrBD,EAAQE,SACD,EAIX,CAEA,OAAQN,GAAuBG,EACjC,GACA,CAAC3D,EAAgBwD,KAGnB,OACEO,EAACC,cAAAC,EACC,CAAAC,GAAI7E,EACJ8E,QAAS/C,GACTgD,QAAS,CAAEC,MAAO,IAAKC,KAAM,KAC7BC,eACA,EAAAC,WAAY,CACVH,MAAOI,EAAOC,eACdC,YAAaF,EAAOG,qBACpBC,WAAYJ,EAAOK,sBAGrBf,EAAAC,cAACe,EAAa,CAACC,SAAU5D,IACvB2C,EAAAC,cAACiB,EAAc,CAAAC,MAAO/C,IACnBgD,EACCpB,EAAAC,cAACnF,EAAmB,CAAAuG,eAAYtF,UAAWA,EAAWuF,UAAW3B,IAC/DK,EAAAC,cAAA,MAAA,CAAK7E,IAAKiC,GAAcV,UAAW+D,EAAOrE,UAAWI,MAAO+C,GAAa+B,UAAW9C,IAClFuB,EAAAC,cAAA,MAAA,CAAA,cACeuB,EAAUC,EAAuBC,cAAerG,GAC7DsB,UAAW+D,EAAOiB,QAClBC,QAASrD,GAET,eAAA,IACFyB,EAAAC,cAAC4B,EAAa,CAAAC,cAAa,EAAA1G,IAAK+B,IAC9B6C,EAAAC,cAAA,MAAA,CACEtD,UAAWoF,EACTrB,EAAOsB,MACPtB,EAAO7B,IACPoD,EAASvB,EAAQwB,EAAU,QAAU1G,IAAM2G,EACxCzB,GAAAA,EAAO0B,mBAAqB3G,GAC/BkB,GAEFtB,GAAIA,EACS,cAAAuB,GAAc4E,EAAUC,EAAuBY,MAAOhH,GAAG,YAC3DiH,EAAgBD,MAC3BE,KAAK,SAAQ,cAAA,EAAA,kBAEI1F,GAAkBa,GACjB,mBAAAZ,GAAmBgB,GACrCrB,MAAK+F,OAAAC,OAAAD,OAAAC,OAAA,GAAOhG,GAAUyC,IACtBwD,UAAW,GAEVlG,EACDwD,EAAAC,cAAC0C,EAAe,CACdC,aAAcnH,EACdoH,MAAOnH,EACPC,qBAAsBA,EACtBE,QAASA,QAMnBkB,KAMZ"}
1
+ {"version":3,"file":"Modal.js","sources":["../../../../../src/components/Modal/Modal/Modal.tsx"],"sourcesContent":["import React, { forwardRef, useCallback, useMemo, useRef, useState } from \"react\";\nimport cx from \"classnames\";\nimport { RemoveScroll } from \"react-remove-scroll\";\nimport FocusLock from \"react-focus-lock\";\nimport { CSSTransition } from \"react-transition-group\";\nimport { getTestId } from \"../../../tests/test-ids-utils\";\nimport { ComponentDefaultTestId, ComponentVibeId } from \"../../../tests/constants\";\nimport styles from \"./Modal.module.scss\";\nimport { type ModalProps } from \"./Modal.types\";\nimport ModalTopActions from \"../ModalTopActions/ModalTopActions\";\nimport { getStyle, useMergeRef } from \"@vibe/shared\";\nimport { camelCase } from \"es-toolkit\";\nimport { ModalProvider } from \"../context/ModalContext\";\nimport { type ModalProviderValue } from \"../context/ModalContext.types\";\nimport { keyCodes } from \"../../../constants\";\nimport { createPortal } from \"react-dom\";\nimport usePortalTarget from \"../hooks/usePortalTarget/usePortalTarget\";\nimport useFocusEscapeTargets from \"../hooks/useFocusEscapeTargets/useFocusEscapeTargets\";\nimport { LayerProvider } from \"@vibe/layer\";\n\n// @ts-expect-error This is a precaution to support all possible module systems (ESM/CJS)\nconst FocusLockComponent = (FocusLock.default || FocusLock) as typeof FocusLock;\n\nconst Modal = forwardRef(\n (\n {\n id,\n show,\n size = \"medium\",\n renderHeaderAction,\n closeButtonTheme,\n closeButtonAriaLabel,\n onClose = () => {},\n autoFocus = true,\n allowFocusEscapeTo,\n onFocusAttempt,\n anchorElementRef,\n alertModal,\n container = document.body,\n children,\n style,\n zIndex,\n useFixedPosition = false,\n className,\n \"data-testid\": dataTestId,\n \"aria-labelledby\": ariaLabelledby,\n \"aria-describedby\": ariaDescribedby\n }: ModalProps,\n ref: React.ForwardedRef<HTMLDivElement>\n ) => {\n const portalTargetElement = usePortalTarget(container);\n\n const modalRef = useRef<HTMLDivElement>(null);\n const modalMergedRef = useMergeRef<HTMLDivElement>(ref, modalRef);\n const containerRef = useRef<HTMLDivElement>(null);\n\n const [titleId, setTitleId] = useState<string>();\n const [descriptionId, setDescriptionId] = useState<string>();\n\n const setTitleIdCallback = useCallback(\n (newId: string) => {\n if (ariaLabelledby) return;\n setTitleId(newId);\n },\n [ariaLabelledby]\n );\n const setDescriptionIdCallback = useCallback(\n (newId: string) => {\n if (ariaDescribedby) return;\n setDescriptionId(newId);\n },\n [ariaDescribedby]\n );\n\n const contextValue = useMemo<ModalProviderValue>(\n () => ({\n modalId: id,\n setTitleId: setTitleIdCallback,\n setDescriptionId: setDescriptionIdCallback,\n autoFocus\n }),\n [id, setTitleIdCallback, setDescriptionIdCallback, autoFocus]\n );\n\n const onBackdropClick = useCallback<React.MouseEventHandler<HTMLDivElement>>(\n e => {\n if (!show || alertModal) return;\n onClose(e);\n },\n [show, alertModal, onClose]\n );\n\n const onModalKeyDown = useCallback<React.KeyboardEventHandler<HTMLDivElement>>(\n e => {\n if (e.key !== keyCodes.ESCAPE || !show || alertModal) return;\n onClose(e);\n },\n [alertModal, onClose, show]\n );\n\n const animationType = size === \"full-view\" ? \"fullView\" : anchorElementRef?.current ? \"anchorPop\" : \"centerPop\";\n\n const anchorRect = anchorElementRef?.current?.getBoundingClientRect();\n const anchorVars = anchorRect\n ? ({\n \"--modal-start-x\": `${anchorRect.left + anchorRect.width / 2}px`,\n \"--modal-start-y\": `${anchorRect.top + anchorRect.height / 2}px`\n } as React.CSSProperties)\n : {};\n\n const zIndexStyle = zIndex ? ({ \"--monday-modal-z-index\": zIndex } as React.CSSProperties) : {};\n\n const shouldAllowFocusEscape = useFocusEscapeTargets(allowFocusEscapeTo);\n\n /**\n * Returning true means that the focus-lock is allowed to manage the element.\n * Returning false means that the focus-lock would surrender control to the element.\n */\n const handleFocusLockWhiteList = useCallback(\n (nextFocusedElement?: HTMLElement) => {\n if (onFocusAttempt) {\n const outcome = onFocusAttempt(nextFocusedElement);\n\n if (outcome === true) return true;\n\n if (outcome instanceof HTMLElement) {\n outcome.focus();\n return false;\n }\n\n return false;\n }\n\n return !shouldAllowFocusEscape(nextFocusedElement);\n },\n [onFocusAttempt, shouldAllowFocusEscape]\n );\n\n return (\n <CSSTransition\n in={show}\n nodeRef={containerRef}\n timeout={{ enter: 250, exit: 150 }}\n unmountOnExit\n classNames={{\n enter: styles.containerEnter,\n enterActive: styles.containerEnterActive,\n exitActive: styles.containerExitActive\n }}\n >\n <LayerProvider layerRef={containerRef}>\n <ModalProvider value={contextValue}>\n {createPortal(\n <FocusLockComponent returnFocus autoFocus={autoFocus} whiteList={handleFocusLockWhiteList}>\n <div ref={containerRef} className={styles.container} style={zIndexStyle} onKeyDown={onModalKeyDown}>\n <div\n data-testid={getTestId(ComponentDefaultTestId.MODAL_OVERLAY, id)}\n className={styles.overlay}\n onClick={onBackdropClick}\n aria-hidden\n />\n <RemoveScroll forwardProps ref={modalMergedRef}>\n <div\n className={cx(\n styles.modal,\n styles[animationType],\n getStyle(styles, camelCase(\"size-\" + size)),\n { [styles.withHeaderAction]: !!renderHeaderAction },\n { [styles.fixedPosition]: useFixedPosition },\n className\n )}\n id={id}\n data-testid={dataTestId || getTestId(ComponentDefaultTestId.MODAL, id)}\n data-vibe={ComponentVibeId.MODAL}\n role=\"dialog\"\n aria-modal\n aria-labelledby={ariaLabelledby || titleId}\n aria-describedby={ariaDescribedby || descriptionId}\n style={{ ...style, ...anchorVars }}\n tabIndex={-1}\n >\n {children}\n <ModalTopActions\n renderAction={renderHeaderAction}\n theme={closeButtonTheme}\n closeButtonAriaLabel={closeButtonAriaLabel}\n onClose={onClose}\n />\n </div>\n </RemoveScroll>\n </div>\n </FocusLockComponent>,\n portalTargetElement\n )}\n </ModalProvider>\n </LayerProvider>\n </CSSTransition>\n );\n }\n);\n\nexport default Modal;\n"],"names":["FocusLockComponent","FocusLock","default","Modal","forwardRef","_ref","ref","id","show","_ref$size","size","renderHeaderAction","closeButtonTheme","closeButtonAriaLabel","_ref$onClose","onClose","_ref$autoFocus","autoFocus","allowFocusEscapeTo","onFocusAttempt","anchorElementRef","alertModal","_ref$container","container","document","body","children","style","zIndex","_ref$useFixedPosition","useFixedPosition","className","dataTestId","ariaLabelledby","ariaDescribedby","portalTargetElement","usePortalTarget","modalRef","useRef","modalMergedRef","useMergeRef","containerRef","_useState","useState","_useState2","_slicedToArray","titleId","setTitleId","_useState3","_useState4","descriptionId","setDescriptionId","setTitleIdCallback","useCallback","newId","setDescriptionIdCallback","contextValue","useMemo","modalId","onBackdropClick","e","onModalKeyDown","key","keyCodes","ESCAPE","animationType","current","anchorRect","_a","getBoundingClientRect","anchorVars","concat","left","width","top","height","zIndexStyle","shouldAllowFocusEscape","useFocusEscapeTargets","handleFocusLockWhiteList","nextFocusedElement","outcome","HTMLElement","focus","React","createElement","CSSTransition","in","nodeRef","timeout","enter","exit","unmountOnExit","classNames","styles","containerEnter","enterActive","containerEnterActive","exitActive","containerExitActive","LayerProvider","layerRef","ModalProvider","value","createPortal","returnFocus","whiteList","onKeyDown","getTestId","ComponentDefaultTestId","MODAL_OVERLAY","overlay","onClick","RemoveScroll","forwardProps","cx","modal","getStyle","camelCase","_defineProperty","withHeaderAction","fixedPosition","MODAL","ComponentVibeId","role","Object","assign","tabIndex","ModalTopActions","renderAction","theme"],"mappings":"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"}
@@ -1,2 +1,2 @@
1
- var n={container:"container_2c17432afb",overlay:"overlay_30af0e6a6d",centerPop:"centerPop_2c86ce8eb2",anchorPop:"anchorPop_2c86ce8eb2",modal:"modal_78b1b46489",withHeaderAction:"withHeaderAction_7d2ef0af17",sizeSmall:"sizeSmall_cce4d83593",sizeMedium:"sizeMedium_f14b85ee34",sizeLarge:"sizeLarge_927d996852",sizeFullView:"sizeFullView_d63be9af46",containerEnter:"containerEnter_1089ba10aa",fullView:"fullView_ec582d08fb",containerEnterActive:"containerEnterActive_bd48767a5d",centerPopIn:"centerPopIn_a22e7153d8",anchorPopIn:"anchorPopIn_1860790302",fullViewIn:"fullViewIn_41e2d95fc8",containerExitActive:"containerExitActive_01c6737426",centerPopOut:"centerPopOut_6dad5e28ed",anchorPopOut:"anchorPopOut_207e1c4394",fullViewOut:"fullViewOut_ba2770f539"};!function(n){const e="s_id-025304351d4e_4_3_0";if("undefined"!=typeof document){const a=document.head||document.getElementsByTagName("head")[0];if(a.querySelector("#"+e))return;const t=document.createElement("style");t.id=e,a.firstChild?a.insertBefore(t,a.firstChild):a.appendChild(t),t.appendChild(document.createTextNode(n))}else globalThis.injectedStyles&&(globalThis.injectedStyles[e]=n)}(".container_2c17432afb {\n position: fixed;\n inset: 0;\n z-index: var(--monday-modal-z-index, 10000);\n}\n\n.overlay_30af0e6a6d {\n position: fixed;\n inset: 0;\n height: 100%;\n background-color: var(--backdrop-color);\n}\n\n.centerPop_2c86ce8eb2 {\n transform: translate(-50%, -50%);\n}\n\n.anchorPop_2c86ce8eb2 {\n transform: translate(-50%, -50%);\n}\n\n.modal_78b1b46489 {\n --top-actions-margin-inline: var(--space-24);\n --top-actions-margin-block: var(--space-24);\n --top-actions-width: var(--space-32);\n --modal-inline-padding: var(--space-32);\n position: relative;\n top: 50%;\n left: 50%;\n display: flex;\n flex-direction: column;\n width: var(--modal-width);\n max-height: var(--modal-max-height);\n background-color: var(--primary-background-color);\n overflow: hidden;\n border-radius: var(--border-radius-big);\n box-shadow: var(--box-shadow-large);\n outline: none;\n}\n\n.modal_78b1b46489.withHeaderAction_7d2ef0af17 {\n --top-actions-width: calc(var(--space-32) * 2);\n}\n\n.modal_78b1b46489.sizeSmall_cce4d83593 {\n --modal-max-height: 50%;\n --modal-width: 460px;\n}\n\n.modal_78b1b46489.sizeMedium_f14b85ee34 {\n --modal-max-height: 80%;\n --modal-width: 540px;\n}\n\n.modal_78b1b46489.sizeLarge_927d996852 {\n --modal-max-height: 80%;\n --modal-width: 800px;\n}\n\n.modal_78b1b46489.sizeFullView_d63be9af46 {\n --top-actions-margin-inline: var(--space-32);\n --modal-max-height: 100%;\n --modal-width: auto;\n position: fixed;\n inset: 0;\n height: calc(100% - 40px);\n margin-inline: var(--space-24);\n margin-block-start: 40px;\n border-end-start-radius: unset;\n border-end-end-radius: unset;\n}\n\n@media (min-width: 1280px) {\n .modal_78b1b46489.sizeSmall_cce4d83593 {\n --modal-width: 480px;\n }\n .modal_78b1b46489.sizeMedium_f14b85ee34 {\n --modal-width: 580px;\n }\n .modal_78b1b46489.sizeLarge_927d996852 {\n --modal-width: 840px;\n }\n}\n\n@media (min-width: 1440px) {\n .modal_78b1b46489.sizeSmall_cce4d83593 {\n --modal-width: 520px;\n }\n .modal_78b1b46489.sizeMedium_f14b85ee34 {\n --modal-width: 620px;\n }\n .modal_78b1b46489.sizeLarge_927d996852 {\n --modal-width: 900px;\n }\n}\n\n@media (min-width: 1720px) {\n .modal_78b1b46489.sizeFullView_d63be9af46 {\n margin-inline: 40px;\n }\n}\n\n.containerEnter_1089ba10aa .overlay_30af0e6a6d {\n opacity: 0;\n}\n\n.containerEnter_1089ba10aa .centerPop_2c86ce8eb2 {\n opacity: 0;\n transform: translate(-50%, -50%) scale(0.8);\n}\n\n.containerEnter_1089ba10aa .anchorPop_2c86ce8eb2 {\n opacity: 0;\n transform: translate(calc(-50% + var(--modal-start-x, 0px)), calc(-50% + var(--modal-start-y, 0px))) scale(0.8);\n}\n\n.containerEnter_1089ba10aa .fullView_ec582d08fb {\n opacity: 0.3;\n transform: translateY(30px);\n}\n\n.containerEnterActive_bd48767a5d .overlay_30af0e6a6d {\n opacity: 1;\n transition: opacity 100ms cubic-bezier(0, 0, 0.4, 1);\n}\n\n.containerEnterActive_bd48767a5d .centerPop_2c86ce8eb2 {\n animation: centerPopIn_a22e7153d8 150ms cubic-bezier(0, 0, 0.4, 1) forwards;\n}\n\n.containerEnterActive_bd48767a5d .anchorPop_2c86ce8eb2 {\n animation: anchorPopIn_1860790302 200ms cubic-bezier(0, 0, 0.4, 1) forwards;\n}\n\n.containerEnterActive_bd48767a5d .fullView_ec582d08fb {\n animation: fullViewIn_41e2d95fc8 250ms cubic-bezier(0, 0, 0.4, 1) forwards;\n}\n\n.containerExitActive_01c6737426 .overlay_30af0e6a6d {\n opacity: 0;\n transition: opacity 100ms cubic-bezier(0.6, 0, 1, 1);\n}\n\n.containerExitActive_01c6737426 .centerPop_2c86ce8eb2 {\n animation: centerPopOut_6dad5e28ed 100ms cubic-bezier(0.6, 0, 1, 1) forwards;\n}\n\n.containerExitActive_01c6737426 .anchorPop_2c86ce8eb2 {\n animation: anchorPopOut_207e1c4394 150ms cubic-bezier(0.6, 0, 1, 1) forwards;\n}\n\n.containerExitActive_01c6737426 .fullView_ec582d08fb {\n animation: fullViewOut_ba2770f539 100ms cubic-bezier(0.6, 0, 1, 1) forwards;\n}\n\n@keyframes centerPopIn_a22e7153d8 {\n 0% {\n opacity: 0;\n transform: translate(-50%, -50%) scale(0.8);\n }\n 50%, 100% {\n opacity: 1;\n transform: translate(-50%, -50%) scale(1);\n }\n}\n\n@keyframes centerPopOut_6dad5e28ed {\n 0%, 50% {\n opacity: 1;\n transform: translate(-50%, -50%) scale(1);\n }\n 100% {\n opacity: 0;\n transform: translate(-50%, -50%) scale(0.8);\n }\n}\n\n@keyframes anchorPopIn_1860790302 {\n 0%, 40% {\n opacity: 0;\n transform: translate(calc(-50% + var(--modal-start-x, 0px)), calc(-50% + var(--modal-start-y, 0px))) scale(0.8);\n }\n 100% {\n opacity: 1;\n transform: translate(-50%, -50%) scale(1);\n }\n}\n\n@keyframes anchorPopOut_207e1c4394 {\n 0% {\n opacity: 1;\n transform: translate(-50%, -50%) scale(1);\n }\n 60%, 100% {\n opacity: 0;\n transform: translate(calc(-50% + var(--modal-start-x, 0px)), calc(-50% + var(--modal-start-y, 0px))) scale(0.8);\n }\n}\n\n@keyframes fullViewIn_41e2d95fc8 {\n 0% {\n opacity: 0.3;\n transform: translateY(30px);\n }\n 33% {\n opacity: 1;\n }\n 100% {\n opacity: 1;\n transform: translateY(0);\n }\n}\n\n@keyframes fullViewOut_ba2770f539 {\n from {\n opacity: 1;\n transform: translateY(0);\n }\n to {\n opacity: 0;\n transform: translateY(30px);\n }\n}");export{n as default};
1
+ var n={container:"container_2c17432afb",overlay:"overlay_30af0e6a6d",centerPop:"centerPop_2c86ce8eb2",anchorPop:"anchorPop_2c86ce8eb2",modal:"modal_78b1b46489",fixedPosition:"fixedPosition_53e30efdf2",withHeaderAction:"withHeaderAction_7d2ef0af17",sizeSmall:"sizeSmall_cce4d83593",sizeMedium:"sizeMedium_f14b85ee34",sizeLarge:"sizeLarge_927d996852",sizeFullView:"sizeFullView_d63be9af46",containerEnter:"containerEnter_1089ba10aa",fullView:"fullView_ec582d08fb",containerEnterActive:"containerEnterActive_bd48767a5d",centerPopIn:"centerPopIn_a22e7153d8",anchorPopIn:"anchorPopIn_1860790302",fullViewIn:"fullViewIn_41e2d95fc8",containerExitActive:"containerExitActive_01c6737426",centerPopOut:"centerPopOut_6dad5e28ed",anchorPopOut:"anchorPopOut_207e1c4394",fullViewOut:"fullViewOut_ba2770f539"};!function(n){const e="s_id-72e80303fba3_4_3_0";if("undefined"!=typeof document){const a=document.head||document.getElementsByTagName("head")[0];if(a.querySelector("#"+e))return;const t=document.createElement("style");t.id=e,a.firstChild?a.insertBefore(t,a.firstChild):a.appendChild(t),t.appendChild(document.createTextNode(n))}else globalThis.injectedStyles&&(globalThis.injectedStyles[e]=n)}(".container_2c17432afb {\n position: fixed;\n inset: 0;\n z-index: var(--monday-modal-z-index, 10000);\n}\n\n.overlay_30af0e6a6d {\n position: fixed;\n inset: 0;\n height: 100%;\n background-color: var(--backdrop-color);\n}\n\n.centerPop_2c86ce8eb2 {\n transform: translate(-50%, -50%);\n}\n\n.anchorPop_2c86ce8eb2 {\n transform: translate(-50%, -50%);\n}\n\n.modal_78b1b46489 {\n --top-actions-margin-inline: var(--space-24);\n --top-actions-margin-block: var(--space-24);\n --top-actions-width: var(--space-32);\n --modal-inline-padding: var(--space-32);\n position: relative;\n top: 50%;\n left: 50%;\n display: flex;\n flex-direction: column;\n width: var(--modal-width);\n max-height: var(--modal-max-height);\n background-color: var(--primary-background-color);\n overflow: hidden;\n border-radius: var(--border-radius-big);\n box-shadow: var(--box-shadow-large);\n outline: none;\n}\n\n.modal_78b1b46489.fixedPosition_53e30efdf2 {\n position: fixed;\n}\n\n.modal_78b1b46489.withHeaderAction_7d2ef0af17 {\n --top-actions-width: calc(var(--space-32) * 2);\n}\n\n.modal_78b1b46489.sizeSmall_cce4d83593 {\n --modal-max-height: 50%;\n --modal-width: 460px;\n}\n\n.modal_78b1b46489.sizeMedium_f14b85ee34 {\n --modal-max-height: 80%;\n --modal-width: 540px;\n}\n\n.modal_78b1b46489.sizeLarge_927d996852 {\n --modal-max-height: 80%;\n --modal-width: 800px;\n}\n\n.modal_78b1b46489.sizeFullView_d63be9af46 {\n --top-actions-margin-inline: var(--space-32);\n --modal-max-height: 100%;\n --modal-width: auto;\n position: fixed;\n inset: 0;\n height: calc(100% - 40px);\n margin-inline: var(--space-24);\n margin-block-start: 40px;\n border-end-start-radius: unset;\n border-end-end-radius: unset;\n}\n\n@media (min-width: 1280px) {\n .modal_78b1b46489.sizeSmall_cce4d83593 {\n --modal-width: 480px;\n }\n .modal_78b1b46489.sizeMedium_f14b85ee34 {\n --modal-width: 580px;\n }\n .modal_78b1b46489.sizeLarge_927d996852 {\n --modal-width: 840px;\n }\n}\n\n@media (min-width: 1440px) {\n .modal_78b1b46489.sizeSmall_cce4d83593 {\n --modal-width: 520px;\n }\n .modal_78b1b46489.sizeMedium_f14b85ee34 {\n --modal-width: 620px;\n }\n .modal_78b1b46489.sizeLarge_927d996852 {\n --modal-width: 900px;\n }\n}\n\n@media (min-width: 1720px) {\n .modal_78b1b46489.sizeFullView_d63be9af46 {\n margin-inline: 40px;\n }\n}\n\n.containerEnter_1089ba10aa .overlay_30af0e6a6d {\n opacity: 0;\n}\n\n.containerEnter_1089ba10aa .centerPop_2c86ce8eb2 {\n opacity: 0;\n transform: translate(-50%, -50%) scale(0.8);\n}\n\n.containerEnter_1089ba10aa .anchorPop_2c86ce8eb2 {\n opacity: 0;\n transform: translate(calc(-50% + var(--modal-start-x, 0px)), calc(-50% + var(--modal-start-y, 0px))) scale(0.8);\n}\n\n.containerEnter_1089ba10aa .fullView_ec582d08fb {\n opacity: 0.3;\n transform: translateY(30px);\n}\n\n.containerEnterActive_bd48767a5d .overlay_30af0e6a6d {\n opacity: 1;\n transition: opacity 100ms cubic-bezier(0, 0, 0.4, 1);\n}\n\n.containerEnterActive_bd48767a5d .centerPop_2c86ce8eb2 {\n animation: centerPopIn_a22e7153d8 150ms cubic-bezier(0, 0, 0.4, 1) forwards;\n}\n\n.containerEnterActive_bd48767a5d .anchorPop_2c86ce8eb2 {\n animation: anchorPopIn_1860790302 200ms cubic-bezier(0, 0, 0.4, 1) forwards;\n}\n\n.containerEnterActive_bd48767a5d .fullView_ec582d08fb {\n animation: fullViewIn_41e2d95fc8 250ms cubic-bezier(0, 0, 0.4, 1) forwards;\n}\n\n.containerExitActive_01c6737426 .overlay_30af0e6a6d {\n opacity: 0;\n transition: opacity 100ms cubic-bezier(0.6, 0, 1, 1);\n}\n\n.containerExitActive_01c6737426 .centerPop_2c86ce8eb2 {\n animation: centerPopOut_6dad5e28ed 100ms cubic-bezier(0.6, 0, 1, 1) forwards;\n}\n\n.containerExitActive_01c6737426 .anchorPop_2c86ce8eb2 {\n animation: anchorPopOut_207e1c4394 150ms cubic-bezier(0.6, 0, 1, 1) forwards;\n}\n\n.containerExitActive_01c6737426 .fullView_ec582d08fb {\n animation: fullViewOut_ba2770f539 100ms cubic-bezier(0.6, 0, 1, 1) forwards;\n}\n\n@keyframes centerPopIn_a22e7153d8 {\n 0% {\n opacity: 0;\n transform: translate(-50%, -50%) scale(0.8);\n }\n 50%, 100% {\n opacity: 1;\n transform: translate(-50%, -50%) scale(1);\n }\n}\n\n@keyframes centerPopOut_6dad5e28ed {\n 0%, 50% {\n opacity: 1;\n transform: translate(-50%, -50%) scale(1);\n }\n 100% {\n opacity: 0;\n transform: translate(-50%, -50%) scale(0.8);\n }\n}\n\n@keyframes anchorPopIn_1860790302 {\n 0%, 40% {\n opacity: 0;\n transform: translate(calc(-50% + var(--modal-start-x, 0px)), calc(-50% + var(--modal-start-y, 0px))) scale(0.8);\n }\n 100% {\n opacity: 1;\n transform: translate(-50%, -50%) scale(1);\n }\n}\n\n@keyframes anchorPopOut_207e1c4394 {\n 0% {\n opacity: 1;\n transform: translate(-50%, -50%) scale(1);\n }\n 60%, 100% {\n opacity: 0;\n transform: translate(calc(-50% + var(--modal-start-x, 0px)), calc(-50% + var(--modal-start-y, 0px))) scale(0.8);\n }\n}\n\n@keyframes fullViewIn_41e2d95fc8 {\n 0% {\n opacity: 0.3;\n transform: translateY(30px);\n }\n 33% {\n opacity: 1;\n }\n 100% {\n opacity: 1;\n transform: translateY(0);\n }\n}\n\n@keyframes fullViewOut_ba2770f539 {\n from {\n opacity: 1;\n transform: translateY(0);\n }\n to {\n opacity: 0;\n transform: translateY(30px);\n }\n}");export{n as default};
2
2
  //# sourceMappingURL=Modal.module.scss.js.map
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "@vibe/core",
3
- "version": "4.4.0-alpha-26200.0",
3
+ "version": "4.4.0",
4
4
  "description": "Official monday.com UI resources for application development in React.js",
5
5
  "repository": {
6
6
  "type": "git",
@@ -275,5 +275,5 @@
275
275
  "browserslist": [
276
276
  "extends browserslist-config-monday"
277
277
  ],
278
- "gitHead": "e9e60eea61c66008a67ce4af557b208bc286cc12"
278
+ "gitHead": "0129b83c36dd663f79d05ac9b852d2b1a4df96bf"
279
279
  }
@@ -1,50 +0,0 @@
1
- # Storybook Code Examples
2
-
3
- ## TextInputBasic
4
-
5
- ```tsx
6
- const options = useMemo(() => [{
7
- value: "1",
8
- label: "Chip one"
9
- }, {
10
- value: "2",
11
- label: "Chip two"
12
- }, {
13
- value: "3",
14
- label: "Chip three"
15
- }, {
16
- value: "4",
17
- label: "Chip four"
18
- }], []);
19
- return <div style={{
20
- width: "350px",
21
- marginBottom: "50px"
22
- }}>
23
- <Dropdown placeholder="Select items" options={options} multi searchable textInput clearAriaLabel="Clear" />
24
- </div>;
25
- ```
26
-
27
- ## InteractiveChipsBasic
28
-
29
- ```tsx
30
- const options = useMemo(() => [{
31
- value: "1",
32
- label: "Chip one"
33
- }, {
34
- value: "2",
35
- label: "Chip two"
36
- }, {
37
- value: "3",
38
- label: "Chip three"
39
- }, {
40
- value: "4",
41
- label: "Chip four"
42
- }], []);
43
- return <div style={{
44
- width: "350px",
45
- marginBottom: "50px"
46
- }}>
47
- <Dropdown placeholder="Select items" options={options} multi searchable interactiveChips clearAriaLabel="Clear" />
48
- </div>;
49
- ```
50
-