@okam/stack-ui 1.37.1 → 1.38.1

package/index98.mjs

@@ -1,47 +1,76 @@
 import { tv as e } from "tailwind-variants";
-const t = e({
-  base: "flex focus-ring-black"
-}), o = e({
-  base: "hover:cursor-pointer",
-  variants: {
-    color: {
-      gray: "text-gray-300",
-      black: "text-black"
-    },
-    isDisabled: {
-      true: "text-gray-6"
-    }
-  },
+const o = e({
+  base: `
+    flex
+    items-center
+    justify-center
+    gap-4
+    transition
+    duration-300
+    ease-in-out
+    disabled:pointer-events-none
+    disabled:opacity-30
+    focus-ring-black
+  `,
   defaultVariants: {
-    color: "black"
-  }
-}), a = e({
-  base: "w-6 h-6 mt-0.5 mr-2.5 rounded-full border-2 border-gray-2 shrink-0 hover:cursor-pointer flex items-center justify-center",
+    buttonStyle: "default",
+    type: "button",
+    size: "default",
+    shape: "rounded"
+  },
   variants: {
-    isDisabled: {
-      true: "border-gray-6"
+    type: {
+      button: "",
+      menu: "text-2xl"
     },
-    isFocused: {
-      true: "outline-black [outline-offset: 2px]"
+    buttonStyle: {
+      default: `
+            px-4
+            py-2
+            text-white
+            !bg-color-1-500 
+            hover:!bg-color-1-400
+            active:!bg-color-1-400
+          `,
+      outline: `
+            px-4
+            py-2
+            bg-transparent
+            !border-color-1-500
+            text-color-1-500
+            hover:bg-color-1-500
+            hover:text-white
+            active:bg-color-1-500
+            active:text-white
+          `,
+      hollow: `
+            px-2
+            bg-transparent
+            text-color-1-500
+            hover:border-b-color-1-500
+            active:border-b-color-1-500
+            focus:border-b-color-1-500
+    
+          `
     },
-    isError: {
-      true: "border-red-500"
-    }
-  }
-}), c = e({
-  base: "hidden w-4 h-4 bg-gray-300 rounded-full",
-  variants: {
-    selected: {
-      true: "block text-white"
+    intent: {
+      error: `
+            !bg-error 
+            text-white 
+            pointer-events-none
+            !border-error
+          `
+    },
+    size: {
+      default: "min-w-12 min-h-6",
+      large: "min-w-36 min-h-18"
+    },
+    shape: {
+      rounded: "rounded-md",
+      circular: "rounded-full"
     }
   }
-}), s = e({
-  base: "text-white w-4 h-4 [&_svg]:w-4 [&_svg]:h-4"
 });
 export {
-  a as checkBox,
-  c as checkMark,
-  s as checkMarkIcon,
-  t as checkboxContainer,
-  o as checkboxLabel
+  o as default
 };

package/index99.js

@@ -1 +1,64 @@
-"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const e=require("tailwind-variants"),o=e.tv({base:"block",variants:{isDisabled:{true:"opacity-60 pointer-events-none"}}}),t=e.tv({base:"flex flex-col gap-4 py-8"});exports.checkboxGroup=o;exports.checkboxGroupItemsGroup=t;
+"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const e=require("tailwind-variants"),t=e.tv({base:"text-gray-800 flex flex-col gap-4"}),a=e.tv({base:"flex items-center justify-between"}),r=e.tv({base:"text-2xl text-color-1-500 font-bold"}),l=e.tv({base:""});e.tv({base:""});e.tv({base:""});e.tv({base:""});const n=e.tv({base:"flex items-center gap-1"}),s=e.tv({base:`
+    active:bg-color-1-500
+    p-2
+    rounded-full
+    active:text-color-1-100
+    hover:bg-color-1-200
+    focus-ring-black
+    transition-all
+    duration-300
+    ease-in-out
+  `}),i=e.tv({base:`
+    border-spacing-2
+    border-separate
+  `}),o=e.tv({base:`
+    text-center
+    capitalize
+    rounded-lg
+    p-2
+    mx-2
+    bg-color-1-300
+  `}),c=e.tv({base:"text-center",variants:{isFocusVisible:{true:"z-10",false:""}}}),d=e.tv({base:"w-10 h-10",variants:{isSelected:{true:"",false:""},isInvalid:{true:"",false:""},isDisabled:{true:"disabled pointer-events-none",false:""},isUnavailable:{true:"pointer-events-none",false:""},isOutsideRange:{true:"pointer-events-none",false:""},isOutsideVisibleRange:{true:"pointer-events-none",false:""},isRoundedLeft:{true:"rounded-l-full",false:""},isRoundedRight:{true:"rounded-r-full",false:""}},compoundVariants:[{isSelected:[!0,!1],isInvalid:!0,class:"bg-error-400 hover:bg-error-500"},{isSelected:!0}]}),u=e.tv({base:`
+    w-full
+    h-full
+    flex
+    items-center
+    justify-center
+    cursor-pointer
+    transition-all
+    duration-100
+    ease-in-out
+    relative
+  `,variants:{isSelected:{true:`
+        bg-color-1-400
+        text-white
+        hover:bg-color-1-500
+      `,false:`
+        rounded-full
+        hover:text-white
+        hover:bg-color-1-400
+      `},isInvalid:{true:"",fasle:""},isDisabled:{true:"opacity-50",false:""},isUnavailable:{true:"text-gray-200",false:""},isOutsideRange:{true:`
+        text-black
+        before:content-['/']
+        before:text-gray-400
+        before:[font-weight:100]
+        before:text-4xl
+        before:absolute
+        before:inset-0
+        before:flex
+        before:items-center
+        before:justify-center
+      `,false:""},isOutsideVisibleRange:{true:"text-gray-400",false:""},isFocusVisible:{true:"",false:""},isSelectionStart:{true:"",false:""},isSelectionEnd:{true:"",false:""}},compoundVariants:[{isSelectionStart:[!0,!1],isSelectionEnd:[!0,!1],isDisabled:!1,isOutsideRange:!1,isUnavailable:!1,isInvalid:!0,class:`
+        bg-error-400
+        hover:bg-error-500
+      `},{isSelectionStart:!0,class:`
+        rounded-l-full
+        bg-color-1-400
+        text-white
+        hover:bg-color-1-500
+      `},{isSelectionEnd:!0,class:`
+        rounded-r-full
+        bg-color-1-400
+        text-white
+        hover:bg-color-1-500
+      `}]}),b={container:t,header:a,calendarHeaderContainer:l,title:r,navigationButtonsContainer:n,navigationButtons:s,calendarTable:i,calendarDayLabel:o,cellContainer:c,cell:d,cellDate:u};exports.calendarCell=d;exports.calendarCellContainer=c;exports.calendarCellDate=u;exports.calendarContainer=t;exports.calendarDayLabel=o;exports.calendarHeader=a;exports.calendarHeaderContainer=l;exports.calendarNavigationButtons=s;exports.calendarNavigationButtonsContainer=n;exports.calendarTable=i;exports.calendarTheme=b;exports.calendarTitle=r;

package/index99.mjs

@@ -1,15 +1,230 @@
-import { tv as o } from "tailwind-variants";
-const t = o({
-  base: "block",
+import { tv as e } from "tailwind-variants";
+const t = e({
+  base: "text-gray-800 flex flex-col gap-4"
+}), a = e({
+  base: "flex items-center justify-between"
+}), r = e({
+  base: "text-2xl text-color-1-500 font-bold"
+}), l = e({
+  base: ""
+});
+e({
+  base: ""
+});
+e({
+  base: ""
+});
+e({
+  base: ""
+});
+const s = e({
+  base: "flex items-center gap-1"
+}), n = e({
+  base: `
+    active:bg-color-1-500
+    p-2
+    rounded-full
+    active:text-color-1-100
+    hover:bg-color-1-200
+    focus-ring-black
+    transition-all
+    duration-300
+    ease-in-out
+  `
+}), o = e({
+  base: `
+    border-spacing-2
+    border-separate
+  `
+}), i = e({
+  base: `
+    text-center
+    capitalize
+    rounded-lg
+    p-2
+    mx-2
+    bg-color-1-300
+  `
+}), c = e({
+  base: "text-center",
   variants: {
-    isDisabled: {
-      true: "opacity-60 pointer-events-none"
+    isFocusVisible: {
+      true: "z-10",
+      false: ""
     }
   }
-}), c = o({
-  base: "flex flex-col gap-4 py-8"
-});
+}), u = e({
+  base: "w-10 h-10",
+  variants: {
+    isSelected: {
+      true: "",
+      false: ""
+    },
+    isInvalid: {
+      true: "",
+      false: ""
+    },
+    isDisabled: {
+      true: "disabled pointer-events-none",
+      false: ""
+    },
+    isUnavailable: {
+      true: "pointer-events-none",
+      false: ""
+    },
+    isOutsideRange: {
+      true: "pointer-events-none",
+      false: ""
+    },
+    isOutsideVisibleRange: {
+      true: "pointer-events-none",
+      false: ""
+    },
+    isRoundedLeft: {
+      true: "rounded-l-full",
+      false: ""
+    },
+    isRoundedRight: {
+      true: "rounded-r-full",
+      false: ""
+    }
+  },
+  compoundVariants: [
+    {
+      isSelected: [!0, !1],
+      isInvalid: !0,
+      class: "bg-error-400 hover:bg-error-500"
+    },
+    {
+      isSelected: !0
+    }
+  ]
+}), d = e({
+  base: `
+    w-full
+    h-full
+    flex
+    items-center
+    justify-center
+    cursor-pointer
+    transition-all
+    duration-100
+    ease-in-out
+    relative
+  `,
+  variants: {
+    isSelected: {
+      true: `
+        bg-color-1-400
+        text-white
+        hover:bg-color-1-500
+      `,
+      false: `
+        rounded-full
+        hover:text-white
+        hover:bg-color-1-400
+      `
+    },
+    isInvalid: {
+      true: "",
+      fasle: ""
+    },
+    isDisabled: {
+      true: "opacity-50",
+      false: ""
+    },
+    isUnavailable: {
+      true: "text-gray-200",
+      false: ""
+    },
+    isOutsideRange: {
+      true: `
+        text-black
+        before:content-['/']
+        before:text-gray-400
+        before:[font-weight:100]
+        before:text-4xl
+        before:absolute
+        before:inset-0
+        before:flex
+        before:items-center
+        before:justify-center
+      `,
+      false: ""
+    },
+    isOutsideVisibleRange: {
+      true: "text-gray-400",
+      false: ""
+    },
+    isFocusVisible: {
+      true: "",
+      false: ""
+    },
+    isSelectionStart: {
+      true: "",
+      false: ""
+    },
+    isSelectionEnd: {
+      true: "",
+      false: ""
+    }
+  },
+  compoundVariants: [
+    {
+      isSelectionStart: [!0, !1],
+      isSelectionEnd: [!0, !1],
+      isDisabled: !1,
+      isOutsideRange: !1,
+      isUnavailable: !1,
+      isInvalid: !0,
+      class: `
+        bg-error-400
+        hover:bg-error-500
+      `
+    },
+    {
+      isSelectionStart: !0,
+      class: `
+        rounded-l-full
+        bg-color-1-400
+        text-white
+        hover:bg-color-1-500
+      `
+    },
+    {
+      isSelectionEnd: !0,
+      class: `
+        rounded-r-full
+        bg-color-1-400
+        text-white
+        hover:bg-color-1-500
+      `
+    }
+  ]
+}), f = {
+  container: t,
+  header: a,
+  calendarHeaderContainer: l,
+  title: r,
+  navigationButtonsContainer: s,
+  navigationButtons: n,
+  calendarTable: o,
+  calendarDayLabel: i,
+  cellContainer: c,
+  cell: u,
+  cellDate: d
+};
 export {
-  t as checkboxGroup,
-  c as checkboxGroupItemsGroup
+  u as calendarCell,
+  c as calendarCellContainer,
+  d as calendarCellDate,
+  t as calendarContainer,
+  i as calendarDayLabel,
+  a as calendarHeader,
+  l as calendarHeaderContainer,
+  n as calendarNavigationButtons,
+  s as calendarNavigationButtonsContainer,
+  o as calendarTable,
+  f as calendarTheme,
+  r as calendarTitle
 };

package/logger.d.ts

@@ -1,2 +1,2 @@
 export declare const logger: import("@okam/logger").Logger;
-export declare const log: (message: string, severity?: import("@okam/logger").LogSeverity | undefined, context?: Record<string, unknown> | undefined) => void;
+export declare const log: (message: string, severity?: import("@okam/logger").LogSeverity, context?: Record<string, unknown>) => void;

package/message.d.ts

@@ -0,0 +1,7 @@
+import type { FC } from 'react';
+type Props = {
+    message: string;
+    children?: never;
+};
+export declare const Message: FC<Props>;
+export {};

package/package.json

@@ -1,7 +1,7 @@
 {
   "name": "@okam/stack-ui",
   "main": "./index.js",
-  "version": "1.37.1",
+  "version": "1.38.1",
   "types": "./index.d.ts",
   "exports": {
     ".": {

package/providers/Accordion/index.d.ts

@@ -1,4 +1,3 @@
-/// <reference types="react" />
 import type { TAccordionContext, TAccordionProviderProps } from './interface';
 export declare const useAccordionCtx: () => TAccordionContext, AccordionProvider: import("react").Provider<TAccordionContext | undefined>;
 export declare function AccordionContextProvider(props: TAccordionProviderProps): import("react/jsx-runtime").JSX.Element;

package/providers/Menu/index.d.ts

@@ -1,4 +1,3 @@
-/// <reference types="react" />
 import type { IMenuProviderProps, TMenuContext } from './interface';
 export declare const useMenu: () => TMenuContext, MenuProvider: import("react").Provider<TMenuContext | undefined>;
 export declare function MenuContextProvider({ children, defaultSelectedKey, defaultIsOpen, onCloseCallback, onOpenCallback, tabs, openBtn, closeBtn, ...rest }: IMenuProviderProps): import("react/jsx-runtime").JSX.Element;

package/providers/Swiper/index.d.ts

@@ -1,4 +1,3 @@
-/// <reference types="react" />
 import type { TSwiperControllerContext, TSwiperControllerProviderProps } from './interface';
 export declare const useSwiperController: () => TSwiperControllerContext, SwiperControllerProvider: import("react").Provider<TSwiperControllerContext | undefined>;
 export declare function SwiperControllerContextProvider(props: TSwiperControllerProviderProps): import("react/jsx-runtime").JSX.Element;

package/providers/Translation/index.d.ts

@@ -1,4 +1,3 @@
-/// <reference types="react" />
 import type { TTranslationContext, TTranslationProps } from './interface';
 export declare const useTranslation: () => TTranslationContext, TranslationProvider: import("react").Provider<TTranslationContext | undefined>;
 export declare function TranslationContextProvider({ useTranslationFunc, children, namespace, translateFunctionName, }: TTranslationProps): import("react/jsx-runtime").JSX.Element;

package/providers/Translation/interface.d.ts

@@ -1,4 +1,3 @@
-/// <reference types="react" />
 export type TTranslateFunc = (key: string, obj?: Record<string, unknown>) => string;
 export type TTranslationProps = {
     useTranslationFunc: (ns: string) => {

package/providers/UserSearchQuery/index.d.ts

@@ -1,4 +1,3 @@
-/// <reference types="react" />
 import type { TSearchListingContext, TSearchProviderProps } from './interface';
 export declare const useUserQueryValHook: () => TSearchListingContext, SearchProvider: import("react").Provider<TSearchListingContext | undefined>;
 export declare function SearchBarProvider(props: TSearchProviderProps): import("react/jsx-runtime").JSX.Element;

package/storybook/Lightbox/LightboxControlledState.d.ts

@@ -0,0 +1,3 @@
+import type { TLightboxProps } from '../../components/Lightbox/interface';
+declare const LightboxControlledState: (props: TLightboxProps) => import("react/jsx-runtime").JSX.Element;
+export default LightboxControlledState;

package/storybook/Menu/Menu.d.ts

@@ -0,0 +1,34 @@
+import type { ComponentType } from 'react';
+import React from 'react';
+import type { TButtonProps } from '../../components/Button/interface';
+import type { TMenuItemProps, TMenuProps, TMenuSidePanelProps } from '../../components/Menu/interface';
+export type TSubMenuTab = {
+    key: string;
+    title: string;
+    childItems?: TMenuItemProps[] | null;
+    extra: React.ReactNode | undefined;
+};
+export type TSubMenuExtraData = {
+    path: string;
+    data: React.ReactNode;
+};
+export declare const SidePanelControl: () => import("react/jsx-runtime").JSX.Element;
+export declare const BackBtn: ({ label }: TButtonProps & {
+    label?: string;
+}) => import("react/jsx-runtime").JSX.Element;
+export declare const CloseBtn: () => false | import("react/jsx-runtime").JSX.Element;
+export declare const ShowTab: ({ children }: {
+    children: React.ReactNode;
+}) => import("react/jsx-runtime").JSX.Element;
+export declare const CloseBtnRender: () => import("react/jsx-runtime").JSX.Element;
+export declare const MenuFactory: ({ menuItems, tabs, id, defaultIsOpen, openBtn, MenuComponent, }: {
+    tabs: JSX.Element[];
+    id: string;
+    menuItems?: TMenuItemProps[] | null;
+    defaultIsOpen?: boolean;
+    openBtn?: React.ReactNode | null;
+    MenuComponent: ComponentType<TMenuProps | TMenuSidePanelProps>;
+}) => import("react/jsx-runtime").JSX.Element;
+export declare const menuTabs: (menu: TMenuItemProps[], extras?: TSubMenuExtraData[], MenuComponent?: ComponentType<TMenuProps>) => import("react/jsx-runtime").JSX.Element[];
+declare const MenuContent: () => import("react/jsx-runtime").JSX.Element;
+export default MenuContent;

package/storybook/Menu/NestedMenu.d.ts

@@ -0,0 +1,2 @@
+declare const MenuContent: () => import("react/jsx-runtime").JSX.Element;
+export default MenuContent;

package/storybook/Menu/mock.d.ts

@@ -0,0 +1,2 @@
+import type { TMenuItemProps } from '../../components/Menu/interface';
+export declare const items: TMenuItemProps[];

package/storybook/SelectField/index.d.ts

@@ -0,0 +1,3 @@
+import type { TSelectProps } from '../../components/fields/Select/Select.interface';
+declare const SelectContent: ({ disabled, isError, errorMessage, id, label, name, placeholderLabel, options, ...rest }: TSelectProps) => import("react/jsx-runtime").JSX.Element;
+export default SelectContent;

package/storybook/ShareButtonExample/index.d.ts

@@ -0,0 +1,3 @@
+import type { TShareButtonProps } from '../../components/ShareButton/interface';
+declare const ShareButtonExample: (props: TShareButtonProps) => import("react/jsx-runtime").JSX.Element;
+export default ShareButtonExample;