react-restyle-components 0.2.40 → 0.2.41

package/lib/src/core-components/atoms/input/input-pin.stories.js

@@ -1,20 +0,0 @@
-import { InputPin } from './input-pin.component';
-const meta = {
-    title: 'Design System/Atoms/InputPin',
-    component: InputPin,
-    tags: ['autodocs'],
-    parameters: {
-        componentSubtitle: `import { InputPin } from 'react-restyle-components'`,
-    },
-};
-export default meta;
-export const Basic = {
-    args: {
-        title: 'Enter your Aadhaar Number',
-        hasError: true,
-        defaultPin: [],
-        onPinChanged: (item) => {
-            console.log({ item });
-        },
-    },
-};

package/lib/src/core-components/atoms/input/input.stories.d.ts

@@ -1,6 +0,0 @@
-import type { Meta, StoryObj } from '@storybook/react';
-import { Input } from './input.component';
-declare const meta: Meta<typeof Input>;
-export default meta;
-type Story = StoryObj<typeof Input>;
-export declare const Basic: Story;

package/lib/src/core-components/atoms/input/input.stories.js

@@ -1,21 +0,0 @@
-import { Input } from './input.component';
-const meta = {
-    title: 'Design System/Atoms/Input',
-    component: Input,
-    tags: ['autodocs'],
-};
-export default meta;
-export const Basic = {
-    args: {
-        className: 'mt-4',
-        title: 'Enter your Pan Number',
-        hasError: true,
-        defaultValue: '',
-        onChange: (item) => {
-            console.log({ item });
-        },
-        onBlur: (item) => {
-            console.log({ item });
-        },
-    },
-};

package/lib/src/core-components/atoms/input/input.styles.css

@@ -1,35 +0,0 @@
-.-z-1 {
-  z-index: -1;
-}
-
-.origin-0 {
-  transform-origin: 0%;
-}
-
-input:focus ~ label,
-input:not(:placeholder-shown) ~ label,
-textarea:focus ~ label,
-textarea:not(:placeholder-shown) ~ label,
-select:focus ~ label,
-select:not([value=""]):valid ~ label {
-  /* @apply transform; scale-75; -translate-y-6; */
-  --tw-translate-x: 0;
-  --tw-translate-y: 0;
-  --tw-rotate: 0;
-  --tw-skew-x: 0;
-  --tw-skew-y: 0;
-  transform: translateX(var(--tw-translate-x)) translateY(var(--tw-translate-y))
-    rotate(var(--tw-rotate)) skewX(var(--tw-skew-x)) skewY(var(--tw-skew-y))
-    scaleX(var(--tw-scale-x)) scaleY(var(--tw-scale-y));
-  --tw-scale-x: 0.75;
-  --tw-scale-y: 0.75;
-  --tw-translate-y: -1.5rem;
-}
-
-input:focus ~ label,
-select:focus ~ label {
-  /* @apply text-black; left-0; */
-  --tw-text-opacity: 1;
-  color: "#696969";
-  left: 0px;
-}

package/lib/src/core-components/atoms/input-dropdown/input-dropdown.stories.d.ts

@@ -1,6 +0,0 @@
-import type { Meta, StoryObj } from '@storybook/react';
-import { InputDropdown } from './input-dropdown.component';
-declare const meta: Meta<typeof InputDropdown>;
-export default meta;
-type Story = StoryObj<typeof InputDropdown>;
-export declare const Basic: Story;

package/lib/src/core-components/atoms/input-dropdown/input-dropdown.stories.js

@@ -1,17 +0,0 @@
-import { InputDropdown } from './input-dropdown.component';
-const meta = {
-    title: 'Design System/Atoms/InputDropdown',
-    component: InputDropdown,
-    tags: ['autodocs'],
-    parameters: {
-        componentSubtitle: `import { InputDropdown } from 'react-restyle-components'`,
-    },
-};
-export default meta;
-export const Basic = {
-    args: {
-        title: 'Source of funds',
-        items: ['Bank account', 'UPI', 'Credit Card'],
-        hasError: true,
-    },
-};

package/lib/src/core-components/atoms/list/list.component.spec.d.ts

@@ -1 +0,0 @@
-import '@testing-library/jest-dom';

package/lib/src/core-components/atoms/list/list.component.spec.js

@@ -1,9 +0,0 @@
-import React from 'react';
-import { render, screen } from '@testing-library/react';
-import '@testing-library/jest-dom';
-import { List } from './list.component';
-test('Render List', () => {
-    render(React.createElement(List, null,
-        React.createElement("span", null, "Hi")));
-    expect(screen.getByText('Hi')).toBeInTheDocument();
-});

package/lib/src/core-components/atoms/list/list.stories.d.ts

@@ -1,6 +0,0 @@
-import type { Meta, StoryObj } from '@storybook/react';
-import { List } from './list.component';
-declare const meta: Meta<typeof List>;
-export default meta;
-type Story = StoryObj<typeof List>;
-export declare const Basic: Story;

package/lib/src/core-components/atoms/list/list.stories.js

@@ -1,20 +0,0 @@
-import React from 'react';
-import { List } from './list.component';
-const meta = {
-    title: 'Design System/Atoms/List',
-    component: List,
-    tags: ['autodocs'],
-    parameters: {
-        componentSubtitle: `import { List } from 'react-restyle-components'`,
-    },
-};
-export default meta;
-export const Basic = {
-    args: {
-        direction: 'col',
-        children: (React.createElement(React.Fragment, null,
-            React.createElement("span", null, "Item 1"),
-            React.createElement("span", null, "Item 2"),
-            React.createElement("span", null, "Item 3"))),
-    },
-};

package/lib/src/core-components/atoms/loader/loader.stories.d.ts

@@ -1,6 +0,0 @@
-import type { Meta, StoryObj } from '@storybook/react';
-import { Loader } from './loader.component';
-declare const meta: Meta<typeof Loader>;
-export default meta;
-type Story = StoryObj<typeof Loader>;
-export declare const Basic: Story;

package/lib/src/core-components/atoms/loader/loader.stories.js

@@ -1,13 +0,0 @@
-import { Loader } from './loader.component';
-const meta = {
-    title: 'Design System/Atoms/Loader',
-    component: Loader,
-    tags: ['autodocs'],
-    parameters: {
-        componentSubtitle: `import { Loader } from 'react-restyle-components'`,
-    },
-};
-export default meta;
-export const Basic = {
-    args: {},
-};

package/lib/src/core-components/atoms/radio/radio.stories.d.ts

@@ -1,6 +0,0 @@
-import type { Meta, StoryObj } from '@storybook/react';
-import { Radio } from './radio.component';
-declare const meta: Meta<typeof Radio>;
-export default meta;
-type Story = StoryObj<typeof Radio>;
-export declare const Basic: Story;

package/lib/src/core-components/atoms/radio/radio.stories.js

@@ -1,22 +0,0 @@
-import { Radio } from './radio.component';
-const meta = {
-    title: 'Design System/Atoms/Radio',
-    component: Radio,
-    tags: ['autodocs'],
-    parameters: {
-        componentSubtitle: `import { Radio } from 'react-restyle-components'`,
-    },
-};
-export default meta;
-export const Basic = {
-    args: {
-        title: '',
-        data: [
-            { title: 'Salary', checked: false },
-            { title: 'Business', checked: false },
-        ],
-        onChange: (item) => {
-            console.log({ item });
-        },
-    },
-};

package/lib/src/core-components/atoms/stepper/stepper.stories.d.ts

@@ -1,6 +0,0 @@
-import type { Meta, StoryObj } from '@storybook/react';
-import { Stepper } from './stepper.component';
-declare const meta: Meta<typeof Stepper>;
-export default meta;
-type Story = StoryObj<typeof Stepper>;
-export declare const Basic: Story;

package/lib/src/core-components/atoms/stepper/stepper.stories.js

@@ -1,18 +0,0 @@
-import { Stepper } from './stepper.component';
-const meta = {
-    title: 'Design System/Atoms/Stepper',
-    component: Stepper,
-    tags: ['autodocs'],
-    parameters: {
-        componentSubtitle: `import { Stepper } from 'react-restyle-components'`,
-    },
-};
-export default meta;
-export const Basic = {
-    args: {
-        steps: ['1', '2', '3', '4'],
-        currentStep: 2,
-        onStepClick: (currentStep, step) => { },
-        className: 'mt-4',
-    },
-};

package/lib/src/core-components/atoms/tabs/_tabs.component.d.ts

@@ -1,16 +0,0 @@
-import React from 'react';
-interface TabProps {
-    title: string;
-    children: React.JSX.Element;
-}
-export declare const Tab: ({ title, children }: TabProps) => React.JSX.Element;
-export interface TabsProps {
-    options: Array<{
-        title: string;
-        content?: React.JSX.Element;
-        inActive?: boolean;
-    }>;
-    children: React.JSX.Element[];
-}
-export declare const Tabs: ({ options, children }: TabsProps) => React.JSX.Element;
-export {};

package/lib/src/core-components/atoms/tabs/_tabs.component.js

@@ -1,19 +0,0 @@
-import React, { useState } from 'react';
-import { cn } from '../../../core-utils';
-export const Tab = ({ title, children }) => {
-    return (React.createElement("div", { className: cn('flex'), key: title }, children));
-};
-export const Tabs = ({ options, children }) => {
-    const [activeTab, setActiveTab] = useState(0);
-    const [selected, setSelected] = useState(options[0].title);
-    const tabs = React.Children.toArray(children).filter((child) => React.isValidElement(child) && child.type === Tab);
-    return (React.createElement(React.Fragment, null,
-        React.createElement("div", { className: cn('flex flex-col w-full') },
-            React.createElement("div", { className: cn('flex border-b') }, options?.map((tab, index) => (React.createElement("button", { type: "button", key: index, className: cn('py-2', 'px-4', 'mr-1', 'border-none', 'rounded-t-md', 'shadow-inner', 'cursor-pointer', activeTab === index && 'bg-blue-500', activeTab === index && 'border-none', activeTab === index && 'text-white'), onClick: () => {
-                    setSelected(tab?.title);
-                    !tab.inActive && setActiveTab(index);
-                }, disabled: tab.inActive }, tab.title)))),
-            React.createElement("div", { className: cn('p-2', 'border', 'border-solid', 'border-slate-600', 'rounded-b-md') }, options[activeTab]?.content
-                ? options[activeTab]?.content
-                : tabs[options?.findIndex((item) => item.title === selected)]))));
-};

package/lib/src/core-components/atoms/tabs/tabs.module.css

@@ -1,238 +0,0 @@
-.flex {
-  display: flex;
-}
-
-.flex-col {
-  flex-direction: column;
-}
-.w-full {
-  width: 100%;
-}
-.border {
-  border-width: 1px;
-}
-
-.border-b {
-  border-bottom-width: 1px;
-}
-
-.border-t {
-  border-top-width: 1px;
-}
-
-.border-solid {
-  border-style: solid;
-}
-
-.border-none {
-  border-style: none;
-}
-.py-2 {
-  padding-top: 0.5rem;
-  padding-bottom: 0.5rem;
-}
-
-.pb-2 {
-  padding-bottom: 0.5rem;
-}
-
-.pt-1 {
-  padding-top: 0.25rem;
-}
-
-.pt-2 {
-  padding-top: 0.5rem;
-}
-
-.pt-3 {
-  padding-top: 0.75rem;
-}
-
-.text-center {
-  text-align: center;
-}
-.rounded {
-  border-radius: 0.25rem;
-}
-
-.rounded-100px {
-  border-radius: 100px;
-}
-
-.rounded-full {
-  border-radius: 9999px;
-}
-
-.rounded-lg {
-  border-radius: 0.5rem;
-}
-
-.rounded-md {
-  border-radius: 0.375rem;
-}
-
-.rounded-none {
-  border-radius: 0px;
-}
-
-.rounded-sm {
-  border-radius: 0.125rem;
-}
-
-.rounded-b {
-  border-bottom-right-radius: 0.25rem;
-  border-bottom-left-radius: 0.25rem;
-}
-
-.rounded-b-md {
-  border-bottom-right-radius: 0.375rem;
-  border-bottom-left-radius: 0.375rem;
-}
-
-.rounded-t {
-  border-top-left-radius: 0.25rem;
-  border-top-right-radius: 0.25rem;
-}
-
-.rounded-t-md {
-  border-top-left-radius: 0.375rem;
-  border-top-right-radius: 0.375rem;
-}
-
-.border {
-  border-width: 1px;
-}
-
-.border-b {
-  border-bottom-width: 1px;
-}
-
-.border-t {
-  border-top-width: 1px;
-}
-
-.border-solid {
-  border-style: solid;
-}
-
-.border-none {
-  border-style: none;
-}
-.bg-blue-500 {
-  --tw-bg-opacity: 1;
-  background-color: rgb(59 130 246 / var(--tw-bg-opacity));
-}
-.cursor-pointer {
-  cursor: pointer;
-}
-.text-white {
-  --tw-text-opacity: 1;
-  color: rgb(255 255 255 / var(--tw-text-opacity));
-}
-.border-solid {
-  border-style: solid;
-}
-.border-slate-600 {
-  --tw-border-opacity: 1;
-  border-color: rgb(71 85 105 / var(--tw-border-opacity));
-}
-.rounded-b-md {
-  border-bottom-right-radius: 0.375rem;
-  border-bottom-left-radius: 0.375rem;
-}
-.p-1 {
-  padding: 0.25rem;
-}
-
-.p-2 {
-  padding: 0.5rem;
-}
-
-.p-4 {
-  padding: 1rem;
-}
-
-.px-0 {
-  padding-left: 0px;
-  padding-right: 0px;
-}
-
-.px-2 {
-  padding-left: 0.5rem;
-  padding-right: 0.5rem;
-}
-
-.px-3 {
-  padding-left: 0.75rem;
-  padding-right: 0.75rem;
-}
-
-.px-4 {
-  padding-left: 1rem;
-  padding-right: 1rem;
-}
-
-.py-1 {
-  padding-top: 0.25rem;
-  padding-bottom: 0.25rem;
-}
-
-.py-2 {
-  padding-top: 0.5rem;
-  padding-bottom: 0.5rem;
-}
-
-.pb-2 {
-  padding-bottom: 0.5rem;
-}
-
-.pt-1 {
-  padding-top: 0.25rem;
-}
-
-.pt-2 {
-  padding-top: 0.5rem;
-}
-
-.pt-3 {
-  padding-top: 0.75rem;
-}
-.ml-1 {
-  margin-left: 0.25rem;
-}
-
-.ml-2 {
-  margin-left: 0.5rem;
-}
-
-.ml-4 {
-  margin-left: 1rem;
-}
-
-.ml-6 {
-  margin-left: 1.5rem;
-}
-
-.mr-1 {
-  margin-right: 0.25rem;
-}
-
-.mr-2 {
-  margin-right: 0.5rem;
-}
-
-.mr-3 {
-  margin-right: 0.75rem;
-}
-
-.mt-0 {
-  margin-top: 0px;
-}
-
-.mt-1 {
-  margin-top: 0.25rem;
-}
-
-.mt-4 {
-  margin-top: 1rem;
-}

package/lib/src/core-components/atoms/tabs/tabs.stories.d.ts

@@ -1,6 +0,0 @@
-import type { Meta, StoryObj } from '@storybook/react';
-import { Tabs } from './_tabs.component';
-declare const meta: Meta<typeof Tabs>;
-export default meta;
-type Story = StoryObj<typeof Tabs>;
-export declare const Basic: Story;

package/lib/src/core-components/atoms/tabs/tabs.stories.js

@@ -1,29 +0,0 @@
-import React from 'react';
-import { Tabs, Tab } from './_tabs.component';
-// More on how to set up stories at: https://storybook.js.org/docs/react/writing-stories/introduction
-const meta = {
-    title: 'Design System/Atoms/Tabs',
-    component: Tabs,
-    tags: ['autodocs'],
-    decorators: [
-        (Story) => (React.createElement(React.Fragment, null,
-            React.createElement(Story, null))),
-    ],
-};
-export default meta;
-export const Basic = {
-    args: {
-        options: [
-            { title: 'Work History' },
-            { title: 'Book Order' },
-            { title: 'Make Frame', content: React.createElement("div", null, "Make Frame") },
-        ],
-    },
-    render: function Render(args) {
-        return (React.createElement(Tabs, { ...args },
-            React.createElement(Tab, { title: "Work History" },
-                React.createElement("span", null, "Work History")),
-            React.createElement(Tab, { title: "Book Order" },
-                React.createElement("span", null, "Book Order"))));
-    },
-};

package/lib/src/core-components/atoms/tooltip/Tooltip.stories.d.ts

@@ -1,30 +0,0 @@
-import React from 'react';
-import type { StoryObj } from '@storybook/react';
-declare const meta: {
-    title: string;
-    component: ({ align, side, children, content, avoidCollisions, alignOffset, sideOffset, disabled, delay, className, }: React.PropsWithChildren<import("./Tooltip.types").TooltipProps>) => React.JSX.Element;
-    tags: string[];
-    parameters: {
-        docs: {
-            page: () => React.JSX.Element;
-        };
-    };
-    decorators: ((Story: import("@storybook/csf").PartialStoryFn<import("@storybook/react/dist/types-a5624094").R, {
-        className?: string | undefined;
-        delay?: number | undefined;
-        side?: "top" | "right" | "bottom" | "left" | undefined;
-        sideOffset?: number | undefined;
-        content?: React.ReactNode;
-        align?: "center" | "start" | "end" | undefined;
-        alignOffset?: number | undefined;
-        avoidCollisions?: boolean | undefined;
-        disabled?: boolean | undefined;
-        children?: React.ReactNode;
-    }>) => React.JSX.Element)[];
-};
-export default meta;
-type Story = StoryObj<typeof meta>;
-export declare const Basic: Story;
-export declare const Positions: Story;
-export declare const JSXContent: Story;
-export declare const JSXContentDifferentAlignments: Story;

package/lib/src/core-components/atoms/tooltip/Tooltip.stories.js

@@ -1,83 +0,0 @@
-import React from 'react';
-import { Button } from '../button/button.component';
-import { Tooltip, TooltipProvider } from './tooltip.component';
-import { Title, Subtitle, Primary, Controls, Stories } from '@storybook/blocks';
-// import {AxeIcon} from '../AxeIcon/AxeIcon';
-const meta = {
-    title: 'Design System/Atoms/Tooltip',
-    component: Tooltip,
-    tags: ['autodocs'],
-    parameters: {
-        docs: {
-            page: () => (React.createElement(React.Fragment, null,
-                React.createElement(Title, null),
-                React.createElement(Subtitle, null),
-                React.createElement(Primary, null),
-                React.createElement(Controls, null),
-                React.createElement(Stories, null))),
-        },
-    },
-    decorators: [
-        (Story) => (React.createElement(TooltipProvider, null,
-            React.createElement(Story, null))),
-    ],
-};
-export default meta;
-export const Basic = {
-    args: {
-        children: React.createElement("span", { className: "m-10" }, '🪔'),
-        content: 'Happy Diwali ✨',
-    },
-};
-export const Positions = {
-    parameters: {
-        controls: { hideNoControlsWarning: true, exclude: ['content', 'position'] },
-        docs: {
-            description: {
-                story: 'Example shows the same `Tooltip` used for all 4 position.',
-            },
-        },
-    },
-    render: (args) => (React.createElement("div", { style: { padding: '100px', display: 'flex', gap: '12px' } },
-        React.createElement(Tooltip, { ...args, content: "top", side: "top" },
-            React.createElement("span", null, "\uD83D\uDC46")),
-        React.createElement(Tooltip, { ...args, content: "bottom", side: "bottom" },
-            React.createElement("span", null, "\uD83D\uDC47")),
-        React.createElement(Tooltip, { ...args, content: "left", side: "left" },
-            React.createElement("span", null, "\uD83D\uDC48")),
-        React.createElement(Tooltip, { ...args, content: "right", side: "right" },
-            React.createElement("span", null, "\uD83D\uDC49")))),
-};
-export const JSXContent = {
-    parameters: {
-        controls: { hideNoControlsWarning: true, include: [] },
-        docs: {
-            description: {
-                story: 'JSX tooltip for a button.',
-            },
-        },
-    },
-    render: () => (React.createElement("div", { style: { padding: '100px', display: 'flex', gap: '12px' } },
-        React.createElement(Tooltip, { side: "top", content: React.createElement(React.Fragment, null,
-                React.createElement(Button, { variant: "solid" }, "\u2728\u2728\u2728"),
-                ' ',
-                React.createElement(Button, { variant: "solid" }, "\u2728\u2728\u2728")) },
-            React.createElement("span", null, "Fancy Tooltip")))),
-};
-export const JSXContentDifferentAlignments = {
-    parameters: {
-        controls: { hideNoControlsWarning: true, include: [] },
-        docs: {
-            description: {
-                story: 'JSX tooltip for a button with all 3 alignments options and side set to top.',
-            },
-        },
-    },
-    render: () => (React.createElement("div", { style: { padding: '100px', display: 'flex', gap: '12px' } },
-        React.createElement(Tooltip, { side: "top", align: "start", content: React.createElement("span", null, "Tooltip") },
-            React.createElement(Button, { variant: "solid" }, "Align Start")),
-        React.createElement(Tooltip, { side: "top", align: "center", content: React.createElement("span", null, "Tooltip") },
-            React.createElement(Button, { variant: "solid" }, "Align Center")),
-        React.createElement(Tooltip, { side: "top", align: "end", content: React.createElement("span", null, "Tooltip") },
-            React.createElement(Button, { variant: "solid" }, "Align End")))),
-};

package/lib/src/core-components/molecules/auto-complete-filter-multiple-select-multiple-fields-display/auto-complete-filter-multiple-select-multiple-fields-display.stories.d.ts

@@ -1,6 +0,0 @@
-import type { Meta, StoryObj } from '@storybook/react';
-import { AutoCompleteFilterMultipleSelectMultipleFieldsDisplay } from './auto-complete-filter-multiple-select-multiple-fields-display.component';
-declare const meta: Meta<typeof AutoCompleteFilterMultipleSelectMultipleFieldsDisplay>;
-export default meta;
-type Story = StoryObj<typeof AutoCompleteFilterMultipleSelectMultipleFieldsDisplay>;
-export declare const Basic: Story;