@spaced-out/ui-design-system 0.4.12 → 0.4.13-beta.1

package/lib/utils/helpers/helpers.stories.js

@@ -0,0 +1,111 @@
+"use strict";
+
+Object.defineProperty(exports, "__esModule", {
+  value: true
+});
+exports.default = exports.Example = void 0;
+var _react = _interopRequireWildcard(require("react"));
+var _Button = require("../../components/Button");
+var _Input = require("../../components/Input");
+var _Text = require("../../components/Text");
+var _helpers = require("./helpers");
+var _helpersStoriesModule = _interopRequireDefault(require("./helpers.stories.module.css"));
+function _interopRequireDefault(e) { return e && e.__esModule ? e : { default: e }; }
+function _interopRequireWildcard(e, t) { if ("function" == typeof WeakMap) var r = new WeakMap(), n = new WeakMap(); return (_interopRequireWildcard = function (e, t) { if (!t && e && e.__esModule) return e; var o, i, f = { __proto__: null, default: e }; if (null === e || "object" != typeof e && "function" != typeof e) return f; if (o = t ? n : r) { if (o.has(e)) return o.get(e); o.set(e, f); } for (const t in e) "default" !== t && {}.hasOwnProperty.call(e, t) && ((i = (o = Object.defineProperty) && Object.getOwnPropertyDescriptor(e, t)) && (i.get || i.set) ? o(f, t, i) : f[t] = e[t]); return f; })(e, t); }
+var _default = exports.default = {
+  tags: ['autodocs'],
+  title: 'Utils/Helper Functions',
+  parameters: {
+    docs: {
+      description: {
+        component: `
+\`\`\`js
+import { uuid, range } from "@spaced-out/ui-design-system/lib/utils/helpers";
+\`\`\`
+This story showcases helper functions that can be used in different scenarios.
+
+### Helper Functions
+- \`uuid\`: Generates a unique identifier.
+- \`range\`: Creates an array of numbers within a specified range.
+- \`convertFileSize\`: Converts a file size in bytes to KB, MB, or GB.
+
+### Usage
+\`\`\`jsx
+import { uuid, range } from './helpers';
+
+const uniqueId = uuid(); // Example output: "983651f0-a7db-4f84-b0d2-4d348b5e5199"
+
+const numbers = range(1, 5); // Example output: [1, 2, 3, 4, 5]
+
+const fileSize = convertFileSize(1024 * 1024 * 1024); // 1 GB
+\`\`\`
+`
+      }
+    }
+  }
+};
+const Example = () => {
+  const [uniqueId, setUniqueId] = (0, _react.useState)('');
+  const [rangeStart, setRangeStart] = (0, _react.useState)(1);
+  const [rangeEnd, setRangeEnd] = (0, _react.useState)(5);
+  const [numbers, setNumbers] = (0, _react.useState)([]);
+  const [fileSize, setFileSize] = (0, _react.useState)(1024);
+  const generateUniqueId = () => {
+    const id = (0, _helpers.uuid)();
+    setUniqueId(id);
+  };
+  const generateRange = () => {
+    // @ts-ignore - TS2345 - Argument of type 'number' is not assignable to parameter of type 'string'.
+    const start = parseInt(rangeStart, 10);
+    // @ts-ignore - TS2345 - Argument of type 'number' is not assignable to parameter of type 'string'.
+    const end = parseInt(rangeEnd, 10);
+    const generatedNumbers = (0, _helpers.range)(start, end);
+    // @ts-ignore - TS2345 - Argument of type 'number[]' is not assignable to parameter of type 'SetStateAction<never[]>'.
+    setNumbers(generatedNumbers);
+  };
+  return /*#__PURE__*/_react.default.createElement("div", null, /*#__PURE__*/_react.default.createElement(_Text.BodyLarge, {
+    className: _helpersStoriesModule.default.text
+  }, "This story showcases helper functions that can be used in different scenarios."), /*#__PURE__*/_react.default.createElement("div", {
+    className: _helpersStoriesModule.default.playground
+  }, /*#__PURE__*/_react.default.createElement("div", {
+    className: _helpersStoriesModule.default.playgroundItem
+  }, /*#__PURE__*/_react.default.createElement(_Text.BodyLarge, null, "Generated Unique ID: ", uniqueId), /*#__PURE__*/_react.default.createElement(_Button.Button, {
+    onClick: generateUniqueId
+  }, "Generate Unique ID")), /*#__PURE__*/_react.default.createElement("div", {
+    className: _helpersStoriesModule.default.playgroundItem
+  }, /*#__PURE__*/_react.default.createElement(_Text.BodyLarge, null, "Generated Range: ", numbers.join(', ')), /*#__PURE__*/_react.default.createElement("div", null, /*#__PURE__*/_react.default.createElement("label", {
+    htmlFor: "rangeStart"
+  }, "Start:"), /*#__PURE__*/_react.default.createElement(_Input.Input, {
+    type: "number",
+    id: "rangeStart"
+    // @ts-ignore - TS2769 - No overload matches this call.
+    ,
+    value: rangeStart
+    // @ts-ignore - TS2345 - Argument of type 'string' is not assignable to parameter of type 'SetStateAction<number>'.
+    ,
+    onChange: event => setRangeStart(event.target.value)
+  })), /*#__PURE__*/_react.default.createElement("div", null, /*#__PURE__*/_react.default.createElement("label", {
+    htmlFor: "rangeEnd"
+  }, "End:"), /*#__PURE__*/_react.default.createElement(_Input.Input, {
+    type: "number",
+    id: "rangeEnd"
+    // @ts-ignore - TS2769 - No overload matches this call.
+    ,
+    value: rangeEnd
+    // @ts-ignore - TS2345 - Argument of type 'string' is not assignable to parameter of type 'SetStateAction<number>'.
+    ,
+    onChange: event => setRangeEnd(event.target.value)
+  })), /*#__PURE__*/_react.default.createElement(_Button.Button, {
+    onClick: generateRange
+  }, "Generate Range")), /*#__PURE__*/_react.default.createElement("div", {
+    className: _helpersStoriesModule.default.playgroundItem
+  }, /*#__PURE__*/_react.default.createElement(_Text.BodyLarge, null, "Generated File Size: ", (0, _helpers.convertFileSize)(parseInt(fileSize))), /*#__PURE__*/_react.default.createElement("div", null, /*#__PURE__*/_react.default.createElement(_Input.Input, {
+    type: "number",
+    id: "rangeStart"
+    // @ts-ignore - TS2769 - No overload matches this call.
+    ,
+    value: fileSize || 0,
+    onChange: event => setFileSize(parseInt(event.target.value))
+  })))));
+};
+exports.Example = Example;

package/lib/utils/helpers/index.d.ts

@@ -0,0 +1,2 @@
+export * from './helpers';
+//# sourceMappingURL=index.d.ts.map

package/lib/utils/helpers/index.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../src/utils/helpers/index.ts"],"names":[],"mappings":"AAAA,cAAc,WAAW,CAAC"}

package/lib/utils/index.d.ts

@@ -0,0 +1,15 @@
+export * from './array';
+export * from './charts';
+export * from './classify';
+export * from './click-away';
+export * from './date-range-picker';
+export * from './dom';
+export * from './helpers';
+export * from './makeClassNameComponent';
+export * from './menu';
+export * from './merge-refs';
+export * from './rating';
+export * from './score-bar';
+export * from './string';
+export * from './tokens';
+//# sourceMappingURL=index.d.ts.map

package/lib/utils/index.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../src/utils/index.ts"],"names":[],"mappings":"AAAA,cAAc,SAAS,CAAC;AACxB,cAAc,UAAU,CAAC;AACzB,cAAc,YAAY,CAAC;AAC3B,cAAc,cAAc,CAAC;AAC7B,cAAc,qBAAqB,CAAC;AACpC,cAAc,OAAO,CAAC;AACtB,cAAc,WAAW,CAAC;AAC1B,cAAc,0BAA0B,CAAC;AACzC,cAAc,QAAQ,CAAC;AACvB,cAAc,cAAc,CAAC;AAC7B,cAAc,UAAU,CAAC;AACzB,cAAc,aAAa,CAAC;AAC5B,cAAc,UAAU,CAAC;AACzB,cAAc,UAAU,CAAC"}

package/lib/utils/makeClassNameComponent/index.d.ts

@@ -0,0 +1,2 @@
+export * from './makeClassNameComponent';
+//# sourceMappingURL=index.d.ts.map

package/lib/utils/makeClassNameComponent/index.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../src/utils/makeClassNameComponent/index.ts"],"names":[],"mappings":"AAAA,cAAc,0BAA0B,CAAC"}

package/lib/utils/makeClassNameComponent/makeClassNameComponent.d.ts

@@ -0,0 +1,9 @@
+import { Flow } from 'flow-to-typescript-codemod';
+import * as React from 'react';
+export declare function nameHoc<C, T extends React.ComponentType<C>, C2>(WrapperComponent: T, WrappedComponent: React.ComponentType<C2>, hocName: string): T;
+export type ClassNameComponent<T = 'div', I = React.ElementRef<T>> = Flow.AbstractComponent<ComponentProps<T>, I>;
+export declare function makeClassNameComponent<C extends string>(baseClassName: string, ComponentType?: C, name?: string): Flow.AbstractComponent<ComponentProps<C>, React.ElementRef<C>>;
+export declare function makeClassNameComponentCustom<C extends Readonly<{
+    className?: string;
+}>, B>(baseClassName: string, ComponentType: Flow.AbstractComponent<C, B>): Flow.AbstractComponent<C, B>;
+//# sourceMappingURL=makeClassNameComponent.d.ts.map

package/lib/utils/makeClassNameComponent/makeClassNameComponent.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"makeClassNameComponent.d.ts","sourceRoot":"","sources":["../../../src/utils/makeClassNameComponent/makeClassNameComponent.tsx"],"names":[],"mappings":"AAAA,OAAO,EAAC,IAAI,EAAC,MAAM,4BAA4B,CAAC;AAChD,OAAO,KAAK,KAAK,MAAM,OAAO,CAAC;AAK/B,wBAAgB,OAAO,CAAC,CAAC,EAAE,CAAC,SAAS,KAAK,CAAC,aAAa,CAAC,CAAC,CAAC,EAAE,EAAE,EAC7D,gBAAgB,EAAE,CAAC,EACnB,gBAAgB,EAAE,KAAK,CAAC,aAAa,CAAC,EAAE,CAAC,EACzC,OAAO,EAAE,MAAM,GACd,CAAC,CAKH;AAGD,MAAM,MAAM,kBAAkB,CAAC,CAAC,GAAG,KAAK,EAAE,CAAC,GAAG,KAAK,CAAC,UAAU,CAAC,CAAC,CAAC,IAAI,IAAI,CAAC,iBAAiB,CAAC,cAAc,CAAC,CAAC,CAAC,EAAE,CAAC,CAAC,CAAC;AAElH,wBAAgB,sBAAsB,CAAC,CAAC,SAAS,MAAM,EAAE,aAAa,EAAE,MAAM,EAAE,aAAa,GAAE,CAAS,EAAE,IAAI,CAAC,EAAE,MAAM,GAAG,IAAI,CAAC,iBAAiB,CAAC,cAAc,CAAC,CAAC,CAAC,EAAE,KAAK,CAAC,UAAU,CAAC,CAAC,CAAC,CAAC,CAYvL;AAED,wBAAgB,4BAA4B,CAAC,CAAC,SAAS,QAAQ,CAAC;IAC9D,SAAS,CAAC,EAAE,MAAM,CAAC;CACpB,CAAC,EAAE,CAAC,EAAE,aAAa,EAAE,MAAM,EAAE,aAAa,EAAE,IAAI,CAAC,iBAAiB,CAAC,CAAC,EAAE,CAAC,CAAC,GAAG,IAAI,CAAC,iBAAiB,CAAC,CAAC,EAAE,CAAC,CAAC,CAiBvG"}

package/lib/utils/makeClassNameComponent/makeClassNameComponent.js

@@ -16,11 +16,15 @@ function nameHoc(WrapperComponent, WrappedComponent, hocName) {
   WrapperComponent.displayName = `${hocName}(${wrappedComponentName})`;
   return WrapperComponent;
 }
+
+// @ts-ignore - TS2322 - Type 'T' is not assignable to type 'ComponentType<P>'.
+
+// @ts-ignore - TS2322 - Type 'C' is not assignable to type 'ComponentType<P>'.
 function makeClassNameComponent(baseClassName) {
   let ComponentType = arguments.length > 1 && arguments[1] !== undefined ? arguments[1] : 'div';
   let name = arguments.length > 2 ? arguments[2] : undefined;
   return /*#__PURE__*/React.forwardRef(
-  // $FlowFixMe[escaped-generic]
+  // @ts-ignore - TS7031 - Binding element 'className' implicitly has an 'any' type. | TS7006 - Parameter 'ref' implicitly has an 'any' type.
   nameComponent((_ref, ref) => {
     let {
       className,
@@ -28,7 +32,7 @@ function makeClassNameComponent(baseClassName) {
     } = _ref;
     return (
       /*#__PURE__*/
-      // $FlowFixMe[escaped-generic]
+      // @ts-ignore - TS2604 - JSX element type 'ComponentType' does not have any construct or call signatures.
       React.createElement(ComponentType, _extends({}, props, {
         ref: ref,
         className: (0, _classify.default)(baseClassName, className)
@@ -37,17 +41,27 @@ function makeClassNameComponent(baseClassName) {
   }, `CNC(${name || ComponentType})`));
 }
 function makeClassNameComponentCustom(baseClassName, ComponentType) {
-  return /*#__PURE__*/React.forwardRef(nameHoc((_ref2, ref) => {
+  return /*#__PURE__*/React.forwardRef(
+  // @ts-ignore - TS2345 - Argument of type 'ComponentType<unknown>' is not assignable to parameter of type 'ForwardRefRenderFunction<B, unknown>'.
+  nameHoc(
+  // @ts-ignore - TS2345 - Argument of type '({ className, ...props }: { [x: string]: any; className: any; }, ref: any) => Element' is not assignable to parameter of type 'ComponentType<unknown>'. | TS7031 - Binding element 'className' implicitly has an 'any' type. | TS7006 - Parameter 'ref' implicitly has an 'any' type.
+  (_ref2, ref) => {
     let {
       className,
       ...props
     } = _ref2;
-    return /*#__PURE__*/React.createElement(ComponentType, _extends({}, props, {
-      ref: ref,
-      className: (0, _classify.default)(baseClassName, className)
-    }));
+    return (
+      /*#__PURE__*/
+      // @ts-ignore - TS2769 - No overload matches this call.
+      React.createElement(ComponentType, _extends({}, props, {
+        ref: ref,
+        className: (0, _classify.default)(baseClassName, className)
+      }))
+    );
   }, ComponentType, 'CNC'));
 }
+
+// @ts-ignore - TS7006 - Parameter 'component' implicitly has an 'any' type.
 function nameComponent(component, name) {
   component.displayName = name;
   return component;

package/lib/utils/makeClassNameComponent/makeClassNameComponent.stories.d.ts

@@ -0,0 +1,15 @@
+import React from 'react';
+declare const _default: {
+    tags: string[];
+    title: string;
+    parameters: {
+        docs: {
+            description: {
+                component: string;
+            };
+        };
+    };
+};
+export default _default;
+export declare const Example: () => React.ReactElement<React.ComponentProps<"div">>;
+//# sourceMappingURL=makeClassNameComponent.stories.d.ts.map

package/lib/utils/makeClassNameComponent/makeClassNameComponent.stories.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"makeClassNameComponent.stories.d.ts","sourceRoot":"","sources":["../../../src/utils/makeClassNameComponent/makeClassNameComponent.stories.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAiB,MAAM,OAAO,CAAC;;;;;;;;;;;;AAOtC,wBAwBE;AAEF,eAAO,MAAM,OAAO,QAAO,KAAK,CAAC,YAAY,CAAC,KAAK,CAAC,cAAc,CAAC,KAAK,CAAC,CAYxE,CAAC"}

package/lib/utils/makeClassNameComponent/makeClassNameComponent.stories.js

@@ -0,0 +1,44 @@
+"use strict";
+
+Object.defineProperty(exports, "__esModule", {
+  value: true
+});
+exports.default = exports.Example = void 0;
+var _react = _interopRequireWildcard(require("react"));
+var _makeClassNameComponent = require("./makeClassNameComponent");
+var _makeClassNameComponentStoriesModule = _interopRequireDefault(require("./makeClassNameComponent.stories.module.css"));
+function _interopRequireDefault(e) { return e && e.__esModule ? e : { default: e }; }
+function _interopRequireWildcard(e, t) { if ("function" == typeof WeakMap) var r = new WeakMap(), n = new WeakMap(); return (_interopRequireWildcard = function (e, t) { if (!t && e && e.__esModule) return e; var o, i, f = { __proto__: null, default: e }; if (null === e || "object" != typeof e && "function" != typeof e) return f; if (o = t ? n : r) { if (o.has(e)) return o.get(e); o.set(e, f); } for (const t in e) "default" !== t && {}.hasOwnProperty.call(e, t) && ((i = (o = Object.defineProperty) && Object.getOwnPropertyDescriptor(e, t)) && (i.get || i.set) ? o(f, t, i) : f[t] = e[t]); return f; })(e, t); }
+var _default = exports.default = {
+  tags: ['autodocs'],
+  title: 'Utils/Make Class Name Component',
+  parameters: {
+    docs: {
+      description: {
+        component: `
+\`\`\`js
+import { makeClassNameComponent } from "@spaced-out/ui-design-system/lib/utils/makeClassNameComponent";
+\`\`\`
+This story showcases the utility functions \`makeClassNameComponent\` and \`makeClassNameComponentCustom\`.
+
+### \`makeClassNameComponent\`
+The \`makeClassNameComponent\` function creates a higher-order component (HOC) that adds a base class name and combines it with the existing class name.
+
+### \`makeClassNameComponentCustom\`
+The \`makeClassNameComponentCustom\` function is similar to \`makeClassNameComponent\`, but allows you to use a custom component as the base component.
+
+### Usage
+Please refer to the individual functions for usage examples.
+`
+      }
+    }
+  }
+};
+const Example = () => {
+  const [className] = (0, _react.useState)('');
+  const ClassNameDiv = (0, _makeClassNameComponent.makeClassNameComponent)(_makeClassNameComponentStoriesModule.default.container, 'div');
+  return /*#__PURE__*/_react.default.createElement("div", null, /*#__PURE__*/_react.default.createElement(ClassNameDiv, {
+    className: className
+  }, "I'm a div created with make className component"));
+};
+exports.Example = Example;

package/lib/utils/menu/index.d.ts

@@ -0,0 +1,2 @@
+export * from './menu';
+//# sourceMappingURL=index.d.ts.map

package/lib/utils/menu/index.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../src/utils/menu/index.ts"],"names":[],"mappings":"AAAA,cAAc,QAAQ,CAAC"}

package/lib/utils/menu/menu.d.ts

@@ -0,0 +1,20 @@
+import * as React from 'react';
+import type { MenuGroupTitleOption, MenuOption } from '../../components/Menu';
+export declare const getSelectedKeysFromSelectedOption: (currentOption?: MenuOption, currentSelectedKeys?: Array<string>) => Array<string>;
+export declare const getTextLabelFromSelectedKeys: (currentSelectedKeys?: Array<string>, options?: MenuOption[]) => string;
+export declare const getButtonLabelFromSelectedKeys: (currentSelectedKeys?: Array<string>, label?: React.ReactNode) => React.ReactNode;
+export declare const getOptionFromKey: (options?: MenuOption[], key?: string) => MenuOption | null | undefined;
+export declare const getOptionsFromKeys: (options?: MenuOption[], keys?: Array<string>) => Array<MenuOption>;
+export declare const getFilteredOptionsFromSearchText: (options: MenuOption[], searchText: string) => MenuOption[];
+export declare const getFilteredOptionsResultText: (options: MenuOption[], staticLabels: {
+    [key: string]: string;
+}) => string;
+export declare const getFilteredComposeOptionsFromSearchText: (composeOptions: Array<Array<MenuOption>>, searchText: string) => Array<Array<MenuOption>>;
+export declare const getFilteredComposeOptionsResultText: (composeOptions: Array<Array<MenuOption>>, staticLabels: {
+    [key: string]: string;
+}) => string;
+export declare const getFilteredGroupTitleOptionsFromSearchText: (groupTitleOptions: Array<MenuGroupTitleOption>, searchText: string) => Array<MenuGroupTitleOption>;
+export declare const getFilteredGroupTitleOptionsResultText: (groupTitleOptions: Array<MenuGroupTitleOption>, staticLabels: {
+    [key: string]: string;
+}) => string;
+//# sourceMappingURL=menu.d.ts.map

package/lib/utils/menu/menu.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"menu.d.ts","sourceRoot":"","sources":["../../../src/utils/menu/menu.ts"],"names":[],"mappings":"AAAA,OAAO,KAAK,KAAK,MAAM,OAAO,CAAC;AAE/B,OAAO,KAAK,EAAC,oBAAoB,EAAE,UAAU,EAAC,MAAM,uBAAuB,CAAC;AAG5E,eAAO,MAAM,iCAAiC,GAAI,gBAAgB,UAAU,EAAE,sBAAsB,KAAK,CAAC,MAAM,CAAC,KAAG,KAAK,CAAC,MAAM,CAgB/H,CAAC;AAEF,eAAO,MAAM,4BAA4B,GAAI,sBAAsB,KAAK,CAAC,MAAM,CAAC,EAAE,UAAU,UAAU,EAAE,KAAG,MAQ1G,CAAC;AAEF,eAAO,MAAM,8BAA8B,GAAI,sBAAsB,KAAK,CAAC,MAAM,CAAC,EAAE,QAAQ,KAAK,CAAC,SAAS,oBAU1G,CAAC;AAEF,eAAO,MAAM,gBAAgB,GAAI,UAAU,UAAU,EAAE,EAAE,MAAM,MAAM,KAAG,UAAU,GAAG,IAAI,GAAG,SAM3F,CAAC;AAEF,eAAO,MAAM,kBAAkB,GAAI,UAAU,UAAU,EAAE,EAAE,OAAO,KAAK,CAAC,MAAM,CAAC,KAAG,KAAK,CAAC,UAAU,CAWjG,CAAC;AAEF,eAAO,MAAM,gCAAgC,GAAI,SAAS,UAAU,EAAE,EAAE,YAAY,MAAM,KAAG,UAAU,EAQtG,CAAC;AAEF,eAAO,MAAM,4BAA4B,GACvC,SAAS,UAAU,EAAE,EACrB,cAAc;IACZ,CAAC,GAAG,EAAE,MAAM,GAAG,MAAM,CAAC;CACvB,KACA,MAaF,CAAC;AAEF,eAAO,MAAM,uCAAuC,GAAI,gBAAgB,KAAK,CAAC,KAAK,CAAC,UAAU,CAAC,CAAC,EAAE,YAAY,MAAM,KAAG,KAAK,CAAC,KAAK,CAAC,UAAU,CAAC,CAY7I,CAAC;AAEF,eAAO,MAAM,mCAAmC,GAC9C,gBAAgB,KAAK,CAAC,KAAK,CAAC,UAAU,CAAC,CAAC,EACxC,cAAc;IACZ,CAAC,GAAG,EAAE,MAAM,GAAG,MAAM,CAAC;CACvB,KACA,MAeF,CAAC;AAEF,eAAO,MAAM,0CAA0C,GAAI,mBAAmB,KAAK,CAAC,oBAAoB,CAAC,EAAE,YAAY,MAAM,KAAG,KAAK,CAAC,oBAAoB,CAiBzJ,CAAC;AAEF,eAAO,MAAM,sCAAsC,GACjD,mBAAmB,KAAK,CAAC,oBAAoB,CAAC,EAC9C,cAAc;IACZ,CAAC,GAAG,EAAE,MAAM,GAAG,MAAM,CAAC;CACvB,KACA,MAiBF,CAAC"}

package/lib/utils/menu/menu.js

@@ -4,8 +4,6 @@ Object.defineProperty(exports, "__esModule", {
   value: true
 });
 exports.getTextLabelFromSelectedKeys = exports.getSelectedKeysFromSelectedOption = exports.getOptionsFromKeys = exports.getOptionFromKey = exports.getFilteredOptionsResultText = exports.getFilteredOptionsFromSearchText = exports.getFilteredGroupTitleOptionsResultText = exports.getFilteredGroupTitleOptionsFromSearchText = exports.getFilteredComposeOptionsResultText = exports.getFilteredComposeOptionsFromSearchText = exports.getButtonLabelFromSelectedKeys = void 0;
-var React = _interopRequireWildcard(require("react"));
-function _interopRequireWildcard(e, t) { if ("function" == typeof WeakMap) var r = new WeakMap(), n = new WeakMap(); return (_interopRequireWildcard = function (e, t) { if (!t && e && e.__esModule) return e; var o, i, f = { __proto__: null, default: e }; if (null === e || "object" != typeof e && "function" != typeof e) return f; if (o = t ? n : r) { if (o.has(e)) return o.get(e); o.set(e, f); } for (const t in e) "default" !== t && {}.hasOwnProperty.call(e, t) && ((i = (o = Object.defineProperty) && Object.getOwnPropertyDescriptor(e, t)) && (i.get || i.set) ? o(f, t, i) : f[t] = e[t]); return f; })(e, t); }
 const getSelectedKeysFromSelectedOption = (currentOption, currentSelectedKeys) => {
   if (!Array.isArray(currentSelectedKeys) || !currentOption?.key) {
     return [];

package/lib/utils/merge-refs/index.d.ts

@@ -0,0 +1,2 @@
+export * from './merge-refs';
+//# sourceMappingURL=index.d.ts.map

package/lib/utils/merge-refs/index.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../src/utils/merge-refs/index.ts"],"names":[],"mappings":"AAAA,cAAc,cAAc,CAAC"}

package/lib/utils/merge-refs/merge-refs.d.ts

@@ -0,0 +1,4 @@
+export declare function mergeRefs(refs: Array<{
+    current: HTMLElement | null | undefined;
+}>): (value?: HTMLElement | null | undefined) => void;
+//# sourceMappingURL=merge-refs.d.ts.map

package/lib/utils/merge-refs/merge-refs.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"merge-refs.d.ts","sourceRoot":"","sources":["../../../src/utils/merge-refs/merge-refs.ts"],"names":[],"mappings":"AAAA,wBAAgB,SAAS,CACvB,IAAI,EAAE,KAAK,CAAC;IACV,OAAO,EAAE,WAAW,GAAG,IAAI,GAAG,SAAS,CAAC;CACzC,CAAC,GACD,CAAC,KAAK,CAAC,EAAE,WAAW,GAAG,IAAI,GAAG,SAAS,KAAK,IAAI,CAWlD"}

package/lib/utils/merge-refs/merge-refs.js

@@ -8,6 +8,7 @@ function mergeRefs(refs) {
   return value => {
     refs.forEach(ref => {
       if (typeof ref === 'function') {
+        // @ts-ignore - TS2349 - This expression is not callable.
         ref(value);
       } else if (ref != null) {
         ref.current = value;

package/lib/utils/merge-refs/merge-refs.stories.d.ts

@@ -0,0 +1,15 @@
+import React from 'react';
+declare const _default: {
+    tags: string[];
+    title: string;
+    parameters: {
+        docs: {
+            description: {
+                component: string;
+            };
+        };
+    };
+};
+export default _default;
+export declare const Example: () => React.ReactElement<React.ComponentProps<"div">>;
+//# sourceMappingURL=merge-refs.stories.d.ts.map

package/lib/utils/merge-refs/merge-refs.stories.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"merge-refs.stories.d.ts","sourceRoot":"","sources":["../../../src/utils/merge-refs/merge-refs.stories.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAyB,MAAM,OAAO,CAAC;;;;;;;;;;;;AAW9C,wBAqBE;AAEF,eAAO,MAAM,OAAO,QAAO,KAAK,CAAC,YAAY,CAAC,KAAK,CAAC,cAAc,CAAC,KAAK,CAAC,CAyDxE,CAAC"}

package/lib/utils/merge-refs/merge-refs.stories.js

@@ -0,0 +1,86 @@
+"use strict";
+
+Object.defineProperty(exports, "__esModule", {
+  value: true
+});
+exports.default = exports.Example = void 0;
+var _react = _interopRequireWildcard(require("react"));
+var _Button = require("../../components/Button");
+var _Input = require("../../components/Input");
+var _Text = require("../../components/Text");
+var _mergeRefs = require("./merge-refs");
+var _mergeRefsStoriesModule = _interopRequireDefault(require("./merge-refs.stories.module.css"));
+function _interopRequireDefault(e) { return e && e.__esModule ? e : { default: e }; }
+function _interopRequireWildcard(e, t) { if ("function" == typeof WeakMap) var r = new WeakMap(), n = new WeakMap(); return (_interopRequireWildcard = function (e, t) { if (!t && e && e.__esModule) return e; var o, i, f = { __proto__: null, default: e }; if (null === e || "object" != typeof e && "function" != typeof e) return f; if (o = t ? n : r) { if (o.has(e)) return o.get(e); o.set(e, f); } for (const t in e) "default" !== t && {}.hasOwnProperty.call(e, t) && ((i = (o = Object.defineProperty) && Object.getOwnPropertyDescriptor(e, t)) && (i.get || i.set) ? o(f, t, i) : f[t] = e[t]); return f; })(e, t); }
+var _default = exports.default = {
+  tags: ['autodocs'],
+  title: 'Utils/Merge Refs',
+  parameters: {
+    docs: {
+      description: {
+        component: `
+\`\`\`js
+import { mergeRefs } from "@spaced-out/ui-design-system/lib/utils/merge-refs";
+\`\`\`
+This story showcases the \`mergeRefs\` utility function.
+
+### \`mergeRefs\`
+The \`mergeRefs\` function combines multiple ref objects into a single ref function or object. It allows you to merge refs from different sources and use them together.
+
+### Usage
+Please refer to the function for a usage example.
+`
+      }
+    }
+  }
+};
+const Example = () => {
+  const [inputValue, setInputValue] = (0, _react.useState)('');
+  const [inputValue1, setInputValue1] = (0, _react.useState)('');
+  const inputRef1 = (0, _react.useRef)(null);
+  const inputRef2 = (0, _react.useRef)(null);
+  const handleInputChange = event => {
+    setInputValue(event.target.value);
+  };
+  const handleInputChange1 = event => {
+    setInputValue1(event.target.value);
+  };
+  const handleClearButtonClick = () => {
+    setInputValue('');
+    setInputValue1('');
+    // @ts-ignore - TS2339 - Property 'focus' does not exist on type 'never'.
+    inputRef1.current?.focus();
+    // @ts-ignore - TS2531 - Object is possibly 'null'.
+    inputRef1.current.value = '';
+    // @ts-ignore - TS2531 - Object is possibly 'null'.
+    inputRef2.current.value = '';
+  };
+  const handleMergeRefs = (0, _mergeRefs.mergeRefs)([inputRef1, inputRef2]);
+  return /*#__PURE__*/_react.default.createElement("div", null, /*#__PURE__*/_react.default.createElement(_Text.BodyLarge, {
+    className: _mergeRefsStoriesModule.default.text
+  }, "This story showcases the mergeRefs utility function."), /*#__PURE__*/_react.default.createElement("div", {
+    className: _mergeRefsStoriesModule.default.text
+  }, /*#__PURE__*/_react.default.createElement(_Input.Input
+  // @ts-ignore - TS2769 - No overload matches this call.
+  , {
+    id: "input1",
+    label: "Input 1",
+    type: "text",
+    value: inputValue,
+    onChange: handleInputChange,
+    ref: handleMergeRefs
+  }), /*#__PURE__*/_react.default.createElement(_Input.Input
+  // @ts-ignore - TS2769 - No overload matches this call.
+  , {
+    id: "input2",
+    label: "Input 2",
+    type: "text",
+    value: inputValue1,
+    onChange: handleInputChange1,
+    ref: handleMergeRefs
+  })), /*#__PURE__*/_react.default.createElement(_Button.Button, {
+    className: _mergeRefsStoriesModule.default.button,
+    onClick: handleClearButtonClick
+  }, "Clear Inputs"));
+};
+exports.Example = Example;

package/lib/utils/rating/index.d.ts

@@ -0,0 +1,2 @@
+export * from './rating';
+//# sourceMappingURL=index.d.ts.map

package/lib/utils/rating/index.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../src/utils/rating/index.ts"],"names":[],"mappings":"AAAA,cAAc,UAAU,CAAC"}

package/lib/utils/rating/rating.d.ts

@@ -0,0 +1,13 @@
+export declare const RATING_ERRORS: Readonly<{
+    INVALID_RANGE: {
+        type: string;
+        description: string;
+    };
+    INVALID_RATING_LABELS: {
+        type: string;
+        description: string;
+    };
+}>;
+export declare const RATINGS: Array<string>;
+export declare const getRatingLabel: (rating: number, labels: Array<string>) => string;
+//# sourceMappingURL=rating.d.ts.map

package/lib/utils/rating/rating.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"rating.d.ts","sourceRoot":"","sources":["../../../src/utils/rating/rating.ts"],"names":[],"mappings":"AAAA,eAAO,MAAM,aAAa;;;;;;;;;EAUxB,CAAC;AAEH,eAAO,MAAM,OAAO,EAAE,KAAK,CAAC,MAAM,CAOjC,CAAC;AAEF,eAAO,MAAM,cAAc,GAAI,QAAQ,MAAM,EAAE,QAAQ,KAAK,CAAC,MAAM,CAAC,KAAG,MAQtE,CAAC"}

package/lib/utils/score-bar/index.d.ts

@@ -0,0 +1,2 @@
+export * from './score-bar';
+//# sourceMappingURL=index.d.ts.map

package/lib/utils/score-bar/index.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../src/utils/score-bar/index.ts"],"names":[],"mappings":"AAAA,cAAc,aAAa,CAAC"}

package/lib/utils/score-bar/score-bar.d.ts

@@ -0,0 +1,10 @@
+import type { ScoreBarColorMap, ScoreBarLabelMap } from '../../components/ScoreBar';
+export declare const getColorByScorePercentage: (totalBars: number, score: number, currentBarNumber: number, colorMap: ScoreBarColorMap) => string;
+export declare const getLabelByScorePercentage: (score: number, totalBars: number, labelMap?: ScoreBarLabelMap) => string;
+export declare const SCORE_BAR_ERRORS: Readonly<{
+    INVALID_BAR_COUNT: {
+        type: string;
+        description: string;
+    };
+}>;
+//# sourceMappingURL=score-bar.d.ts.map

package/lib/utils/score-bar/score-bar.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"score-bar.d.ts","sourceRoot":"","sources":["../../../src/utils/score-bar/score-bar.ts"],"names":[],"mappings":"AAAA,OAAO,KAAK,EAAC,gBAAgB,EAAE,gBAAgB,EAAC,MAAM,2BAA2B,CAAC;AAclF,eAAO,MAAM,yBAAyB,GACpC,WAAW,MAAM,EACjB,OAAO,MAAM,EACb,kBAAkB,MAAM,EACxB,UAAU,gBAAgB,KACzB,MAQF,CAAC;AAEF,eAAO,MAAM,yBAAyB,GAAI,OAAO,MAAM,EAAE,WAAW,MAAM,EAAE,WAAW,gBAAgB,KAAG,MAQzG,CAAC;AAEF,eAAO,MAAM,gBAAgB;;;;;EAK3B,CAAC"}

package/lib/utils/string/index.d.ts

@@ -0,0 +1,2 @@
+export * from './string';
+//# sourceMappingURL=index.d.ts.map

package/lib/utils/string/index.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../src/utils/string/index.ts"],"names":[],"mappings":"AAAA,cAAc,UAAU,CAAC"}

package/lib/utils/string/string.d.ts

@@ -0,0 +1,6 @@
+export declare const capitalize: (word: string) => string;
+export declare const escapeRegExp: (str: string) => string;
+export declare const formatWord: (word: string, count: number) => string;
+export declare const truncateString: (inputString: string, maxLength: number) => string;
+export declare const appendPx: (value?: number | string) => string;
+//# sourceMappingURL=string.d.ts.map

package/lib/utils/string/string.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"string.d.ts","sourceRoot":"","sources":["../../../src/utils/string/string.ts"],"names":[],"mappings":"AAAA,eAAO,MAAM,UAAU,GAAI,MAAM,MAAM,KAAG,MAOzC,CAAC;AAEF,eAAO,MAAM,YAAY,GAAI,KAAK,MAAM,KAAG,MAAyD,CAAC;AAErG,eAAO,MAAM,UAAU,GAAI,MAAM,MAAM,EAAE,OAAO,MAAM,KAAG,MAAyC,CAAC;AAEnG,eAAO,MAAM,cAAc,GAAI,aAAa,MAAM,EAAE,WAAW,MAAM,KAAG,MAKvE,CAAC;AAEF,eAAO,MAAM,QAAQ,GAAI,QAAQ,MAAM,GAAG,MAAM,KAAG,MAKlD,CAAC"}

package/lib/utils/string/string.stories.d.ts

@@ -0,0 +1,15 @@
+import React from 'react';
+declare const _default: {
+    tags: string[];
+    title: string;
+    parameters: {
+        docs: {
+            description: {
+                component: string;
+            };
+        };
+    };
+};
+export default _default;
+export declare const Example: () => React.ReactElement<React.ComponentProps<"div">>;
+//# sourceMappingURL=string.stories.d.ts.map

package/lib/utils/string/string.stories.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"string.stories.d.ts","sourceRoot":"","sources":["../../../src/utils/string/string.stories.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,MAAM,OAAO,CAAC;;;;;;;;;;;;AAW1B,wBAwBE;AAEF,eAAO,MAAM,OAAO,QAAO,KAAK,CAAC,YAAY,CAAC,KAAK,CAAC,cAAc,CAAC,KAAK,CAAC,CAiCxE,CAAC"}

package/lib/utils/string/string.stories.js

@@ -0,0 +1,63 @@
+"use strict";
+
+Object.defineProperty(exports, "__esModule", {
+  value: true
+});
+exports.default = exports.Example = void 0;
+var _react = _interopRequireDefault(require("react"));
+var _Input = require("../../components/Input");
+var _Text = require("../../components/Text");
+var _useInputState = require("../../hooks/useInputState/useInputState");
+var _string = require("./string");
+var _stringStoriesModule = _interopRequireDefault(require("./string.stories.module.css"));
+function _interopRequireDefault(e) { return e && e.__esModule ? e : { default: e }; }
+var _default = exports.default = {
+  tags: ['autodocs'],
+  title: 'Utils/String',
+  parameters: {
+    docs: {
+      description: {
+        component: `
+\`\`\`js
+import { capitalize, escapeRegExp, formatWord, truncateString } from "@spaced-out/ui-design-system/lib/utils/string";
+\`\`\`
+This story showcases various utility functions for string manipulation.
+
+### Utility Functions
+- \`capitalize\`: Capitalizes the first letter of a word.
+- \`escapeRegExp\`: Escapes special characters in a regular expression string.
+- \`formatWord\`: Formats a word based on a count, adding an "s" for plural.
+- \`truncateString\`: Truncates a string based on a maxLength, adding ellipsis "..." at the end.
+
+### Usage
+Please refer to the individual functions for usage examples.
+`
+      }
+    }
+  }
+};
+const Example = () => {
+  const [value, onChange] = (0, _useInputState.useInputState)('');
+  const count = 3;
+  const maxLength = 5;
+  return /*#__PURE__*/_react.default.createElement("div", null, /*#__PURE__*/_react.default.createElement(_Text.BodyLarge, {
+    className: _stringStoriesModule.default.text
+  }, "This story showcases various utility functions for string manipulation."), /*#__PURE__*/_react.default.createElement(_Input.Input, {
+    classNames: {
+      box: _stringStoriesModule.default.text
+    },
+    label: "Original Word",
+    placeholder: "Type a word here",
+    value: value,
+    onChange: onChange
+  }), /*#__PURE__*/_react.default.createElement(_Text.BodyLarge, {
+    className: _stringStoriesModule.default.text
+  }, /*#__PURE__*/_react.default.createElement("strong", null, "Capitalized Word:"), " ", (0, _string.capitalize)(value)), /*#__PURE__*/_react.default.createElement(_Text.BodyLarge, {
+    className: _stringStoriesModule.default.text
+  }, /*#__PURE__*/_react.default.createElement("strong", null, "Escaped RegExp:"), " ", (0, _string.escapeRegExp)(`[${value}]`)), /*#__PURE__*/_react.default.createElement(_Text.BodyLarge, {
+    className: _stringStoriesModule.default.text
+  }, /*#__PURE__*/_react.default.createElement("strong", null, "Formatted Word:"), ' ', !!value.length && (0, _string.formatWord)(value, count)), /*#__PURE__*/_react.default.createElement(_Text.BodyLarge, {
+    className: _stringStoriesModule.default.text
+  }, /*#__PURE__*/_react.default.createElement("strong", null, "Truncated String:"), ' ', !!value.length && (0, _string.truncateString)(value, maxLength)));
+};
+exports.Example = Example;