suada-components 1.0.3

package/README.md

@@ -0,0 +1,63 @@
+# suada-components
+
+`suada-components` is a library of React components designed for rapid development and consistency across SUADA projects. This README outlines key information about the project setup, development practices, and how to contribute effectively.
+
+## Useful Links
+
+- **Release Notes**: Keep up with the latest updates and enhancements.
+- **Version Tags**: Track and utilize specific versions of the library.
+
+## IDE Recommendations
+
+To ensure a consistent development environment, we recommend using **Visual Studio Code**. Enhance your coding experience by installing the following VS Code extensions:
+
+- **Code Spell Checker**: Helps catch spelling errors in your code.
+- **ESLint**: Integrates ESLint into VS Code, highlighting and fixing code quality and style issues.
+- **EditorConfig**: Helps maintain consistent coding styles for multiple developers working on the same project.
+- **Prettier**: Automatically formats your code to ensure it adheres to a consistent style.
+
+## Node Version Management
+
+This project uses `asdf` for managing Node versions, ensuring that all contributors use the same version for consistency.
+
+1. Install `asdf` by following the instructions [here](https://asdf-vm.com/guide/getting-started.html).
+2. The required Node version is specified in the `.tool-versions` file.
+3. After installing `asdf`, install the Node version specified for this project with:
+   ```bash
+   asdf install nodejs <version>
+   ```
+
+## Installing Dependencies
+
+`suada-components` uses `yarn` for dependency management. Install `yarn` globally, then install the project dependencies:
+
+## Available Scripts
+
+Here are some of the scripts available in this project:
+
+| Script                | Description                                     |
+| --------------------- | ----------------------------------------------- |
+| `npm run storybook`   | Runs the component library in development mode. |
+| `npm run build`       | Builds the library for production.              |
+| `npm build-storybook` | Builds the Storybook for production.            |
+
+## Committing Guidelines
+
+We use **Commitlint** to ensure our commit messages are consistent and follow conventional commit format. Here's an example of a well-formed commit message:
+
+### Commit Types
+
+- **feat**: Introduces a new feature.
+- **fix**: Fixes a bug.
+- **chore**: Other changes that don't modify source or test files.
+- **style**: Changes that do not affect the meaning of the code (white-space, formatting).
+- **docs**: Documentation only changes.
+- **refactor**: A code change that neither fixes a bug nor adds a feature.
+- **perf**: A code change that improves performance.
+- **test**: Adding missing tests or correcting existing tests.
+- **build**: Changes that affect the build system or external dependencies.
+- **ci**: Changes to our CI configuration files and scripts.
+- **revert**: Reverts a previous commit.
+- **breaking**: Causes a major version increment.
+
+Adhering to these guidelines helps maintain a clean, manageable, and understandable commit history.

package/dist/App.d.ts

@@ -0,0 +1,3 @@
+import "./App.css";
+declare function App(): import("react/jsx-runtime").JSX.Element;
+export default App;

package/dist/App.js

@@ -0,0 +1,11 @@
+import { jsx as _jsx, jsxs as _jsxs, Fragment as _Fragment } from "react/jsx-runtime";
+import { useState } from "react";
+import reactLogo from "./assets/react.svg";
+import viteLogo from "/vite.svg";
+import "./App.css";
+function App() {
+    var _a = useState(0), count = _a[0], setCount = _a[1];
+    return (_jsxs(_Fragment, { children: [_jsxs("div", { children: [_jsx("a", { href: "https://vite.dev", target: "_blank", children: _jsx("img", { src: viteLogo, className: "logo", alt: "Vite logo" }) }), _jsx("a", { href: "https://react.dev", target: "_blank", children: _jsx("img", { src: reactLogo, className: "logo react", alt: "React logo" }) })] }), _jsx("h1", { children: "Vite + React" }), _jsxs("div", { className: "card", children: [_jsxs("button", { onClick: function () { return setCount(function (count) { return count + 1; }); }, children: ["count is ", count] }), _jsxs("p", { children: ["Edit ", _jsx("code", { children: "src/App.tsx" }), " and save to test HMR"] })] }), _jsx("p", { className: "read-the-docs", children: "Click on the Vite and React logos to learn more" })] }));
+}
+export default App;
+//# sourceMappingURL=App.js.map

package/dist/App.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"App.js","sourceRoot":"","sources":["../src/App.tsx"],"names":[],"mappings":";AAAA,OAAO,EAAE,QAAQ,EAAE,MAAM,OAAO,CAAC;AACjC,OAAO,SAAS,MAAM,oBAAoB,CAAC;AAC3C,OAAO,QAAQ,MAAM,WAAW,CAAC;AACjC,OAAO,WAAW,CAAC;AAGnB,SAAS,GAAG;IACJ,IAAA,KAAoB,QAAQ,CAAC,CAAC,CAAC,EAA9B,KAAK,QAAA,EAAE,QAAQ,QAAe,CAAC;IAEtC,OAAO,CACL,8BACE,0BACE,YAAG,IAAI,EAAC,kBAAkB,EAAC,MAAM,EAAC,QAAQ,YACxC,cAAK,GAAG,EAAE,QAAQ,EAAE,SAAS,EAAC,MAAM,EAAC,GAAG,EAAC,WAAW,GAAG,GACrD,EACJ,YAAG,IAAI,EAAC,mBAAmB,EAAC,MAAM,EAAC,QAAQ,YACzC,cAAK,GAAG,EAAE,SAAS,EAAE,SAAS,EAAC,YAAY,EAAC,GAAG,EAAC,YAAY,GAAG,GAC7D,IACA,EACN,wCAAqB,EACrB,eAAK,SAAS,EAAC,MAAM,aACnB,kBAAQ,OAAO,EAAE,cAAM,OAAA,QAAQ,CAAC,UAAC,KAAK,IAAK,OAAA,KAAK,GAAG,CAAC,EAAT,CAAS,CAAC,EAA9B,CAA8B,0BACzC,KAAK,IACR,EACT,iCACO,yCAAwB,6BAC3B,IACA,EACN,YAAG,SAAS,EAAC,eAAe,gEAExB,IACH,CACJ,CAAC;AACJ,CAAC;AAED,eAAe,GAAG,CAAC"}

package/dist/components/AudioPlayer/AudioPlayer.d.ts

@@ -0,0 +1,5 @@
+import React from 'react';
+export interface IAudioPlayerProps {
+    url: string;
+}
+export declare const AudioPlayer: (props: IAudioPlayerProps) => React.JSX.Element;

package/dist/components/AudioPlayer/AudioPlayer.js

@@ -0,0 +1,5 @@
+import { jsx as _jsx } from "react/jsx-runtime";
+export var AudioPlayer = function (props) {
+    return (_jsx("audio", { controls: true, autoPlay: true, children: _jsx("source", { src: props.url }) }));
+};
+//# sourceMappingURL=AudioPlayer.js.map

package/dist/components/AudioPlayer/AudioPlayer.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"AudioPlayer.js","sourceRoot":"","sources":["../../../src/components/AudioPlayer/AudioPlayer.tsx"],"names":[],"mappings":";AAMA,MAAM,CAAC,IAAM,WAAW,GAAG,UAAC,KAAwB;IAClD,OAAO,CACL,gBAAO,QAAQ,QAAC,QAAQ,kBACtB,iBAAQ,GAAG,EAAE,KAAK,CAAC,GAAG,GAAI,GACpB,CACT,CAAA;AACH,CAAC,CAAA"}

package/dist/components/AudioPlayer/AudioPlayer.stories.d.ts

@@ -0,0 +1,4 @@
+import { Meta } from '@storybook/react';
+declare const _default: Meta;
+export default _default;
+export declare const DefaultAudioPlayer: import("@storybook/core/types").AnnotatedStoryFn<import("@storybook/react").ReactRenderer, import("./AudioPlayer").IAudioPlayerProps>;

package/dist/components/AudioPlayer/AudioPlayer.stories.js

@@ -0,0 +1,33 @@
+var __assign = (this && this.__assign) || function () {
+    __assign = Object.assign || function(t) {
+        for (var s, i = 1, n = arguments.length; i < n; i++) {
+            s = arguments[i];
+            for (var p in s) if (Object.prototype.hasOwnProperty.call(s, p))
+                t[p] = s[p];
+        }
+        return t;
+    };
+    return __assign.apply(this, arguments);
+};
+import { jsx as _jsx } from "react/jsx-runtime";
+import { AudioPlayer } from './AudioPlayer';
+export default {
+    title: 'Components/AudioPLayer',
+    component: AudioPlayer,
+    tags: ['autodocs', 'audio-player'],
+    parameters: {
+        layout: 'centered',
+        controls: {
+            matchers: {
+                color: /(background|color)$/i,
+                date: /Date$/,
+            },
+        },
+    },
+};
+var Template = function (args) { return _jsx(AudioPlayer, __assign({}, args)); };
+export var DefaultAudioPlayer = Template.bind({});
+DefaultAudioPlayer.args = {
+    url: 'https://test-streams.mux.dev/x36xhzz/x36xhzz.m3u8',
+};
+//# sourceMappingURL=AudioPlayer.stories.js.map

package/dist/components/AudioPlayer/AudioPlayer.stories.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"AudioPlayer.stories.js","sourceRoot":"","sources":["../../../src/components/AudioPlayer/AudioPlayer.stories.tsx"],"names":[],"mappings":";;;;;;;;;;;;AAEA,OAAO,EAAE,WAAW,EAAE,MAAM,eAAe,CAAA;AAE3C,eAAe;IACb,KAAK,EAAE,wBAAwB;IAC/B,SAAS,EAAE,WAAW;IACtB,IAAI,EAAE,CAAC,UAAU,EAAE,cAAc,CAAC;IAElC,UAAU,EAAE;QACV,MAAM,EAAE,UAAU;QAClB,QAAQ,EAAE;YACR,QAAQ,EAAE;gBACR,KAAK,EAAE,sBAAsB;gBAC7B,IAAI,EAAE,OAAO;aACd;SACF;KACF;CACM,CAAA;AAET,IAAM,QAAQ,GAAgC,UAAA,IAAI,IAAI,OAAA,KAAC,WAAW,eAAK,IAAI,EAAI,EAAzB,CAAyB,CAAA;AAE/E,MAAM,CAAC,IAAM,kBAAkB,GAAG,QAAQ,CAAC,IAAI,CAAC,EAAE,CAAC,CAAA;AACnD,kBAAkB,CAAC,IAAI,GAAG;IACxB,GAAG,EAAE,mDAAmD;CACzD,CAAA"}

package/dist/components/AudioPlayer/index.d.ts

@@ -0,0 +1 @@
+export { AudioPlayer } from './AudioPlayer';

package/dist/components/AudioPlayer/index.js

@@ -0,0 +1,2 @@
+export { AudioPlayer } from './AudioPlayer';
+//# sourceMappingURL=index.js.map

package/dist/components/AudioPlayer/index.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"index.js","sourceRoot":"","sources":["../../../src/components/AudioPlayer/index.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,WAAW,EAAE,MAAM,eAAe,CAAA"}

package/dist/components/Badge/Badge.d.ts

@@ -0,0 +1,5 @@
+import { ReactElement } from 'react';
+export declare const Badge: ({ src, onEditClick, }: {
+    src: string;
+    onEditClick: () => void;
+}) => ReactElement;

package/dist/components/Badge/Badge.js

@@ -0,0 +1,10 @@
+import { Fragment as _Fragment, jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
+import { EditButton, Wrapper } from './styled-components';
+import { Edit } from '../../icons';
+export var Badge = function (_a) {
+    var src = _a.src, onEditClick = _a.onEditClick;
+    if (!src)
+        return _jsx(_Fragment, {});
+    return (_jsxs(Wrapper, { children: [_jsx("img", { src: src }), _jsx(EditButton, { onClick: onEditClick, children: _jsx(Edit, { style: { color: '#fff' } }) })] }));
+};
+//# sourceMappingURL=Badge.js.map

package/dist/components/Badge/Badge.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"Badge.js","sourceRoot":"","sources":["../../../src/components/Badge/Badge.tsx"],"names":[],"mappings":";AACA,OAAO,EAAE,UAAU,EAAE,OAAO,EAAE,MAAM,qBAAqB,CAAA;AACzD,OAAO,EAAE,IAAI,EAAE,MAAM,aAAa,CAAA;AAElC,MAAM,CAAC,IAAM,KAAK,GAAG,UAAC,EAMrB;QALC,GAAG,SAAA,EACH,WAAW,iBAAA;IAKX,IAAI,CAAC,GAAG;QAAE,OAAO,mBAAK,CAAA;IACtB,OAAO,CACL,MAAC,OAAO,eACN,cAAK,GAAG,EAAE,GAAG,GAAI,EACjB,KAAC,UAAU,IAAC,OAAO,EAAE,WAAW,YAC9B,KAAC,IAAI,IAAC,KAAK,EAAE,EAAE,KAAK,EAAE,MAAM,EAAE,GAAI,GACvB,IACL,CACX,CAAA;AACH,CAAC,CAAA"}

package/dist/components/Badge/Badge.stories.d.ts

@@ -0,0 +1,8 @@
+import { Meta } from '@storybook/react';
+import { Badge } from './Badge';
+declare const _default: Meta<typeof Badge>;
+export default _default;
+export declare const Default: import("@storybook/core/types").AnnotatedStoryFn<import("@storybook/react").ReactRenderer, {
+    src: string;
+    onEditClick: () => void;
+}>;

package/dist/components/Badge/Badge.stories.js

@@ -0,0 +1,28 @@
+var __assign = (this && this.__assign) || function () {
+    __assign = Object.assign || function(t) {
+        for (var s, i = 1, n = arguments.length; i < n; i++) {
+            s = arguments[i];
+            for (var p in s) if (Object.prototype.hasOwnProperty.call(s, p))
+                t[p] = s[p];
+        }
+        return t;
+    };
+    return __assign.apply(this, arguments);
+};
+import { jsx as _jsx } from "react/jsx-runtime";
+import { Badge } from './Badge';
+export default {
+    title: 'Components/Badge',
+    tags: ['autodocs'],
+    parameters: {
+        layout: 'centered',
+    },
+    component: Badge,
+};
+var Template = function (args) { return _jsx(Badge, __assign({}, args)); };
+export var Default = Template.bind({});
+Default.args = {
+    src: 'https://encrypted-tbn0.gstatic.com/images?q=tbn:ANd9GcQaxdUf7Wbdggm-utxlTr34w-nqSDOPHFIiWw&s',
+    onEditClick: function () { return console.log('Edit clicked'); },
+};
+//# sourceMappingURL=Badge.stories.js.map

package/dist/components/Badge/Badge.stories.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"Badge.stories.js","sourceRoot":"","sources":["../../../src/components/Badge/Badge.stories.tsx"],"names":[],"mappings":";;;;;;;;;;;;AAEA,OAAO,EAAE,KAAK,EAAE,MAAM,SAAS,CAAA;AAE/B,eAAe;IACb,KAAK,EAAE,kBAAkB;IACzB,IAAI,EAAE,CAAC,UAAU,CAAC;IAClB,UAAU,EAAE;QACV,MAAM,EAAE,UAAU;KACnB;IAED,SAAS,EAAE,KAAK;CACK,CAAA;AAEvB,IAAM,QAAQ,GAA0B,UAAA,IAAI,IAAI,OAAA,KAAC,KAAK,eAAK,IAAI,EAAI,EAAnB,CAAmB,CAAA;AAEnE,MAAM,CAAC,IAAM,OAAO,GAAG,QAAQ,CAAC,IAAI,CAAC,EAAE,CAAC,CAAA;AACxC,OAAO,CAAC,IAAI,GAAG;IACb,GAAG,EAAE,8FAA8F;IACnG,WAAW,EAAE,cAAM,OAAA,OAAO,CAAC,GAAG,CAAC,cAAc,CAAC,EAA3B,CAA2B;CAC/C,CAAA"}

package/dist/components/Badge/index.d.ts

@@ -0,0 +1 @@
+export { Badge } from './Badge';

package/dist/components/Badge/index.js

@@ -0,0 +1,2 @@
+export { Badge } from './Badge';
+//# sourceMappingURL=index.js.map

package/dist/components/Badge/index.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"index.js","sourceRoot":"","sources":["../../../src/components/Badge/index.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,KAAK,EAAE,MAAM,SAAS,CAAA"}

package/dist/components/Badge/styled-components.d.ts

@@ -0,0 +1,3 @@
+export declare const Wrapper: import("styled-components/dist/types").IStyledComponentBase<"web", import("styled-components").FastOmit<import("react").DetailedHTMLProps<import("react").HTMLAttributes<HTMLDivElement>, HTMLDivElement>, never>> & string;
+export declare const ScaledIframe: import("styled-components/dist/types").IStyledComponentBase<"web", import("styled-components").FastOmit<import("react").DetailedHTMLProps<import("react").IframeHTMLAttributes<HTMLIFrameElement>, HTMLIFrameElement>, never>> & string;
+export declare const EditButton: import("styled-components/dist/types").IStyledComponentBase<"web", import("styled-components").FastOmit<import("react").DetailedHTMLProps<import("react").HTMLAttributes<HTMLDivElement>, HTMLDivElement>, never>> & string;

package/dist/components/Badge/styled-components.js

@@ -0,0 +1,10 @@
+var __makeTemplateObject = (this && this.__makeTemplateObject) || function (cooked, raw) {
+    if (Object.defineProperty) { Object.defineProperty(cooked, "raw", { value: raw }); } else { cooked.raw = raw; }
+    return cooked;
+};
+import styled from 'styled-components';
+export var Wrapper = styled.div(templateObject_1 || (templateObject_1 = __makeTemplateObject(["\n  aspect-ratio: 1;\n  width: 410px;\n  scale: 0.4;\n  transform: translate(-75%, -76%);\n  background-color: #f5f5f5;\n  display: flex;\n  justify-content: center;\n  align-items: center;\n  cursor: pointer;\n  transition: 0.3s;\n  border-radius: 14px;\n  position: relative;\n  img {\n    width: 100%;\n    height: 100%;\n  }\n"], ["\n  aspect-ratio: 1;\n  width: 410px;\n  scale: 0.4;\n  transform: translate(-75%, -76%);\n  background-color: #f5f5f5;\n  display: flex;\n  justify-content: center;\n  align-items: center;\n  cursor: pointer;\n  transition: 0.3s;\n  border-radius: 14px;\n  position: relative;\n  img {\n    width: 100%;\n    height: 100%;\n  }\n"])));
+export var ScaledIframe = styled.iframe(templateObject_2 || (templateObject_2 = __makeTemplateObject(["\n  width: 410px;\n  height: 410px;\n  border: 0;\n  border-radius: 4px;\n"], ["\n  width: 410px;\n  height: 410px;\n  border: 0;\n  border-radius: 4px;\n"])));
+export var EditButton = styled.div(templateObject_3 || (templateObject_3 = __makeTemplateObject(["\n  background-color: rgb(6, 198, 143);\n  position: absolute;\n  right: -12px;\n  scale: 2.5;\n  top: -12px;\n  cursor: pointer;\n  align-items: center;\n  justify-content: center;\n  border-radius: 50%;\n  padding: 10px;\n  display: flex;\n"], ["\n  background-color: rgb(6, 198, 143);\n  position: absolute;\n  right: -12px;\n  scale: 2.5;\n  top: -12px;\n  cursor: pointer;\n  align-items: center;\n  justify-content: center;\n  border-radius: 50%;\n  padding: 10px;\n  display: flex;\n"])));
+var templateObject_1, templateObject_2, templateObject_3;
+//# sourceMappingURL=styled-components.js.map

package/dist/components/Badge/styled-components.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"styled-components.js","sourceRoot":"","sources":["../../../src/components/Badge/styled-components.ts"],"names":[],"mappings":";;;;AAAA,OAAO,MAAM,MAAM,mBAAmB,CAAA;AAEtC,MAAM,CAAC,IAAM,OAAO,GAAG,MAAM,CAAC,GAAG,+YAAA,4UAiBhC,IAAA,CAAA;AAED,MAAM,CAAC,IAAM,YAAY,GAAG,MAAM,CAAC,MAAM,+IAAA,4EAKxC,IAAA,CAAA;AAED,MAAM,CAAC,IAAM,UAAU,GAAG,MAAM,CAAC,GAAG,uTAAA,oPAYnC,IAAA,CAAA"}

package/dist/components/BreadCrumb/BreadCrumb.stories.d.ts

@@ -0,0 +1,4 @@
+import { Meta } from '@storybook/react';
+declare const _default: Meta;
+export default _default;
+export declare const Default: import("@storybook/core/types").AnnotatedStoryFn<import("@storybook/react").ReactRenderer, import("./types").IBreadcrumbPropsV2>;

package/dist/components/BreadCrumb/BreadCrumb.stories.js

@@ -0,0 +1,31 @@
+var __assign = (this && this.__assign) || function () {
+    __assign = Object.assign || function(t) {
+        for (var s, i = 1, n = arguments.length; i < n; i++) {
+            s = arguments[i];
+            for (var p in s) if (Object.prototype.hasOwnProperty.call(s, p))
+                t[p] = s[p];
+        }
+        return t;
+    };
+    return __assign.apply(this, arguments);
+};
+import { jsx as _jsx } from "react/jsx-runtime";
+import { Breadcrumb } from './Breadcrumb';
+export default {
+    title: 'Components/Breadcrumb',
+    component: Breadcrumb,
+    parameters: {
+        layout: 'centered',
+    },
+    tags: ['autodocs'],
+};
+var Template = function (args) { return _jsx(Breadcrumb, __assign({}, args)); };
+export var Default = Template.bind({});
+Default.args = {
+    data: [
+        { label: 'Home', link: '/', icon: null, state: {} },
+        { label: 'Category', link: '/category', icon: null, state: {} },
+        { label: 'Subcategory', link: '/category/subcategory', icon: null, state: {} },
+    ],
+};
+//# sourceMappingURL=BreadCrumb.stories.js.map

package/dist/components/BreadCrumb/BreadCrumb.stories.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"BreadCrumb.stories.js","sourceRoot":"","sources":["../../../src/components/BreadCrumb/BreadCrumb.stories.tsx"],"names":[],"mappings":";;;;;;;;;;;;AAEA,OAAO,EAAE,UAAU,EAAE,MAAM,cAAc,CAAA;AAEzC,eAAe;IACb,KAAK,EAAE,uBAAuB;IAC9B,SAAS,EAAE,UAAU;IACrB,UAAU,EAAE;QACV,MAAM,EAAE,UAAU;KACnB;IACD,IAAI,EAAE,CAAC,UAAU,CAAC;CACX,CAAA;AAET,IAAM,QAAQ,GAA+B,UAAA,IAAI,IAAI,OAAA,KAAC,UAAU,eAAK,IAAI,EAAI,EAAxB,CAAwB,CAAA;AAE7E,MAAM,CAAC,IAAM,OAAO,GAAG,QAAQ,CAAC,IAAI,CAAC,EAAE,CAAC,CAAA;AACxC,OAAO,CAAC,IAAI,GAAG;IACb,IAAI,EAAE;QACJ,EAAE,KAAK,EAAE,MAAM,EAAE,IAAI,EAAE,GAAG,EAAE,IAAI,EAAE,IAAI,EAAE,KAAK,EAAE,EAAE,EAAE;QACnD,EAAE,KAAK,EAAE,UAAU,EAAE,IAAI,EAAE,WAAW,EAAE,IAAI,EAAE,IAAI,EAAE,KAAK,EAAE,EAAE,EAAE;QAC/D,EAAE,KAAK,EAAE,aAAa,EAAE,IAAI,EAAE,uBAAuB,EAAE,IAAI,EAAE,IAAI,EAAE,KAAK,EAAE,EAAE,EAAE;KAC/E;CACF,CAAA"}

package/dist/components/BreadCrumb/Breadcrumb.d.ts

@@ -0,0 +1,3 @@
+import React from 'react';
+import { IBreadcrumbPropsV2 } from './types';
+export declare const Breadcrumb: React.FC<IBreadcrumbPropsV2>;

package/dist/components/BreadCrumb/Breadcrumb.js

@@ -0,0 +1,20 @@
+import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
+import React from 'react';
+import { Container, ItemWrapper, PathItem } from './styled-components';
+import { useNavigate } from 'react-router';
+import { ChevronRightIcon } from '../../icons';
+export var Breadcrumb = function (_a) {
+    var data = _a.data;
+    var navigate = useNavigate();
+    var handleClick = function (event, link, state) {
+        if (state === void 0) { state = {}; }
+        event.preventDefault();
+        navigate(link, {
+            state: state,
+        });
+    };
+    if (!data)
+        return;
+    return (_jsx(Container, { children: data.map(function (item, index) { return (_jsxs(React.Fragment, { children: [_jsxs(PathItem, { children: [item.icon, item.link ? (_jsx("a", { href: '/', onClick: function (e) { return handleClick(e, item.link, item.state); }, children: item.label })) : (_jsx(ItemWrapper, { children: item.label }))] }), index < data.length - 1 && (index === 0 ? _jsx(ChevronRightIcon, {}) : _jsx("span", { children: " / " }))] }, index)); }) }));
+};
+//# sourceMappingURL=Breadcrumb.js.map

package/dist/components/BreadCrumb/Breadcrumb.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"Breadcrumb.js","sourceRoot":"","sources":["../../../src/components/BreadCrumb/Breadcrumb.tsx"],"names":[],"mappings":";AAAA,OAAO,KAAK,MAAM,OAAO,CAAA;AACzB,OAAO,EAAE,SAAS,EAAE,WAAW,EAAE,QAAQ,EAAE,MAAM,qBAAqB,CAAA;AACtE,OAAO,EAAE,WAAW,EAAE,MAAM,cAAc,CAAA;AAE1C,OAAO,EAAE,gBAAgB,EAAE,MAAM,aAAa,CAAA;AAE9C,MAAM,CAAC,IAAM,UAAU,GAAiC,UAAC,EAAQ;QAAN,IAAI,UAAA;IAC7D,IAAM,QAAQ,GAAG,WAAW,EAAE,CAAA;IAE9B,IAAM,WAAW,GAAG,UAClB,KAAsD,EACtD,IAAY,EACZ,KAA8B;QAA9B,sBAAA,EAAA,UAA8B;QAE9B,KAAK,CAAC,cAAc,EAAE,CAAA;QACtB,QAAQ,CAAC,IAAI,EAAE;YACb,KAAK,OAAA;SACN,CAAC,CAAA;IACJ,CAAC,CAAA;IAED,IAAI,CAAC,IAAI;QAAE,OAAM;IAEjB,OAAO,CACL,KAAC,SAAS,cACP,IAAI,CAAC,GAAG,CAAC,UAAC,IAAuB,EAAE,KAAK,IAAK,OAAA,CAC5C,MAAC,KAAK,CAAC,QAAQ,eACb,MAAC,QAAQ,eACN,IAAI,CAAC,IAAI,EACT,IAAI,CAAC,IAAI,CAAC,CAAC,CAAC,CACX,YAAG,IAAI,EAAC,GAAG,EAAC,OAAO,EAAE,UAAC,CAAC,IAAW,OAAA,WAAW,CAAC,CAAC,EAAE,IAAI,CAAC,IAAK,EAAE,IAAI,CAAC,KAAK,CAAC,EAAtC,CAAsC,YACrE,IAAI,CAAC,KAAK,GACT,CACL,CAAC,CAAC,CAAC,CACF,KAAC,WAAW,cAAE,IAAI,CAAC,KAAK,GAAe,CACxC,IACQ,EACV,KAAK,GAAG,IAAI,CAAC,MAAM,GAAG,CAAC,IAAI,CAAC,KAAK,KAAK,CAAC,CAAC,CAAC,CAAC,KAAC,gBAAgB,KAAG,CAAC,CAAC,CAAC,iCAAgB,CAAC,KAXhE,KAAK,CAYT,CAClB,EAd6C,CAc7C,CAAC,GACQ,CACb,CAAA;AACH,CAAC,CAAA"}

package/dist/components/BreadCrumb/index.d.ts

@@ -0,0 +1 @@
+export { Breadcrumb } from './Breadcrumb';

package/dist/components/BreadCrumb/index.js

@@ -0,0 +1,2 @@
+export { Breadcrumb } from './Breadcrumb';
+//# sourceMappingURL=index.js.map

package/dist/components/BreadCrumb/index.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"index.js","sourceRoot":"","sources":["../../../src/components/BreadCrumb/index.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,UAAU,EAAE,MAAM,cAAc,CAAA"}

package/dist/components/BreadCrumb/styled-components.d.ts

@@ -0,0 +1,5 @@
+export declare const Header: import("styled-components/dist/types").IStyledComponentBase<"web", import("styled-components").FastOmit<import("react").DetailedHTMLProps<import("react").HTMLAttributes<HTMLDivElement>, HTMLDivElement>, never>> & string;
+export declare const Container: import("styled-components/dist/types").IStyledComponentBase<"web", import("styled-components").FastOmit<import("react").DetailedHTMLProps<import("react").HTMLAttributes<HTMLDivElement>, HTMLDivElement>, never>> & string;
+export declare const PathItem: import("styled-components/dist/types").IStyledComponentBase<"web", import("styled-components").FastOmit<import("react").DetailedHTMLProps<import("react").HTMLAttributes<HTMLDivElement>, HTMLDivElement>, never>> & string;
+export declare const Wrapper: import("styled-components/dist/types").IStyledComponentBase<"web", import("styled-components").FastOmit<import("react").DetailedHTMLProps<import("react").HTMLAttributes<HTMLDivElement>, HTMLDivElement>, never>> & string;
+export declare const ItemWrapper: import("styled-components/dist/types").IStyledComponentBase<"web", import("styled-components").FastOmit<import("react").DetailedHTMLProps<import("react").HTMLAttributes<HTMLDivElement>, HTMLDivElement>, never>> & string;

package/dist/components/BreadCrumb/styled-components.js

@@ -0,0 +1,12 @@
+var __makeTemplateObject = (this && this.__makeTemplateObject) || function (cooked, raw) {
+    if (Object.defineProperty) { Object.defineProperty(cooked, "raw", { value: raw }); } else { cooked.raw = raw; }
+    return cooked;
+};
+import styled from 'styled-components';
+export var Header = styled.div(templateObject_1 || (templateObject_1 = __makeTemplateObject([""], [""])));
+export var Container = styled.div(templateObject_2 || (templateObject_2 = __makeTemplateObject(["\n  display: flex;\n  align-items: center;\n  gap: 5px;\n  margin-bottom: 10px;\n"], ["\n  display: flex;\n  align-items: center;\n  gap: 5px;\n  margin-bottom: 10px;\n"])));
+export var PathItem = styled.div(templateObject_3 || (templateObject_3 = __makeTemplateObject(["\n  color: #68707a;\n  font-weight: 400;\n  font-size: 16px;\n  display: flex;\n  justify-content: center;\n  align-items: center;\n  gap: 8px;\n\n  svg {\n    /* opacity: 0.5; */\n  }\n"], ["\n  color: #68707a;\n  font-weight: 400;\n  font-size: 16px;\n  display: flex;\n  justify-content: center;\n  align-items: center;\n  gap: 8px;\n\n  svg {\n    /* opacity: 0.5; */\n  }\n"])));
+export var Wrapper = styled.div(templateObject_4 || (templateObject_4 = __makeTemplateObject(["\n  display: flex;\n  align-items: center;\n"], ["\n  display: flex;\n  align-items: center;\n"])));
+export var ItemWrapper = styled.div(templateObject_5 || (templateObject_5 = __makeTemplateObject(["\n  font-weight: 400;\n"], ["\n  font-weight: 400;\n"])));
+var templateObject_1, templateObject_2, templateObject_3, templateObject_4, templateObject_5;
+//# sourceMappingURL=styled-components.js.map

package/dist/components/BreadCrumb/styled-components.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"styled-components.js","sourceRoot":"","sources":["../../../src/components/BreadCrumb/styled-components.ts"],"names":[],"mappings":";;;;AAAA,OAAO,MAAM,MAAM,mBAAmB,CAAA;AAEtC,MAAM,CAAC,IAAM,MAAM,GAAG,MAAM,CAAC,GAAG,qEAAA,EAAE,IAAA,CAAA;AAElC,MAAM,CAAC,IAAM,SAAS,GAAG,MAAM,CAAC,GAAG,sJAAA,mFAKlC,IAAA,CAAA;AAED,MAAM,CAAC,IAAM,QAAQ,GAAG,MAAM,CAAC,GAAG,+PAAA,4LAYjC,IAAA,CAAA;AAED,MAAM,CAAC,IAAM,OAAO,GAAG,MAAM,CAAC,GAAG,iHAAA,8CAGhC,IAAA,CAAA;AAED,MAAM,CAAC,IAAM,WAAW,GAAG,MAAM,CAAC,GAAG,4FAAA,yBAEpC,IAAA,CAAA"}

package/dist/components/BreadCrumb/types.d.ts

@@ -0,0 +1,15 @@
+export interface IBreadcrumbV2 {
+    title: string;
+}
+export interface IBreadcrumbItemV2 {
+    label: string;
+    link?: string;
+    icon?: React.ReactNode;
+    state?: {
+        id: number;
+        name: string;
+    } | object;
+}
+export interface IBreadcrumbPropsV2 {
+    data: IBreadcrumbItemV2[];
+}

package/dist/components/BreadCrumb/types.js

@@ -0,0 +1,2 @@
+export {};
+//# sourceMappingURL=types.js.map

package/dist/components/BreadCrumb/types.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"types.js","sourceRoot":"","sources":["../../../src/components/BreadCrumb/types.ts"],"names":[],"mappings":""}

package/dist/components/Button/Button.d.ts

@@ -0,0 +1,3 @@
+import { ReactElement } from 'react';
+import { ButtonState } from './Button.interface';
+export declare const Button: ({ type, size, label, iconLeft, iconRight, disabled, customStyles, onClick, htmlType, className, }: ButtonState) => ReactElement;

package/dist/components/Button/Button.interface.d.ts

@@ -0,0 +1,40 @@
+import { ReactElement, CSSProperties, ReactNode } from 'react';
+export declare enum HtmlButtonTypeEnum {
+    SUBMIT = "submit",
+    RESET = "reset",
+    BUTTON = "button"
+}
+export declare enum ButtonTypeEnum {
+    PRIMARY = "primary",
+    SECONDARY = "secondary",
+    GHOST = "ghost",
+    NEGATIVE = "negative",
+    POSITIVE = "positive",
+    DARK = "dark",
+    TEXT = "text"
+}
+export declare enum ButtonSizeEnum {
+    SM = "small",
+    LG = "large"
+}
+export type HtmlButtonType = 'submit' | 'reset' | 'button';
+export type ButtonSize = 'small' | 'large';
+export type ButtonType = 'primary' | 'secondary' | 'ghost' | 'negative' | 'positive' | 'dark' | 'text';
+export interface ButtonState {
+    type: ButtonType;
+    size: ButtonSize;
+    label?: ReactNode;
+    iconLeft?: ReactElement | null;
+    iconRight?: ReactElement | null;
+    disabled?: boolean;
+    customStyles?: CSSProperties;
+    onClick?: () => void;
+    htmlType?: HtmlButtonType;
+    id?: string | number;
+    className?: string;
+    themes?: any;
+}
+export interface StyledButtonProps {
+    $type: ButtonType;
+    $size: ButtonSize;
+}

package/dist/components/Button/Button.interface.js

@@ -0,0 +1,22 @@
+export var HtmlButtonTypeEnum;
+(function (HtmlButtonTypeEnum) {
+    HtmlButtonTypeEnum["SUBMIT"] = "submit";
+    HtmlButtonTypeEnum["RESET"] = "reset";
+    HtmlButtonTypeEnum["BUTTON"] = "button";
+})(HtmlButtonTypeEnum || (HtmlButtonTypeEnum = {}));
+export var ButtonTypeEnum;
+(function (ButtonTypeEnum) {
+    ButtonTypeEnum["PRIMARY"] = "primary";
+    ButtonTypeEnum["SECONDARY"] = "secondary";
+    ButtonTypeEnum["GHOST"] = "ghost";
+    ButtonTypeEnum["NEGATIVE"] = "negative";
+    ButtonTypeEnum["POSITIVE"] = "positive";
+    ButtonTypeEnum["DARK"] = "dark";
+    ButtonTypeEnum["TEXT"] = "text";
+})(ButtonTypeEnum || (ButtonTypeEnum = {}));
+export var ButtonSizeEnum;
+(function (ButtonSizeEnum) {
+    ButtonSizeEnum["SM"] = "small";
+    ButtonSizeEnum["LG"] = "large";
+})(ButtonSizeEnum || (ButtonSizeEnum = {}));
+//# sourceMappingURL=Button.interface.js.map

package/dist/components/Button/Button.interface.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"Button.interface.js","sourceRoot":"","sources":["../../../src/components/Button/Button.interface.ts"],"names":[],"mappings":"AAEA,MAAM,CAAN,IAAY,kBAIX;AAJD,WAAY,kBAAkB;IAC5B,uCAAiB,CAAA;IACjB,qCAAe,CAAA;IACf,uCAAiB,CAAA;AACnB,CAAC,EAJW,kBAAkB,KAAlB,kBAAkB,QAI7B;AAED,MAAM,CAAN,IAAY,cAQX;AARD,WAAY,cAAc;IACxB,qCAAmB,CAAA;IACnB,yCAAuB,CAAA;IACvB,iCAAe,CAAA;IACf,uCAAqB,CAAA;IACrB,uCAAqB,CAAA;IACrB,+BAAa,CAAA;IACb,+BAAa,CAAA;AACf,CAAC,EARW,cAAc,KAAd,cAAc,QAQzB;AAED,MAAM,CAAN,IAAY,cAGX;AAHD,WAAY,cAAc;IACxB,8BAAY,CAAA;IACZ,8BAAY,CAAA;AACd,CAAC,EAHW,cAAc,KAAd,cAAc,QAGzB"}

package/dist/components/Button/Button.js

@@ -0,0 +1,8 @@
+import { jsxs as _jsxs } from "react/jsx-runtime";
+import { HtmlButtonTypeEnum } from './Button.interface';
+import { StyledButton } from './Button.styles';
+export var Button = function (_a) {
+    var type = _a.type, size = _a.size, label = _a.label, iconLeft = _a.iconLeft, iconRight = _a.iconRight, disabled = _a.disabled, customStyles = _a.customStyles, onClick = _a.onClick, _b = _a.htmlType, htmlType = _b === void 0 ? HtmlButtonTypeEnum.BUTTON : _b, className = _a.className;
+    return (_jsxs(StyledButton, { "$type": type, "$size": size, disabled: !!disabled, style: customStyles, onClick: onClick, type: htmlType, className: className, children: [iconLeft, label, iconRight] }));
+};
+//# sourceMappingURL=Button.js.map

package/dist/components/Button/Button.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"Button.js","sourceRoot":"","sources":["../../../src/components/Button/Button.tsx"],"names":[],"mappings":";AACA,OAAO,EAAe,kBAAkB,EAAE,MAAM,oBAAoB,CAAA;AACpE,OAAO,EAAE,YAAY,EAAE,MAAM,iBAAiB,CAAA;AAE9C,MAAM,CAAC,IAAM,MAAM,GAAG,UAAC,EAWT;QAVZ,IAAI,UAAA,EACJ,IAAI,UAAA,EACJ,KAAK,WAAA,EACL,QAAQ,cAAA,EACR,SAAS,eAAA,EACT,QAAQ,cAAA,EACR,YAAY,kBAAA,EACZ,OAAO,aAAA,EACP,gBAAoC,EAApC,QAAQ,mBAAG,kBAAkB,CAAC,MAAM,KAAA,EACpC,SAAS,eAAA;IAET,OAAO,CACL,MAAC,YAAY,aACJ,IAAI,WACJ,IAAI,EACX,QAAQ,EAAE,CAAC,CAAC,QAAQ,EACpB,KAAK,EAAE,YAAY,EACnB,OAAO,EAAE,OAAO,EAChB,IAAI,EAAE,QAAQ,EACd,SAAS,EAAE,SAAS,aAEnB,QAAQ,EACR,KAAK,EACL,SAAS,IACG,CAChB,CAAA;AACH,CAAC,CAAA"}

package/dist/components/Button/Button.stories.d.ts

@@ -0,0 +1,135 @@
+import type { StoryObj } from '@storybook/react';
+import { ButtonTypeEnum, ButtonSizeEnum, HtmlButtonTypeEnum } from './Button.interface';
+declare const meta: {
+    title: string;
+    component: ({ type, size, label, iconLeft, iconRight, disabled, customStyles, onClick, htmlType, className, }: import("./Button.interface").ButtonState) => import("react").ReactElement;
+    parameters: {
+        layout: string;
+    };
+    tags: string[];
+    argTypes: {
+        type: {
+            control: {
+                type: "select";
+                options: ButtonTypeEnum[];
+            };
+        };
+        size: {
+            control: {
+                type: "select";
+                options: ButtonSizeEnum[];
+            };
+        };
+        htmlType: {
+            control: {
+                type: "select";
+                options: HtmlButtonTypeEnum[];
+            };
+        };
+        disabled: {
+            control: {
+                type: "boolean";
+            };
+        };
+        label: {
+            control: {
+                type: "text";
+            };
+        };
+        iconLeft: {
+            control: {
+                type: "object";
+            };
+        };
+        iconRight: {
+            control: {
+                type: "object";
+            };
+        };
+        customStyles: {
+            control: {
+                type: "object";
+            };
+        };
+        className: {
+            control: {
+                type: "text";
+            };
+        };
+        onClick: {
+            action: string;
+        };
+        themes: {
+            control: {
+                type: "select";
+            };
+            options: string[];
+            mapping: {
+                light: {
+                    colors: {
+                        primary: {
+                            main: string;
+                            700: string;
+                        };
+                        neutral: {
+                            100: string;
+                            400: string;
+                            900: string;
+                        };
+                        system: {
+                            success: {
+                                main: string;
+                                700: string;
+                                300: string;
+                            };
+                            error: {
+                                main: string;
+                                700: string;
+                                300: string;
+                            };
+                        };
+                    };
+                };
+                dark: {
+                    colors: {
+                        primary: {
+                            main: string;
+                            700: string;
+                        };
+                        neutral: {
+                            100: string;
+                            400: string;
+                            900: string;
+                        };
+                        system: {
+                            success: {
+                                main: string;
+                                700: string;
+                                300: string;
+                            };
+                            error: {
+                                main: string;
+                                700: string;
+                                300: string;
+                            };
+                        };
+                    };
+                };
+            };
+            defaultValue: string;
+        };
+    };
+    args: {
+        onClick: () => void;
+    };
+};
+export default meta;
+type Story = StoryObj<typeof meta>;
+export declare const Primary: Story;
+export declare const Secondary: Story;
+export declare const Disabled: Story;
+export declare const Positive: Story;
+export declare const Negative: Story;
+export declare const Ghost: Story;
+export declare const Dark: Story;
+export declare const Text: Story;