krl-alfred 1.83.2 → 1.84.0

package/dist/components/BlogCard/props.d.ts

@@ -0,0 +1,23 @@
+/// <reference types="react" />
+export declare const direction: string[];
+export declare const size: string[];
+type DIRECTION = typeof direction[number];
+type SIZE = typeof size[number];
+export interface BlogCard {
+    authorTitle?: string;
+    authorImg?: React.ReactNode;
+    contentImg?: React.ReactNode;
+    tags?: string;
+    date?: string;
+    contentTitle?: string;
+    contentDesc?: string;
+    direction?: DIRECTION;
+    size?: SIZE;
+}
+export interface BlogCardStyledProps {
+    $direction?: DIRECTION;
+    $size?: SIZE;
+}
+export declare const BlogCardDefault: BlogCard;
+export type BlogCardProps = typeof BlogCardDefault;
+export {};

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

@@ -0,0 +1,29 @@
+declare const _default: {
+    title: string;
+    component: (props: any) => import("react/jsx-runtime").JSX.Element;
+    tags: string[];
+    argTypes: {
+        direction: {
+            control: string;
+            options: string[];
+        };
+        size: {
+            control: string;
+            options: string[];
+        };
+    };
+};
+export default _default;
+export declare const Default: {
+    args: {
+        authorImg: import("react/jsx-runtime").JSX.Element;
+        contentImg: import("react/jsx-runtime").JSX.Element;
+        authorTitle: string;
+        tags: string;
+        date: string;
+        contentTitle: string;
+        contentDesc: string;
+        direction: string;
+        size: string;
+    };
+};

package/dist/components/Breadcrumbs/Breadcrumbs.d.ts

@@ -0,0 +1,4 @@
+import React from "react";
+import { BreadcrumbsProps } from "./props";
+declare const Breadcrumbs: React.MemoExoticComponent<({ data, subMenuRowLength, onClickBackIcon, }: BreadcrumbsProps) => import("react/jsx-runtime").JSX.Element>;
+export default Breadcrumbs;

package/dist/components/Breadcrumbs/Breadcrumbs.styled.d.ts

@@ -0,0 +1,15 @@
+/// <reference types="react" />
+import { BreadcrumbsStyledProps } from "./props";
+export declare const BreadcrumbsWrapper: import("styled-components/dist/types").IStyledComponentBase<"web", import("styled-components").FastOmit<import("react").DetailedHTMLProps<import("react").HTMLAttributes<HTMLDivElement>, HTMLDivElement>, never>> & string;
+export declare const BreadcrumbsList: import("styled-components/dist/types").IStyledComponentBase<"web", import("styled-components").FastOmit<import("react").DetailedHTMLProps<import("react").HTMLAttributes<HTMLUListElement>, HTMLUListElement>, never>> & string;
+export declare const BreadcrumbsListItem: import("styled-components/dist/types").IStyledComponentBase<"web", import("styled-components").FastOmit<import("react").DetailedHTMLProps<import("react").LiHTMLAttributes<HTMLLIElement>, HTMLLIElement>, never>> & string;
+export declare const BreadcrumbsListItemInner: import("styled-components/dist/types").IStyledComponentBase<"web", import("styled-components").FastOmit<import("react").DetailedHTMLProps<import("react").HTMLAttributes<HTMLSpanElement>, HTMLSpanElement>, never>> & string;
+export declare const ButtonLinkComponentSm: import("styled-components/dist/types").IStyledComponentBase<"web", import("styled-components").FastOmit<import("react").DetailedHTMLProps<import("react").HTMLAttributes<HTMLSpanElement>, HTMLSpanElement>, never>> & string;
+export declare const ButtonLinkComponentLg: import("styled-components/dist/types").IStyledComponentBase<"web", import("styled-components").FastOmit<import("react").DetailedHTMLProps<import("react").HTMLAttributes<HTMLSpanElement>, HTMLSpanElement>, never>> & string;
+export declare const BreadcrumbsListItemIconWrapper: import("styled-components/dist/types").IStyledComponentBase<"web", import("styled-components").FastOmit<import("react").DetailedHTMLProps<import("react").HTMLAttributes<HTMLSpanElement>, HTMLSpanElement>, never>> & string;
+export declare const BreadcrumbsListItemBackIconWrapper: import("styled-components/dist/types").IStyledComponentBase<"web", import("styled-components").FastOmit<import("react").DetailedHTMLProps<import("react").HTMLAttributes<HTMLSpanElement>, HTMLSpanElement>, never>> & string;
+export declare const BreadcrumbsListDropdownWrapper: import("styled-components/dist/types").IStyledComponentBase<"web", import("styled-components").FastOmit<import("react").DetailedHTMLProps<import("react").HTMLAttributes<HTMLDivElement>, HTMLDivElement>, never>> & string;
+export declare const BreadcrumbsListDropdownOpener: import("styled-components/dist/types").IStyledComponentBase<"web", import("styled-components").FastOmit<import("react").DetailedHTMLProps<import("react").ButtonHTMLAttributes<HTMLButtonElement>, HTMLButtonElement>, never>> & string;
+export declare const DropdownList: import("styled-components/dist/types").IStyledComponentBase<"web", import("styled-components/dist/types").Substitute<import("react").DetailedHTMLProps<import("react").HTMLAttributes<HTMLUListElement>, HTMLUListElement>, BreadcrumbsStyledProps>> & string;
+export declare const SubMenuMobileWrapper: import("styled-components/dist/types").IStyledComponentBase<"web", import("styled-components").FastOmit<import("react").DetailedHTMLProps<import("react").HTMLAttributes<HTMLUListElement>, HTMLUListElement>, never>> & string;
+export declare const SubMenuMobileItem: import("styled-components/dist/types").IStyledComponentBase<"web", import("styled-components/dist/types").Substitute<import("react").DetailedHTMLProps<import("react").LiHTMLAttributes<HTMLLIElement>, HTMLLIElement>, BreadcrumbsStyledProps>> & string;

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

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

package/dist/components/Breadcrumbs/props.d.ts

@@ -0,0 +1,10 @@
+export interface Breadcrumbs {
+    data?: object[];
+    subMenuRowLength?: number | undefined;
+    onClickBackIcon?(): void;
+}
+export interface BreadcrumbsStyledProps {
+    $isActive?: boolean;
+}
+export declare const BreadcrumbsDefault: Breadcrumbs;
+export type BreadcrumbsProps = typeof BreadcrumbsDefault;

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

@@ -0,0 +1,77 @@
+/// <reference types="react" />
+declare const _default: {
+    title: string;
+    component: import("react").MemoExoticComponent<({ data, subMenuRowLength, onClickBackIcon, }: import("../props").Breadcrumbs) => import("react/jsx-runtime").JSX.Element>;
+    tags: string[];
+    argTypes: {
+        subMenuRowLength: {
+            control: string;
+        };
+        data: {
+            control: string;
+        };
+        onClickBackIcon: {
+            control: string;
+        };
+    };
+};
+export default _default;
+export declare const Default: {
+    argTypes: {
+        subMenuRowLength: {
+            control: string;
+        };
+        data: {
+            control: string;
+        };
+    };
+    args: {
+        data: ({
+            slug: string;
+            name: string;
+            children?: undefined;
+        } | {
+            slug: string;
+            name: string;
+            children: ({
+                name: string;
+                slug: string;
+                id: number;
+                isSeeAll: boolean;
+                isHideDesktop: boolean;
+                parentId?: undefined;
+                isActive?: undefined;
+                isHideMobile?: undefined;
+            } | {
+                parentId: number;
+                name: string;
+                slug: string;
+                id: number;
+                isSeeAll?: undefined;
+                isHideDesktop?: undefined;
+                isActive?: undefined;
+                isHideMobile?: undefined;
+            } | {
+                parentId: number;
+                name: string;
+                slug: string;
+                id: number;
+                isActive: boolean;
+                isSeeAll?: undefined;
+                isHideDesktop?: undefined;
+                isHideMobile?: undefined;
+            } | {
+                name: string;
+                slug: string;
+                id: number;
+                isSeeAll: boolean;
+                isHideMobile: boolean;
+                isHideDesktop?: undefined;
+                parentId?: undefined;
+                isActive?: undefined;
+            })[];
+        })[];
+        subMenuRowLength: number;
+        onClickBackIcon: (e: any) => void;
+    };
+};

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

@@ -0,0 +1,3 @@
+import React from 'react';
+declare const Button: React.ForwardRefExoticComponent<import("./props").Button & React.RefAttributes<any>>;
+export default Button;

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

@@ -0,0 +1,4 @@
+/// <reference types="react" />
+import { ButtonStyledProps } from "./props";
+export declare const ButtonStyled: import("styled-components/dist/types").IStyledComponentBase<"web", import("styled-components/dist/types").Substitute<import("react").DetailedHTMLProps<import("react").ButtonHTMLAttributes<HTMLButtonElement>, HTMLButtonElement>, ButtonStyledProps>> & string;
+export declare const IconStyled: import("styled-components/dist/types").IStyledComponentBase<"web", import("styled-components/dist/types").Substitute<import("react").DetailedHTMLProps<import("react").HTMLAttributes<HTMLDivElement>, HTMLDivElement>, ButtonStyledProps>> & string;

package/dist/components/Button/Button.styled.js

@@ -44,7 +44,7 @@ var primary = (0, styled_components_1.css)(templateObject_1 || (templateObject_1
             return "var(--body-bold-14-17)";
     }
 }, devices_1.devices.mdUp, devices_1.devices.md);
-var secondary = (0, styled_components_1.css)(templateObject_2 || (templateObject_2 = __makeTemplateObject(["\n  background-color: var(--primary-opacity-5);\n  color: var(--primary-initial);\n  border: 1px solid transparent;\n  font: ", ";\n\n  @media only screen and ", " {\n    &:hover {\n      color: var(--primary-hover);\n    }\n  }\n\n \n\n  &:active {\n    color: var(--primary-press);\n    @media only screen and ", " {\n      color: var(--primary-hover);\n    }\n  }\n\n  &:disabled {\n    background-color: var(--dark-opacity-5);\n    color: var(--dark-opacity-25);\n  }\n"], ["\n  background-color: var(--primary-opacity-5);\n  color: var(--primary-initial);\n  border: 1px solid transparent;\n  font: ", ";\n\n  @media only screen and ", " {\n    &:hover {\n      color: var(--primary-hover);\n    }\n  }\n\n \n\n  &:active {\n    color: var(--primary-press);\n    @media only screen and ", " {\n      color: var(--primary-hover);\n    }\n  }\n\n  &:disabled {\n    background-color: var(--dark-opacity-5);\n    color: var(--dark-opacity-25);\n  }\n"])), function (props) {
+var secondary = (0, styled_components_1.css)(templateObject_2 || (templateObject_2 = __makeTemplateObject(["\n  background-color: var(--primary-opacity-5);\n  color: var(--primary-initial);\n  border: 1px solid transparent;\n  font: ", ";\n\n  @media only screen and ", " {\n    &:hover {\n      color: var(--primary-hover);\n    }\n  }\n  \n  &:active {\n    color: var(--primary-press);\n    @media only screen and ", " {\n      color: var(--primary-hover);\n    }\n  }\n\n  &:disabled {\n    background-color: var(--dark-opacity-5);\n    color: var(--dark-opacity-25);\n  }\n"], ["\n  background-color: var(--primary-opacity-5);\n  color: var(--primary-initial);\n  border: 1px solid transparent;\n  font: ", ";\n\n  @media only screen and ", " {\n    &:hover {\n      color: var(--primary-hover);\n    }\n  }\n  \n  &:active {\n    color: var(--primary-press);\n    @media only screen and ", " {\n      color: var(--primary-hover);\n    }\n  }\n\n  &:disabled {\n    background-color: var(--dark-opacity-5);\n    color: var(--dark-opacity-25);\n  }\n"])), function (props) {
     switch (props.$size) {
         case 'xsmall':
             return "var(--caption-bold-12-15)";
@@ -58,7 +58,7 @@ var secondary = (0, styled_components_1.css)(templateObject_2 || (templateObject
             return "var(--body-bold-14-17)";
     }
 }, devices_1.devices.mdUp, devices_1.devices.md);
-var inverted = (0, styled_components_1.css)(templateObject_3 || (templateObject_3 = __makeTemplateObject(["\n  background-color: transparent;\n  color: var(--primary-initial);\n  border: 1px solid;\n  border-color: var(--primary-initial);\n  font: ", ";\n\n  @media only screen and ", " {\n    &:hover {\n      color: var(--primary-hover);\n      border-color: var(--primary-hover);\n    }\n  }\n  \n  \n\n  &:active {\n    color: var(--primary-press);\n    border-color: var(--primary-press);\n\n    @media only screen and ", " {\n      color: var(--primary-hover);\n      border-color: var(--primary-hover);\n    }\n  }\n\n  &:disabled {\n    color: var(--dark-opacity-25);\n    border-color: var(--dark-opacity-25);\n  }\n"], ["\n  background-color: transparent;\n  color: var(--primary-initial);\n  border: 1px solid;\n  border-color: var(--primary-initial);\n  font: ", ";\n\n  @media only screen and ", " {\n    &:hover {\n      color: var(--primary-hover);\n      border-color: var(--primary-hover);\n    }\n  }\n  \n  \n\n  &:active {\n    color: var(--primary-press);\n    border-color: var(--primary-press);\n\n    @media only screen and ", " {\n      color: var(--primary-hover);\n      border-color: var(--primary-hover);\n    }\n  }\n\n  &:disabled {\n    color: var(--dark-opacity-25);\n    border-color: var(--dark-opacity-25);\n  }\n"])), function (props) {
+var success = (0, styled_components_1.css)(templateObject_3 || (templateObject_3 = __makeTemplateObject(["\n  background-color: var(--sustainability);\n  color: white;\n  border: 1px solid transparent;\n  font: ", ";\n\n  @media only screen and ", " {\n    &:hover {\n      color: white;\n    }\n  }\n  \n  &:active {\n    color: white;\n    @media only screen and ", " {\n      color: white;\n    }\n  }\n\n  &:disabled {\n    background-color: var(--dark-opacity-5);\n    color: var(--dark-opacity-25);\n  }\n"], ["\n  background-color: var(--sustainability);\n  color: white;\n  border: 1px solid transparent;\n  font: ", ";\n\n  @media only screen and ", " {\n    &:hover {\n      color: white;\n    }\n  }\n  \n  &:active {\n    color: white;\n    @media only screen and ", " {\n      color: white;\n    }\n  }\n\n  &:disabled {\n    background-color: var(--dark-opacity-5);\n    color: var(--dark-opacity-25);\n  }\n"])), function (props) {
     switch (props.$size) {
         case 'xsmall':
             return "var(--caption-bold-12-15)";
@@ -72,7 +72,21 @@ var inverted = (0, styled_components_1.css)(templateObject_3 || (templateObject_
             return "var(--body-bold-14-17)";
     }
 }, devices_1.devices.mdUp, devices_1.devices.md);
-var ghost = (0, styled_components_1.css)(templateObject_4 || (templateObject_4 = __makeTemplateObject(["\n  background-color: transparent;\n  color: var(--primary-initial);\n  border: 0;\n  font: ", ";\n\n  @media only screen and ", " {\n    &:hover {\n      color: var(--primary-initial);\n      background-color: var(--primary-opacity-5);\n    }\n  }\n\n  \n  &:active {\n    color: var(--primary-hover);\n    background-color: var(--primary-opacity-5);\n\n    @media only screen and ", " {\n      color: var(--primary-initial);\n    }\n  }\n\n  &:disabled {\n    color: var(--dark-opacity-25);\n  }\n"], ["\n  background-color: transparent;\n  color: var(--primary-initial);\n  border: 0;\n  font: ", ";\n\n  @media only screen and ", " {\n    &:hover {\n      color: var(--primary-initial);\n      background-color: var(--primary-opacity-5);\n    }\n  }\n\n  \n  &:active {\n    color: var(--primary-hover);\n    background-color: var(--primary-opacity-5);\n\n    @media only screen and ", " {\n      color: var(--primary-initial);\n    }\n  }\n\n  &:disabled {\n    color: var(--dark-opacity-25);\n  }\n"])), function (props) {
+var inverted = (0, styled_components_1.css)(templateObject_4 || (templateObject_4 = __makeTemplateObject(["\n  background-color: transparent;\n  color: var(--primary-initial);\n  border: 1px solid;\n  border-color: var(--primary-initial);\n  font: ", ";\n\n  @media only screen and ", " {\n    &:hover {\n      color: var(--primary-hover);\n      border-color: var(--primary-hover);\n    }\n  }\n  \n  \n\n  &:active {\n    color: var(--primary-press);\n    border-color: var(--primary-press);\n\n    @media only screen and ", " {\n      color: var(--primary-hover);\n      border-color: var(--primary-hover);\n    }\n  }\n\n  &:disabled {\n    color: var(--dark-opacity-25);\n    border-color: var(--dark-opacity-25);\n  }\n"], ["\n  background-color: transparent;\n  color: var(--primary-initial);\n  border: 1px solid;\n  border-color: var(--primary-initial);\n  font: ", ";\n\n  @media only screen and ", " {\n    &:hover {\n      color: var(--primary-hover);\n      border-color: var(--primary-hover);\n    }\n  }\n  \n  \n\n  &:active {\n    color: var(--primary-press);\n    border-color: var(--primary-press);\n\n    @media only screen and ", " {\n      color: var(--primary-hover);\n      border-color: var(--primary-hover);\n    }\n  }\n\n  &:disabled {\n    color: var(--dark-opacity-25);\n    border-color: var(--dark-opacity-25);\n  }\n"])), function (props) {
+    switch (props.$size) {
+        case 'xsmall':
+            return "var(--caption-bold-12-15)";
+        case 'small':
+            return "var(--body-bold-13-16)";
+        case 'big':
+            return "var(--body-bold-14-17)";
+        case 'medium':
+            return "var(--body-bold-14-17)";
+        default:
+            return "var(--body-bold-14-17)";
+    }
+}, devices_1.devices.mdUp, devices_1.devices.md);
+var ghost = (0, styled_components_1.css)(templateObject_5 || (templateObject_5 = __makeTemplateObject(["\n  background-color: transparent;\n  color: var(--primary-initial);\n  border: 0;\n  font: ", ";\n\n  @media only screen and ", " {\n    &:hover {\n      color: var(--primary-initial);\n      background-color: var(--primary-opacity-5);\n    }\n  }\n\n  \n  &:active {\n    color: var(--primary-hover);\n    background-color: var(--primary-opacity-5);\n\n    @media only screen and ", " {\n      color: var(--primary-initial);\n    }\n  }\n\n  &:disabled {\n    color: var(--dark-opacity-25);\n  }\n"], ["\n  background-color: transparent;\n  color: var(--primary-initial);\n  border: 0;\n  font: ", ";\n\n  @media only screen and ", " {\n    &:hover {\n      color: var(--primary-initial);\n      background-color: var(--primary-opacity-5);\n    }\n  }\n\n  \n  &:active {\n    color: var(--primary-hover);\n    background-color: var(--primary-opacity-5);\n\n    @media only screen and ", " {\n      color: var(--primary-initial);\n    }\n  }\n\n  &:disabled {\n    color: var(--dark-opacity-25);\n  }\n"])), function (props) {
     switch (props.$size) {
         case 'xsmall':
             return "var(--body-bold-13-16)";
@@ -86,7 +100,7 @@ var ghost = (0, styled_components_1.css)(templateObject_4 || (templateObject_4 =
             return "var(--body-bold-14-17)";
     }
 }, devices_1.devices.mdUp, devices_1.devices.md);
-exports.ButtonStyled = styled_components_1.default.button(templateObject_5 || (templateObject_5 = __makeTemplateObject(["\n  box-sizing: border-box;\n  position: relative;\n  display: flex;\n  justify-content: center;\n  align-items: center;\n  border-radius: 0.5rem;\n  padding: ", ";\n  cursor: pointer;\n  transition: all .2s;\n  width: ", ";\n  outline: none;\n  ", "\n  height: ", ";\n  &:disabled {\n    cursor: not-allowed;\n  }\n  .children{\n    margin-right: ", ";\n    background-color: transparent;\n    border-radius: inherit;\n    &:is(.isLoading){\n      background-color: inherit;\n    }\n    &:empty{\n      margin-right: 0;\n    }\n  }\n  .loadingContent{\n    position: absolute;\n    background-color: inherit;\n    inset: 0;\n    display: flex;\n    align-items: center;\n    justify-content: center;\n    z-index: 5;\n    border-radius: inherit;\n    svg{\n      color: inherit;\n    }\n  }\n  .buttonTooltip{\n    position: absolute;\n    right: 0;\n    top: calc(100% + 5px);\n    background: white;\n    color: var(--dark);\n    font: var(--caption-medium-10-12);\n    padding: 0.5rem 1rem;\n    border-radius: 0.5rem;\n    box-shadow: 0 6px 30px 0 var(--box-shadow-color);\n    user-select: none;\n    pointer-events: none;\n    transition: all .2s ease;\n    opacity: 0;\n    transition-delay: 0s;\n  }\n  &:hover{\n    .buttonTooltip{\n      opacity: 1;\n      transition-delay: 0.5s;\n    }\n  }\n  &:is(.loading) {\n    user-select: none;\n    pointer-events: none;\n    .children{\n      > span{\n        opacity: 0;\n      } \n    }\n    > *:not(.children){\n      opacity: 0;\n    }\n  }\n"], ["\n  box-sizing: border-box;\n  position: relative;\n  display: flex;\n  justify-content: center;\n  align-items: center;\n  border-radius: 0.5rem;\n  padding: ", ";\n  cursor: pointer;\n  transition: all .2s;\n  width: ", ";\n  outline: none;\n  ", "\n  height: ", ";\n  &:disabled {\n    cursor: not-allowed;\n  }\n  .children{\n    margin-right: ", ";\n    background-color: transparent;\n    border-radius: inherit;\n    &:is(.isLoading){\n      background-color: inherit;\n    }\n    &:empty{\n      margin-right: 0;\n    }\n  }\n  .loadingContent{\n    position: absolute;\n    background-color: inherit;\n    inset: 0;\n    display: flex;\n    align-items: center;\n    justify-content: center;\n    z-index: 5;\n    border-radius: inherit;\n    svg{\n      color: inherit;\n    }\n  }\n  .buttonTooltip{\n    position: absolute;\n    right: 0;\n    top: calc(100% + 5px);\n    background: white;\n    color: var(--dark);\n    font: var(--caption-medium-10-12);\n    padding: 0.5rem 1rem;\n    border-radius: 0.5rem;\n    box-shadow: 0 6px 30px 0 var(--box-shadow-color);\n    user-select: none;\n    pointer-events: none;\n    transition: all .2s ease;\n    opacity: 0;\n    transition-delay: 0s;\n  }\n  &:hover{\n    .buttonTooltip{\n      opacity: 1;\n      transition-delay: 0.5s;\n    }\n  }\n  &:is(.loading) {\n    user-select: none;\n    pointer-events: none;\n    .children{\n      > span{\n        opacity: 0;\n      } \n    }\n    > *:not(.children){\n      opacity: 0;\n    }\n  }\n"])), function (props) { return props.$width ? '0' : '0 24px'; }, function (props) { return props.$width; }, function (props) {
+exports.ButtonStyled = styled_components_1.default.button(templateObject_6 || (templateObject_6 = __makeTemplateObject(["\n  box-sizing: border-box;\n  position: relative;\n  display: flex;\n  justify-content: center;\n  align-items: center;\n  border-radius: 0.5rem;\n  padding: ", ";\n  cursor: pointer;\n  transition: all .2s;\n  width: ", ";\n  outline: none;\n  ", "\n  height: ", ";\n  &:disabled {\n    cursor: not-allowed;\n  }\n  .children{\n    margin-right: ", ";\n    background-color: transparent;\n    border-radius: inherit;\n    &:is(.isLoading){\n      background-color: inherit;\n    }\n    &:empty{\n      margin-right: 0;\n    }\n  }\n  .loadingContent{\n    position: absolute;\n    background-color: inherit;\n    inset: 0;\n    display: flex;\n    align-items: center;\n    justify-content: center;\n    z-index: 5;\n    border-radius: inherit;\n    svg{\n      color: inherit;\n    }\n  }\n  .buttonTooltip{\n    position: absolute;\n    right: 0;\n    top: calc(100% + 5px);\n    background: white;\n    color: var(--dark);\n    font: var(--caption-medium-10-12);\n    padding: 0.5rem 1rem;\n    border-radius: 0.5rem;\n    box-shadow: 0 6px 30px 0 var(--box-shadow-color);\n    user-select: none;\n    pointer-events: none;\n    transition: all .2s ease;\n    opacity: 0;\n    transition-delay: 0s;\n  }\n  &:hover{\n    .buttonTooltip{\n      opacity: 1;\n      transition-delay: 0.5s;\n    }\n  }\n  &:is(.loading) {\n    user-select: none;\n    pointer-events: none;\n    .children{\n      > span{\n        opacity: 0;\n      } \n    }\n    > *:not(.children){\n      opacity: 0;\n    }\n  }\n"], ["\n  box-sizing: border-box;\n  position: relative;\n  display: flex;\n  justify-content: center;\n  align-items: center;\n  border-radius: 0.5rem;\n  padding: ", ";\n  cursor: pointer;\n  transition: all .2s;\n  width: ", ";\n  outline: none;\n  ", "\n  height: ", ";\n  &:disabled {\n    cursor: not-allowed;\n  }\n  .children{\n    margin-right: ", ";\n    background-color: transparent;\n    border-radius: inherit;\n    &:is(.isLoading){\n      background-color: inherit;\n    }\n    &:empty{\n      margin-right: 0;\n    }\n  }\n  .loadingContent{\n    position: absolute;\n    background-color: inherit;\n    inset: 0;\n    display: flex;\n    align-items: center;\n    justify-content: center;\n    z-index: 5;\n    border-radius: inherit;\n    svg{\n      color: inherit;\n    }\n  }\n  .buttonTooltip{\n    position: absolute;\n    right: 0;\n    top: calc(100% + 5px);\n    background: white;\n    color: var(--dark);\n    font: var(--caption-medium-10-12);\n    padding: 0.5rem 1rem;\n    border-radius: 0.5rem;\n    box-shadow: 0 6px 30px 0 var(--box-shadow-color);\n    user-select: none;\n    pointer-events: none;\n    transition: all .2s ease;\n    opacity: 0;\n    transition-delay: 0s;\n  }\n  &:hover{\n    .buttonTooltip{\n      opacity: 1;\n      transition-delay: 0.5s;\n    }\n  }\n  &:is(.loading) {\n    user-select: none;\n    pointer-events: none;\n    .children{\n      > span{\n        opacity: 0;\n      } \n    }\n    > *:not(.children){\n      opacity: 0;\n    }\n  }\n"])), function (props) { return props.$width ? '0' : '0 24px'; }, function (props) { return props.$width; }, function (props) {
     switch (props.$variant) {
         case 'primary':
             return primary;
@@ -96,6 +110,8 @@ exports.ButtonStyled = styled_components_1.default.button(templateObject_5 || (t
             return inverted;
         case 'ghost':
             return ghost;
+        case 'success':
+            return success;
         default:
             return primary;
     }
@@ -113,5 +129,5 @@ exports.ButtonStyled = styled_components_1.default.button(templateObject_5 || (t
             return "48px";
     }
 }, function (props) { return props.$icon && !props.$isLoading ? "10px" : "0"; });
-exports.IconStyled = styled_components_1.default.div(templateObject_6 || (templateObject_6 = __makeTemplateObject(["\n  display: flex;\n  align-items: center;\n  svg{\n    width: ", ";\n    height: ", ";\n    transition: all .2s ease;\n  }\n"], ["\n  display: flex;\n  align-items: center;\n  svg{\n    width: ", ";\n    height: ", ";\n    transition: all .2s ease;\n  }\n"])), function (props) { return props.$iconSize && props.$iconSize; }, function (props) { return props.$iconSize && props.$iconSize; });
-var templateObject_1, templateObject_2, templateObject_3, templateObject_4, templateObject_5, templateObject_6;
+exports.IconStyled = styled_components_1.default.div(templateObject_7 || (templateObject_7 = __makeTemplateObject(["\n  display: flex;\n  align-items: center;\n  svg{\n    width: ", ";\n    height: ", ";\n    transition: all .2s ease;\n  }\n"], ["\n  display: flex;\n  align-items: center;\n  svg{\n    width: ", ";\n    height: ", ";\n    transition: all .2s ease;\n  }\n"])), function (props) { return props.$iconSize && props.$iconSize; }, function (props) { return props.$iconSize && props.$iconSize; });
+var templateObject_1, templateObject_2, templateObject_3, templateObject_4, templateObject_5, templateObject_6, templateObject_7;

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

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

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

@@ -0,0 +1,32 @@
+/// <reference types="react" />
+export declare const variants: string[];
+export declare const sizes: string[];
+export declare const iconNames: string[];
+type SIZES = typeof sizes[number];
+type VARIANT = typeof variants[number];
+type ICON = typeof iconNames[any];
+export interface Button {
+    size: SIZES;
+    variant: VARIANT;
+    children?: React.ReactNode;
+    isLoading?: boolean;
+    onClick?: (event: React.MouseEvent<HTMLButtonElement>) => void;
+    disabled?: boolean;
+    icon?: ICON;
+    width?: string;
+    type?: "submit" | "reset" | "button" | undefined;
+    iconSize?: string;
+    tooltip?: string;
+}
+export interface ButtonStyledProps {
+    $size?: SIZES;
+    $variant?: VARIANT;
+    $icon?: ICON;
+    $width?: string;
+    $isLoading?: boolean;
+    $iconSize?: string;
+    $tooltip?: string;
+}
+export declare const ButtonDefault: Button;
+export type ButtonProps = typeof ButtonDefault;
+export {};

package/dist/components/Button/props.js

@@ -2,7 +2,7 @@
 Object.defineProperty(exports, "__esModule", { value: true });
 exports.ButtonDefault = exports.iconNames = exports.sizes = exports.variants = void 0;
 var iconList_1 = require("../Icon/iconList");
-exports.variants = ['primary', 'secondary', 'inverted', 'ghost'];
+exports.variants = ['primary', 'secondary', 'inverted', 'ghost', "success"];
 exports.sizes = ['big', 'medium', 'small', 'xsmall'];
 exports.iconNames = Object.keys(iconList_1.iconList);
 exports.ButtonDefault = {

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

@@ -0,0 +1,50 @@
+/// <reference types="react" />
+declare const _default: {
+    title: string;
+    component: import("react").ForwardRefExoticComponent<import("../props").Button & import("react").RefAttributes<any>>;
+    tags: string[];
+    argTypes: {
+        variant: {
+            control: string;
+            options: string[];
+        };
+        size: {
+            control: string;
+            options: string[];
+        };
+        icon: {
+            control: string;
+            options: string[];
+        };
+        onClick: {
+            action: string;
+        };
+    };
+};
+export default _default;
+export declare const Default: {
+    args: {
+        variant: string;
+        size: string;
+        children: string;
+        disabled: boolean;
+        isLoading: boolean;
+        width: string;
+        type: string;
+        tooltip: string;
+    };
+};
+export declare const Icon: {
+    args: {
+        icon: string;
+        iconSize: string;
+        variant: string;
+        size: string;
+        children: string;
+        disabled: boolean;
+        isLoading: boolean;
+        width: string;
+        type: string;
+        tooltip: string;
+    };
+};

package/dist/components/CampaignCard/CampaignCard.d.ts

@@ -0,0 +1,3 @@
+import { CampaignCardProps } from "./props";
+declare const CampaignCard: ({ size, onClick, hasDelivery, deliveryText, isProgressComplete, activeStep, totalStep, title, progressTitle, image }: CampaignCardProps) => import("react/jsx-runtime").JSX.Element;
+export default CampaignCard;

package/dist/components/CampaignCard/CampaignCard.styled.d.ts

@@ -0,0 +1,3 @@
+/// <reference types="react" />
+import { CampaignCardStyledProps } from "./props";
+export declare const CampaignCardStyled: import("styled-components/dist/types").IStyledComponentBase<"web", import("styled-components/dist/types").Substitute<import("react").DetailedHTMLProps<import("react").HTMLAttributes<HTMLDivElement>, HTMLDivElement>, CampaignCardStyledProps>> & string;

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

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

package/dist/components/CampaignCard/props.d.ts

@@ -0,0 +1,21 @@
+/// <reference types="react" />
+export declare const sizes: string[];
+type SIZES = typeof sizes[number];
+interface CampaignCard {
+    size?: SIZES;
+    onClick?: () => void;
+    hasDelivery?: boolean;
+    deliveryText?: string;
+    isProgressComplete?: boolean;
+    activeStep?: number;
+    totalStep?: number;
+    title?: string;
+    progressTitle?: string;
+    image?: React.ReactNode;
+}
+export interface CampaignCardStyledProps {
+    $size?: SIZES;
+}
+export declare const CampaignCardDefault: CampaignCard;
+export type CampaignCardProps = typeof CampaignCardDefault;
+export {};

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

@@ -0,0 +1,26 @@
+declare const _default: {
+    title: string;
+    component: (props: any) => import("react/jsx-runtime").JSX.Element;
+    tags: string[];
+    argTypes: {
+        size: {
+            control: string;
+            options: string[];
+        };
+    };
+};
+export default _default;
+export declare const Default: {
+    args: {
+        size: string;
+        deliveryText: string;
+        onClick: () => void;
+        hasDelivery: boolean;
+        isProgressComplete: boolean;
+        activeStep: number;
+        totalStep: number;
+        title: string;
+        progressTitle: string;
+        image: import("react/jsx-runtime").JSX.Element;
+    };
+};

package/dist/components/CategoryMenu/CategoryMenu.d.ts

@@ -0,0 +1,3 @@
+import { CategoryMenuProps } from "./props";
+declare const CategoryMenu: ({ data, subMenuRowLength, }: CategoryMenuProps) => import("react/jsx-runtime").JSX.Element;
+export default CategoryMenu;

package/dist/components/CategoryMenu/CategoryMenu.styled.d.ts

@@ -0,0 +1,9 @@
+/// <reference types="react" />
+import { CategoryMenuStyled } from "./props";
+export declare const CategoryMenuWrapper: import("styled-components/dist/types").IStyledComponentBase<"web", import("styled-components").FastOmit<import("react").DetailedHTMLProps<import("react").HTMLAttributes<HTMLUListElement>, HTMLUListElement>, never>> & string;
+export declare const CategoryItem: import("styled-components/dist/types").IStyledComponentBase<"web", import("styled-components/dist/types").Substitute<import("react").DetailedHTMLProps<import("react").LiHTMLAttributes<HTMLLIElement>, HTMLLIElement>, CategoryMenuStyled>> & string;
+export declare const CategoryItemButtonInner: import("styled-components/dist/types").IStyledComponentBase<"web", import("styled-components").FastOmit<import("react").DetailedHTMLProps<import("react").HTMLAttributes<HTMLSpanElement>, HTMLSpanElement>, never>> & string;
+export declare const CategoryItemButtonIcon: import("styled-components/dist/types").IStyledComponentBase<"web", import("styled-components/dist/types").Substitute<import("react").DetailedHTMLProps<import("react").HTMLAttributes<HTMLSpanElement>, HTMLSpanElement>, CategoryMenuStyled>> & string;
+export declare const CategoryItemButtonBadge: import("styled-components/dist/types").IStyledComponentBase<"web", import("styled-components").FastOmit<import("react").DetailedHTMLProps<import("react").HTMLAttributes<HTMLSpanElement>, HTMLSpanElement>, never>> & string;
+export declare const CategoryItemButtonTitle: import("styled-components/dist/types").IStyledComponentBase<"web", import("styled-components").FastOmit<import("react").DetailedHTMLProps<import("react").HTMLAttributes<HTMLElement>, HTMLElement>, never>> & string;
+export declare const SubMenu: import("styled-components/dist/types").IStyledComponentBase<"web", import("styled-components/dist/types").Substitute<import("react").DetailedHTMLProps<import("react").HTMLAttributes<HTMLUListElement>, HTMLUListElement>, CategoryMenuStyled>> & string;

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

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

package/dist/components/CategoryMenu/props.d.ts

@@ -0,0 +1,12 @@
+export interface CategoryMenu {
+    subMenuRowLength?: number;
+    data?: object[];
+    isActiveCategory?: boolean;
+}
+export interface CategoryMenuStyled {
+    $subMenuRowLength?: number;
+    $isActiveCategory?: boolean;
+    $hasAnimation?: boolean;
+}
+export declare const CategoryMenuDefault: CategoryMenu;
+export type CategoryMenuProps = typeof CategoryMenuDefault;

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

@@ -0,0 +1,136 @@
+declare const _default: {
+    title: string;
+    component: ({ data, subMenuRowLength, }: import("../props").CategoryMenu) => import("react/jsx-runtime").JSX.Element;
+    tags: string[];
+    argTypes: {
+        subMenuRowLength: {
+            control: string;
+        };
+        data: {
+            control: string;
+        };
+    };
+};
+export default _default;
+export declare const Default: {
+    argTypes: {
+        subMenuRowLength: {
+            control: string;
+        };
+        data: {
+            control: string;
+        };
+    };
+    args: {
+        subMenuRowLength: number;
+        data: ({
+            id: number;
+            parentId: number;
+            name: string;
+            filterName: any;
+            isShowHeader: boolean;
+            slug: string;
+            productCount: number;
+            headerMediaUrl: any;
+            medias: any[];
+            icon: string;
+            children: any[];
+            isActive: boolean;
+            component?: undefined;
+            badgeText?: undefined;
+        } | {
+            id: number;
+            parentId: number;
+            name: string;
+            filterName: any;
+            isShowHeader: boolean;
+            slug: string;
+            productCount: number;
+            headerMediaUrl: string;
+            medias: any[];
+            icon: string;
+            children: ({
+                id: number;
+                parentId: number;
+                name: string;
+                filterName: any;
+                isShowHeader: boolean;
+                slug: string;
+                productCount: number;
+                headerMediaUrl: any;
+                medias: any[];
+                children: {
+                    id: number;
+                    parentId: number;
+                    name: string;
+                    filterName: any;
+                    isShowHeader: boolean;
+                    slug: string;
+                    productCount: number;
+                    headerMediaUrl: any;
+                    medias: any[];
+                    children: any[];
+                }[];
+                isSeeAll?: undefined;
+            } | {
+                id: number;
+                name: string;
+                isSeeAll: boolean;
+                slug: string;
+                parentId?: undefined;
+                filterName?: undefined;
+                isShowHeader?: undefined;
+                productCount?: undefined;
+                headerMediaUrl?: undefined;
+                medias?: undefined;
+                children?: undefined;
+            })[];
+            isActive?: undefined;
+            component?: undefined;
+            badgeText?: undefined;
+        } | {
+            id: number;
+            parentId: number;
+            name: string;
+            filterName: any;
+            isShowHeader: boolean;
+            slug: string;
+            productCount: number;
+            headerMediaUrl: any;
+            medias: any[];
+            icon: string;
+            component: ({ children }: {
+                children: any;
+            }) => import("react/jsx-runtime").JSX.Element;
+            children: {
+                id: number;
+                parentId: number;
+                name: string;
+                filterName: any;
+                isShowHeader: boolean;
+                slug: string;
+                productCount: number;
+                headerMediaUrl: any;
+                medias: any[];
+                children: any[];
+            }[];
+            isActive?: undefined;
+            badgeText?: undefined;
+        } | {
+            id: number;
+            parentId: number;
+            name: string;
+            filterName: any;
+            isShowHeader: boolean;
+            slug: string;
+            productCount: number;
+            headerMediaUrl: any;
+            medias: any[];
+            icon: string;
+            children: any[];
+            badgeText: string;
+            isActive?: undefined;
+            component?: undefined;
+        })[];
+    };
+};

package/dist/components/Checkbox/Checkbox.d.ts

@@ -0,0 +1,3 @@
+import { CheckboxProps } from "./props";
+declare const Checkbox: ({ value, checked, onChange, name, id, label, disabled, size, valid, labelOffset, color, textSize, verticalAlign, required, readOnly, }: CheckboxProps) => import("react/jsx-runtime").JSX.Element;
+export default Checkbox;

package/dist/components/Checkbox/Checkbox.styled.d.ts

@@ -0,0 +1,3 @@
+/// <reference types="react" />
+import { CheckboxStyledProps } from "./props";
+export declare const CheckboxStyled: import("styled-components/dist/types").IStyledComponentBase<"web", import("styled-components/dist/types").Substitute<import("react").DetailedHTMLProps<import("react").LabelHTMLAttributes<HTMLLabelElement>, HTMLLabelElement>, CheckboxStyledProps>> & string;

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

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