@geneui/components 2.11.2 → 2.12.2

package/index.js

@@ -1,128 +1,152 @@
-export { default as TextLink } from './TextLink.js';
-export { default as Button } from './Button.js';
-export { default as Label } from './Label.js';
-export { default as Icon } from './Icon.js';
-export { default as Switcher } from './Switcher.js';
-export { default as Divider } from './Divider.js';
-export { default as Radio } from './Radio.js';
-export { default as Paper, alignItems, cornersRadius, justifyContents, paperDirections, paperWraps } from './Paper.js';
-export { default as Portal } from './Portal.js';
-export { default as Avatar } from './Avatar.js';
-export { default as Badge } from './Badge.js';
-export { default as BusyLoader } from './BusyLoader.js';
-export { A as AreaChart, B as BarChart, e as ColumnChart, l as ColumnRangeChart, C as ComboBox, a as Counter, f as DalColumnChart, i as DonutChart, m as Dropdown, F as FunnelChart, k as HeatMapChart, H as Holder, I as ImagePreview, L as LineChart, c as MapChart, M as ModuleTitle, b as MultiSelectDropdownField, O as Overlay, h as PieChart, P as Profile, j as ScatterChart, S as StackedBarChart, g as StackedColumnChart, T as TimePicker, d as TreeMapChart, D as ValidatableDropdown, W as Widget } from './index-9164a86d.js';
-export { default as SkeletonLoader } from './SkeletonLoader.js';
-export { default as Scrollbar } from './Scrollbar.js';
-export { default as Time } from './Time.js';
-export { default as Empty } from './Empty.js';
-export { P as Popover } from './index-084588e9.js';
-export { P as PopoverV2 } from './index-5e96cb4d.js';
-export { default as Title } from './Title.js';
-export { default as Image } from './Image.js';
-export { default as KeyValue } from './KeyValue.js';
-export { default as Option } from './Option.js';
-export { default as QRCode } from './QRCode.js';
-export { Col, Row } from './Grid.js';
-export { Tab, Tabs } from './Tabs.js';
-export { Step, Steps } from './Steps.js';
-export { Timeline, TimelineItem, timelineAppearances, timelineColors } from './Timeline.js';
-export { default as RadioGroup } from './RadioGroup.js';
-export { default as Checkbox } from './Checkbox.js';
-export { default as Card } from './Card.js';
-export { default as Tag } from './Tag.js';
-export { default as Alert, alertTypes } from './Alert.js';
-export { default as Tooltip } from './Tooltip.js';
-export { R as Range } from './index-00fe8887.js';
-export { default as Slider } from './Slider.js';
-export { default as Pagination } from './Pagination.js';
-export { default as ExtendedInput } from './ExtendedInput.js';
-export { default as Editor, default as ValidatableEditor } from './Editor.js';
-export { default as ValidatableUploader } from './ValidatableUploader.js';
-export { default as ValidatableRadio } from './ValidatableRadio.js';
-export { default as ValidatableCheckbox } from './ValidatableCheckbox.js';
-export { default as ValidatableSwitcher } from './ValidatableSwitcher.js';
-export { default as ValidatableNumberInput } from './ValidatableNumberInput.js';
-export { default as ValidatableTextInput } from './ValidatableTextInput.js';
-export { default as ValidatableDatePicker } from './ValidatableDatePicker.js';
-export { default as Notification, notificationTypes } from './Notification.js';
-export { default as Modal } from './Modal.js';
-import './globalStyling-9c60a159.js';
-export { Collapse, Panel } from './Collapse.js';
-export { default as Status, statusIconTypes } from './Status.js';
-export { default as Menu } from './Menu.js';
-export { default as Progress } from './Progress.js';
-export { default as MobileNavigation } from './MobileNavigation.js';
-export { default as MobilePopup } from './MobilePopup.js';
-export { U as Uploader } from './index-135b9d17.js';
-export { default as Products } from './Products.js';
-export { default as Search } from './Search.js';
-export { D as DatePickerInput } from './index-0199942c.js';
-export { default as Breadcrumb } from './Breadcrumb.js';
-export { default as Section } from './Section.js';
-export { default as ColorPicker } from './ColorPicker.js';
-export { default as NavigationMenu } from './NavigationMenu.js';
-export { default as Textarea } from './Textarea.js';
-export { default as AdvancedSearch } from './AdvancedSearch.js';
-export { default as FormableMultiSelectDropdown } from './FormableMultiSelectDropdown.js';
-export { default as FormableNumberInput } from './FormableNumberInput.js';
-export { default as FormableDatePicker } from './FormableDatePicker.js';
-export { default as FormableTextInput } from './FormableTextInput.js';
-export { default as FormableDropdown } from './FormableDropdown.js';
-export { default as FormableCheckbox } from './FormableCheckbox.js';
-export { default as FormableUploader } from './FormableUploader.js';
-export { default as FormableSwitcher } from './FormableSwitcher.js';
-export { default as FormableEditor } from './FormableEditor.js';
-export { default as FormableRadio } from './FormableRadio.js';
-export { F as FormableHOC } from './FormableHOC-21051057.js';
-export { default as Toaster, toasterPositions } from './Toaster.js';
-export { default as SearchWithDropdown } from './SearchWithDropdown.js';
-export { default as CheckboxGroupWithSearch } from './CheckboxGroupWithSearch.js';
-export { default as CheckboxGroup } from './CheckboxGroup.js';
-export { default as Overspread } from './Overspread.js';
-export { default as DatePicker } from './DatePicker.js';
-export { default as DateFilter } from './DateFilter.js';
-export { ComboTable, PaginationSelector, PaperWrapper, TableContainer, TableHeader, TablePagination, TableTitle, WithHeader, WithTitle } from './TableCompositions.js';
-export { T as Table } from './index-8c98317a.js';
-export { CardList, WrappedCardList } from './CardList.js';
+export { default as TextLink } from './TextLink/index.js';
+export { default as Button } from './Button/index.js';
+export { default as Label } from './Label/index.js';
+export { default as Icon } from './Icon/index.js';
+export { default as Switcher } from './Switcher/index.js';
+export { default as Divider } from './Divider/index.js';
+export { default as Radio } from './Radio/index.js';
+export { default as Portal } from './Portal/index.js';
+export { default as Badge } from './Badge/index.js';
+export { default as BusyLoader } from './BusyLoader/index.js';
+export { default as ModuleTitle } from './ModuleTitle/index.js';
+export { default as SkeletonLoader } from './SkeletonLoader/index.js';
+export { default as Scrollbar } from './Scrollbar/index.js';
+export { default as Time } from './Time/index.js';
+export { default as Empty } from './Empty/index.js';
+export { default as Popover } from './Popover/index.js';
+export { P as PopoverV2 } from './index-462461c0.js';
+export { default as Title } from './Title/index.js';
+export { default as Image } from './Image/index.js';
+export { default as KeyValue } from './KeyValue/index.js';
+export { default as Option } from './Option/index.js';
+export { default as ImagePreview } from './ImagePreview/index.js';
+export { default as QRCode } from './QRCode/index.js';
+export { default as Paper, alignItems, cornersRadius, justifyContents, paperDirections, paperWraps } from './Paper/index.js';
+export { default as Avatar } from './Avatar/index.js';
+export { default as LinkButton } from './LinkButton/index.js';
+export { Col, Row } from './Grid/index.js';
+export { Tab, Tabs } from './Tabs/index.js';
+export { Step, Steps } from './Steps/index.js';
+export { Timeline, TimelineItem, timelineAppearances, timelineColors } from './Timeline/index.js';
+export { default as RadioGroup } from './RadioGroup/index.js';
+export { default as Checkbox } from './Checkbox/index.js';
+export { default as Card } from './Card/index.js';
+export { default as Tag } from './Tag/index.js';
+export { default as Alert, alertTypes } from './Alert/index.js';
+export { default as Tooltip } from './Tooltip/index.js';
+export { default as Range } from './Range/index.js';
+export { default as Slider } from './Slider/index.js';
+export { default as Pagination } from './Pagination/index.js';
+export { default as ExtendedInput } from './ExtendedInput/index.js';
+export { default as ValidatableDropdown } from './ValidatableDropdown/index.js';
+export { default as MultiSelectDropdownField } from './ValidatableMultiSelectDropdown/index.js';
+export { default as Editor, default as ValidatableEditor } from './Editor/index.js';
+export { default as ValidatableUploader } from './ValidatableUploader/index.js';
+export { default as ValidatableRadio } from './ValidatableRadio/index.js';
+export { default as ValidatableCheckbox } from './ValidatableCheckbox/index.js';
+export { default as ValidatableSwitcher } from './ValidatableSwitcher/index.js';
+export { default as ValidatableNumberInput } from './ValidatableNumberInput/index.js';
+export { default as ValidatableTextInput } from './ValidatableTextInput/index.js';
+export { default as ValidatableDatePicker } from './ValidatableDatePicker/index.js';
+export { default as Notification, notificationTypes } from './Notification/index.js';
+export { default as Modal } from './Modal/index.js';
+export { Collapse, Panel } from './Collapse/index.js';
+export { default as Status, statusIconTypes } from './Status/index.js';
+export { default as Menu } from './Menu/index.js';
+export { default as Overlay } from './Overlay/index.js';
+export { default as Profile } from './Profile/index.js';
+export { AreaChart, BarChart, ColumnChart, ColumnRangeChart, DalColumnChart, DonutChart, FunnelChart, HeatMapChart, LineChart, MapChart, PieChart, ScatterChart, StackedBarChart, StackedColumnChart, TreeMapChart } from './Charts/index.js';
+export { default as Widget } from './Widget/index.js';
+export { default as Progress } from './Progress/index.js';
+export { default as MobileNavigation } from './MobileNavigation/index.js';
+export { default as MobilePopup } from './MobilePopup/index.js';
+export { default as Uploader } from './Uploader/index.js';
+export { default as Products } from './Products/index.js';
+export { default as Search } from './Search/index.js';
+export { default as DatePickerInput } from './DatePickerInput/index.js';
+export { default as Holder } from './Holder/index.js';
+export { default as Breadcrumb } from './Breadcrumb/index.js';
+export { default as Section } from './Section/index.js';
+export { default as TimePicker } from './TimePicker/index.js';
+export { default as ColorPicker } from './ColorPicker/index.js';
+export { default as NavigationMenu } from './NavigationMenu/index.js';
+export { default as ComboBox } from './ComboBox/index.js';
+export { default as Textarea } from './Textarea/index.js';
+export { default as Counter } from './Counter/index.js';
+export { default as AdvancedSearch } from './AdvancedSearch/index.js';
+export { default as FormableMultiSelectDropdown } from './FormableMultiSelectDropdown/index.js';
+export { default as FormableNumberInput } from './FormableNumberInput/index.js';
+export { default as FormableDatePicker } from './FormableDatePicker/index.js';
+export { default as FormableTextInput } from './FormableTextInput/index.js';
+export { default as FormableDropdown } from './FormableDropdown/index.js';
+export { default as FormableCheckbox } from './FormableCheckbox/index.js';
+export { default as FormableUploader } from './FormableUploader/index.js';
+export { default as FormableSwitcher } from './FormableSwitcher/index.js';
+export { default as FormableEditor } from './FormableEditor/index.js';
+export { default as FormableRadio } from './FormableRadio/index.js';
+export { F as FormableHOC } from './FormableHOC-55263162.js';
+export { default as Toaster, toasterPositions } from './Toaster/index.js';
+export { default as SearchWithDropdown } from './SearchWithDropdown/index.js';
+export { default as CheckboxGroupWithSearch } from './CheckboxGroupWithSearch/index.js';
+export { default as CheckboxGroup } from './CheckboxGroup/index.js';
+export { default as Overspread } from './Overspread/index.js';
+export { default as DatePicker } from './DatePicker/index.js';
+export { default as DateFilter } from './DateFilter/index.js';
+export { ComboTable, PaginationSelector, PaperWrapper, TableContainer, TableHeader, TablePagination, TableTitle, WithHeader, WithTitle } from './TableCompositions/index.js';
+export { D as Dropdown } from './index-34e47647.js';
+export { T as Table } from './index-11eea761.js';
+export { CardList, WrappedCardList } from './CardList/index.js';
 import 'react';
-export { default as Form } from './FormContainer.js';
-export { default as TransferList } from './TransferList.js';
-export { R as RichEditor } from './RichEditor-98accead.js';
-export { default as Drawer } from './Drawer.js';
-export { default as ActionableList } from './ActionableList.js';
-export { GeneUIDesignSystemContext, default as GeneUIProvider } from './GeneUIProvider.js';
-import './index-e0af0caf.js';
+import 'prop-types';
+export { default as Form } from './FormContainer/index.js';
+export { default as TransferList } from './TransferList/index.js';
+export { R as RichEditor } from './RichEditor-8b0f7ccd.js';
+export { default as Drawer } from './Drawer/index.js';
+export { default as ActionableList } from './ActionableList/index.js';
+export { GeneUIDesignSystemContext, default as GeneUIProvider } from './GeneUIProvider/index.js';
+export { default as useWidth } from './hooks/useWidth.js';
+export { default as useMount } from './hooks/useMount.js';
+export { default as useClick } from './hooks/useClick.js';
+export { default as useToggle } from './hooks/useToggle.js';
+export { default as useUpdate } from './hooks/useUpdate.js';
+export { default as usePrevious } from './hooks/usePrevious.js';
+export { default as useKeyDown } from './hooks/useKeyDown.js';
+export { default as useForceUpdate } from './hooks/useForceUpdate.js';
+export { default as useDeviceType } from './hooks/useDeviceType.js';
+export { default as useWindowSize } from './hooks/useWindowSize.js';
+export { default as useClickOutside } from './hooks/useClickOutside.js';
+export { default as useDebounce } from './hooks/useDebounceHook.js';
+export { default as useThrottle } from './hooks/useThrottle.js';
+export { default as useMutationObserver } from './hooks/useMutationObserver.js';
+export { default as useUpdatableRef } from './hooks/useUpdatableRef.js';
+export { default as useDidMount } from './hooks/useDidMount.js';
+export { default as useBodyScroll } from './hooks/useBodyScroll.js';
+export { default as useImgDownload } from './hooks/useImgDownload.js';
+export { default as useEllipsisDetection } from './hooks/useEllipsisDetection.js';
 import './_rollupPluginBabelHelpers-e8fb2e5c.js';
 import './index-6ff23041.js';
 import './style-inject.es-746bb8ed.js';
-import './configs-91c86664.js';
-import './index-ac59cb10.js';
+import './configs-fed6ac34.js';
+import './index-a0e4e333.js';
 import './dateValidation-67caec66.js';
 import './_commonjsHelpers-24198af3.js';
 import 'react-dom';
-import './useKeyDown-38102ae7.js';
 import './checkboxRadioSwitcher-5b69d7bd.js';
 import './guid-8ddf77b3.js';
-import './configs.js';
-import './useEllipsisDetection-ef536015.js';
-import './useMount-6fef51a5.js';
-import './objectWithoutPropertiesLoose-299691d8.js';
-import './rangeAndSlider-20599da4.js';
-import './clsx.m-2bb6df4b.js';
-import './useDeviceType-dd51db38.js';
-import './useWindowSize-80369d76.js';
-import './useClickOutside-5183e396.js';
-import './index-897d8240.js';
-import './index-2030e31c.js';
-import './index-b7a33c58.js';
 import './localization-4ba17032.js';
 import './Popover-f4d1cac0.js';
 import './index-122432cd.js';
 import './debounce-4419bc2f.js';
-import './useWidth-9f4647f8.js';
+import './rangeAndSlider-0301a458.js';
+import './index-45eafea6.js';
+import './react-lifecycles-compat.es-6e1f3768.js';
+import './SuggestionList/index.js';
+import './config-0ca92874.js';
 import './checkTimeValidation-e56771be.js';
-import './LinkButton.js';
 import './index-262edd7a.js';
-import './CellMeasurerCache-b786dd93.js';
-import './index-e8776f3d.js';
-import './react-beautiful-dnd.esm-38c37304.js';
+import './index-2ad83e03.js';
+import './objectWithoutPropertiesLoose-d8a4a68c.js';
+import './clsx.m-2bb6df4b.js';
+import './CellMeasurerCache-3741d716.js';
+import './index-b1e429a7.js';
+import './react-beautiful-dnd.esm-04c14563.js';

package/index.mobile.d.ts

@@ -0,0 +1,16 @@
+export * from './lib/atoms/Button/index.mobile';
+export * from './lib/atoms/Divider/index.mobile';
+export * from './lib/atoms/Icon/index.mobile';
+export * from './lib/atoms/Label/index.mobile';
+export * from './lib/atoms/Radio/index.mobile';
+export * from './lib/atoms/Switcher/index.mobile';
+export * from './lib/molecules/Alert/index.mobile';
+export * from './lib/molecules/Checkbox/index.mobile';
+export * from './lib/molecules/ExtendedInput/index.mobile';
+export * from './lib/molecules/Grid/index.mobile';
+export * from './lib/molecules/Notification/index.mobile';
+export * from './lib/molecules/Pagination/index.mobile';
+export * from './lib/molecules/RadioGroup/index.mobile';
+export * from './lib/molecules/ValidatableElements/Elements/index.mobile';
+export * from './lib/molecules/Counter/index.mobile';
+export * from './lib/organisms/CheckboxGroup/index.mobile';

package/lib/atoms/Avatar/Avatar.d.ts

@@ -0,0 +1,34 @@
+import React, { MouseEvent, ReactNode } from 'react';
+import './Avatar.scss';
+interface IAvatarProps {
+    /**
+     * Background image source
+     */
+    src?: string;
+    /**
+     * The property will show icon. This property will work when "src" is not specified.
+     */
+    icon?: string;
+    /**
+     * The property will show first two letters in upper case. This will work when "src" or "icon" are not specified.
+     */
+    children?: ReactNode;
+    /**
+     * Avatar size
+     */
+    size?: 'small' | 'default' | 'medium' | 'big';
+    /**
+     * Avatar color
+     */
+    color?: 'default' | 'green' | 'red';
+    /**
+     * Avatar shape
+     */
+    shape?: 'circle' | 'square';
+    /**
+     * Handle click event on avatar component((event: Event) => void 0).
+     */
+    onClick?: (event: MouseEvent) => void;
+}
+declare const Avatar: React.FC<IAvatarProps>;
+export { IAvatarProps, Avatar as default };

package/lib/atoms/Avatar/index.d.ts

@@ -0,0 +1 @@
+export { IAvatarProps, default as default } from './Avatar';

package/lib/atoms/LinkButton/LinkButton.d.ts

@@ -0,0 +1,46 @@
+import React from 'react';
+import './LinkButton.scss';
+interface ILinkButtonProps {
+    /**
+     * Href for <code>\<a\></code> tag if you don't pass instead of <code>\<a\></code> tag will be <code>\<button\></code> tag .
+     */
+    href?: string;
+    /**
+     * Fires event when user click on LinkButton.
+     * <br>
+     * <code>(event: Event) => void </code>
+     */
+    onClick?: (event: React.MouseEvent) => void;
+    /**
+     * Fires event when the element has been pressed.
+     * <br>
+     * <code>(event: Event) => void</code>
+     */
+    onMouseDown?: (event: React.MouseEvent) => void;
+    /**
+     * The LinkButton additional className.
+     */
+    className?: string;
+    /**
+     * Any valid React node.
+     */
+    children?: React.ReactNode;
+    /**
+     * Icon to render before the LinkButton. Should be an icon component's type.
+     */
+    iconBefore?: string;
+    /**
+     * Icon to render after the LinkButton. Should be an icon component's type.
+     */
+    iconAfter?: string;
+    /**
+     * Makes the LinkButton disabled.
+     */
+    isDisabled?: boolean;
+    /**
+     * aria-label for button or LinkButton.
+     */
+    ariaLabel?: string;
+}
+declare const LinkButton: React.FC<ILinkButtonProps>;
+export { ILinkButtonProps, LinkButton as default };

package/lib/atoms/LinkButton/index.d.ts

@@ -0,0 +1 @@
+export { ILinkButtonProps, default as default } from './LinkButton';

package/{objectWithoutPropertiesLoose-299691d8.js → objectWithoutPropertiesLoose-d8a4a68c.js}

@@ -8,20 +8,20 @@ function _typeof(o) {
   }, _typeof(o);
 }
 
-function _toPrimitive(input, hint) {
-  if (_typeof(input) !== "object" || input === null) return input;
-  var prim = input[Symbol.toPrimitive];
-  if (prim !== undefined) {
-    var res = prim.call(input, hint || "default");
-    if (_typeof(res) !== "object") return res;
+function toPrimitive(t, r) {
+  if ("object" != _typeof(t) || !t) return t;
+  var e = t[Symbol.toPrimitive];
+  if (void 0 !== e) {
+    var i = e.call(t, r || "default");
+    if ("object" != _typeof(i)) return i;
     throw new TypeError("@@toPrimitive must return a primitive value.");
   }
-  return (hint === "string" ? String : Number)(input);
+  return ("string" === r ? String : Number)(t);
 }
 
-function _toPropertyKey(arg) {
-  var key = _toPrimitive(arg, "string");
-  return _typeof(key) === "symbol" ? key : String(key);
+function toPropertyKey(t) {
+  var i = toPrimitive(t, "string");
+  return "symbol" == _typeof(i) ? i : String(i);
 }
 
 function _setPrototypeOf(o, p) {
@@ -33,7 +33,7 @@ function _setPrototypeOf(o, p) {
 }
 
 function _defineProperty(obj, key, value) {
-  key = _toPropertyKey(key);
+  key = toPropertyKey(key);
   if (key in obj) {
     Object.defineProperty(obj, key, {
       value: value,
@@ -75,4 +75,4 @@ function _objectWithoutPropertiesLoose(source, excluded) {
   return target;
 }
 
-export { _defineProperty as _, _setPrototypeOf as a, _objectWithoutPropertiesLoose as b, _extends as c, _toPropertyKey as d, _typeof as e };
+export { _defineProperty as _, _setPrototypeOf as a, _objectWithoutPropertiesLoose as b, _extends as c, _typeof as d, toPropertyKey as t };

package/package.json

@@ -1,7 +1,7 @@
 {
     "name": "@geneui/components",
     "description": "The Gene UI components library designed for BI tools",
-    "version": "2.11.2",
+    "version": "2.12.2",
     "author": "SoftConstruct",
     "homepage": "https://github.com/softconstruct/gene-ui-components#readme",
     "repository": {
@@ -18,18 +18,25 @@
         "component-library"
     ],
     "main": "index.js",
+    "typings": "index.d.ts",
+    "sideEffects": [
+        "**/*.css",
+        "**/*.scss"
+    ],
     "scripts": {
-        "start": "start-storybook -p 6006 -s .storybook/public",
-        "test": "jest",
+        "start": "npm run test && storybook dev -p 6006",
+        "dev": "concurrently --kill-others -g \"npm:test:watch\" \"npm:start\"",
+        "test": "jest --silent --config ./configs/jest.config.js --rootDir ./ --coverage --json --outputFile=./coverage/.jest-test-results.json",
+        "test:watch": "npm run test -- --watchAll --json",
+        "test-report": "babel-node --config-file ./configs/.babelrc ./scripts/testReport.js",
         "build": "babel-node --config-file ./configs/.babelrc ./scripts/build.js",
         "copy-build-statics-files": "babel-node --config-file ./configs/.babelrc ./scripts/copyFiles.js",
         "bump-up-commit": "babel-node --config-file ./configs/.babelrc ./scripts/postPublish.js",
         "build:watch": "watch 'npm run build' ./src",
-        "commit": "git-cz",
+        "commit": "cross-env DISABLE_SCOPE_LOWERCASE=true git-cz",
         "changelog": "conventional-changelog -i CHANGELOG.md -s",
         "add-lib-version-to-docs": "babel-node --config-file ./configs/.babelrc ./scripts/addVersionHistory.js",
-        "build-storybook": "npm run add-lib-version-to-docs && build-storybook",
-        "publish-lib": "npm run build && cd dist && npm publish",
+        "build-storybook": "npm run add-lib-version-to-docs && npm run test && storybook build",
         "semantic-release": "semantic-release --extends ./configs/.releaserc.json --no-ci",
         "create-component": "babel-node --config-file ./configs/.babelrc ./scripts/createComponent.js",
         "find-component-usage": "babel-node --config-file ./configs/.babelrc ./scripts/findComponentUsage.js",
@@ -54,8 +61,9 @@
         "@babel/plugin-proposal-nullish-coalescing-operator": "^7.18.6",
         "@babel/plugin-proposal-optional-chaining": "^7.18.9",
         "@babel/plugin-syntax-jsx": "^7.18.6",
-        "@babel/preset-env": "^7.19.4",
-        "@babel/preset-react": "^7.18.6",
+        "@babel/preset-env": "^7.23.6",
+        "@babel/preset-react": "^7.23.3",
+        "@babel/preset-typescript": "^7.23.3",
         "@commitlint/cli": "^17.1.2",
         "@commitlint/config-conventional": "^17.1.0",
         "@faker-js/faker": "^7.6.0",
@@ -65,31 +73,38 @@
         "@rollup/plugin-image": "^3.0.1",
         "@rollup/plugin-json": "^6.0.0",
         "@rollup/plugin-node-resolve": "^15.0.0",
+        "@rollup/plugin-typescript": "^11.1.5",
         "@semantic-release/changelog": "^6.0.2",
         "@semantic-release/commit-analyzer": "^9.0.2",
         "@semantic-release/git": "^10.0.1",
         "@semantic-release/npm": "^9.0.1",
         "@semantic-release/release-notes-generator": "^10.0.3",
-        "@storybook/addon-a11y": "^6.5.15",
-        "@storybook/addon-docs": "^6.5.15",
-        "@storybook/addon-essentials": "^6.4.22",
-        "@storybook/addon-viewport": "^6.5.15",
-        "@storybook/addons": "^6.4.22",
-        "@storybook/builder-webpack5": "^6.4.22",
-        "@storybook/manager-webpack5": "^6.4.22",
-        "@storybook/mdx2-csf": "^0.0.3",
+        "@storybook/addon-a11y": "^7.6.5",
+        "@storybook/addon-essentials": "^7.6.5",
+        "@storybook/addon-jest": "^7.6.6",
+        "@storybook/addon-viewport": "^7.6.5",
+        "@storybook/addons": "^7.6.5",
+        "@storybook/blocks": "^7.6.6",
         "@storybook/preset-scss": "^1.0.3",
-        "@storybook/react": "^6.4.22",
-        "@storybook/theming": "^6.4.22",
+        "@storybook/react": "^7.6.5",
+        "@storybook/react-docgen-typescript-plugin": "^1.0.6--canary.9.0c3f3b7.0",
+        "@storybook/react-webpack5": "^7.6.5",
+        "@storybook/theming": "^7.6.5",
+        "@types/enzyme-adapter-react-16": "^1.0.9",
+        "@types/jest": "^29.5.11",
         "autoprefixer": "^10.4.13",
+        "babel-jest": "^29.7.0",
         "babel-loader": "^8.2.5",
         "chalk": "^4.1.2",
         "commitizen": "^4.2.5",
+        "concurrently": "^8.2.2",
         "conventional-changelog-cli": "^2.2.2",
+        "cross-env": "^7.0.3",
         "css-loader": "^6.7.3",
         "cz-conventional-changelog": "^3.3.0",
         "enzyme": "^3.11.0",
-        "enzyme-adapter-react-16": "^1.15.2",
+        "enzyme-adapter-react-16": "^1.15.7",
+        "enzyme-to-json": "^3.6.2",
         "eslint": "^8.25.0",
         "eslint-config-airbnb": "^19.0.4",
         "eslint-config-prettier": "^8.5.0",
@@ -104,7 +119,8 @@
         "identity-obj-proxy": "^3.0.0",
         "immutability-helper": "^3.0.1",
         "inquirer": "^8.2.4",
-        "jest": "^29.2.1",
+        "jest": "^29.7.0",
+        "jest-environment-jsdom": "^29.7.0",
         "lint-staged": "^13.0.3",
         "metro-react-native-babel-preset": "^0.51.1",
         "open-cli": "^7.1.0",
@@ -125,17 +141,21 @@
         "sass": "^1.55.0",
         "sass-loader": "^13.2.0",
         "semantic-release": "^19.0.5",
-        "storybook-dark-mode": "^2.0.4",
+        "storybook": "^7.6.5",
+        "storybook-dark-mode": "^3.0.3",
         "style-loader": "^3.3.1",
         "stylelint": "^14.14.0",
         "stylelint-config-prettier": "^9.0.3",
         "stylelint-config-standard-scss": "^5.0.0",
         "treeify": "^1.1.0",
+        "ts-jest": "^29.1.1",
+        "typescript": "^5.3.2",
         "watch": "^1.0.2",
         "webpack": "^5.74.0",
         "webpack-cli": "^4.10.0",
         "webpack-dev-server": "^3.1.14",
-        "webpack-node-externals": "^1.7.2"
+        "webpack-node-externals": "^1.7.2",
+        "yargs": "^17.7.2"
     },
     "dependencies": {
         "classnames": "^2.3.2",