@okam/stack-ui 1.25.3 → 1.25.6

package/theme/ShareButton/index.d.ts

@@ -0,0 +1,174 @@
+export declare const shareButtonContainer: import("tailwind-variants").TVReturnType<{
+    listDirection: {
+        row: "flex-row";
+        column: "flex-col";
+    };
+}, undefined, "flex print:hidden relative", import("tailwind-variants/dist/config").TVConfig<{
+    listDirection: {
+        row: "flex-row";
+        column: "flex-col";
+    };
+}, {
+    listDirection: {
+        row: "flex-row";
+        column: "flex-col";
+    };
+}>, {
+    listDirection: {
+        row: "flex-row";
+        column: "flex-col";
+    };
+}, undefined, import("tailwind-variants").TVReturnType<{
+    listDirection: {
+        row: "flex-row";
+        column: "flex-col";
+    };
+}, undefined, "flex print:hidden relative", import("tailwind-variants/dist/config").TVConfig<{
+    listDirection: {
+        row: "flex-row";
+        column: "flex-col";
+    };
+}, {
+    listDirection: {
+        row: "flex-row";
+        column: "flex-col";
+    };
+}>, unknown, unknown, undefined>>;
+export declare const shareButton: import("tailwind-variants").TVReturnType<{
+    isOpen: {
+        true: "";
+        false: "";
+    };
+}, undefined, "relative z-20 !bg-color-1-500 hover:!bg-color-1-400 w-16 h-16 flex justify-center items-center active:!bg-color-1-400 rounded-full text-white focus-ring-black", import("tailwind-variants/dist/config").TVConfig<{
+    isOpen: {
+        true: "";
+        false: "";
+    };
+}, {
+    isOpen: {
+        true: "";
+        false: "";
+    };
+}>, {
+    isOpen: {
+        true: "";
+        false: "";
+    };
+}, undefined, import("tailwind-variants").TVReturnType<{
+    isOpen: {
+        true: "";
+        false: "";
+    };
+}, undefined, "relative z-20 !bg-color-1-500 hover:!bg-color-1-400 w-16 h-16 flex justify-center items-center active:!bg-color-1-400 rounded-full text-white focus-ring-black", import("tailwind-variants/dist/config").TVConfig<{
+    isOpen: {
+        true: "";
+        false: "";
+    };
+}, {
+    isOpen: {
+        true: "";
+        false: "";
+    };
+}>, unknown, unknown, undefined>>;
+export declare const shareButtonLinksList: import("tailwind-variants").TVReturnType<{
+    listDirection: {
+        row: "flex-row pl-14 h-16 left-0";
+        column: "flex-col [width:calc(100% + .5rem)] pt-14 w-16 top-0";
+    };
+    isOpen: {
+        true: "opacity-100 visible";
+        false: "";
+    };
+}, undefined, "!bg-color-1-200 absolute opacity-0 invisible flex transition duration-300 items-center p-0 bg-primary-1 z-0 rounded-b-full rounded-t-full", import("tailwind-variants/dist/config").TVConfig<{
+    listDirection: {
+        row: "flex-row pl-14 h-16 left-0";
+        column: "flex-col [width:calc(100% + .5rem)] pt-14 w-16 top-0";
+    };
+    isOpen: {
+        true: "opacity-100 visible";
+        false: "";
+    };
+}, {
+    listDirection: {
+        row: "flex-row pl-14 h-16 left-0";
+        column: "flex-col [width:calc(100% + .5rem)] pt-14 w-16 top-0";
+    };
+    isOpen: {
+        true: "opacity-100 visible";
+        false: "";
+    };
+}>, {
+    listDirection: {
+        row: "flex-row pl-14 h-16 left-0";
+        column: "flex-col [width:calc(100% + .5rem)] pt-14 w-16 top-0";
+    };
+    isOpen: {
+        true: "opacity-100 visible";
+        false: "";
+    };
+}, undefined, import("tailwind-variants").TVReturnType<{
+    listDirection: {
+        row: "flex-row pl-14 h-16 left-0";
+        column: "flex-col [width:calc(100% + .5rem)] pt-14 w-16 top-0";
+    };
+    isOpen: {
+        true: "opacity-100 visible";
+        false: "";
+    };
+}, undefined, "!bg-color-1-200 absolute opacity-0 invisible flex transition duration-300 items-center p-0 bg-primary-1 z-0 rounded-b-full rounded-t-full", import("tailwind-variants/dist/config").TVConfig<{
+    listDirection: {
+        row: "flex-row pl-14 h-16 left-0";
+        column: "flex-col [width:calc(100% + .5rem)] pt-14 w-16 top-0";
+    };
+    isOpen: {
+        true: "opacity-100 visible";
+        false: "";
+    };
+}, {
+    listDirection: {
+        row: "flex-row pl-14 h-16 left-0";
+        column: "flex-col [width:calc(100% + .5rem)] pt-14 w-16 top-0";
+    };
+    isOpen: {
+        true: "opacity-100 visible";
+        false: "";
+    };
+}>, unknown, unknown, undefined>>;
+export declare const shareButtonLink: import("tailwind-variants").TVReturnType<{
+    listDirection: {
+        row: "last:rounded-r-full h-full";
+        column: "last:rounded-b-full";
+    };
+}, undefined, "\n    flex\n    items-center\n    justify-center\n    cursor-pointer\n    bg-color-1-200\n    hover:bg-color-1-300\n    w-full\n    text-color-1-500\n    rounded-none\n    p-2\n    focus-ring-black\n    z-10\n    has-focus-ring:z-20\n  ", import("tailwind-variants/dist/config").TVConfig<{
+    listDirection: {
+        row: "last:rounded-r-full h-full";
+        column: "last:rounded-b-full";
+    };
+}, {
+    listDirection: {
+        row: "last:rounded-r-full h-full";
+        column: "last:rounded-b-full";
+    };
+}>, {
+    listDirection: {
+        row: "last:rounded-r-full h-full";
+        column: "last:rounded-b-full";
+    };
+}, undefined, import("tailwind-variants").TVReturnType<{
+    listDirection: {
+        row: "last:rounded-r-full h-full";
+        column: "last:rounded-b-full";
+    };
+}, undefined, "\n    flex\n    items-center\n    justify-center\n    cursor-pointer\n    bg-color-1-200\n    hover:bg-color-1-300\n    w-full\n    text-color-1-500\n    rounded-none\n    p-2\n    focus-ring-black\n    z-10\n    has-focus-ring:z-20\n  ", import("tailwind-variants/dist/config").TVConfig<{
+    listDirection: {
+        row: "last:rounded-r-full h-full";
+        column: "last:rounded-b-full";
+    };
+}, {
+    listDirection: {
+        row: "last:rounded-r-full h-full";
+        column: "last:rounded-b-full";
+    };
+}>, unknown, unknown, undefined>>;
+export declare const shareButtonIcon: import("tailwind-variants").TVReturnType<{} | {} | {}, undefined, "text-white", import("tailwind-variants/dist/config").TVConfig<unknown, {} | {}>, {} | {}, undefined, import("tailwind-variants").TVReturnType<unknown, undefined, "text-white", import("tailwind-variants/dist/config").TVConfig<unknown, {} | {}>, unknown, unknown, undefined>>;
+export declare const shareButtonLinkIcons: import("tailwind-variants").TVReturnType<{} | {} | {}, undefined, "", import("tailwind-variants/dist/config").TVConfig<unknown, {} | {}>, {} | {}, undefined, import("tailwind-variants").TVReturnType<unknown, undefined, "", import("tailwind-variants/dist/config").TVConfig<unknown, {} | {}>, unknown, unknown, undefined>>;

package/theme/SidePanel/index.d.ts

@@ -0,0 +1,3 @@
+export declare const sidePanelWrapper: import("tailwind-variants").TVReturnType<{} | {} | {}, undefined, "m-auto fixed right-0 top-0 bottom-0 w-full max-w-[512px] [&>div]:h-full", import("tailwind-variants/dist/config").TVConfig<unknown, {} | {}>, {} | {}, undefined, import("tailwind-variants").TVReturnType<unknown, undefined, "m-auto fixed right-0 top-0 bottom-0 w-full max-w-[512px] [&>div]:h-full", import("tailwind-variants/dist/config").TVConfig<unknown, {} | {}>, unknown, unknown, undefined>>;
+export declare const sidePanelContainer: import("tailwind-variants").TVReturnType<{} | {} | {}, undefined, "h-full w-full flex justify-end", import("tailwind-variants/dist/config").TVConfig<unknown, {} | {}>, {} | {}, undefined, import("tailwind-variants").TVReturnType<unknown, undefined, "h-full w-full flex justify-end", import("tailwind-variants/dist/config").TVConfig<unknown, {} | {}>, unknown, unknown, undefined>>;
+export declare const sidePanelInnerContainer: import("tailwind-variants").TVReturnType<{} | {} | {}, undefined, "bg-black h-full w-full overflow-y-auto", import("tailwind-variants/dist/config").TVConfig<unknown, {} | {}>, {} | {}, undefined, import("tailwind-variants").TVReturnType<unknown, undefined, "bg-black h-full w-full overflow-y-auto", import("tailwind-variants/dist/config").TVConfig<unknown, {} | {}>, unknown, unknown, undefined>>;

package/theme/TextArea/index.d.ts

@@ -0,0 +1,29 @@
+export declare const textArea: import("tailwind-variants").TVReturnType<{
+    isError: {
+        true: "border-red-500";
+    };
+}, undefined, "\n    w-full\n    min-h-32\n    rounded-2xl\n    px-6\n    h-12\n    border-2\n    border-solid\n    transition\n    duration-300\n    ease-in-out\n    text-gray-2\n    placeholder:text-gray-2\n    focus-ring-black\n    \n  ", import("tailwind-variants/dist/config").TVConfig<{
+    isError: {
+        true: "border-red-500";
+    };
+}, {
+    isError: {
+        true: "border-red-500";
+    };
+}>, {
+    isError: {
+        true: "border-red-500";
+    };
+}, undefined, import("tailwind-variants").TVReturnType<{
+    isError: {
+        true: "border-red-500";
+    };
+}, undefined, "\n    w-full\n    min-h-32\n    rounded-2xl\n    px-6\n    h-12\n    border-2\n    border-solid\n    transition\n    duration-300\n    ease-in-out\n    text-gray-2\n    placeholder:text-gray-2\n    focus-ring-black\n    \n  ", import("tailwind-variants/dist/config").TVConfig<{
+    isError: {
+        true: "border-red-500";
+    };
+}, {
+    isError: {
+        true: "border-red-500";
+    };
+}>, unknown, unknown, undefined>>;

package/theme/Typography/index.d.ts

@@ -0,0 +1,233 @@
+declare const typography: import("tailwind-variants").TVReturnType<{
+    size: {
+        h1: "text-5xl";
+        h2: "text-4xl";
+        h3: "text-3xl";
+        h4: "text-2xl";
+        h5: "text-xl";
+        h6: "text-lg";
+        leading: "text-md font-bold leading-normal";
+        paragraph: "text-md inline";
+        footnotes: "text-sm";
+        xs: "text-xs";
+    };
+    font: {
+        body: "font-body";
+    };
+    weight: {
+        normal: "font-normal";
+        light: "font-light";
+        bold: "font-bold";
+    };
+    color: {
+        gray: "text-gray-500";
+        white: "text-white";
+    };
+    isError: {
+        true: "text-sm text-error py-3";
+    };
+    align: {
+        center: "text-center";
+        left: "text-left";
+        right: "text-right";
+    };
+}, undefined, undefined, import("tailwind-variants/dist/config").TVConfig<{
+    size: {
+        h1: "text-5xl";
+        h2: "text-4xl";
+        h3: "text-3xl";
+        h4: "text-2xl";
+        h5: "text-xl";
+        h6: "text-lg";
+        leading: "text-md font-bold leading-normal";
+        paragraph: "text-md inline";
+        footnotes: "text-sm";
+        xs: "text-xs";
+    };
+    font: {
+        body: "font-body";
+    };
+    weight: {
+        normal: "font-normal";
+        light: "font-light";
+        bold: "font-bold";
+    };
+    color: {
+        gray: "text-gray-500";
+        white: "text-white";
+    };
+    isError: {
+        true: "text-sm text-error py-3";
+    };
+    align: {
+        center: "text-center";
+        left: "text-left";
+        right: "text-right";
+    };
+}, {
+    size: {
+        h1: "text-5xl";
+        h2: "text-4xl";
+        h3: "text-3xl";
+        h4: "text-2xl";
+        h5: "text-xl";
+        h6: "text-lg";
+        leading: "text-md font-bold leading-normal";
+        paragraph: "text-md inline";
+        footnotes: "text-sm";
+        xs: "text-xs";
+    };
+    font: {
+        body: "font-body";
+    };
+    weight: {
+        normal: "font-normal";
+        light: "font-light";
+        bold: "font-bold";
+    };
+    color: {
+        gray: "text-gray-500";
+        white: "text-white";
+    };
+    isError: {
+        true: "text-sm text-error py-3";
+    };
+    align: {
+        center: "text-center";
+        left: "text-left";
+        right: "text-right";
+    };
+}>, {
+    size: {
+        h1: "text-5xl";
+        h2: "text-4xl";
+        h3: "text-3xl";
+        h4: "text-2xl";
+        h5: "text-xl";
+        h6: "text-lg";
+        leading: "text-md font-bold leading-normal";
+        paragraph: "text-md inline";
+        footnotes: "text-sm";
+        xs: "text-xs";
+    };
+    font: {
+        body: "font-body";
+    };
+    weight: {
+        normal: "font-normal";
+        light: "font-light";
+        bold: "font-bold";
+    };
+    color: {
+        gray: "text-gray-500";
+        white: "text-white";
+    };
+    isError: {
+        true: "text-sm text-error py-3";
+    };
+    align: {
+        center: "text-center";
+        left: "text-left";
+        right: "text-right";
+    };
+}, undefined, import("tailwind-variants").TVReturnType<{
+    size: {
+        h1: "text-5xl";
+        h2: "text-4xl";
+        h3: "text-3xl";
+        h4: "text-2xl";
+        h5: "text-xl";
+        h6: "text-lg";
+        leading: "text-md font-bold leading-normal";
+        paragraph: "text-md inline";
+        footnotes: "text-sm";
+        xs: "text-xs";
+    };
+    font: {
+        body: "font-body";
+    };
+    weight: {
+        normal: "font-normal";
+        light: "font-light";
+        bold: "font-bold";
+    };
+    color: {
+        gray: "text-gray-500";
+        white: "text-white";
+    };
+    isError: {
+        true: "text-sm text-error py-3";
+    };
+    align: {
+        center: "text-center";
+        left: "text-left";
+        right: "text-right";
+    };
+}, undefined, undefined, import("tailwind-variants/dist/config").TVConfig<{
+    size: {
+        h1: "text-5xl";
+        h2: "text-4xl";
+        h3: "text-3xl";
+        h4: "text-2xl";
+        h5: "text-xl";
+        h6: "text-lg";
+        leading: "text-md font-bold leading-normal";
+        paragraph: "text-md inline";
+        footnotes: "text-sm";
+        xs: "text-xs";
+    };
+    font: {
+        body: "font-body";
+    };
+    weight: {
+        normal: "font-normal";
+        light: "font-light";
+        bold: "font-bold";
+    };
+    color: {
+        gray: "text-gray-500";
+        white: "text-white";
+    };
+    isError: {
+        true: "text-sm text-error py-3";
+    };
+    align: {
+        center: "text-center";
+        left: "text-left";
+        right: "text-right";
+    };
+}, {
+    size: {
+        h1: "text-5xl";
+        h2: "text-4xl";
+        h3: "text-3xl";
+        h4: "text-2xl";
+        h5: "text-xl";
+        h6: "text-lg";
+        leading: "text-md font-bold leading-normal";
+        paragraph: "text-md inline";
+        footnotes: "text-sm";
+        xs: "text-xs";
+    };
+    font: {
+        body: "font-body";
+    };
+    weight: {
+        normal: "font-normal";
+        light: "font-light";
+        bold: "font-bold";
+    };
+    color: {
+        gray: "text-gray-500";
+        white: "text-white";
+    };
+    isError: {
+        true: "text-sm text-error py-3";
+    };
+    align: {
+        center: "text-center";
+        left: "text-left";
+        right: "text-right";
+    };
+}>, unknown, unknown, undefined>>;
+export default typography;

package/theme/index.d.ts

@@ -0,0 +1,5 @@
+import React from 'react';
+declare const _default: React.MemoExoticComponent<({ children }: {
+    children: React.ReactNode;
+}) => import("react/jsx-runtime").JSX.Element>;
+export default _default;

package/transitions/AccordionTransition.d.ts

@@ -0,0 +1,4 @@
+/// <reference types="react" />
+import type { TTransition } from '../types/components';
+declare const AccordionTransition: (props: TTransition) => JSX.Element;
+export default AccordionTransition;

package/transitions/ModalTransition.d.ts

@@ -0,0 +1,7 @@
+import React from 'react';
+interface TProps {
+    isVisible: boolean;
+    children: React.ReactNode;
+}
+declare const ModalTransition: ({ isVisible, children }: TProps) => JSX.Element;
+export default ModalTransition;

package/transitions/RenderWithOpacity.d.ts

@@ -0,0 +1,4 @@
+/// <reference types="react" />
+import type { TTransition } from '../types/components';
+declare const RenderWithOpacity: ({ isVisible, children, themeName, tokens, customTheme, ...rest }: TTransition) => JSX.Element;
+export default RenderWithOpacity;

package/transitions/RenderWithSlide.d.ts

@@ -0,0 +1,7 @@
+import React from 'react';
+interface TProps {
+    isVisible: boolean;
+    children: React.ReactNode;
+}
+declare const RenderWithSlide: ({ isVisible, children }: TProps) => JSX.Element;
+export default RenderWithSlide;

package/transitions/SidePanelTransition.d.ts

@@ -0,0 +1,7 @@
+import React from 'react';
+interface TProps {
+    isVisible: boolean;
+    children: React.ReactNode;
+}
+declare const SidePanelTransition: ({ isVisible, children }: TProps) => JSX.Element;
+export default SidePanelTransition;

package/types/components.d.ts

@@ -0,0 +1,28 @@
+import type React from 'react';
+import type { HTMLAttributes } from 'react';
+import type { RefCallBack } from 'react-hook-form';
+import type { TCustomTheme, TToken } from '../providers/Theme/interface';
+export interface TDefaultComponent<T = TToken> {
+    as?: React.ElementType<any>;
+    customTheme?: TCustomTheme;
+    tokens?: T;
+    themeName?: string | null;
+    children?: React.ReactNode;
+}
+export type TReactHookForm = {
+    onBlur?: (...event: any[]) => void;
+    onChange?: (...event: any[]) => void;
+    fieldRef?: RefCallBack;
+    min?: string | number | undefined;
+    max?: string | number | undefined;
+    maxLength?: number | undefined;
+    minLength?: number | undefined;
+    pattern?: string | undefined;
+    validation?: object;
+};
+export interface TTransition extends TDefaultComponent, HTMLAttributes<HTMLElement> {
+    isVisible: boolean;
+    children: React.ReactNode;
+}
+export type Nullable<T> = T | undefined | null;
+export type Maybe<T> = T | null;

package/.eslintrc.js

@@ -1,32 +0,0 @@
-const { getDefaultIgnorePatterns } = require('../../../linter/helpers')
-
-module.exports = {
-  extends: [
-    'plugin:@nx/react',
-    '../../../.eslintrc.js',
-    '../../../linter/bases/typescript',
-    '../../../linter/bases/regexp',
-    '../../../linter/bases/jest',
-    '../../../linter/bases/rtl',
-    '../../../linter/bases/storybook',
-    '../../../linter/bases/react',
-    '../../../linter/bases/prettier',
-    'plugin:storybook/recommended',
-  ],
-  ignorePatterns: ['!**/*', ...getDefaultIgnorePatterns()],
-  overrides: [
-    {
-      files: ['*.ts', '*.tsx', '*.js', '*.jsx'],
-      // We set parserOptions.project for the project to allow TypeScript to create the type-checker behind the scenes when we run linting
-      parserOptions: {
-        project: `${__dirname}/tsconfig.*?.json`,
-      },
-      rules: {
-        '@nx/dependency-checks': 'error',
-      },
-    },
-  ],
-  rules: {
-    'react/react-in-jsx-scope': 'off',
-  },
-}

package/.storybook/.eslintrc.js

@@ -1,29 +0,0 @@
-const { getDefaultIgnorePatterns } = require('../../../../linter/helpers')
-
-module.exports = {
-  extends: [
-    'plugin:@nx/react',
-    '../../../../.eslintrc.js',
-    '../../../../linter/bases/typescript',
-    '../../../../linter/bases/regexp',
-    '../../../../linter/bases/jest',
-    '../../../../linter/bases/rtl',
-    '../../../../linter/bases/storybook',
-    '../../../../linter/bases/react',
-    '../../../../linter/bases/prettier',
-    'plugin:storybook/recommended',
-  ],
-  ignorePatterns: ['!**/*', ...getDefaultIgnorePatterns()],
-  overrides: [
-    {
-      files: ['*.ts', '*.tsx', '*.js', '*.jsx'],
-      // We set parserOptions.project for the project to allow TypeScript to create the type-checker behind the scenes when we run linting
-      parserOptions: {
-        project: `${__dirname}/tsconfig.*?.json`,
-      },
-    },
-  ],
-  rules: {
-    'react/react-in-jsx-scope': 'off',
-  },
-}

package/.storybook/main.ts

@@ -1,33 +0,0 @@
-/* eslint-disable @typescript-eslint/ban-ts-comment */
-import type { StorybookConfig } from '@storybook/nextjs'
-
-const config: StorybookConfig = {
-  stories: ['../src/**/*.mdx', '../src/**/*.stories.@(js|jsx|ts|tsx)'],
-  addons: [
-    '@storybook/addon-a11y',
-    '@storybook/addon-links',
-    '@storybook/addon-essentials',
-    '@storybook/addon-interactions',
-    {
-      name: '@storybook/addon-styling',
-      options: {
-        // Check out https://github.com/storybookjs/addon-styling/blob/main/docs/api.md
-        // For more details on this addon's options.
-        postCss: true,
-      },
-    },
-  ],
-  framework: {
-    name: '@storybook/nextjs',
-    options: {},
-  },
-  docs: {
-    autodocs: 'tag',
-  },
-}
-
-export default config
-
-// To customize your Vite configuration you can use the viteFinal field.
-// Check https://storybook.js.org/docs/react/builders/vite#configuration
-// and https://nx.dev/packages/storybook/documents/custom-builder-configs

package/.storybook/preview.js

@@ -1,56 +0,0 @@
-/** @type { import('@storybook/react').Preview } */
-
-import '../src/tailwind.css' // replace with the name of your tailwind css file
-import React, { Suspense } from 'react'
-import { I18nProvider, OverlayProvider } from 'react-aria'
-import { useGlobals } from '@storybook/client-api'
-import BaseThemeProvider from '../src/theme'
-import { IsClientContextProvider } from '../src/providers/Client'
-
-export const parameters = {
-  actions: { argTypesRegex: '^on[A-Z].*' },
-  layout: 'centered',
-  controls: { expanded: true },
-  backgrounds: {
-    default: 'light',
-    values: [
-      {
-        name: 'light',
-        value: '#ffffff',
-      },
-      {
-        name: 'dark',
-        value: '#000000',
-      },
-    ],
-  },
-}
-
-export const decorators = [
-  (Story, context) => {
-    const [{ locale }] = useGlobals()
-
-    return (
-      <>
-        <style>
-          {`
-            #root {
-              padding: 0 !important;
-            }
-          `}
-        </style>
-        <BaseThemeProvider>
-          <I18nProvider locale={locale}>
-            <IsClientContextProvider>
-              <OverlayProvider>
-                <Suspense fallback={<div>Loading... </div>}>
-                  <Story />
-                </Suspense>
-              </OverlayProvider>
-            </IsClientContextProvider>
-          </I18nProvider>
-        </BaseThemeProvider>
-      </>
-    )
-  },
-]