lsoft-ui 0.0.1

package/dist/examples/TabsExample.js

@@ -0,0 +1,182 @@
+import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
+import { useState } from "react";
+import { Box, VStack, Text, Code, Divider, } from "@chakra-ui/react";
+import CustomTabs from "../components/CustomTabs";
+import { CodeViewer } from "./CodeViewer";
+export const TabsExample = () => {
+    var _a;
+    const [selectedTab, setSelectedTab] = useState(0);
+    const tabs = [
+        {
+            label: "Usuários",
+            content: (_jsxs(Box, { p: 4, children: [_jsx(Text, { fontSize: "lg", fontWeight: "bold", mb: 4, children: "Lista de Usu\u00E1rios" }), _jsx(Text, { children: "Conte\u00FAdo da aba de usu\u00E1rios..." })] })),
+            tooltip: "Gerenciar usuários do sistema",
+            quantity: 150,
+        },
+        {
+            label: "Produtos",
+            content: (_jsxs(Box, { p: 4, children: [_jsx(Text, { fontSize: "lg", fontWeight: "bold", mb: 4, children: "Lista de Produtos" }), _jsx(Text, { children: "Conte\u00FAdo da aba de produtos..." })] })),
+            tooltip: "Gerenciar produtos do catálogo",
+            quantity: 89,
+        },
+        {
+            label: "Pedidos",
+            content: (_jsxs(Box, { p: 4, children: [_jsx(Text, { fontSize: "lg", fontWeight: "bold", mb: 4, children: "Lista de Pedidos" }), _jsx(Text, { children: "Conte\u00FAdo da aba de pedidos..." })] })),
+            tooltip: "Visualizar pedidos realizados",
+            quantity: 23,
+        },
+        {
+            label: "Relatórios",
+            content: (_jsxs(Box, { p: 4, children: [_jsx(Text, { fontSize: "lg", fontWeight: "bold", mb: 4, children: "Relat\u00F3rios" }), _jsx(Text, { children: "Conte\u00FAdo da aba de relat\u00F3rios..." })] })),
+            tooltip: "Gerar relatórios do sistema",
+        },
+    ];
+    const tabsWithCustomColor = [
+        {
+            label: "Ativos",
+            content: (_jsxs(Box, { p: 4, children: [_jsx(Text, { fontSize: "lg", fontWeight: "bold", mb: 4, children: "Itens Ativos" }), _jsx(Text, { children: "Conte\u00FAdo dos itens ativos..." })] })),
+            tooltip: "Itens que estão ativos no sistema",
+            quantity: 45,
+        },
+        {
+            label: "Inativos",
+            content: (_jsxs(Box, { p: 4, children: [_jsx(Text, { fontSize: "lg", fontWeight: "bold", mb: 4, children: "Itens Inativos" }), _jsx(Text, { children: "Conte\u00FAdo dos itens inativos..." })] })),
+            tooltip: "Itens que estão inativos no sistema",
+            quantity: 12,
+        },
+    ];
+    return (_jsx(Box, { p: 6, maxW: "800px", mx: "auto", children: _jsxs(VStack, { spacing: 6, align: "stretch", children: [_jsx(Text, { fontSize: "xl", fontWeight: "bold", textAlign: "center", children: "Exemplo - CustomTabs" }), _jsxs(Box, { children: [_jsx(Text, { fontSize: "lg", fontWeight: "bold", mb: 4, children: "Tabs com Quantidade e Tooltip (Cor Padr\u00E3o)" }), _jsx(CustomTabs, { tabs: tabs, selectedIndex: selectedTab, onChange: setSelectedTab, height: "300px" })] }), _jsx(Divider, {}), _jsxs(Box, { children: [_jsx(Text, { fontSize: "lg", fontWeight: "bold", mb: 4, children: "Tabs com Cor Customizada" }), _jsx(CustomTabs, { tabs: tabsWithCustomColor, tabTextColor: "#3182ce", height: "200px" })] }), _jsx(Divider, {}), _jsxs(Box, { children: [_jsx(Text, { fontSize: "lg", fontWeight: "bold", mb: 4, children: "Tabs com Cor do Tema" }), _jsx(CustomTabs, { tabs: [
+                                {
+                                    label: "Sucesso",
+                                    content: (_jsx(Box, { p: 4, children: _jsx(Text, { children: "Conte\u00FAdo de sucesso..." }) })),
+                                    tooltip: "Operações bem-sucedidas",
+                                    quantity: 67,
+                                },
+                                {
+                                    label: "Erro",
+                                    content: (_jsx(Box, { p: 4, children: _jsx(Text, { children: "Conte\u00FAdo de erro..." }) })),
+                                    tooltip: "Operações com erro",
+                                    quantity: 3,
+                                },
+                            ], tabTextColor: "green.500", height: "200px" })] }), _jsx(Divider, {}), _jsxs(Box, { children: [_jsx(Text, { fontSize: "sm", fontWeight: "bold", mb: 2, children: "Debug - Tab Selecionada:" }), _jsx(Code, { p: 3, borderRadius: "md", fontSize: "xs", display: "block", children: JSON.stringify({ selectedTab: selectedTab, tabLabel: (_a = tabs[selectedTab]) === null || _a === void 0 ? void 0 : _a.label }, null, 2) })] }), _jsx(CodeViewer, { title: "C\u00F3digo Fonte - CustomTabs", code: `import React, { useState } from "react";
+import CustomTabs from "ls-ckfront";
+
+export const TabsExample: React.FC = () => {
+  const [selectedTab, setSelectedTab] = useState(0);
+
+  const tabs = [
+    {
+      label: "Usuários",
+      content: (
+        <Box p={4}>
+          <Text fontSize="lg" fontWeight="bold" mb={4}>
+            Lista de Usuários
+          </Text>
+          <Text>Conteúdo da aba de usuários...</Text>
+        </Box>
+      ),
+      tooltip: "Gerenciar usuários do sistema",
+      quantity: 150,
+    },
+    {
+      label: "Produtos",
+      content: (
+        <Box p={4}>
+          <Text fontSize="lg" fontWeight="bold" mb={4}>
+            Lista de Produtos
+          </Text>
+          <Text>Conteúdo da aba de produtos...</Text>
+        </Box>
+      ),
+      tooltip: "Gerenciar produtos do catálogo",
+      quantity: 89,
+    },
+    {
+      label: "Pedidos",
+      content: (
+        <Box p={4}>
+          <Text fontSize="lg" fontWeight="bold" mb={4}>
+            Lista de Pedidos
+          </Text>
+          <Text>Conteúdo da aba de pedidos...</Text>
+        </Box>
+      ),
+      tooltip: "Visualizar pedidos realizados",
+      quantity: 23,
+    },
+    {
+      label: "Relatórios",
+      content: (
+        <Box p={4}>
+          <Text fontSize="lg" fontWeight="bold" mb={4}>
+            Relatórios
+          </Text>
+          <Text>Conteúdo da aba de relatórios...</Text>
+        </Box>
+      ),
+      tooltip: "Gerar relatórios do sistema",
+    },
+  ];
+
+  return (
+    <CustomTabs
+      tabs={tabs}
+      selectedIndex={selectedTab}
+      onChange={setSelectedTab}
+      height="300px"
+    />
+  );
+};
+
+// Exemplo com cor customizada
+const TabsWithCustomColor = () => {
+  const tabs = [
+    {
+      label: "Ativos",
+      content: <Box p={4}>Conteúdo dos itens ativos...</Box>,
+      tooltip: "Itens que estão ativos no sistema",
+      quantity: 45,
+    },
+    {
+      label: "Inativos",
+      content: <Box p={4}>Conteúdo dos itens inativos...</Box>,
+      tooltip: "Itens que estão inativos no sistema",
+      quantity: 12,
+    },
+  ];
+
+  return (
+    <CustomTabs
+      tabs={tabs}
+      tabTextColor="#3182ce" // Hexadecimal
+      height="200px"
+    />
+  );
+};
+
+// Exemplo com cor do tema
+const TabsWithThemeColor = () => {
+  const tabs = [
+    {
+      label: "Sucesso",
+      content: <Box p={4}>Conteúdo de sucesso...</Box>,
+      tooltip: "Operações bem-sucedidas",
+      quantity: 67,
+    },
+    {
+      label: "Erro",
+      content: <Box p={4}>Conteúdo de erro...</Box>,
+      tooltip: "Operações com erro",
+      quantity: 3,
+    },
+  ];
+
+  return (
+    <CustomTabs
+      tabs={tabs}
+      tabTextColor="green.500" // Cor do tema
+      height="200px"
+    />
+  );
+};` })] }) }));
+};

package/dist/examples/index.d.ts

@@ -0,0 +1,6 @@
+export { ReactHookFormExample } from "./ReactHookFormExample";
+export { FormikExample } from "./FormikExample";
+export { SimpleFormExample } from "./SimpleFormExample";
+export { NumberInputExample } from "./NumberInputExample";
+export { TabsExample } from "./TabsExample";
+export { CodeViewer } from "./CodeViewer";

package/dist/examples/index.js

@@ -0,0 +1,6 @@
+export { ReactHookFormExample } from "./ReactHookFormExample";
+export { FormikExample } from "./FormikExample";
+export { SimpleFormExample } from "./SimpleFormExample";
+export { NumberInputExample } from "./NumberInputExample";
+export { TabsExample } from "./TabsExample";
+export { CodeViewer } from "./CodeViewer";

package/dist/index.d.ts

@@ -0,0 +1,32 @@
+export * from "./providers/LsCKFrontProvider";
+export * from "./theme";
+export * from "./components/CustomButton";
+export * from "./components/CustomCard";
+export * from "./components/CustomInput";
+export * from "./components/CustomAutoComplete";
+export * from "./components/CustomTabs";
+export * from "./components/CustomTextarea";
+export * from "./components/CustomTable";
+export * from "./components/CustomCheckBox";
+export * from "./components/CustomLoadingCenterPage";
+export * from "./components/CustomSelect";
+export * from "./components/CustomRadioGroup";
+export * from "./components/CustomIconButton";
+export * from "./components/CustomPopover";
+export * from "./components/CustomInputNumber";
+export * from "./components/Accordion/CustomAccordionItem";
+export * from "./components/Accordion/CustomAccordionGroup";
+export * from "./components/CustomToast";
+export * from "./components/Pagination/CustomPagination";
+export * from "./components/CustomList";
+export * from "./components/CustomSkeleton";
+export * from "./components/CustomModal";
+export * from "./components/CustomCheckboxGroup";
+export * from "./components/CustomDrawer";
+export * from "./components/DatePicker/CustomDatePicker";
+export * from "./components/CustomMultSelect";
+export * from "./components/CustomSwitch";
+export * from "./examples";
+export * from "./components/CustomDrawer";
+export * from "./components/CustomMultipleInputs";
+export * from "./components/CustomModalNfe";

package/dist/index.js

@@ -0,0 +1,32 @@
+export * from "./providers/LsCKFrontProvider";
+export * from "./theme";
+export * from "./components/CustomButton";
+export * from "./components/CustomCard";
+export * from "./components/CustomInput";
+export * from "./components/CustomAutoComplete";
+export * from "./components/CustomTabs";
+export * from "./components/CustomTextarea";
+export * from "./components/CustomTable";
+export * from "./components/CustomCheckBox";
+export * from "./components/CustomLoadingCenterPage";
+export * from "./components/CustomSelect";
+export * from "./components/CustomRadioGroup";
+export * from "./components/CustomIconButton";
+export * from "./components/CustomPopover";
+export * from "./components/CustomInputNumber";
+export * from "./components/Accordion/CustomAccordionItem";
+export * from "./components/Accordion/CustomAccordionGroup";
+export * from "./components/CustomToast";
+export * from "./components/Pagination/CustomPagination";
+export * from "./components/CustomList";
+export * from "./components/CustomSkeleton";
+export * from "./components/CustomModal";
+export * from "./components/CustomCheckboxGroup";
+export * from "./components/CustomDrawer";
+export * from "./components/DatePicker/CustomDatePicker";
+export * from "./components/CustomMultSelect";
+export * from "./components/CustomSwitch";
+export * from "./examples";
+export * from "./components/CustomDrawer";
+export * from "./components/CustomMultipleInputs";
+export * from "./components/CustomModalNfe";

package/dist/providers/LsCKFrontProvider.d.ts

@@ -0,0 +1,6 @@
+interface LSFrontProviderProps {
+    children: React.ReactNode;
+    themeName: "bime" | "waipe";
+}
+export declare const LsCKFrontProvider: ({ children, themeName }: LSFrontProviderProps) => import("react/jsx-runtime").JSX.Element;
+export {};

package/dist/providers/LsCKFrontProvider.js

@@ -0,0 +1,7 @@
+import { jsx as _jsx } from "react/jsx-runtime";
+import { ChakraProvider } from "@chakra-ui/react";
+import bimeTheme from "../theme/bime";
+import waipeTheme from "../theme/waipe";
+export const LsCKFrontProvider = ({ children, themeName }) => {
+    return _jsx(ChakraProvider, { theme: themeName === "waipe" ? waipeTheme : bimeTheme, children: children });
+};

package/dist/stories/Londrisoft/Components/Accordion/CustomAccordionGroup.stories.d.ts

@@ -0,0 +1,13 @@
+import type { Meta, StoryObj } from "@storybook/react";
+import { CustomAccordionGroup } from "../../../../components/Accordion/CustomAccordionGroup";
+declare const meta: Meta<typeof CustomAccordionGroup>;
+export default meta;
+type Story = StoryObj<typeof CustomAccordionGroup>;
+/** 🎯 Agrupador padrão */
+export declare const Default: Story;
+/** 🔒 Somente um item aberto de cada vez */
+export declare const SingleOpen: Story;
+/** 🔓 Múltiplos itens podem ficar abertos */
+export declare const MultipleOpen: Story;
+/** 🎛 Controlado via prop `index` */
+export declare const Controlled: Story;