@ironsource/shared-ui 2.0.0-rc.5 → 2.0.0-rc.6

package/index.js

@@ -1,26 +1,23 @@
 import './MenuItem.vue_vue_type_style_index_0_scoped_c7e837fa_lang.css';
-import { AppTriggerTypes as c } from "./components/appTrigger/index.js";
-import { AutocompleteDropdownTypes as b } from "./components/autocompleteDropdown/index.js";
-import { MenuItemTypes as I } from "./components/menuItem/index.js";
-import { MenuTypes as $ } from "./components/menu/index.js";
-import { AppIconTypes as F } from "./components/appIcon/index.js";
-import { RadioButtonTypes as C } from "./components/radioButton/index.js";
-import { Snackbar as B } from "./components/snackbar/index.js";
-import { FloatingToolbarTypes as P } from "./components/floatingToolbar/index.js";
-import { IncludeExcludeTypes as w } from "./components/includeExclude/index.js";
-import { CssBaselineTypes as H } from "./components/cssBaseline/index.js";
-import { ID_INJECTION_KEY as v, useId as N } from "./composables/useId.js";
-import { EmptyStateTypes as G } from "./components/emptyState/index.js";
-import { TableTypes as K } from "./components/table/index.js";
-import { DialogTypes as Y } from "./components/dialog/index.js";
-import { FilterPanelTypes as q } from "./components/filtersPanel/index.js";
-import { FilterDropdownTypes as L } from "./components/filterDropdown/index.js";
-import { TabsTypes as U } from "./components/tabs/index.js";
-import { CheckboxTypes as X } from "./components/checkbox/index.js";
-import { SkeletonTypes as ee } from "./components/skeleton/index.js";
-import { TypographyTypes as re } from "./components/typography/index.js";
-import { TypographyTypesV4 as pe } from "./components/typography/v4/index.js";
-import { PopoverTypes as fe } from "./components/popover/index.js";
+import { AppTriggerTypes as C } from "./components/appTrigger/index.js";
+import { AutocompleteDropdownTypes as P } from "./components/autocompleteDropdown/index.js";
+import { MenuItemTypes as S } from "./components/menuItem/index.js";
+import { MenuTypes as H } from "./components/menu/index.js";
+import { AppIconTypes as v } from "./components/appIcon/index.js";
+import { RadioButtonTypes as _ } from "./components/radioButton/index.js";
+import { Snackbar as q } from "./components/snackbar/index.js";
+import { FloatingToolbarTypes as J } from "./components/floatingToolbar/index.js";
+import { IncludeExcludeTypes as V } from "./components/includeExclude/index.js";
+import { CssBaselineTypes as z } from "./components/cssBaseline/index.js";
+import { ID_INJECTION_KEY as Q, useId as U } from "./composables/useId.js";
+import { FilterPanelTypes as X } from "./components/filtersPanel/index.js";
+import { FilterDropdownTypes as ee } from "./components/filterDropdown/index.js";
+import { CheckboxTypes as re } from "./components/checkbox/index.js";
+import { SkeletonTypes as pe } from "./components/skeleton/index.js";
+import { TypographyTypes as fe } from "./components/typography/index.js";
+import { TypographyTypesV4 as xe } from "./components/typography/v4/index.js";
+import { PopoverTypes as de } from "./components/popover/index.js";
+import { MultiBarTypes as le } from "./components/multibar/index.js";
 import * as e from "./components/button/v3/index.js";
 import * as o from "./components/button/v4/index.js";
 import * as r from "./components/chip/v3/index.js";
@@ -31,62 +28,64 @@ import * as f from "./components/dropdown/v3/index.js";
 import * as m from "./components/dropdown/v4/index.js";
 import * as x from "./components/search/v3/index.js";
 import * as s from "./components/search/v4/index.js";
-import * as l from "./components/icon/v3/index.js";
-import * as d from "./components/icon/v4/index.js";
-import * as u from "./components/input/v3/index.js";
-import * as i from "./components/input/v4/index.js";
-import { ToggleTypes as xe } from "./components/toggle/index.js";
-import { TooltipTypes as le } from "./components/tooltip/index.js";
-import { TextAreaTypes as ue } from "./components/textArea/index.js";
-import { EditableTypes as ne } from "./components/table-cells/index.js";
-import { useToggle as ye } from "./composables/useToggle.js";
-import { useSearch as ge } from "./composables/useSearch.js";
-import { DateRangeTypes as Ee } from "./components/dateRange/index.js";
-import { DatePickerTypes as De } from "./components/datePicker/index.js";
-import { BannerTypes as Ae } from "./components/banner/index.js";
-import { default as ke } from "./components/appTrigger/AppTrigger.vue.js";
-import { default as he } from "./components/autocompleteDropdown/AutocompleteDropdown.vue.js";
-import { default as Se } from "./components/menuItem/MenuItem.vue.js";
-import { default as Re } from "./components/menu/Menu.vue.js";
-import { default as Me } from "./components/appIcon/AppIcon.vue.js";
-import { default as Oe } from "./components/radioButton/RadioButton.vue.js";
-import { default as Ne } from "./components/radioButton/RadioGroup.vue.js";
+import * as d from "./components/icon/v3/index.js";
+import * as i from "./components/icon/v4/index.js";
+import * as l from "./components/input/v3/index.js";
+import * as n from "./components/input/v4/index.js";
+import * as u from "./components/tabs/v3/index.js";
+import * as T from "./components/tabs/v4/index.js";
+import * as c from "./components/dialog/v3/index.js";
+import * as y from "./components/dialog/v4/index.js";
+import * as $ from "./components/tooltip/v3/index.js";
+import * as g from "./components/tooltip/v4/index.js";
+import * as I from "./components/table/v3/index.js";
+import * as D from "./components/table/v4/index.js";
+import * as A from "./components/table-cells/v3/index.js";
+import * as E from "./components/table-cells/v4/index.js";
+import * as k from "./components/emptyState/v3/index.js";
+import * as F from "./components/emptyState/v4/index.js";
+import { ToggleTypes as ue } from "./components/toggle/v3/index.js";
+import { TextAreaTypes as ce } from "./components/textArea/index.js";
+import { useToggle as $e } from "./composables/useToggle.js";
+import { useSearch as Ie } from "./composables/useSearch.js";
+import { DateRangeTypes as Ae } from "./components/dateRange/index.js";
+import { DatePickerTypes as ke } from "./components/datePicker/index.js";
+import { BannerTypes as be } from "./components/banner/index.js";
+import { default as Be } from "./components/appTrigger/AppTrigger.vue.js";
+import { default as Me } from "./components/autocompleteDropdown/AutocompleteDropdown.vue.js";
+import { default as Re } from "./components/menuItem/MenuItem.vue.js";
+import { default as we } from "./components/menu/Menu.vue.js";
+import { default as Oe } from "./components/appIcon/AppIcon.vue.js";
+import { default as Ne } from "./components/radioButton/RadioButton.vue.js";
+import { default as je } from "./components/radioButton/RadioGroup.vue.js";
 import { snackbarEmits as Ge, snackbarTypes as Je } from "./components/snackbar/snackbar.types.js";
 import { default as Ve } from "./components/floatingToolbar/FloatingToolbar.vue.js";
-import { default as je } from "./components/includeExclude/IncludeExclude.vue.js";
-import { default as ze } from "./components/includeExclude/IncludeExcludeDragDrop.vue.js";
-import { default as Qe } from "./components/includeExclude/IncludeExcludeOption.vue.js";
-import { default as We } from "./components/includeExclude/IncludeExcludeOptionDraggable.vue.js";
-import { default as Ze } from "./components/includeExclude/IncludeExcludeAppTrigger.vue.js";
-import { default as oo } from "./components/includeExclude/IncludeExcludeAppHeader.vue.js";
-import { default as to } from "./components/includeExclude/IncludeExcludeChipFilter.vue.js";
-import { default as ao } from "./components/cssBaseline/CssBaseline.vue.js";
-import { default as mo } from "./components/emptyState/EmptyState.vue.js";
-import { default as so } from "./components/table/Table.vue.js";
-import { TableContext as uo } from "./components/table/TableContext.js";
-import { default as no } from "./components/dialog/Dialog.vue.js";
-import { Reason as yo } from "./components/dialog/Reason.js";
-import { default as go } from "./components/filtersPanel/FiltersPanel.vue.js";
-import { default as Eo } from "./components/filtersPanel/FilterSearchInput.vue.js";
-import { useHiddenFilter as Do } from "./components/filtersPanel/useHiddenFilter.js";
-import { default as Ao } from "./components/filterDropdown/FilterDropdown.vue.js";
-import { default as ko } from "./components/filterDropdown/AddFilterButton.vue.js";
-import { default as ho } from "./components/tabs/Tabs.vue.js";
-import { default as So } from "./components/checkbox/Checkbox.vue.js";
-import { default as Ro } from "./components/skeleton/Skeleton.vue.js";
-import { default as Mo } from "./components/typography/Heading.vue.js";
-import { default as Oo } from "./components/typography/Text.vue.js";
-import { default as No } from "./components/typography/v4/Typography.vue.js";
-import { default as Go } from "./components/popover/Popover.vue.js";
-import { default as Ko } from "./components/toggle/Toggle.vue.js";
-import { default as Yo } from "./components/tooltip/Tooltip.vue.js";
-import { default as qo } from "./components/textArea/TextArea.vue.js";
-import { default as Lo } from "./components/table-cells/Editable.vue.js";
-import { EditableContext as Uo, useEditableContext as Wo } from "./components/table-cells/EditableContext.js";
-import { default as Zo } from "./components/dateRange/DateRange.vue.js";
-import { default as or } from "./components/datePicker/DatePicker.vue.js";
-import { default as tr } from "./components/banner/Banner.vue.js";
-const n = {
+import { default as ze } from "./components/includeExclude/IncludeExclude.vue.js";
+import { default as Qe } from "./components/includeExclude/IncludeExcludeDragDrop.vue.js";
+import { default as We } from "./components/includeExclude/IncludeExcludeOption.vue.js";
+import { default as Ze } from "./components/includeExclude/IncludeExcludeOptionDraggable.vue.js";
+import { default as oo } from "./components/includeExclude/IncludeExcludeAppTrigger.vue.js";
+import { default as to } from "./components/includeExclude/IncludeExcludeAppHeader.vue.js";
+import { default as ao } from "./components/includeExclude/IncludeExcludeChipFilter.vue.js";
+import { default as mo } from "./components/cssBaseline/CssBaseline.vue.js";
+import { default as so } from "./components/filtersPanel/FiltersPanel.vue.js";
+import { default as lo } from "./components/filtersPanel/FilterSearchInput.vue.js";
+import { useHiddenFilter as uo } from "./components/filtersPanel/useHiddenFilter.js";
+import { default as co } from "./components/filterDropdown/FilterDropdown.vue.js";
+import { default as $o } from "./components/filterDropdown/AddFilterButton.vue.js";
+import { default as Io } from "./components/checkbox/Checkbox.vue.js";
+import { default as Ao } from "./components/skeleton/Skeleton.vue.js";
+import { default as ko } from "./components/typography/Heading.vue.js";
+import { default as bo } from "./components/typography/Text.vue.js";
+import { default as Bo } from "./components/typography/v4/Typography.vue.js";
+import { default as Mo } from "./components/popover/Popover.vue.js";
+import { default as Ro } from "./components/multibar/MultiBar.vue.js";
+import { default as wo } from "./components/toggle/v3/Toggle.vue.js";
+import { default as Oo } from "./components/textArea/TextArea.vue.js";
+import { default as No } from "./components/dateRange/DateRange.vue.js";
+import { default as jo } from "./components/datePicker/DatePicker.vue.js";
+import { default as Go } from "./components/banner/Banner.vue.js";
+const b = {
   ...r,
   ...t,
   ...p,
@@ -97,87 +96,85 @@ const n = {
   ...m,
   ...x,
   ...s,
-  ...u,
-  ...i,
   ...l,
-  ...d
+  ...n,
+  ...d,
+  ...i,
+  ...u,
+  ...T,
+  ...c,
+  ...y,
+  ...$,
+  ...g,
+  ...I,
+  ...D,
+  ...A,
+  ...E,
+  ...k,
+  ...F
 };
 export {
-  ko as AddFilterButton,
-  Me as AppIcon,
-  F as AppIconTypes,
-  ke as AppTrigger,
-  c as AppTriggerTypes,
-  he as AutocompleteDropdown,
-  b as AutocompleteDropdownTypes,
-  tr as Banner,
-  Ae as BannerTypes,
-  So as Checkbox,
-  X as CheckboxTypes,
-  ao as CssBaseline,
-  H as CssBaselineTypes,
-  or as DatePicker,
-  De as DatePickerTypes,
-  Zo as DateRange,
-  Ee as DateRangeTypes,
-  no as Dialog,
-  Y as DialogTypes,
-  Lo as Editable,
-  Uo as EditableContext,
-  ne as EditableTypes,
-  mo as EmptyState,
-  G as EmptyStateTypes,
-  Ao as FilterDropdown,
-  L as FilterDropdownTypes,
-  q as FilterPanelTypes,
-  Eo as FilterSearchInput,
-  go as FiltersPanel,
+  $o as AddFilterButton,
+  Oe as AppIcon,
+  v as AppIconTypes,
+  Be as AppTrigger,
+  C as AppTriggerTypes,
+  Me as AutocompleteDropdown,
+  P as AutocompleteDropdownTypes,
+  Go as Banner,
+  be as BannerTypes,
+  Io as Checkbox,
+  re as CheckboxTypes,
+  mo as CssBaseline,
+  z as CssBaselineTypes,
+  jo as DatePicker,
+  ke as DatePickerTypes,
+  No as DateRange,
+  Ae as DateRangeTypes,
+  co as FilterDropdown,
+  ee as FilterDropdownTypes,
+  X as FilterPanelTypes,
+  lo as FilterSearchInput,
+  so as FiltersPanel,
   Ve as FloatingToolbar,
-  P as FloatingToolbarTypes,
-  Mo as Heading,
-  v as ID_INJECTION_KEY,
-  je as IncludeExclude,
-  oo as IncludeExcludeAppHeader,
-  Ze as IncludeExcludeAppTrigger,
-  to as IncludeExcludeChipFilter,
-  ze as IncludeExcludeDragDrop,
-  Qe as IncludeExcludeOption,
-  We as IncludeExcludeOptionDraggable,
-  w as IncludeExcludeTypes,
-  Re as Menu,
-  Se as MenuItem,
-  I as MenuItemTypes,
-  $ as MenuTypes,
-  Go as Popover,
-  fe as PopoverTypes,
-  Oe as RadioButton,
-  C as RadioButtonTypes,
-  Ne as RadioGroup,
-  yo as Reason,
-  Ro as Skeleton,
-  ee as SkeletonTypes,
-  B as Snackbar,
-  so as Table,
-  uo as TableContext,
-  K as TableTypes,
-  ho as Tabs,
-  U as TabsTypes,
-  Oo as Text,
-  qo as TextArea,
-  ue as TextAreaTypes,
-  Ko as Toggle,
-  xe as ToggleTypes,
-  Yo as Tooltip,
-  le as TooltipTypes,
-  No as Typography,
-  re as TypographyTypes,
-  pe as TypographyTypesV4,
-  n as default,
+  J as FloatingToolbarTypes,
+  ko as Heading,
+  Q as ID_INJECTION_KEY,
+  ze as IncludeExclude,
+  to as IncludeExcludeAppHeader,
+  oo as IncludeExcludeAppTrigger,
+  ao as IncludeExcludeChipFilter,
+  Qe as IncludeExcludeDragDrop,
+  We as IncludeExcludeOption,
+  Ze as IncludeExcludeOptionDraggable,
+  V as IncludeExcludeTypes,
+  we as Menu,
+  Re as MenuItem,
+  S as MenuItemTypes,
+  H as MenuTypes,
+  Ro as MultiBar,
+  le as MultiBarTypes,
+  Mo as Popover,
+  de as PopoverTypes,
+  Ne as RadioButton,
+  _ as RadioButtonTypes,
+  je as RadioGroup,
+  Ao as Skeleton,
+  pe as SkeletonTypes,
+  q as Snackbar,
+  bo as Text,
+  Oo as TextArea,
+  ce as TextAreaTypes,
+  wo as Toggle,
+  ue as ToggleTypes,
+  Bo as Typography,
+  fe as TypographyTypes,
+  xe as TypographyTypesV4,
+  b as default,
   Ge as snackbarEmits,
   Je as snackbarTypes,
-  Wo as useEditableContext,
-  Do as useHiddenFilter,
-  N as useId,
-  ge as useSearch,
-  ye as useToggle
+  uo as useHiddenFilter,
+  U as useId,
+  Ie as useSearch,
+  $e as useToggle
 };

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@ironsource/shared-ui",
-  "version": "2.0.0-rc.5",
+  "version": "2.0.0-rc.6",
   "engines": {
     "npm": ">=7.0.0",
     "node": ">=16.0.0"
@@ -10,8 +10,10 @@
     "build": "vite build && vue-tsc --declaration --emitDeclarationOnly --project tsconfig.build.json && node inject-css.js && sh ./scripts/build-styles.sh",
     "preview": "vite preview",
     "storybook": "StoryBookEnv=dev sb dev -p 6006",
+    "storybook:pw": "StoryBookEnv=dev STORYBOOK_PW=true sb dev -p 6006",
     "storybook:dist": "StoryBookEnv=prod sb dev -p 6006",
-    "build-storybook": "storybook build -o docs",
+    "storybook:dist:pw": "StoryBookEnv=prod STORYBOOK_PW=true sb dev -p 6006",
+    "build-storybook": "sb build -o docs",
     "serve-storybook": "RemoveAddons=true npm run build-storybook && http-server ./docs --port 6007",
     "serve-storybook-ci": "npx concurrently -s first -n 'SB,TEST' -c 'magenta,blue' 'npm run storybook:dist --silent' 'npx wait-on tcp:6006' ",
     "test-storybook": "test-storybook --maxWorkers=2",
@@ -42,7 +44,9 @@
     "deploy:html": "aws s3 cp ./docs/index.html s3://mobile-shared-ui-platform/$FOLDER/index.html  --cache-control='max-age=0, s-maxage=604800'",
     "cf:invalidate": "aws cloudfront create-invalidation --distribution-id E2H80TE9BVV9YO --paths  \"/$FOLDER/*\" ",
     "upload:visual": "aws s3 cp ./visual-tests s3://mobile-shared-ui-platform/visual-tests/$FOLDER  --recursive  --exclude '.gitkeep' ",
-    "release": "commit-and-tag-version"
+    "release": "commit-and-tag-version",
+    "pw:ci": "cd e2e/playwright && BASE_URL=http://localhost:6006/ npx playwright test --reporter=list",
+    "test-storybook-pw": "concurrently 'npm run storybook:dist:pw --silent' 'npx wait-on http://localhost:6006 && npm run pw:ci'  --kill-others --success first"
   },
   "dependencies": {
     "@phosphor-icons/vue": "^2.1.6",
@@ -150,34 +154,41 @@
     "./appIcon": "./components/appIcon/AppIcon.vue.js",
     "./switch": "./components/switch/v3/Switch.vue.js",
     "./switch/v4": "./components/switch/v4/SwitchV4.vue.js",
-    "./editable": "./components/table-cells/Editable.vue.js",
+    "./editable": "./components/table-cells/v3/Editable.vue.js",
+    "./editable/v4": "./components/table-cells/v4/EditableV4.vue.js",
     "./radioButton": "./components/radioButton/RadioButton.vue.js",
     "./radioGroup": "./components/radioButton/RadioGroup.vue.js",
     "./floatingToolbar": "./components/floatingToolbar/FloatingToolbar.vue.js",
     "./includeExclude": "./components/includeExclude/index.vue.js",
     "./cssBaseline": "./components/cssBaseline/CssBaseline.vue.js",
     "./snackbar": "./components/snackbar/index.vue.js",
-    "./emptyState": "./components/emptyState/EmptyState.vue.js",
-    "./table": "./components/table/Table.vue.js",
+    "./emptyState": "./components/emptyState/v3/EmptyState.vue.js",
+    "./emptyState/v4": "./components/emptyState/v4/EmptyStateV4.vue.js",
+    "./table": "./components/table/v3/Table.vue.js",
+    "./table/v4": "./components/table/v4/DataGrid.vue.js",
     "./dateRange": "./components/dateRange/DateRange.vue.js",
     "./datePicker": "./components/datePicker/DatePicker.vue.js",
-    "./dialog": "./components/dialog/Dialog.vue.js",
+    "./dialog": "./components/dialog/v3/Dialog.vue.js",
+    "./dialog/v4": "./components/dialog/v4/DialogV4.vue.js",
     "./dropdown": "./components/dropdown/v3/index.vue.js",
     "./dropdown/v4": "./components/dropdown/v4/index.vue.js",
     "./filterDropdown": "./components/filterDropdown/FilterDropdown.vue.js",
     "./filtersPanel": "./components/filtersPanel/index.vue.js",
-    "./tabs": "./components/tabs/Tabs.vue.js",
+    "./tabs": "./components/tabs/v3/Tabs.vue.js",
+    "./tabs/v4": "./components/tabs/v4/TabsV4.vue.js",
     "./chip": "./components/chip/v3/Chip.vue.js",
     "./chip/v4": "./components/chip/v4/ChipV4.vue.js",
     "./button": "./components/button/v3/Button.vue.js",
     "./button/v4": "./components/button/v4/ButtonV4.vue.js",
     "./iconButton": "./components/button/v3/IconButton.vue.js",
+    "./iconButton/v4": "./components/button/v4/IconButtonV4.vue.js",
     "./scrollButton": "./components/button/v3/ScrollButton.vue.js",
     "./checkbox": "./components/checkbox/Checkbox.vue.js",
     "./icon": "./components/icon/v3/Icon.vue.js",
     "./icon/v4": "./components/icon/v4/IconV4.vue.js",
-    "./toggle": "./components/toggle/Toggle.vue.js",
-    "./tooltip": "./components/tooltip/Tooltip.vue.js",
+    "./toggle": "./components/toggle/v3/Toggle.vue.js",
+    "./tooltip": "./components/tooltip/v3/Tooltip.vue.js",
+    "./tooltip/v4": "./components/tooltip/v4/TooltipV4.vue.js",
     "./search": "./components/search/v3/Search.vue.js",
     "./search/v4": "./components/search/v4/Search.vue.js",
     "./useId": "./composables/useId.vue.js",
@@ -194,6 +205,7 @@
     "./styleguide": "./styleguide.scss",
     "./styleguideV4": "./style/styleguideV4.scss",
     "./banner": "./components/banner/Banner.vue.js",
+    "./multibar": "./components/multibar/MultiBar.vue.js",
     "./typography": "./components/typography/v4/Typography.vue.js"
   },
   "typesVersions": {
@@ -211,7 +223,10 @@
         "./components/menu/Menu.vue.d.ts"
       ],
       "editable": [
-        "./components/table-cells/Editable.vue.d.ts"
+        "./components/table-cells/v3/Editable.vue.d.ts"
+      ],
+      "editable/v4": [
+        "./components/table-cells/v4/EditableV4.vue.d.ts"
       ],
       "appIcon": [
         "./components/appIcon/AppIcon.vue.d.ts"
@@ -241,13 +256,22 @@
         "./components/cssBaseline/CssBaseline.vue.d.ts"
       ],
       "emptyState": [
-        "./components/emptyState/EmptyState.vue.d.ts"
+        "./components/emptyState/v3/EmptyState.vue.d.ts"
+      ],
+      "emptyState/v4": [
+        "./components/emptyState/v4/EmptyStateV4.vue.d.ts"
       ],
       "table": [
-        "./components/table/Table.vue.d.ts"
+        "./components/table/v3/Table.vue.d.ts"
+      ],
+      "table/v4": [
+        "./components/table/v4/DataGrid.vue.d.ts"
       ],
       "dialog": [
-        "./components/dialog/Dialog.vue.d.ts"
+        "./components/dialog/v3/Dialog.vue.d.ts"
+      ],
+      "dialog/v4": [
+        "./components/dialog/v4/DialogV4.vue.d.ts"
       ],
       "dropdown": [
         "./components/dropdown/index.d.ts"
@@ -262,7 +286,10 @@
         "./components/filterDropdown/index.d.ts"
       ],
       "tabs": [
-        "./components/tabs/Tabs.vue.d.ts"
+        "./components/tabs/v3/Tabs.vue.d.ts"
+      ],
+      "tabs/v4": [
+        "./components/tabs/v4/TabsV4.vue.d.ts"
       ],
       "./dateRange": [
         "./components/dateRange/DateRange.vue.d.ts"
@@ -283,7 +310,10 @@
         "./components/button/v4/ButtonV4.vue.d.ts"
       ],
       "iconButton": [
-        "./components/button/IconButton.vue.d.ts"
+        "./components/button/v3/IconButton.vue.d.ts"
+      ],
+      "iconButton/v4": [
+        "./components/button/v4/IconButtonV4.vue.d.ts"
       ],
       "scrollButton": [
         "./components/button/ScrollButton.vue.d.ts"
@@ -295,16 +325,19 @@
         "./components/icon/Icon.vue.d.ts"
       ],
       "./toggle": [
-        "./components/toggle/Toggle.vue.d.ts"
+        "./components/toggle/v3/Toggle.vue.d.ts"
       ],
       "./tooltip": [
-        "./components/tooltip/Tooltip.vue.d.ts"
+        "./components/tooltip/v3/Tooltip.vue.d.ts"
+      ],
+      "./tooltip/v4": [
+        "./components/tooltip/v4/TooltipV4.vue.d.ts"
       ],
       "search": [
         "./components/search/v3/Search.vue.d.ts"
       ],
       "search/v4": [
-        "./components/search/v4/Search.vue.d.ts"
+        "./components/search/v4/SearchV4.vue.d.ts"
       ],
       "skeleton": [
         "./components/skeleton/Skeleton.vue.d.ts"
@@ -333,6 +366,9 @@
       "textArea": [
         "./components/textArea/TextArea.vue.d.ts"
       ],
+      "multibar": [
+        "./components/multibar/MultiBar.vue.d.ts"
+      ],
       "typography": [
         "./components/typography/v4/Typography.vue.d.ts"
       ]

package/testids/index.d.ts

@@ -12,6 +12,10 @@ export declare enum IncludeExcludeTestIdModifiers {
 export declare enum DropdownTestIdModifiers {
     TRIGGER = "dd-trigger",
     WRAPPER = "dd-wrapper",
+    BUTTON = "dd-button",
+    BUTTON_WRAPPER = "dd-button-wrapper",
+    BUTTON_CONTENT = "dd-button-content",
+    BUTTON_CLEAR = "dd-button-clear",
     LABEL = "dd-label",
     LIST_CONTAINER = "dd-list-container",
     SEARCH = "dd-search",
@@ -20,7 +24,9 @@ export declare enum DropdownTestIdModifiers {
     ACTION_APPLY = "dd-action-apply",
     ACTION_CLEAR_ALL = "dd-action-clear-all",
     HELPER_TEXT = "dd-helper-text",
-    HELPER_TEXT_ERROR = "dd-helper-text-error"
+    HELPER_TEXT_ERROR = "dd-helper-text-error",
+    SELECT_ALL = "dd-select-all",
+    NO_RESULT = "dd-no-result"
 }
 export declare enum BannerTestIdModifiers {
     WRAPPER = "banner-wrapper",
@@ -71,7 +77,8 @@ export declare enum TextAreaTestIdModifiers {
 export declare enum SearchTestIdModifiers {
     CONTAINER = "search-container",
     FIELD = "search-field",
-    CLOSE = "search-close"
+    CLOSE = "search-close",
+    CLEAR = "search-clear"
 }
 export declare enum TableTestIdModifiers {
     CONTAINER = "tbl-container",
@@ -94,7 +101,8 @@ export declare enum ToggleTestIdModifiers {
 }
 export declare enum TooltipTestIdModifiers {
     TEXT = "tt-text",
-    TRIGGER = "tt-trigger"
+    TRIGGER = "tt-trigger",
+    HEADER = "tt-header"
 }
 export declare enum AppTriggerTestIdModifiers {
     WRAPPER = "at-wrapper",

package/testids/index.js

@@ -1,27 +1,27 @@
-var a = /* @__PURE__ */ ((E) => (E.TRIGGER = "ie-trigger", E.CONTENT = "ie-content", E.SEARCH = "ie-search", E.LIST = "ie-list", E.LIST_SELECTED = "ie-list-selected", E.ACTION_CANCEL = "ie-action-cancel", E.ACTION_APPLY = "ie-action-apply", E.SELECT_ALL = "ie-select-all", E.CLEAR_ALL = "ie-clear-all", E))(a || {}), R = /* @__PURE__ */ ((E) => (E.TRIGGER = "dd-trigger", E.WRAPPER = "dd-wrapper", E.LABEL = "dd-label", E.LIST_CONTAINER = "dd-list-container", E.SEARCH = "dd-search", E.TITLE = "dd-title", E.ACTION_CANCEL = "dd-action-cancel", E.ACTION_APPLY = "dd-action-apply", E.ACTION_CLEAR_ALL = "dd-action-clear-all", E.HELPER_TEXT = "dd-helper-text", E.HELPER_TEXT_ERROR = "dd-helper-text-error", E))(R || {}), A = /* @__PURE__ */ ((E) => (E.WRAPPER = "banner-wrapper", E.CONTENT = "banner-content", E))(A || {}), t = /* @__PURE__ */ ((E) => (E.WRAPPER = "dialog-wrapper", E.HEADER = "dialog-header", E.ACTION_CLOSE = "dialog-action-close", E.HEADER_SECONDARY = "dialog-header-secondary", E.CONTENT = "dialog-content", E.ACTION_BUTTONS_WRAPPER = "dialog-action-buttons-wrapper", E.BACKDROP = "dialog-backdrop", E))(t || {}), r = /* @__PURE__ */ ((E) => (E.WRAPPER = "input-wrapper", E.TOOLTIP = "input-tooltip", E.MANDATORY = "input-mandatory", E.LABEL_CONTAINER = "input-label-container", E.LABEL_TEXT = "input-label-text", E.FIELD = "input-field", E.EXTRA_TEXT = "input-extra-text", E.TOGGLE_PASSWORD = "input-toggle-password-icon", E))(r || {}), P = /* @__PURE__ */ ((E) => (E.WRAPPER = "cb-wrapper", E.LABEL = "cb-label", E.FIELD = "cb-field", E.CHECKED = "cb-checked", E))(P || {}), O = /* @__PURE__ */ ((E) => (E.FIELD = "radio-field", E.LABEL = "radio-label", E.ERROR_TEXT = "radio-error-text", E.GROUP = "radio-group", E))(O || {}), L = /* @__PURE__ */ ((E) => (E.WRAPPER = "swicth-wrapper", E.BUTTON = "swicth-button", E.TEXT = "swicth-text", E))(L || {}), N = /* @__PURE__ */ ((E) => (E.WRAPPER = "ta-wrapper", E.LABEL = "ta-label", E.FIELD = "ta-field", E.TEXT = "ta-text", E))(N || {}), _ = /* @__PURE__ */ ((E) => (E.CONTAINER = "search-container", E.FIELD = "search-field", E.CLOSE = "search-close", E))(_ || {}), l = /* @__PURE__ */ ((E) => (E.CONTAINER = "tbl-container", E.TABLE = "tbl-table", E.HEADER = "tbl-header", E.TITLE = "tbl-title", E.HEADER_RIGHT = "tbl-header-right", E.ACTIONS = "tbl-actions", E.SECTIONS = "tbl-sections", E.BODY_WRAPPER = "tbl-body-wrapper", E.EMPTY_STATE = "tbl-empty-state", E))(l || {}), c = /* @__PURE__ */ ((E) => (E.WRAPPER = "toggle-wrapper", E.BODY = "toggle-body", E.FIELD = "toggle-field", E.TEXT = "toggle-text", E.HELPER_TEXT = "toggle-helper-text", E.ERROR_TEXT = "toggle-error-text", E))(c || {}), p = /* @__PURE__ */ ((E) => (E.TEXT = "tt-text", E.TRIGGER = "tt-trigger", E))(p || {}), n = /* @__PURE__ */ ((E) => (E.WRAPPER = "at-wrapper", E.TITLE_TEXT = "at-title-text", E.TITLE_TOOLTIP_TEXT = "at-tooltip-text", E.DESCRIPTION_TOOLTIP_TEXT = "at-description-tooltip-text", E.DESCRIPTION_TEXT = "at-description-text", E.TRIGGER_BUTTON = "at-trigger-button", E))(n || {}), C = /* @__PURE__ */ ((E) => (E.WRAPPER = "ai-wrapper", E.SELECTED_OPTION = "ai-selected-option", E.SEARCH_FIELD = "ai-search-field", E))(C || {}), v = /* @__PURE__ */ ((E) => (E.WRAPPER = "chip-wrapper", E.CLEAR = "chip-clear", E))(v || {}), S = /* @__PURE__ */ ((E) => (E.WRAPPER = "dp-wrapper", E.INPUT = "dp-input", E))(S || {}), X = /* @__PURE__ */ ((E) => (E.WRAPPER = "cm-wrapper", E.DAYS_HEADER = "cm-days-header", E.PREVIOUS = "cm-previous", E.NEXT = "cm-next", E.DAYS_WRAPPER = "cm-days-wrapper", E.DAY = "cm-day", E.MONTH_HEADER_TEXT = "cm-month-header-text", E.MONTH_HEADER = "cm-month-header", E))(X || {}), b = /* @__PURE__ */ ((E) => (E.WRAPPER = "dr-wrapper", E.FIELD = "dr-field", E.TRIGGER = "dr-trigger", E.CONTAINER = "dr-container", E.MENU = "dr-menu", E.MESSAGE = "dr-message", E.ACTION_APPLY = "dr-action-apply", E.ACTION_CANCEL = "dr-action-cancel", E))(b || {}), W = /* @__PURE__ */ ((E) => (E.WRAPPER = "tabs-wrapper", E.TAB = "tabs-tab", E))(W || {}), h = /* @__PURE__ */ ((E) => (E.TEXT = "t-text", E))(h || {}), H = /* @__PURE__ */ ((E) => (E.HEADER = "h-header", E))(H || {}), G = /* @__PURE__ */ ((E) => (E.CONTAINER = "field-label-container", E.TEXT = "field-label-text", E.MANDATORY = "field-label-mandatory", E.TOOLTIP = "field-label-help-tooltip", E))(G || {}), m = /* @__PURE__ */ ((E) => (E.CONTAINER = "field-help-text-container", E.TEXT = "field-help-text-text", E.ICON = "field-help-text-icon", E))(m || {});
+var a = /* @__PURE__ */ ((E) => (E.TRIGGER = "ie-trigger", E.CONTENT = "ie-content", E.SEARCH = "ie-search", E.LIST = "ie-list", E.LIST_SELECTED = "ie-list-selected", E.ACTION_CANCEL = "ie-action-cancel", E.ACTION_APPLY = "ie-action-apply", E.SELECT_ALL = "ie-select-all", E.CLEAR_ALL = "ie-clear-all", E))(a || {}), R = /* @__PURE__ */ ((E) => (E.TRIGGER = "dd-trigger", E.WRAPPER = "dd-wrapper", E.BUTTON = "dd-button", E.BUTTON_WRAPPER = "dd-button-wrapper", E.BUTTON_CONTENT = "dd-button-content", E.BUTTON_CLEAR = "dd-button-clear", E.LABEL = "dd-label", E.LIST_CONTAINER = "dd-list-container", E.SEARCH = "dd-search", E.TITLE = "dd-title", E.ACTION_CANCEL = "dd-action-cancel", E.ACTION_APPLY = "dd-action-apply", E.ACTION_CLEAR_ALL = "dd-action-clear-all", E.HELPER_TEXT = "dd-helper-text", E.HELPER_TEXT_ERROR = "dd-helper-text-error", E.SELECT_ALL = "dd-select-all", E.NO_RESULT = "dd-no-result", E))(R || {}), A = /* @__PURE__ */ ((E) => (E.WRAPPER = "banner-wrapper", E.CONTENT = "banner-content", E))(A || {}), t = /* @__PURE__ */ ((E) => (E.WRAPPER = "dialog-wrapper", E.HEADER = "dialog-header", E.ACTION_CLOSE = "dialog-action-close", E.HEADER_SECONDARY = "dialog-header-secondary", E.CONTENT = "dialog-content", E.ACTION_BUTTONS_WRAPPER = "dialog-action-buttons-wrapper", E.BACKDROP = "dialog-backdrop", E))(t || {}), O = /* @__PURE__ */ ((E) => (E.WRAPPER = "input-wrapper", E.TOOLTIP = "input-tooltip", E.MANDATORY = "input-mandatory", E.LABEL_CONTAINER = "input-label-container", E.LABEL_TEXT = "input-label-text", E.FIELD = "input-field", E.EXTRA_TEXT = "input-extra-text", E.TOGGLE_PASSWORD = "input-toggle-password-icon", E))(O || {}), L = /* @__PURE__ */ ((E) => (E.WRAPPER = "cb-wrapper", E.LABEL = "cb-label", E.FIELD = "cb-field", E.CHECKED = "cb-checked", E))(L || {}), P = /* @__PURE__ */ ((E) => (E.FIELD = "radio-field", E.LABEL = "radio-label", E.ERROR_TEXT = "radio-error-text", E.GROUP = "radio-group", E))(P || {}), N = /* @__PURE__ */ ((E) => (E.WRAPPER = "swicth-wrapper", E.BUTTON = "swicth-button", E.TEXT = "swicth-text", E))(N || {}), r = /* @__PURE__ */ ((E) => (E.WRAPPER = "ta-wrapper", E.LABEL = "ta-label", E.FIELD = "ta-field", E.TEXT = "ta-text", E))(r || {}), _ = /* @__PURE__ */ ((E) => (E.CONTAINER = "search-container", E.FIELD = "search-field", E.CLOSE = "search-close", E.CLEAR = "search-clear", E))(_ || {}), l = /* @__PURE__ */ ((E) => (E.CONTAINER = "tbl-container", E.TABLE = "tbl-table", E.HEADER = "tbl-header", E.TITLE = "tbl-title", E.HEADER_RIGHT = "tbl-header-right", E.ACTIONS = "tbl-actions", E.SECTIONS = "tbl-sections", E.BODY_WRAPPER = "tbl-body-wrapper", E.EMPTY_STATE = "tbl-empty-state", E))(l || {}), c = /* @__PURE__ */ ((E) => (E.WRAPPER = "toggle-wrapper", E.BODY = "toggle-body", E.FIELD = "toggle-field", E.TEXT = "toggle-text", E.HELPER_TEXT = "toggle-helper-text", E.ERROR_TEXT = "toggle-error-text", E))(c || {}), C = /* @__PURE__ */ ((E) => (E.TEXT = "tt-text", E.TRIGGER = "tt-trigger", E.HEADER = "tt-header", E))(C || {}), n = /* @__PURE__ */ ((E) => (E.WRAPPER = "at-wrapper", E.TITLE_TEXT = "at-title-text", E.TITLE_TOOLTIP_TEXT = "at-tooltip-text", E.DESCRIPTION_TOOLTIP_TEXT = "at-description-tooltip-text", E.DESCRIPTION_TEXT = "at-description-text", E.TRIGGER_BUTTON = "at-trigger-button", E))(n || {}), p = /* @__PURE__ */ ((E) => (E.WRAPPER = "ai-wrapper", E.SELECTED_OPTION = "ai-selected-option", E.SEARCH_FIELD = "ai-search-field", E))(p || {}), v = /* @__PURE__ */ ((E) => (E.WRAPPER = "chip-wrapper", E.CLEAR = "chip-clear", E))(v || {}), b = /* @__PURE__ */ ((E) => (E.WRAPPER = "dp-wrapper", E.INPUT = "dp-input", E))(b || {}), S = /* @__PURE__ */ ((E) => (E.WRAPPER = "cm-wrapper", E.DAYS_HEADER = "cm-days-header", E.PREVIOUS = "cm-previous", E.NEXT = "cm-next", E.DAYS_WRAPPER = "cm-days-wrapper", E.DAY = "cm-day", E.MONTH_HEADER_TEXT = "cm-month-header-text", E.MONTH_HEADER = "cm-month-header", E))(S || {}), X = /* @__PURE__ */ ((E) => (E.WRAPPER = "dr-wrapper", E.FIELD = "dr-field", E.TRIGGER = "dr-trigger", E.CONTAINER = "dr-container", E.MENU = "dr-menu", E.MESSAGE = "dr-message", E.ACTION_APPLY = "dr-action-apply", E.ACTION_CANCEL = "dr-action-cancel", E))(X || {}), W = /* @__PURE__ */ ((E) => (E.WRAPPER = "tabs-wrapper", E.TAB = "tabs-tab", E))(W || {}), h = /* @__PURE__ */ ((E) => (E.TEXT = "t-text", E))(h || {}), u = /* @__PURE__ */ ((E) => (E.HEADER = "h-header", E))(u || {}), B = /* @__PURE__ */ ((E) => (E.CONTAINER = "field-label-container", E.TEXT = "field-label-text", E.MANDATORY = "field-label-mandatory", E.TOOLTIP = "field-label-help-tooltip", E))(B || {}), H = /* @__PURE__ */ ((E) => (E.CONTAINER = "field-help-text-container", E.TEXT = "field-help-text-text", E.ICON = "field-help-text-icon", E))(H || {});
 export {
   n as AppTriggerTestIdModifiers,
-  C as AutocompleteInputTestIdModifiers,
+  p as AutocompleteInputTestIdModifiers,
   A as BannerTestIdModifiers,
-  X as CalendarMonthTestIdModifiers,
-  P as CheckboxTestIdModifiers,
+  S as CalendarMonthTestIdModifiers,
+  L as CheckboxTestIdModifiers,
   v as ChipTestIdModifiers,
-  S as DatePickerTestIdModifiers,
-  b as DateRangeTestIdModifiers,
+  b as DatePickerTestIdModifiers,
+  X as DateRangeTestIdModifiers,
   t as DialogTestIdModifiers,
   R as DropdownTestIdModifiers,
-  m as FieldHelpTextTestIdModifiers,
-  G as FieldLabelTestIdModifiers,
-  H as HeaderTestIdModifiers,
+  H as FieldHelpTextTestIdModifiers,
+  B as FieldLabelTestIdModifiers,
+  u as HeaderTestIdModifiers,
   a as IncludeExcludeTestIdModifiers,
-  r as InputTestIdModifiers,
-  O as RadioTestIdModifiers,
+  O as InputTestIdModifiers,
+  P as RadioTestIdModifiers,
   _ as SearchTestIdModifiers,
-  L as SwitchTestIdModifiers,
+  N as SwitchTestIdModifiers,
   l as TableTestIdModifiers,
   W as TabsTestIdModifiers,
-  N as TextAreaTestIdModifiers,
+  r as TextAreaTestIdModifiers,
   h as TextTestIdModifiers,
   c as ToggleTestIdModifiers,
-  p as TooltipTestIdModifiers
+  C as TooltipTestIdModifiers
 };

package/utils/storybook-utils.d.ts

@@ -0,0 +1 @@
+export declare const createArgTypes: (argTypes: any) => any;

package/utils/string.d.ts

@@ -0,0 +1,2 @@
+export declare const snakeCaseToCamelCase: (str: string) => string;
+export declare const capitalizeFirstLetter: (str: string) => string;