@lerianstudio/sindarian-ui 1.0.0-beta.13 → 1.0.0-beta.14

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
@@ -6,7 +6,7 @@ exports.PageContent = PageContent;
6
6
  const jsx_runtime_1 = require("react/jsx-runtime");
7
7
  const utils_1 = require("../../lib/utils");
8
8
  function PageRoot({ className, ...props }) {
9
- return ((0, jsx_runtime_1.jsx)("div", { "data-slot": "page-root", className: (0, utils_1.cn)('bg-background text-foreground flex h-screen min-h-screen w-full flex-col overflow-y-auto', className), ...props }));
9
+ return ((0, jsx_runtime_1.jsx)("div", { "data-slot": "page-root", className: (0, utils_1.cn)('text-foreground flex h-screen min-h-screen w-full flex-col overflow-y-auto bg-zinc-100', className), ...props }));
10
10
  }
11
11
  function PageView({ className, ...props }) {
12
12
  return ((0, jsx_runtime_1.jsx)("div", { "data-slot": "page-view", className: (0, utils_1.cn)('flex min-h-0 flex-1', className), ...props }));
@@ -1,4 +1,4 @@
1
- @theme {
1
+ @theme inline {
2
2
  --spacing-alert-p: --spacing(4.5);
3
3
  --text-alert-title: var(--text-sm);
4
4
  --text-alert-description: 13px;
@@ -1,4 +1,4 @@
1
- @theme {
1
+ @theme inline {
2
2
  --color-breadcrumb-link-foreground: var(--color-zinc-700);
3
3
  --color-breadcrumb-link-foreground-hover: var(--color-zinc-900);
4
4
  --color-breadcrumb-muted-foreground: var(--color-shadcn-400);
@@ -1,4 +1,4 @@
1
- @theme {
1
+ @theme inline {
2
2
  /* Button */
3
3
  --text-button: var(--font-size-sm);
4
4
  --spacing-button-px: --spacing(4);
@@ -1,4 +1,4 @@
1
- @theme {
1
+ @theme inline {
2
2
  --color-dialog-title-text: var(--color-zinc-600);
3
3
  --color-dialog-description-text: var(--color-shadcn-400);
4
4
  }
@@ -1,4 +1,4 @@
1
- @theme {
1
+ @theme inline {
2
2
  --spacing-icon-button-p: var(--spacing(2))
3
3
  }
4
4
 
@@ -1,4 +1,4 @@
1
- @theme {
1
+ @theme inline {
2
2
  --spacing-input-wrapper-h: --spacing(10);
3
3
  --spacing-input-wrapper-p: --spacing(2);
4
4
  --spacing-input-px: --spacing(4);
@@ -1,4 +1,4 @@
1
- @theme {
1
+ @theme inline {
2
2
  --spacing-select-h: --spacing(10);
3
3
  --spacing-select-px: --spacing(3);
4
4
  --spacing-select-py: --spacing(2);
@@ -1 +1 @@
1
- {"version":3,"file":"sidebar-components.d.ts","sourceRoot":"","sources":["../../../../src/components/ui/sidebar/sidebar-components.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,MAAM,OAAO,CAAA;AAKzB,MAAM,MAAM,kBAAkB,GAAG,KAAK,CAAC,cAAc,CAAC,KAAK,CAAC,GAAG;IAC7D,SAAS,CAAC,EAAE,MAAM,CAAA;IAClB,SAAS,CAAC,EAAE,OAAO,CAAA;CACpB,CAAA;AAED,eAAO,MAAM,aAAa,GAAI,oCAI3B,kBAAkB,4CAWpB,CAAA;AAED,MAAM,MAAM,mBAAmB,GAAG,KAAK,CAAC,cAAc,CAAC,KAAK,CAAC,GAAG;IAC9D,SAAS,CAAC,EAAE,MAAM,CAAA;CACnB,CAAA;AAED,eAAO,MAAM,cAAc,GAAI,yBAG5B,mBAAmB,4CAWrB,CAAA;AAED,MAAM,MAAM,iBAAiB,GAAG;IAC9B,SAAS,CAAC,EAAE,MAAM,CAAA;CACnB,GAAG,KAAK,CAAC,cAAc,CAAC,KAAK,CAAC,CAAA;AAE/B,eAAO,MAAM,YAAY,GAAI,yBAAyB,iBAAiB,4CAUtE,CAAA;AAED,MAAM,MAAM,sBAAsB,GAAG,KAAK,CAAC,iBAAiB,GAAG;IAC7D,SAAS,CAAC,EAAE,OAAO,CAAA;CACpB,CAAA;AAED,eAAO,MAAM,iBAAiB,GAAI,cAAc,sBAAsB,4CAcrE,CAAA;AAED,MAAM,MAAM,kBAAkB,GAAG;IAC/B,SAAS,CAAC,EAAE,MAAM,CAAA;CACnB,GAAG,KAAK,CAAC,cAAc,CAAC,KAAK,CAAC,CAAA;AAE/B,eAAO,MAAM,aAAa,GAAI,yBAAyB,kBAAkB,4CASxE,CAAA"}
1
+ {"version":3,"file":"sidebar-components.d.ts","sourceRoot":"","sources":["../../../../src/components/ui/sidebar/sidebar-components.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,MAAM,OAAO,CAAA;AAKzB,MAAM,MAAM,kBAAkB,GAAG,KAAK,CAAC,cAAc,CAAC,KAAK,CAAC,GAAG;IAC7D,SAAS,CAAC,EAAE,MAAM,CAAA;IAClB,SAAS,CAAC,EAAE,OAAO,CAAA;CACpB,CAAA;AAED,eAAO,MAAM,aAAa,GAAI,oCAI3B,kBAAkB,4CAWpB,CAAA;AAED,MAAM,MAAM,mBAAmB,GAAG,KAAK,CAAC,cAAc,CAAC,KAAK,CAAC,GAAG;IAC9D,SAAS,CAAC,EAAE,MAAM,CAAA;CACnB,CAAA;AAED,eAAO,MAAM,cAAc,GAAI,yBAG5B,mBAAmB,4CAUrB,CAAA;AAED,MAAM,MAAM,iBAAiB,GAAG;IAC9B,SAAS,CAAC,EAAE,MAAM,CAAA;CACnB,GAAG,KAAK,CAAC,cAAc,CAAC,KAAK,CAAC,CAAA;AAE/B,eAAO,MAAM,YAAY,GAAI,yBAAyB,iBAAiB,4CAUtE,CAAA;AAED,MAAM,MAAM,sBAAsB,GAAG,KAAK,CAAC,iBAAiB,GAAG;IAC7D,SAAS,CAAC,EAAE,OAAO,CAAA;CACpB,CAAA;AAED,eAAO,MAAM,iBAAiB,GAAI,cAAc,sBAAsB,4CAcrE,CAAA;AAED,MAAM,MAAM,kBAAkB,GAAG;IAC/B,SAAS,CAAC,EAAE,MAAM,CAAA;CACnB,GAAG,KAAK,CAAC,cAAc,CAAC,KAAK,CAAC,CAAA;AAE/B,eAAO,MAAM,aAAa,GAAI,yBAAyB,kBAAkB,4CASxE,CAAA"}
@@ -7,7 +7,7 @@ const sidebar_provider_1 = require("./sidebar-provider");
7
7
  const separator_1 = require("../separator");
8
8
  const SidebarHeader = ({ className, collapsed, ...props }) => ((0, jsx_runtime_1.jsx)("div", { "data-slot": "sidebar-header", "data-collapsed": collapsed, className: (0, utils_1.cn)('dark:bg-cod-gray-950 flex h-[60px] w-full items-center bg-white px-4', collapsed && 'justify-center p-0', className), ...props }));
9
9
  exports.SidebarHeader = SidebarHeader;
10
- const SidebarContent = ({ className, ...props }) => ((0, jsx_runtime_1.jsx)("div", { "data-slot": "sidebar-content", className: (0, utils_1.cn)('group flex flex-1 flex-col gap-4 bg-white px-4 pt-4', 'group-data-[collapsed=true]/sidebar:items-center group-data-[collapsed=true]/sidebar:px-2', 'group-data-[collapsed=false]/sidebar:min-w-[244px]', className), ...props }));
10
+ const SidebarContent = ({ className, ...props }) => ((0, jsx_runtime_1.jsx)("div", { "data-slot": "sidebar-content", className: (0, utils_1.cn)('group flex flex-1 flex-col gap-4 overflow-hidden bg-white px-4 pt-4 transition-all duration-300 ease-in-out', 'group-data-[collapsed=true]/sidebar:items-center group-data-[collapsed=true]/sidebar:px-2', className), ...props }));
11
11
  exports.SidebarContent = SidebarContent;
12
12
  const SidebarGroup = ({ className, ...props }) => ((0, jsx_runtime_1.jsx)("nav", { "data-slot": "sidebar-group", className: (0, utils_1.cn)('grid gap-1', 'group-data[collapsed=true]/sidebar:justify-center', className), ...props }));
13
13
  exports.SidebarGroup = SidebarGroup;
@@ -1 +1 @@
1
- {"version":3,"file":"sidebar-provider.d.ts","sourceRoot":"","sources":["../../../../src/components/ui/sidebar/sidebar-provider.tsx"],"names":[],"mappings":"AAEA,OAAO,KAAK,MAAM,OAAO,CAAA;AAEzB,MAAM,MAAM,mBAAmB,GAAG;IAChC,WAAW,EAAE,OAAO,CAAA;IACpB,aAAa,EAAE,MAAM,IAAI,CAAA;CAC1B,CAAA;AAMD,eAAO,MAAM,UAAU,2BAMtB,CAAA;AAED,eAAO,MAAM,eAAe,GAAI,cAAc,KAAK,CAAC,iBAAiB,4CAUpE,CAAA"}
1
+ {"version":3,"file":"sidebar-provider.d.ts","sourceRoot":"","sources":["../../../../src/components/ui/sidebar/sidebar-provider.tsx"],"names":[],"mappings":"AAEA,OAAO,KAAK,MAAM,OAAO,CAAA;AAEzB,MAAM,MAAM,mBAAmB,GAAG;IAChC,WAAW,EAAE,OAAO,CAAA;IACpB,aAAa,EAAE,MAAM,IAAI,CAAA;CAC1B,CAAA;AAMD,eAAO,MAAM,UAAU,2BAMtB,CAAA;AAED,eAAO,MAAM,eAAe,GAAI,cAAc,KAAK,CAAC,iBAAiB,4CAgBpE,CAAA"}
@@ -17,8 +17,11 @@ const useSidebar = () => {
17
17
  };
18
18
  exports.useSidebar = useSidebar;
19
19
  const SidebarProvider = ({ children }) => {
20
- const [isCollapsed, setIsCollapsed] = react_1.default.useState(true);
21
- const toggleSidebar = () => setIsCollapsed(!isCollapsed);
22
- return ((0, jsx_runtime_1.jsx)(SidebarContext.Provider, { value: { isCollapsed, toggleSidebar }, children: children }));
20
+ const [collapsed, setCollapsed] = react_1.default.useState(localStorage.getItem('sidebar-collapsed') === 'true');
21
+ const toggleSidebar = () => setCollapsed((collapsed) => !collapsed);
22
+ react_1.default.useEffect(() => {
23
+ localStorage.setItem('sidebar-collapsed', JSON.stringify(collapsed));
24
+ }, [collapsed]);
25
+ return ((0, jsx_runtime_1.jsx)(SidebarContext.Provider, { value: { isCollapsed: collapsed, toggleSidebar }, children: children }));
23
26
  };
24
27
  exports.SidebarProvider = SidebarProvider;
@@ -6,10 +6,10 @@ const jsx_runtime_1 = require("react/jsx-runtime");
6
6
  const class_variance_authority_1 = require("class-variance-authority");
7
7
  const sidebar_provider_1 = require("./sidebar-provider");
8
8
  const utils_1 = require("../../../lib/utils");
9
- const sidebarVariants = (0, class_variance_authority_1.cva)('group/sidebar shadow-sidebar dark:bg-cod-gray-950 relative flex flex-col transition-all duration-100', {
9
+ const sidebarVariants = (0, class_variance_authority_1.cva)('group/sidebar shadow-sidebar dark:bg-cod-gray-950 relative flex flex-col transition-[width] duration-300 ease-in-out', {
10
10
  variants: {
11
11
  collapsed: {
12
- true: 'w-fit',
12
+ true: 'w-[72px]',
13
13
  false: 'w-[244px]'
14
14
  }
15
15
  },
@@ -1,4 +1,4 @@
1
- @theme {
1
+ @theme inline {
2
2
  --color-stepper-item-text: var(--color-shadcn-400);
3
3
  --color-stepper-item-active: var(--color-zinc-700);
4
4
  --color-stepper-item-number: var(--color-shadcn-400);
@@ -1,4 +1,4 @@
1
- @theme {
1
+ @theme inline {
2
2
  --color-tabs-trigger-text: var(--color-shadcn-400);
3
3
  --color-tabs-trigger-hover: var(--color-white);
4
4
  --color-tabs-trigger-text-hover: var(--color-shadcn-500);
package/dist/globals.css CHANGED
@@ -13,7 +13,7 @@
13
13
 
14
14
  @custom-variant dark (&:is(.dark *));
15
15
 
16
- @theme {
16
+ @theme inline {
17
17
  --font-sans: var(--font-inter), Inter, ui-sans-serif, system-ui, sans-serif;
18
18
 
19
19
  --shadow-sidebar: 5px 0px 15px -3px rgba(0, 0, 0, 0.05);
@@ -190,25 +190,25 @@
190
190
  }
191
191
 
192
192
  .dark {
193
- --background: 240 10% 3.9%;
194
- --foreground: 0 0% 98%;
195
- --card: 240 10% 3.9%;
196
- --card-foreground: 0 0% 98%;
197
- --popover: 240 10% 3.9%;
198
- --popover-foreground: 0 0% 98%;
199
- --primary: 0 0% 98%;
200
- --primary-foreground: 240 5.9% 10%;
201
- --secondary: 240 3.7% 15.9%;
202
- --secondary-foreground: 0 0% 98%;
203
- --muted: 240 3.7% 15.9%;
204
- --muted-foreground: 240 5% 64.9%;
205
- --accent: 240 3.7% 15.9%;
206
- --accent-foreground: 0 0% 98%;
207
- --destructive: 0 62.8% 30.6%;
208
- --destructive-foreground: 0 0% 98%;
209
- --border: 240 3.7% 15.9%;
210
- --input: 240 3.7% 15.9%;
211
- --ring: 240 4.9% 83.9%;
193
+ --color-background: oklch(0.209 0.042 265.755);
194
+ --color-foreground: oklch(0.98 0.002 247.839);
195
+ --color-card: oklch(0.209 0.042 265.755);
196
+ --color-card-foreground: oklch(0.98 0.002 247.839);
197
+ --color-popover: oklch(0.209 0.042 265.755);
198
+ --color-popover-foreground: oklch(0.98 0.002 247.839);
199
+ --color-primary: oklch(0.98 0.002 247.839);
200
+ --color-primary-foreground: oklch(0.279 0.041 260.031);
201
+ --color-secondary: oklch(0.279 0.041 260.031);
202
+ --color-secondary-foreground: oklch(0.98 0.002 247.839);
203
+ --color-muted: oklch(0.279 0.041 260.031);
204
+ --color-muted-foreground: oklch(0.551 0.027 264.364);
205
+ --color-accent: oklch(0.279 0.041 260.031);
206
+ --color-accent-foreground: oklch(0.98 0.002 247.839);
207
+ --color-destructive: oklch(0.505 0.213 27.518);
208
+ --color-destructive-foreground: oklch(0.98 0.002 247.839);
209
+ --color-border: oklch(0.279 0.041 260.031);
210
+ --color-input: oklch(0.279 0.041 260.031);
211
+ --color-ring: oklch(0.551 0.027 264.364);
212
212
  }
213
213
  }
214
214
 
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "@lerianstudio/sindarian-ui",
3
- "version": "1.0.0-beta.13",
3
+ "version": "1.0.0-beta.14",
4
4
  "description": "Sindarian UI - A UI library for Midaz Console",
5
5
  "license": "ISC",
6
6
  "author": {