@giddaa-housing/ui 3.0.1 → 3.1.0

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.
Files changed (45) hide show
  1. package/css/generated/shared.css +1 -1
  2. package/css/giddaa.css +162 -0
  3. package/css/preset.css +8 -1
  4. package/dist/activity-timeline.js +3 -3
  5. package/dist/auth-layout.js +18 -18
  6. package/dist/bar-chart.d.ts +1 -1
  7. package/dist/bullet-chart.d.ts +1 -1
  8. package/dist/button-group.d.ts +1 -1
  9. package/dist/carousel.d.ts +1 -1
  10. package/dist/chart.d.ts +1 -1
  11. package/dist/combobox.d.ts +1 -1
  12. package/dist/dropdown-menu.d.ts +1 -1
  13. package/dist/footer.d.ts +4 -2
  14. package/dist/footer.js +38 -34
  15. package/dist/funnel-chart.d.ts +1 -1
  16. package/dist/heatmap-chart.d.ts +1 -1
  17. package/dist/input-group.js +4 -5
  18. package/dist/input-size-context.js +4 -2
  19. package/dist/input.js +1 -1
  20. package/dist/line-chart.d.ts +1 -1
  21. package/dist/mask-input.d.ts +61 -0
  22. package/dist/mask-input.js +0 -0
  23. package/dist/mobile-sidebar.d.ts +57 -0
  24. package/dist/mobile-sidebar.js +196 -0
  25. package/dist/number-input.d.ts +1 -1
  26. package/dist/phone-input.d.ts +1 -1
  27. package/dist/pie-chart.d.ts +1 -1
  28. package/dist/popover.d.ts +1 -1
  29. package/dist/radar-chart.d.ts +1 -1
  30. package/dist/rich-text-editor.d.ts +1 -1
  31. package/dist/scatter-chart.d.ts +1 -1
  32. package/dist/select.d.ts +1 -1
  33. package/dist/{size-context-D4mYvcg8.d.ts → size-context-BX6kAdVj.d.ts} +2 -1
  34. package/dist/size-context.d.ts +2 -2
  35. package/dist/size-context.js +5 -2
  36. package/dist/sparkline.d.ts +1 -1
  37. package/dist/styles.css +505 -111
  38. package/dist/table.js +2 -2
  39. package/dist/tabs.d.ts +1 -1
  40. package/dist/tag.d.ts +1 -1
  41. package/dist/top-navbar.d.ts +100 -0
  42. package/dist/top-navbar.js +295 -0
  43. package/dist/tree-map.d.ts +1 -1
  44. package/dist/waterfall-chart.d.ts +1 -1
  45. package/package.json +13 -1
package/dist/footer.js CHANGED
@@ -1,6 +1,8 @@
1
1
  "use client";
2
2
  import { t as cn } from "./cn-BI_4DMBf.js";
3
- import { InputGroup, InputGroupButton, InputGroupInput } from "./input-group.js";
3
+ import { Button } from "./button.js";
4
+ import { Input } from "./input.js";
5
+ import { ChevronRight } from "lucide-react";
4
6
  import { Fragment, jsx, jsxs } from "react/jsx-runtime";
5
7
  import { mergeProps } from "@base-ui/react/merge-props";
6
8
  import { useRender } from "@base-ui/react/use-render";
@@ -12,7 +14,7 @@ function FooterRoot({ className, containerClassName, children, ...props }) {
12
14
  ...props,
13
15
  children: /* @__PURE__ */ jsx("div", {
14
16
  "data-slot": "footer-container",
15
- className: cn("mx-auto flex w-full max-w-7xl flex-col", containerClassName),
17
+ className: cn("flex w-full flex-col", containerClassName),
16
18
  children
17
19
  })
18
20
  });
@@ -20,70 +22,70 @@ function FooterRoot({ className, containerClassName, children, ...props }) {
20
22
  function FooterCta({ className, ...props }) {
21
23
  return /* @__PURE__ */ jsx("section", {
22
24
  "data-slot": "footer-cta",
23
- className: cn("grid gap-gdt-xl bg-surface-brand px-gdt-xl py-gdt-4xl text-fg-on-brand md:grid-cols-[minmax(0,1fr)_auto] md:items-center md:px-gdt-5xl", className),
25
+ className: cn("grid gap-5 bg-surface-brand px-5 py-gdt-3xl text-fg-on-brand md:px-gdt-6xl md:py-gdt-5xl xl:grid-cols-[minmax(0,1fr)_auto] xl:items-center", className),
24
26
  ...props
25
27
  });
26
28
  }
27
29
  function FooterCtaContent({ className, ...props }) {
28
30
  return /* @__PURE__ */ jsx("div", {
29
31
  "data-slot": "footer-cta-content",
30
- className: cn("flex max-w-145 flex-col gap-2 md:gap-3", className),
32
+ className: cn("flex max-w-140 flex-col gap-5 xl:gap-3", className),
31
33
  ...props
32
34
  });
33
35
  }
34
36
  function FooterCtaTitle({ className, ...props }) {
35
37
  return /* @__PURE__ */ jsx("h2", {
36
38
  "data-slot": "footer-cta-title",
37
- className: cn("text-gdt-h5 text-current md:text-gdt-h4", className),
39
+ className: cn("text-gdt-h3 leading-10 text-current md:leading-[3.25rem]", className),
38
40
  ...props
39
41
  });
40
42
  }
41
43
  function FooterCtaDescription({ className, ...props }) {
42
44
  return /* @__PURE__ */ jsx("p", {
43
45
  "data-slot": "footer-cta-description",
44
- className: cn("text-gdt-sm text-current", className),
46
+ className: cn("text-gdt-sm text-current opacity-85 md:text-gdt-md", className),
45
47
  ...props
46
48
  });
47
49
  }
48
50
  function FooterCtaActions({ className, ...props }) {
49
51
  return /* @__PURE__ */ jsx("div", {
50
52
  "data-slot": "footer-cta-actions",
51
- className: cn("flex flex-wrap items-center gap-3 md:gap-4", className),
53
+ className: cn("flex w-full flex-col items-stretch gap-gdt-lg [&>*]:w-full xl:w-auto xl:flex-row xl:items-center xl:[&>*]:w-auto", className),
52
54
  ...props
53
55
  });
54
56
  }
55
57
  function FooterBody({ className, ...props }) {
56
58
  return /* @__PURE__ */ jsx("div", {
57
59
  "data-slot": "footer-body",
58
- className: cn("flex flex-col gap-gdt-6xl px-gdt-xl py-gdt-5xl md:px-gdt-5xl", className),
60
+ className: cn("flex flex-col gap-gdt-6xl px-5 py-gdt-3xl md:gap-32 md:px-gdt-6xl md:py-gdt-5xl", className),
59
61
  ...props
60
62
  });
61
63
  }
62
64
  function FooterHeader({ className, ...props }) {
63
65
  return /* @__PURE__ */ jsx("div", {
64
66
  "data-slot": "footer-header",
65
- className: cn("flex max-w-xl flex-col gap-gdt-sm", className),
67
+ className: cn("flex w-full flex-col gap-1.5 border-b border-line-subtle pb-5 md:pb-7", className),
66
68
  ...props
67
69
  });
68
70
  }
69
71
  function FooterTitle({ className, ...props }) {
70
72
  return /* @__PURE__ */ jsx("h2", {
71
73
  "data-slot": "footer-title",
72
- className: cn("text-gdt-h5 text-fg-primary", className),
74
+ className: cn("text-gdt-h4 text-fg-primary", className),
73
75
  ...props
74
76
  });
75
77
  }
76
78
  function FooterDescription({ className, ...props }) {
77
79
  return /* @__PURE__ */ jsx("p", {
78
80
  "data-slot": "footer-description",
79
- className: cn("text-gdt-xs text-fg-secondary", className),
81
+ className: cn("text-gdt-sm text-fg-secondary", className),
80
82
  ...props
81
83
  });
82
84
  }
83
85
  function FooterNav({ className, ...props }) {
84
86
  return /* @__PURE__ */ jsx("nav", {
85
87
  "data-slot": "footer-nav",
86
- className: cn("grid gap-x-gdt-4xl gap-y-gdt-xl sm:grid-cols-2 md:grid-cols-3 lg:grid-cols-6", className),
88
+ className: cn("grid grid-cols-2 gap-gdt-3xl md:grid-cols-4 xl:grid-cols-7", className),
87
89
  ...props
88
90
  });
89
91
  }
@@ -97,21 +99,21 @@ function FooterSection({ className, ...props }) {
97
99
  function FooterSectionTitle({ className, ...props }) {
98
100
  return /* @__PURE__ */ jsx("h3", {
99
101
  "data-slot": "footer-section-title",
100
- className: cn("text-gdt-xs font-bold text-fg-primary", className),
102
+ className: cn("text-gdt-md font-bold text-fg-primary", className),
101
103
  ...props
102
104
  });
103
105
  }
104
106
  function FooterLinkList({ className, ...props }) {
105
107
  return /* @__PURE__ */ jsx("ul", {
106
108
  "data-slot": "footer-link-list",
107
- className: cn("flex flex-col gap-gdt-sm", className),
109
+ className: cn("flex flex-col gap-gdt-md", className),
108
110
  ...props
109
111
  });
110
112
  }
111
113
  function FooterLinkItem({ className, ...props }) {
112
114
  return /* @__PURE__ */ jsx("li", {
113
115
  "data-slot": "footer-link-item",
114
- className: cn("text-gdt-xs", className),
116
+ className: cn("text-gdt-sm", className),
115
117
  ...props
116
118
  });
117
119
  }
@@ -119,10 +121,10 @@ function FooterLink({ className, children, render, showArrow = false, ...props }
119
121
  return useRender({
120
122
  defaultTagName: "a",
121
123
  props: mergeProps({
122
- className: cn("inline-flex items-center gap-gdt-sm text-fg-secondary transition-colors hover:text-fg-brand focus-visible:outline-none focus-visible:ring-2 focus-visible:ring-line-focus focus-visible:ring-offset-2", className),
123
- children: /* @__PURE__ */ jsxs(Fragment, { children: [/* @__PURE__ */ jsx("span", { children }), showArrow && /* @__PURE__ */ jsx("span", {
124
+ className: cn("inline-flex items-center gap-gdt-sm text-fg-secondary underline-offset-4 transition-colors hover:text-fg-brand hover:underline focus-visible:outline-none focus-visible:ring-2 focus-visible:ring-line-focus focus-visible:ring-offset-2", className),
125
+ children: /* @__PURE__ */ jsxs(Fragment, { children: [/* @__PURE__ */ jsx("span", { children }), showArrow && /* @__PURE__ */ jsx(ChevronRight, {
124
126
  "aria-hidden": "true",
125
- children: ""
127
+ className: "size-3.5"
126
128
  })] })
127
129
  }, props),
128
130
  render,
@@ -132,21 +134,21 @@ function FooterLink({ className, children, render, showArrow = false, ...props }
132
134
  function FooterContactGrid({ className, ...props }) {
133
135
  return /* @__PURE__ */ jsx("div", {
134
136
  "data-slot": "footer-contact-grid",
135
- className: cn("grid gap-gdt-3xl border-t border-line-subtle pt-gdt-xl md:grid-cols-[minmax(0,1fr)_minmax(18rem,25rem)]", className),
137
+ className: cn("grid gap-5 lg:grid-cols-[minmax(0,1fr)_28.75rem] lg:gap-gdt-5xl", className),
136
138
  ...props
137
139
  });
138
140
  }
139
141
  function FooterContact({ className, ...props }) {
140
142
  return /* @__PURE__ */ jsx("address", {
141
143
  "data-slot": "footer-contact",
142
- className: cn("not-italic text-gdt-xs text-fg-secondary", className),
144
+ className: cn("not-italic text-gdt-sm text-fg-secondary lg:order-first", className),
143
145
  ...props
144
146
  });
145
147
  }
146
148
  function FooterContactTitle({ className, ...props }) {
147
149
  return /* @__PURE__ */ jsx("h3", {
148
150
  "data-slot": "footer-contact-title",
149
- className: cn("mb-gdt-sm text-gdt-xs font-bold text-fg-primary", className),
151
+ className: cn("mb-gdt-xs text-gdt-sm font-bold text-fg-primary", className),
150
152
  ...props
151
153
  });
152
154
  }
@@ -167,45 +169,47 @@ function FooterSocialItem({ className, ...props }) {
167
169
  function FooterSocialLink({ className, ...props }) {
168
170
  return /* @__PURE__ */ jsx("a", {
169
171
  "data-slot": "footer-social-link",
170
- className: cn("inline-flex size-7 items-center justify-center rounded-full bg-canvas text-fg-secondary transition-colors hover:bg-surface-brand hover:text-fg-on-brand focus-visible:outline-none focus-visible:ring-2 focus-visible:ring-line-focus focus-visible:ring-offset-2 [&>svg:not([class*='size-'])]:size-3.5", className),
172
+ className: cn("inline-flex size-10 items-center justify-center rounded-full bg-surface-raised text-fg-secondary transition-colors hover:bg-surface-brand hover:text-fg-on-brand focus-visible:outline-none focus-visible:ring-2 focus-visible:ring-line-focus focus-visible:ring-offset-2 [&>svg:not([class*='size-'])]:size-4.5", className),
171
173
  ...props
172
174
  });
173
175
  }
174
176
  function FooterNewsletter({ className, ...props }) {
175
177
  return /* @__PURE__ */ jsx("form", {
176
178
  "data-slot": "footer-newsletter",
177
- className: cn("flex flex-col gap-gdt-md", className),
179
+ className: cn("flex flex-col gap-3.5", className),
178
180
  ...props
179
181
  });
180
182
  }
181
183
  function FooterNewsletterTitle({ className, ...props }) {
182
184
  return /* @__PURE__ */ jsx("h3", {
183
185
  "data-slot": "footer-newsletter-title",
184
- className: cn("text-gdt-xs font-bold text-fg-primary", className),
186
+ className: cn("text-gdt-md font-semibold text-fg-primary", className),
185
187
  ...props
186
188
  });
187
189
  }
188
190
  function FooterNewsletterDescription({ className, ...props }) {
189
191
  return /* @__PURE__ */ jsx("p", {
190
192
  "data-slot": "footer-newsletter-description",
191
- className: cn("text-gdt-xs text-fg-secondary", className),
193
+ className: cn("text-gdt-sm text-fg-secondary", className),
192
194
  ...props
193
195
  });
194
196
  }
195
- function FooterNewsletterControl({ className, children, ...props }) {
196
- return /* @__PURE__ */ jsx(InputGroup, {
197
+ function FooterNewsletterControl({ className, children, size = "lg", ...props }) {
198
+ return /* @__PURE__ */ jsx("div", {
197
199
  "data-slot": "footer-newsletter-control",
198
- size: "md",
199
- className: cn("max-w-md bg-canvas", className),
200
+ className: cn("flex w-full max-w-[28.75rem] flex-col gap-gdt-md md:flex-row", className),
200
201
  ...props,
201
- children: children ?? /* @__PURE__ */ jsxs(Fragment, { children: [/* @__PURE__ */ jsx(InputGroupInput, {
202
+ children: children ?? /* @__PURE__ */ jsxs(Fragment, { children: [/* @__PURE__ */ jsx(Input, {
202
203
  type: "email",
203
204
  name: "email",
204
- placeholder: "Email address",
205
+ size,
206
+ placeholder: "Enter your email",
205
207
  "aria-label": "Email address"
206
- }), /* @__PURE__ */ jsx(InputGroupButton, {
208
+ }), /* @__PURE__ */ jsx(Button, {
207
209
  type: "submit",
208
210
  variant: "primary",
211
+ size,
212
+ className: "w-full md:w-auto",
209
213
  children: "Subscribe"
210
214
  })] })
211
215
  });
@@ -213,14 +217,14 @@ function FooterNewsletterControl({ className, children, ...props }) {
213
217
  function FooterBottom({ className, ...props }) {
214
218
  return /* @__PURE__ */ jsx("div", {
215
219
  "data-slot": "footer-bottom",
216
- className: cn("flex flex-col gap-gdt-md border-t border-line-subtle px-gdt-xl py-gdt-lg text-gdt-subtext text-fg-secondary md:flex-row md:items-center md:justify-between md:px-gdt-5xl", className),
220
+ className: cn("flex flex-col gap-2.5 border-t border-line-subtle px-5 py-gdt-xl text-gdt-xs text-fg-secondary [&>[data-slot=footer-legal-links]]:order-first md:flex-row md:items-center md:justify-between md:px-gdt-6xl md:[&>[data-slot=footer-legal-links]]:order-none", className),
217
221
  ...props
218
222
  });
219
223
  }
220
224
  function FooterLegalLinks({ className, ...props }) {
221
225
  return /* @__PURE__ */ jsx("nav", {
222
226
  "data-slot": "footer-legal-links",
223
- className: cn("flex flex-wrap items-center gap-gdt-xl", className),
227
+ className: cn("flex flex-wrap items-center gap-5 md:gap-gdt-xl", className),
224
228
  ...props
225
229
  });
226
230
  }
@@ -1,4 +1,4 @@
1
- import { t as ComponentSize } from "./size-context-D4mYvcg8.js";
1
+ import { t as ComponentSize } from "./size-context-BX6kAdVj.js";
2
2
  import { ChartCard, ChartValueType } from "./chart.js";
3
3
  import * as React from "react";
4
4
  //#region src/funnel-chart.d.ts
@@ -1,4 +1,4 @@
1
- import { t as ComponentSize } from "./size-context-D4mYvcg8.js";
1
+ import { t as ComponentSize } from "./size-context-BX6kAdVj.js";
2
2
  import { ChartCard } from "./chart.js";
3
3
  import * as React from "react";
4
4
  //#region src/heatmap-chart.d.ts
@@ -1,14 +1,14 @@
1
1
  "use client";
2
2
  import { t as cn } from "./cn-BI_4DMBf.js";
3
- import { SizeProvider, useComponentSize } from "./size-context.js";
3
+ import { SizeProvider } from "./size-context.js";
4
4
  import { Button } from "./button.js";
5
- import { InputSizeProvider } from "./input-size-context.js";
5
+ import { InputSizeProvider, useInputComponentSize } from "./input-size-context.js";
6
6
  import { Input } from "./input.js";
7
7
  import { Textarea } from "./textarea.js";
8
8
  import { jsx } from "react/jsx-runtime";
9
9
  import { cva } from "class-variance-authority";
10
10
  //#region src/input-group.tsx
11
- const inputGroupVariants = cva("group/input-group relative flex w-full min-w-0 items-center rounded-full has-[textarea]:rounded-xl has-data-[align=block-end]:rounded-xl has-data-[align=block-start]:rounded-xl border border-line bg-canvas transition-[background-color,border-color,box-shadow,color] outline-none in-data-[slot=combobox-content]:focus-within:border-inherit in-data-[slot=combobox-content]:focus-within:ring-0 has-disabled:border-line-subtle has-disabled:bg-surface has-disabled:text-fg-caption-placeholder focus-within:border-line-focus focus-within:inset-ring-1 focus-within:inset-ring-line-focus has-[[data-slot][aria-invalid=true]]:border-line-danger has-[[data-slot][aria-invalid=true]]:inset-shadow-none has-[[data-slot][aria-invalid=true]]:focus-within:border-line-danger has-[[data-slot][aria-invalid=true]]:focus-within:inset-ring-line-danger has-[>[data-align=block-end]]:h-auto has-[>[data-align=block-end]]:flex-col has-[>[data-align=block-start]]:h-auto has-[>[data-align=block-start]]:flex-col has-[>textarea]:h-auto has-[>[data-align=block-end]]:[&>input]:pt-3 has-[>[data-align=block-start]]:[&>input]:pb-3 has-[>[data-align=inline-start]]:[&>[data-slot=input-group-control]]:group-data-[size=sm]/input-group:pl-2 has-[>[data-align=inline-start]]:[&>[data-slot=input-group-control]]:group-data-[size=md]/input-group:pl-2.5 has-[>[data-align=inline-start]]:[&>[data-slot=input-group-control]]:group-data-[size=lg]/input-group:pl-3 has-[>[data-align=inline-start]]:[&>[data-slot=input-group-control]]:group-data-[size=xl]/input-group:pl-3 has-[>[data-align=inline-end]]:[&>[data-slot=input-group-control]]:group-data-[size=sm]/input-group:pr-2 has-[>[data-align=inline-end]]:[&>[data-slot=input-group-control]]:group-data-[size=md]/input-group:pr-2.5 has-[>[data-align=inline-end]]:[&>[data-slot=input-group-control]]:group-data-[size=lg]/input-group:pr-3 has-[>[data-align=inline-end]]:[&>[data-slot=input-group-control]]:group-data-[size=xl]/input-group:pr-3", {
11
+ const inputGroupVariants = cva("group/input-group relative flex w-full min-w-0 items-center overflow-hidden rounded-full has-[textarea]:rounded-xl has-data-[align=block-end]:rounded-xl has-data-[align=block-start]:rounded-xl border border-line bg-canvas transition-[background-color,border-color,box-shadow,color] outline-none in-data-[slot=combobox-content]:focus-within:border-inherit in-data-[slot=combobox-content]:focus-within:ring-0 has-disabled:border-line-subtle has-disabled:bg-surface has-disabled:text-fg-caption-placeholder focus-within:border-line-focus focus-within:inset-ring-1 focus-within:inset-ring-line-focus has-[[data-slot][aria-invalid=true]]:border-line-danger has-[[data-slot][aria-invalid=true]]:inset-shadow-none has-[[data-slot][aria-invalid=true]]:focus-within:border-line-danger has-[[data-slot][aria-invalid=true]]:focus-within:inset-ring-line-danger has-[>[data-align=block-end]]:h-auto has-[>[data-align=block-end]]:flex-col has-[>[data-align=block-start]]:h-auto has-[>[data-align=block-start]]:flex-col has-[>textarea]:h-auto has-[>[data-align=block-end]]:[&>input]:pt-3 has-[>[data-align=block-start]]:[&>input]:pb-3 has-[>[data-align=inline-start]]:[&>[data-slot=input-group-control]]:group-data-[size=sm]/input-group:pl-2 has-[>[data-align=inline-start]]:[&>[data-slot=input-group-control]]:group-data-[size=md]/input-group:pl-2.5 has-[>[data-align=inline-start]]:[&>[data-slot=input-group-control]]:group-data-[size=lg]/input-group:pl-3 has-[>[data-align=inline-start]]:[&>[data-slot=input-group-control]]:group-data-[size=xl]/input-group:pl-3 has-[>[data-align=inline-end]]:[&>[data-slot=input-group-control]]:group-data-[size=sm]/input-group:pr-2 has-[>[data-align=inline-end]]:[&>[data-slot=input-group-control]]:group-data-[size=md]/input-group:pr-2.5 has-[>[data-align=inline-end]]:[&>[data-slot=input-group-control]]:group-data-[size=lg]/input-group:pr-3 has-[>[data-align=inline-end]]:[&>[data-slot=input-group-control]]:group-data-[size=xl]/input-group:pr-3", {
12
12
  variants: { size: {
13
13
  sm: "h-8",
14
14
  md: "h-10",
@@ -18,8 +18,7 @@ const inputGroupVariants = cva("group/input-group relative flex w-full min-w-0 i
18
18
  defaultVariants: { size: "md" }
19
19
  });
20
20
  function InputGroup({ className, size, ...props }) {
21
- const inheritedSize = useComponentSize();
22
- const resolvedSize = size ?? inheritedSize;
21
+ const resolvedSize = useInputComponentSize(size);
23
22
  return /* @__PURE__ */ jsx(SizeProvider, {
24
23
  size: resolvedSize === "xl" ? void 0 : resolvedSize,
25
24
  children: /* @__PURE__ */ jsx(InputSizeProvider, {
@@ -1,4 +1,5 @@
1
1
  "use client";
2
+ import { useInheritedComponentSize } from "./size-context.js";
2
3
  import { Fragment, jsx } from "react/jsx-runtime";
3
4
  import { createContext, useContext } from "react";
4
5
  //#region src/input-size-context.tsx
@@ -11,8 +12,9 @@ function InputSizeProvider({ children, size }) {
11
12
  });
12
13
  }
13
14
  function useInputComponentSize(size, fallback = "md") {
14
- const inheritedSize = useContext(InputSizeContext);
15
- return size ?? inheritedSize ?? fallback;
15
+ const inheritedInputSize = useContext(InputSizeContext);
16
+ const inheritedComponentSize = useInheritedComponentSize();
17
+ return size ?? inheritedInputSize ?? inheritedComponentSize ?? fallback;
16
18
  }
17
19
  //#endregion
18
20
  export { InputSizeProvider, useInputComponentSize };
package/dist/input.js CHANGED
@@ -5,7 +5,7 @@ import { jsx } from "react/jsx-runtime";
5
5
  import { cva } from "class-variance-authority";
6
6
  import { Input as Input$1 } from "@base-ui/react/input";
7
7
  //#region src/input.tsx
8
- const inputVariants = cva("flex w-full min-w-0 rounded-full border border-line bg-canvas text-fg-primary transition-[background-color,border-color,box-shadow,color] outline-none file:inline-flex file:border-0 file:bg-transparent file:font-normal file:text-fg-primary placeholder:text-fg-caption-placeholder hover:border-line-strong focus-visible:border-line-focus focus-visible:inset-ring-1 focus-visible:inset-ring-line-focus disabled:pointer-events-none disabled:cursor-not-allowed disabled:border-line-subtle disabled:bg-surface disabled:text-fg-caption-placeholder disabled:placeholder:text-fg-caption-placeholder aria-invalid:border-line-danger aria-invalid:text-fg-danger aria-invalid:placeholder:text-fg-danger aria-invalid:shadow-none aria-invalid:focus-visible:border-line-danger aria-invalid:focus-visible:inset-ring-line-danger", {
8
+ const inputVariants = cva("flex w-full min-w-0 rounded-full border border-line bg-canvas text-fg-primary transition-[background-color,border-color,box-shadow,color] outline-none file:inline-flex file:border-0 file:bg-transparent file:font-normal file:text-fg-primary placeholder:text-fg-caption-placeholder hover:border-line-strong focus-visible:border-line-focus focus-visible:inset-ring-1 focus-visible:inset-ring-line-focus disabled:pointer-events-none disabled:cursor-not-allowed disabled:border-line-subtle disabled:bg-surface disabled:text-fg-caption-placeholder disabled:placeholder:text-fg-caption-placeholder aria-invalid:border-line-danger aria-invalid:text-fg-danger aria-invalid:placeholder:text-fg-danger aria-invalid:shadow-none aria-invalid:focus-visible:border-line-danger aria-invalid:focus-visible:inset-ring-line-danger autofill:border-line autofill:bg-canvas autofill:[-webkit-text-fill-color:var(--color-fg-primary)] autofill:[box-shadow:0_0_0_1000px_var(--color-canvas)_inset]", {
9
9
  variants: { size: {
10
10
  sm: "h-8 px-3 text-gdt-xs font-normal file:text-gdt-xs",
11
11
  md: "h-10 px-3.5 text-gdt-sm font-normal file:text-gdt-sm",
@@ -1,4 +1,4 @@
1
- import { t as ComponentSize } from "./size-context-D4mYvcg8.js";
1
+ import { t as ComponentSize } from "./size-context-BX6kAdVj.js";
2
2
  import { ChartConfig } from "./chart.js";
3
3
  import * as React from "react";
4
4
  import { Area, AreaChart as AreaChart$1, CartesianGrid, Line, LineChart as LineChart$1, XAxis, YAxis } from "recharts";
@@ -0,0 +1,61 @@
1
+ import { t as Input } from "./input-CfoEJ8A6.js";
2
+ import * as React from "react";
3
+ //#region src/mask-input.d.ts
4
+ type MaskToken = {
5
+ pattern: RegExp;
6
+ transform?: (char: string) => string;
7
+ };
8
+ declare const defaultTokens: Record<string, MaskToken>;
9
+ declare const maskPresets: {
10
+ creditCard: string;
11
+ cvc: string;
12
+ date: string;
13
+ phoneNg: string;
14
+ time: string;
15
+ };
16
+ type MaskPreset = keyof typeof maskPresets;
17
+ type MaskInputOptions = {
18
+ allowNegative?: boolean;
19
+ currency?: string;
20
+ decimalScale?: number;
21
+ fixedDecimalScale?: boolean;
22
+ locale?: string;
23
+ mask?: string;
24
+ max?: number;
25
+ min?: number;
26
+ numeric?: boolean;
27
+ preset?: MaskPreset;
28
+ prefix?: string;
29
+ suffix?: string;
30
+ thousandSeparator?: boolean;
31
+ tokens?: Record<string, MaskToken>;
32
+ };
33
+ type MaskedValue = {
34
+ /** What the input displays: affixes, separators and all. */
35
+ masked: string;
36
+ /** The characters the user owns — token characters, or a plain number string. */
37
+ unmasked: string;
38
+ /** `unmasked` parsed, or `null` while it isn't a finished number. */
39
+ number: number | null;
40
+ /** Parallel to `masked`: true where the character came from `unmasked`. */
41
+ editable: boolean[];
42
+ };
43
+ /**
44
+ * Format a value exactly as `MaskInput` would — useful for rendering the same
45
+ * amounts outside an input (table cells, summaries) without duplicating rules.
46
+ */
47
+ declare function formatMaskValue(input: string | number, options?: MaskInputOptions): MaskedValue;
48
+ type MaskInputProps = Omit<React.ComponentProps<typeof Input>, "value" | "defaultValue" | "onChange" | "prefix" | "min" | "max"> & MaskInputOptions & {
49
+ /** Controlled value. Accepts either the masked or the unmasked form. */
50
+ value?: string | number;
51
+ /** Uncontrolled initial value. */
52
+ defaultValue?: string | number;
53
+ /** Reject a keystroke by returning `false`. Runs on every proposed change with the partial value, so allow in-progress input. */
54
+ validate?: (value: MaskedValue) => boolean;
55
+ /** Fires whenever the value changes, with the display and raw forms. */
56
+ onValueChange?: (value: MaskedValue) => void;
57
+ onChange?: React.ChangeEventHandler<HTMLInputElement>;
58
+ };
59
+ declare function MaskInput({ allowNegative, currency, decimalScale, defaultValue, fixedDecimalScale, inputMode, locale, mask, max, min, numeric, onBlur, onChange, onClick, onKeyDown, onValueChange, preset, prefix, ref, suffix, thousandSeparator, tokens, validate, value, ...props }: MaskInputProps): React.JSX.Element;
60
+ //#endregion
61
+ export { MaskInput, type MaskInputOptions, type MaskInputProps, type MaskPreset, type MaskToken, type MaskedValue, formatMaskValue, defaultTokens as maskInputTokens, maskPresets };
Binary file
@@ -0,0 +1,57 @@
1
+ import { Collapsible, CollapsibleContent, CollapsibleTrigger } from "./collapsible.js";
2
+ import { Sheet, SheetBody, SheetClose, SheetContent, SheetFooter, SheetHeader, SheetTitle, SheetTrigger } from "./sheet.js";
3
+ import { useRender } from "@base-ui/react/use-render";
4
+ import * as React from "react";
5
+ //#region src/mobile-sidebar.d.ts
6
+ type MobileSidebarRootProps = React.ComponentProps<typeof Sheet>;
7
+ declare function MobileSidebarRoot(props: MobileSidebarRootProps): React.JSX.Element;
8
+ declare function MobileSidebarTrigger({ className, children, ...props }: React.ComponentProps<typeof SheetTrigger>): React.JSX.Element;
9
+ type MobileSidebarContentProps = Omit<Extract<React.ComponentProps<typeof SheetContent>, {
10
+ side?: "left" | "right";
11
+ }>, "side" | "size">;
12
+ declare function MobileSidebarContent({ className, showCloseButton, ...props }: MobileSidebarContentProps): React.JSX.Element;
13
+ declare function MobileSidebarHeader({ className, ...props }: React.ComponentProps<typeof SheetHeader>): React.JSX.Element;
14
+ declare function MobileSidebarTitle({ className, ...props }: React.ComponentProps<typeof SheetTitle>): React.JSX.Element;
15
+ declare function MobileSidebarClose({ className, children, ...props }: React.ComponentProps<typeof SheetClose>): React.JSX.Element;
16
+ declare function MobileSidebarBody({ className, ...props }: React.ComponentProps<typeof SheetBody>): React.JSX.Element;
17
+ declare function MobileSidebarFooter({ className, ...props }: React.ComponentProps<typeof SheetFooter>): React.JSX.Element;
18
+ declare function MobileSidebarNav({ className, ...props }: React.ComponentProps<"nav">): React.JSX.Element;
19
+ declare function MobileSidebarList({ className, ...props }: React.ComponentProps<"ul">): React.JSX.Element;
20
+ declare function MobileSidebarItem({ className, ...props }: React.ComponentProps<"li">): React.JSX.Element;
21
+ type MobileSidebarLinkProps = useRender.ComponentProps<"a"> & {
22
+ active?: boolean;
23
+ icon?: React.ReactNode;
24
+ };
25
+ declare function MobileSidebarLink({ active, icon, className, children, render, ...props }: MobileSidebarLinkProps): React.ReactElement<unknown, string | React.JSXElementConstructor<any>>;
26
+ declare function MobileSidebarGroup({ className, ...props }: React.ComponentProps<typeof Collapsible>): React.JSX.Element;
27
+ type MobileSidebarGroupTriggerProps = React.ComponentProps<typeof CollapsibleTrigger> & {
28
+ active?: boolean;
29
+ icon?: React.ReactNode;
30
+ };
31
+ declare function MobileSidebarGroupTrigger({ active, icon, className, children, ...props }: MobileSidebarGroupTriggerProps): React.JSX.Element;
32
+ declare function MobileSidebarGroupPanel({ className, ...props }: React.ComponentProps<typeof CollapsibleContent>): React.JSX.Element;
33
+ declare function MobileSidebarSubList({ className, ...props }: React.ComponentProps<"ul">): React.JSX.Element;
34
+ declare function MobileSidebarSubheading({ className, ...props }: React.ComponentProps<"li">): React.JSX.Element;
35
+ declare function MobileSidebarSubLink({ className, render, ...props }: useRender.ComponentProps<"a">): React.ReactElement<unknown, string | React.JSXElementConstructor<any>>;
36
+ declare const MobileSidebar: {
37
+ Root: typeof MobileSidebarRoot;
38
+ Trigger: typeof MobileSidebarTrigger;
39
+ Content: typeof MobileSidebarContent;
40
+ Header: typeof MobileSidebarHeader;
41
+ Title: typeof MobileSidebarTitle;
42
+ Close: typeof MobileSidebarClose;
43
+ Body: typeof MobileSidebarBody;
44
+ Footer: typeof MobileSidebarFooter;
45
+ Nav: typeof MobileSidebarNav;
46
+ List: typeof MobileSidebarList;
47
+ Item: typeof MobileSidebarItem;
48
+ Link: typeof MobileSidebarLink;
49
+ Group: typeof MobileSidebarGroup;
50
+ GroupTrigger: typeof MobileSidebarGroupTrigger;
51
+ GroupPanel: typeof MobileSidebarGroupPanel;
52
+ SubList: typeof MobileSidebarSubList;
53
+ Subheading: typeof MobileSidebarSubheading;
54
+ SubLink: typeof MobileSidebarSubLink;
55
+ };
56
+ //#endregion
57
+ export { MobileSidebar, MobileSidebarBody, MobileSidebarClose, MobileSidebarContent, type MobileSidebarContentProps, MobileSidebarFooter, MobileSidebarGroup, MobileSidebarGroupPanel, MobileSidebarGroupTrigger, type MobileSidebarGroupTriggerProps, MobileSidebarHeader, MobileSidebarItem, MobileSidebarLink, type MobileSidebarLinkProps, MobileSidebarList, MobileSidebarNav, MobileSidebarRoot, type MobileSidebarRootProps, MobileSidebarSubLink, MobileSidebarSubList, MobileSidebarSubheading, MobileSidebarTitle, MobileSidebarTrigger };
@@ -0,0 +1,196 @@
1
+ "use client";
2
+ import { t as cn } from "./cn-BI_4DMBf.js";
3
+ import { Collapsible, CollapsibleContent, CollapsibleTrigger } from "./collapsible.js";
4
+ import { Sheet, SheetBody, SheetClose, SheetContent, SheetFooter, SheetHeader, SheetTitle, SheetTrigger } from "./sheet.js";
5
+ import { ChevronDownIcon, MenuIcon, XIcon } from "lucide-react";
6
+ import { Fragment, jsx, jsxs } from "react/jsx-runtime";
7
+ import { mergeProps } from "@base-ui/react/merge-props";
8
+ import { useRender } from "@base-ui/react/use-render";
9
+ //#region src/mobile-sidebar.tsx
10
+ function MobileSidebarRoot(props) {
11
+ return /* @__PURE__ */ jsx(Sheet, { ...props });
12
+ }
13
+ function MobileSidebarTrigger({ className, children, ...props }) {
14
+ return /* @__PURE__ */ jsx(SheetTrigger, {
15
+ "data-slot": "mobile-sidebar-trigger",
16
+ className: cn("inline-flex size-10 items-center justify-center rounded-lg text-fg-secondary outline-none transition-[background-color,color,translate] duration-(--duration-motion-press) ease-gdt-out hover:bg-surface hover:text-fg-primary focus-visible:shadow-[0_0_0_2px_var(--color-line-focus)] active:translate-y-px motion-reduce:active:translate-y-0", className),
17
+ ...props,
18
+ children: children ?? /* @__PURE__ */ jsx(MenuIcon, {
19
+ "aria-hidden": "true",
20
+ className: "size-6"
21
+ })
22
+ });
23
+ }
24
+ function MobileSidebarContent({ className, showCloseButton = false, ...props }) {
25
+ return /* @__PURE__ */ jsx(SheetContent, {
26
+ "data-slot": "mobile-sidebar-content",
27
+ side: "right",
28
+ size: "sm",
29
+ showCloseButton,
30
+ className: cn("h-dvh w-[min(100vw,24.375rem)] rounded-none border-y-0 border-r-0 bg-canvas [--sheet-padding-x:1.25rem] [--sheet-padding-top:0.8125rem]", className),
31
+ ...props
32
+ });
33
+ }
34
+ function MobileSidebarHeader({ className, ...props }) {
35
+ return /* @__PURE__ */ jsx(SheetHeader, {
36
+ "data-slot": "mobile-sidebar-header",
37
+ className: cn("min-h-16 flex-row items-center justify-between gap-4 px-5 py-[13px]", className),
38
+ ...props
39
+ });
40
+ }
41
+ function MobileSidebarTitle({ className, ...props }) {
42
+ return /* @__PURE__ */ jsx(SheetTitle, {
43
+ "data-slot": "mobile-sidebar-title",
44
+ className: cn("sr-only", className),
45
+ ...props
46
+ });
47
+ }
48
+ function MobileSidebarClose({ className, children, ...props }) {
49
+ return /* @__PURE__ */ jsx(SheetClose, {
50
+ "data-slot": "mobile-sidebar-close",
51
+ className: cn("inline-flex size-8 shrink-0 items-center justify-center rounded-lg text-fg-primary outline-none transition-[background-color,translate] duration-(--duration-motion-press) ease-gdt-out hover:bg-surface focus-visible:shadow-[0_0_0_2px_var(--color-line-focus)] active:translate-y-px motion-reduce:active:translate-y-0", className),
52
+ ...props,
53
+ children: children ?? /* @__PURE__ */ jsx(XIcon, {
54
+ "aria-hidden": "true",
55
+ className: "size-5"
56
+ })
57
+ });
58
+ }
59
+ function MobileSidebarBody({ className, ...props }) {
60
+ return /* @__PURE__ */ jsx(SheetBody, {
61
+ "data-slot": "mobile-sidebar-body",
62
+ className: cn("flex flex-col px-5 py-3", className),
63
+ ...props
64
+ });
65
+ }
66
+ function MobileSidebarFooter({ className, ...props }) {
67
+ return /* @__PURE__ */ jsx(SheetFooter, {
68
+ "data-slot": "mobile-sidebar-footer",
69
+ className: cn("flex-col items-stretch gap-3 px-5 py-4 [&>*]:w-full", className),
70
+ ...props
71
+ });
72
+ }
73
+ function MobileSidebarNav({ className, ...props }) {
74
+ return /* @__PURE__ */ jsx("nav", {
75
+ "data-slot": "mobile-sidebar-nav",
76
+ className,
77
+ ...props
78
+ });
79
+ }
80
+ function MobileSidebarList({ className, ...props }) {
81
+ return /* @__PURE__ */ jsx("ul", {
82
+ "data-slot": "mobile-sidebar-list",
83
+ className: cn("flex flex-col", className),
84
+ ...props
85
+ });
86
+ }
87
+ function MobileSidebarItem({ className, ...props }) {
88
+ return /* @__PURE__ */ jsx("li", {
89
+ "data-slot": "mobile-sidebar-item",
90
+ className: cn("min-w-0", className),
91
+ ...props
92
+ });
93
+ }
94
+ function MobileSidebarLink({ active = false, icon, className, children, render, ...props }) {
95
+ return useRender({
96
+ defaultTagName: "a",
97
+ props: mergeProps({
98
+ "aria-current": active ? "page" : void 0,
99
+ className: cn("group/mobile-sidebar-link grid min-h-11 w-full grid-cols-1 items-center rounded-xl px-2 py-2.5 text-left text-gdt-md font-semibold text-fg-primary outline-none transition-colors hover:bg-surface focus-visible:shadow-[0_0_0_2px_var(--color-line-focus)]", active && "bg-surface-brand-subtle text-fg-brand", className),
100
+ children: /* @__PURE__ */ jsx(Fragment, { children: /* @__PURE__ */ jsxs("span", {
101
+ className: cn("grid min-w-0 items-center", icon ? "grid-cols-[1.25rem_minmax(0,1fr)] gap-3" : "grid-cols-1"),
102
+ children: [icon ? /* @__PURE__ */ jsx("span", {
103
+ className: "flex size-5 items-center justify-center [&>svg]:size-5",
104
+ children: icon
105
+ }) : null, /* @__PURE__ */ jsx("span", {
106
+ className: "min-w-0 truncate",
107
+ children
108
+ })]
109
+ }) })
110
+ }, props),
111
+ render,
112
+ state: {
113
+ slot: "mobile-sidebar-link",
114
+ active
115
+ }
116
+ });
117
+ }
118
+ function MobileSidebarGroup({ className, ...props }) {
119
+ return /* @__PURE__ */ jsx(Collapsible, {
120
+ "data-slot": "mobile-sidebar-group",
121
+ className: cn("min-w-0", className),
122
+ ...props
123
+ });
124
+ }
125
+ function MobileSidebarGroupTrigger({ active = false, icon, className, children, ...props }) {
126
+ return /* @__PURE__ */ jsxs(CollapsibleTrigger, {
127
+ "data-slot": "mobile-sidebar-group-trigger",
128
+ "data-active": active || void 0,
129
+ className: cn("grid min-h-11 w-full grid-cols-[minmax(0,1fr)_auto] items-center gap-3 rounded-xl px-2 py-2.5 text-left text-gdt-md font-semibold text-fg-primary outline-none transition-colors hover:bg-surface focus-visible:shadow-[0_0_0_2px_var(--color-line-focus)]", active && "bg-surface-brand-subtle text-fg-brand", className),
130
+ ...props,
131
+ children: [/* @__PURE__ */ jsxs("span", {
132
+ className: cn("grid min-w-0 items-center", icon ? "grid-cols-[1.25rem_minmax(0,1fr)] gap-3" : "grid-cols-1"),
133
+ children: [icon ? /* @__PURE__ */ jsx("span", {
134
+ className: "flex size-5 items-center justify-center [&>svg]:size-5",
135
+ children: icon
136
+ }) : null, /* @__PURE__ */ jsx("span", {
137
+ className: "min-w-0 truncate",
138
+ children
139
+ })]
140
+ }), /* @__PURE__ */ jsx(ChevronDownIcon, {
141
+ "aria-hidden": "true",
142
+ className: "size-4 shrink-0 text-current transition-transform duration-(--duration-motion-press) ease-gdt-out group-data-[panel-open]/collapsible-trigger:rotate-180 motion-reduce:transition-none"
143
+ })]
144
+ });
145
+ }
146
+ function MobileSidebarGroupPanel({ className, ...props }) {
147
+ return /* @__PURE__ */ jsx(CollapsibleContent, {
148
+ "data-slot": "mobile-sidebar-group-panel",
149
+ className: cn("overflow-hidden", className),
150
+ ...props
151
+ });
152
+ }
153
+ function MobileSidebarSubList({ className, ...props }) {
154
+ return /* @__PURE__ */ jsx("ul", {
155
+ "data-slot": "mobile-sidebar-sub-list",
156
+ className: cn("ml-8 flex flex-col pb-1", className),
157
+ ...props
158
+ });
159
+ }
160
+ function MobileSidebarSubheading({ className, ...props }) {
161
+ return /* @__PURE__ */ jsx("li", {
162
+ "data-slot": "mobile-sidebar-subheading",
163
+ className: cn("px-2 pt-1.5 text-gdt-capitalized font-semibold uppercase text-fg-brand", className),
164
+ ...props
165
+ });
166
+ }
167
+ function MobileSidebarSubLink({ className, render, ...props }) {
168
+ return useRender({
169
+ defaultTagName: "a",
170
+ props: mergeProps({ className: cn("block rounded-lg px-2 py-1.5 text-gdt-sm font-medium text-fg-secondary outline-none transition-colors hover:bg-surface hover:text-fg-primary focus-visible:shadow-[0_0_0_2px_var(--color-line-focus)]", className) }, props),
171
+ render,
172
+ state: { slot: "mobile-sidebar-sub-link" }
173
+ });
174
+ }
175
+ const MobileSidebar = {
176
+ Root: MobileSidebarRoot,
177
+ Trigger: MobileSidebarTrigger,
178
+ Content: MobileSidebarContent,
179
+ Header: MobileSidebarHeader,
180
+ Title: MobileSidebarTitle,
181
+ Close: MobileSidebarClose,
182
+ Body: MobileSidebarBody,
183
+ Footer: MobileSidebarFooter,
184
+ Nav: MobileSidebarNav,
185
+ List: MobileSidebarList,
186
+ Item: MobileSidebarItem,
187
+ Link: MobileSidebarLink,
188
+ Group: MobileSidebarGroup,
189
+ GroupTrigger: MobileSidebarGroupTrigger,
190
+ GroupPanel: MobileSidebarGroupPanel,
191
+ SubList: MobileSidebarSubList,
192
+ Subheading: MobileSidebarSubheading,
193
+ SubLink: MobileSidebarSubLink
194
+ };
195
+ //#endregion
196
+ export { MobileSidebar, MobileSidebarBody, MobileSidebarClose, MobileSidebarContent, MobileSidebarFooter, MobileSidebarGroup, MobileSidebarGroupPanel, MobileSidebarGroupTrigger, MobileSidebarHeader, MobileSidebarItem, MobileSidebarLink, MobileSidebarList, MobileSidebarNav, MobileSidebarRoot, MobileSidebarSubLink, MobileSidebarSubList, MobileSidebarSubheading, MobileSidebarTitle, MobileSidebarTrigger };
@@ -1,4 +1,4 @@
1
- import { t as ComponentSize } from "./size-context-D4mYvcg8.js";
1
+ import { t as ComponentSize } from "./size-context-BX6kAdVj.js";
2
2
  import * as React from "react";
3
3
  import { NumberFieldRootProps } from "@base-ui/react/number-field";
4
4
  //#region src/number-input.d.ts