adjacent-ui 0.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 (123) hide show
  1. package/CHANGELOG.md +15 -0
  2. package/LICENSE +21 -0
  3. package/README.md +41 -0
  4. package/dist/button/button.css +177 -0
  5. package/dist/button/button.d.ts +25 -0
  6. package/dist/button/button.d.ts.map +1 -0
  7. package/dist/button/button.js +11 -0
  8. package/dist/button/button.js.map +1 -0
  9. package/dist/card/card.css +126 -0
  10. package/dist/card/card.d.ts +18 -0
  11. package/dist/card/card.d.ts.map +1 -0
  12. package/dist/card/card.js +38 -0
  13. package/dist/card/card.js.map +1 -0
  14. package/dist/checkbox/checkbox.css +116 -0
  15. package/dist/checkbox/checkbox.d.ts +13 -0
  16. package/dist/checkbox/checkbox.d.ts.map +1 -0
  17. package/dist/checkbox/checkbox.js +32 -0
  18. package/dist/checkbox/checkbox.js.map +1 -0
  19. package/dist/data-table/data-table.css +238 -0
  20. package/dist/data-table/data-table.d.ts +47 -0
  21. package/dist/data-table/data-table.d.ts.map +1 -0
  22. package/dist/data-table/data-table.js +58 -0
  23. package/dist/data-table/data-table.js.map +1 -0
  24. package/dist/divider/divider.css +35 -0
  25. package/dist/divider/divider.d.ts +12 -0
  26. package/dist/divider/divider.d.ts.map +1 -0
  27. package/dist/divider/divider.js +7 -0
  28. package/dist/divider/divider.js.map +1 -0
  29. package/dist/floating-action-button/floating-action-button.css +132 -0
  30. package/dist/floating-action-button/floating-action-button.d.ts +15 -0
  31. package/dist/floating-action-button/floating-action-button.d.ts.map +1 -0
  32. package/dist/floating-action-button/floating-action-button.js +8 -0
  33. package/dist/floating-action-button/floating-action-button.js.map +1 -0
  34. package/dist/index.d.ts +20 -0
  35. package/dist/index.d.ts.map +1 -0
  36. package/dist/index.js +20 -0
  37. package/dist/index.js.map +1 -0
  38. package/dist/list/list.css +181 -0
  39. package/dist/list/list.d.ts +56 -0
  40. package/dist/list/list.d.ts.map +1 -0
  41. package/dist/list/list.js +33 -0
  42. package/dist/list/list.js.map +1 -0
  43. package/dist/menu/menu.css +170 -0
  44. package/dist/menu/menu.d.ts +70 -0
  45. package/dist/menu/menu.d.ts.map +1 -0
  46. package/dist/menu/menu.js +69 -0
  47. package/dist/menu/menu.js.map +1 -0
  48. package/dist/navigation/header/header.css +182 -0
  49. package/dist/navigation/header/header.d.ts +20 -0
  50. package/dist/navigation/header/header.d.ts.map +1 -0
  51. package/dist/navigation/header/header.js +23 -0
  52. package/dist/navigation/header/header.js.map +1 -0
  53. package/dist/navigation/index.d.ts +5 -0
  54. package/dist/navigation/index.d.ts.map +1 -0
  55. package/dist/navigation/index.js +5 -0
  56. package/dist/navigation/index.js.map +1 -0
  57. package/dist/navigation/link/link.d.ts +5 -0
  58. package/dist/navigation/link/link.d.ts.map +1 -0
  59. package/dist/navigation/link/link.js +6 -0
  60. package/dist/navigation/link/link.js.map +1 -0
  61. package/dist/navigation/shell/shell.css +21 -0
  62. package/dist/navigation/shell/shell.d.ts +22 -0
  63. package/dist/navigation/shell/shell.d.ts.map +1 -0
  64. package/dist/navigation/shell/shell.js +15 -0
  65. package/dist/navigation/shell/shell.js.map +1 -0
  66. package/dist/navigation/tabs/tabs.css +390 -0
  67. package/dist/navigation/tabs/tabs.d.ts +37 -0
  68. package/dist/navigation/tabs/tabs.d.ts.map +1 -0
  69. package/dist/navigation/tabs/tabs.js +74 -0
  70. package/dist/navigation/tabs/tabs.js.map +1 -0
  71. package/dist/page/page.css +15 -0
  72. package/dist/page/page.d.ts +32 -0
  73. package/dist/page/page.d.ts.map +1 -0
  74. package/dist/page/page.js +10 -0
  75. package/dist/page/page.js.map +1 -0
  76. package/dist/radio/radio.css +108 -0
  77. package/dist/radio/radio.d.ts +29 -0
  78. package/dist/radio/radio.d.ts.map +1 -0
  79. package/dist/radio/radio.js +23 -0
  80. package/dist/radio/radio.js.map +1 -0
  81. package/dist/runtime/use-display-mode.d.ts +9 -0
  82. package/dist/runtime/use-display-mode.d.ts.map +1 -0
  83. package/dist/runtime/use-display-mode.js +33 -0
  84. package/dist/runtime/use-display-mode.js.map +1 -0
  85. package/dist/runtime/use-keyboard.d.ts +8 -0
  86. package/dist/runtime/use-keyboard.d.ts.map +1 -0
  87. package/dist/runtime/use-keyboard.js +34 -0
  88. package/dist/runtime/use-keyboard.js.map +1 -0
  89. package/dist/runtime/use-viewport-tier.d.ts +10 -0
  90. package/dist/runtime/use-viewport-tier.d.ts.map +1 -0
  91. package/dist/runtime/use-viewport-tier.js +24 -0
  92. package/dist/runtime/use-viewport-tier.js.map +1 -0
  93. package/dist/snackbar/snackbar.css +95 -0
  94. package/dist/snackbar/snackbar.d.ts +15 -0
  95. package/dist/snackbar/snackbar.d.ts.map +1 -0
  96. package/dist/snackbar/snackbar.js +36 -0
  97. package/dist/snackbar/snackbar.js.map +1 -0
  98. package/dist/switch/switch.css +164 -0
  99. package/dist/switch/switch.d.ts +11 -0
  100. package/dist/switch/switch.d.ts.map +1 -0
  101. package/dist/switch/switch.js +11 -0
  102. package/dist/switch/switch.js.map +1 -0
  103. package/dist/tabs/tabs.css +165 -0
  104. package/dist/tabs/tabs.d.ts +25 -0
  105. package/dist/tabs/tabs.d.ts.map +1 -0
  106. package/dist/tabs/tabs.js +81 -0
  107. package/dist/tabs/tabs.js.map +1 -0
  108. package/dist/text/text.css +91 -0
  109. package/dist/text/text.d.ts +12 -0
  110. package/dist/text/text.d.ts.map +1 -0
  111. package/dist/text/text.js +17 -0
  112. package/dist/text/text.js.map +1 -0
  113. package/dist/text-area/text-area.css +11 -0
  114. package/dist/text-area/text-area.d.ts +13 -0
  115. package/dist/text-area/text-area.d.ts.map +1 -0
  116. package/dist/text-area/text-area.js +35 -0
  117. package/dist/text-area/text-area.js.map +1 -0
  118. package/dist/text-field/text-field.css +154 -0
  119. package/dist/text-field/text-field.d.ts +18 -0
  120. package/dist/text-field/text-field.d.ts.map +1 -0
  121. package/dist/text-field/text-field.js +32 -0
  122. package/dist/text-field/text-field.js.map +1 -0
  123. package/package.json +78 -0
@@ -0,0 +1 @@
1
+ {"version":3,"file":"switch.d.ts","sourceRoot":"","sources":["../../src/switch/switch.tsx"],"names":[],"mappings":"AAEA,OAAO,KAAK,EAAE,WAAW,EAAE,qBAAqB,EAAE,SAAS,EAAE,MAAM,OAAO,CAAC;AAE3E,OAAO,cAAc,CAAC;AAEtB,MAAM,WAAW,WACf,SAAQ,IAAI,CAAC,qBAAqB,CAAC,OAAO,CAAC,EAAE,UAAU,GAAG,UAAU,GAAG,MAAM,CAAC;IAC9E,QAAQ,CAAC,WAAW,CAAC,EAAE,SAAS,CAAC;IACjC,QAAQ,CAAC,KAAK,CAAC,EAAE,SAAS,CAAC;IAC3B,QAAQ,CAAC,eAAe,CAAC,EAAE,CAAC,OAAO,EAAE,OAAO,KAAK,IAAI,CAAC;IACtD,QAAQ,CAAC,QAAQ,CAAC,EAAE,CAAC,KAAK,EAAE,WAAW,CAAC,gBAAgB,CAAC,KAAK,IAAI,CAAC;IACnE,QAAQ,CAAC,aAAa,CAAC,EAAE,SAAS,CAAC;CACpC;AAED,wBAAgB,MAAM,CAAC,EACrB,WAAW,EACX,SAAS,EACT,KAAK,EACL,QAAQ,EACR,eAAe,EACf,aAAa,EACb,GAAG,KAAK,EACT,EAAE,WAAW,+BAwBb"}
@@ -0,0 +1,11 @@
1
+ "use client";
2
+ import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
3
+ import "./switch.css";
4
+ export function Switch({ checkedIcon, className, label, onChange, onCheckedChange, uncheckedIcon, ...props }) {
5
+ const classes = ["adj-switch", className].filter(Boolean).join(" ");
6
+ return (_jsxs("label", { className: classes, "data-labeled": String(label !== undefined), children: [_jsx("input", { className: "adj-switch__input", onChange: (event) => {
7
+ onChange?.(event);
8
+ onCheckedChange?.(event.currentTarget.checked);
9
+ }, role: "switch", type: "checkbox", ...props }), _jsx("span", { "aria-hidden": "true", className: "adj-switch__track", children: _jsxs("span", { className: "adj-switch__handle", children: [_jsx("span", { className: "adj-switch__unchecked-icon", children: uncheckedIcon }), _jsx("span", { className: "adj-switch__checked-icon", children: checkedIcon })] }) }), label !== undefined ? _jsx("span", { className: "adj-switch__label", children: label }) : null] }));
10
+ }
11
+ //# sourceMappingURL=switch.js.map
@@ -0,0 +1 @@
1
+ {"version":3,"file":"switch.js","sourceRoot":"","sources":["../../src/switch/switch.tsx"],"names":[],"mappings":"AAAA,YAAY,CAAC;;AAIb,OAAO,cAAc,CAAC;AAWtB,MAAM,UAAU,MAAM,CAAC,EACrB,WAAW,EACX,SAAS,EACT,KAAK,EACL,QAAQ,EACR,eAAe,EACf,aAAa,EACb,GAAG,KAAK,EACI;IACZ,MAAM,OAAO,GAAG,CAAC,YAAY,EAAE,SAAS,CAAC,CAAC,MAAM,CAAC,OAAO,CAAC,CAAC,IAAI,CAAC,GAAG,CAAC,CAAC;IAEpE,OAAO,CACL,iBAAO,SAAS,EAAE,OAAO,kBAAgB,MAAM,CAAC,KAAK,KAAK,SAAS,CAAC,aAClE,gBACE,SAAS,EAAC,mBAAmB,EAC7B,QAAQ,EAAE,CAAC,KAAK,EAAE,EAAE;oBAClB,QAAQ,EAAE,CAAC,KAAK,CAAC,CAAC;oBAClB,eAAe,EAAE,CAAC,KAAK,CAAC,aAAa,CAAC,OAAO,CAAC,CAAC;gBACjD,CAAC,EACD,IAAI,EAAC,QAAQ,EACb,IAAI,EAAC,UAAU,KACX,KAAK,GACT,EACF,8BAAkB,MAAM,EAAC,SAAS,EAAC,mBAAmB,YACpD,gBAAM,SAAS,EAAC,oBAAoB,aAClC,eAAM,SAAS,EAAC,4BAA4B,YAAE,aAAa,GAAQ,EACnE,eAAM,SAAS,EAAC,0BAA0B,YAAE,WAAW,GAAQ,IAC1D,GACF,EACN,KAAK,KAAK,SAAS,CAAC,CAAC,CAAC,eAAM,SAAS,EAAC,mBAAmB,YAAE,KAAK,GAAQ,CAAC,CAAC,CAAC,IAAI,IAC1E,CACT,CAAC;AACJ,CAAC"}
@@ -0,0 +1,165 @@
1
+ @layer components {
2
+ .adj-tabs-root {
3
+ width: 100%;
4
+ max-width: 100%;
5
+ min-width: 0;
6
+ }
7
+
8
+ .adj-tabs-root[data-mode="scrollable"] {
9
+ contain: inline-size;
10
+ }
11
+
12
+ .adj-tabs {
13
+ display: flex;
14
+ width: 100%;
15
+ max-width: 100%;
16
+ min-width: 0;
17
+ overflow: hidden;
18
+ color: var(--adj-tabs-color, var(--muted-foreground, CanvasText));
19
+ background: var(--adj-tabs-background, var(--background, Canvas));
20
+ border-block-end: 1px solid var(--adj-tabs-divider-color, var(--border, color-mix(in srgb, CanvasText 18%, transparent)));
21
+ }
22
+
23
+ .adj-tabs-root[data-mode="scrollable"] .adj-tabs {
24
+ justify-content: flex-start;
25
+ overflow-x: auto;
26
+ overflow-y: hidden;
27
+ overscroll-behavior-inline: contain;
28
+ scroll-snap-type: inline proximity;
29
+ scrollbar-width: none;
30
+ -webkit-overflow-scrolling: touch;
31
+ }
32
+
33
+ .adj-tabs-root[data-mode="scrollable"] .adj-tabs::-webkit-scrollbar {
34
+ display: none;
35
+ }
36
+
37
+ .adj-tab {
38
+ position: relative;
39
+ display: flex;
40
+ gap: 0.5rem;
41
+ align-items: center;
42
+ justify-content: center;
43
+ box-sizing: border-box;
44
+ min-width: 4.5rem;
45
+ max-width: 16.5rem;
46
+ min-height: 3rem;
47
+ padding-inline: 0.75rem;
48
+ color: inherit;
49
+ font: inherit;
50
+ font-size: 0.875rem;
51
+ font-weight: 500;
52
+ white-space: nowrap;
53
+ appearance: none;
54
+ cursor: pointer;
55
+ background: transparent;
56
+ border: 0;
57
+ border-radius: var(--radius-lg, var(--radius, 0.625rem));
58
+ }
59
+
60
+ .adj-tabs-root[data-mode="fixed"] .adj-tabs > .adj-tab {
61
+ flex: 1 1 0;
62
+ max-width: none;
63
+ }
64
+
65
+ .adj-tabs-root[data-mode="scrollable"] .adj-tabs > .adj-tab {
66
+ flex: 0 0 auto;
67
+ max-width: none;
68
+ padding-inline: 1.5rem;
69
+ scroll-snap-align: center;
70
+ }
71
+
72
+ .adj-tab:has(.adj-tab__icon) {
73
+ min-height: 4.5rem;
74
+ flex-direction: column;
75
+ gap: 0.25rem;
76
+ }
77
+
78
+ .adj-tab[data-selected="true"] {
79
+ color: var(--adj-tabs-active-color, var(--primary, CanvasText));
80
+ }
81
+
82
+ .adj-tab::after {
83
+ position: absolute;
84
+ inset-block-end: 0;
85
+ inset-inline-start: 50%;
86
+ width: 0;
87
+ height: 2px;
88
+ content: "";
89
+ background: var(--adj-tabs-indicator-color, var(--primary, CanvasText));
90
+ border-radius:
91
+ var(--radius-sm, max(0px, calc(var(--radius, 0.625rem) - 4px)))
92
+ var(--radius-sm, max(0px, calc(var(--radius, 0.625rem) - 4px))) 0 0;
93
+ transition:
94
+ width 200ms ease,
95
+ inset-inline-start 200ms ease;
96
+ }
97
+
98
+ .adj-tab[data-selected="true"]::after {
99
+ inset-inline-start: calc(50% - 0.75rem);
100
+ width: 1.5rem;
101
+ }
102
+
103
+ .adj-tabs-root[data-variant="secondary"] .adj-tab[data-selected="true"]::after {
104
+ inset-inline-start: 0;
105
+ width: 100%;
106
+ }
107
+
108
+ .adj-tab:hover:not(:disabled) {
109
+ background: color-mix(in srgb, currentColor 8%, transparent);
110
+ }
111
+
112
+ .adj-tab:focus-visible {
113
+ outline: 2px solid var(--ring, currentColor);
114
+ outline-offset: -2px;
115
+ }
116
+
117
+ .adj-tab:disabled {
118
+ cursor: default;
119
+ opacity: 0.38;
120
+ }
121
+
122
+ .adj-tab__icon {
123
+ display: grid;
124
+ width: 1.5rem;
125
+ height: 1.5rem;
126
+ place-items: center;
127
+ }
128
+
129
+ .adj-tab__icon > svg {
130
+ width: 1.5rem;
131
+ height: 1.5rem;
132
+ }
133
+
134
+ .adj-tab__badge {
135
+ display: grid;
136
+ min-width: 1rem;
137
+ height: 1rem;
138
+ padding-inline: 0.25rem;
139
+ color: var(--adj-tabs-badge-color, var(--background, Canvas));
140
+ font-size: 0.625rem;
141
+ line-height: 1;
142
+ background: var(--adj-tabs-badge-background, var(--foreground, CanvasText));
143
+ border-radius: var(--radius-lg, var(--radius, 0.625rem));
144
+ place-items: center;
145
+ }
146
+
147
+ .adj-tab-panel {
148
+ outline: none;
149
+ }
150
+
151
+ .adj-tab-panel:focus-visible {
152
+ outline: 2px solid var(--ring, currentColor);
153
+ outline-offset: -2px;
154
+ }
155
+
156
+ @media (prefers-reduced-motion: reduce) {
157
+ .adj-tabs-root[data-mode="scrollable"] .adj-tabs {
158
+ scroll-behavior: auto;
159
+ }
160
+
161
+ .adj-tab::after {
162
+ transition: none;
163
+ }
164
+ }
165
+ }
@@ -0,0 +1,25 @@
1
+ import { type ButtonHTMLAttributes, type HTMLAttributes, type ReactNode } from "react";
2
+ import "./tabs.css";
3
+ export type TabsMode = "fixed" | "scrollable";
4
+ export type TabsVariant = "primary" | "secondary";
5
+ export interface TabsProps extends Omit<HTMLAttributes<HTMLDivElement>, "onChange"> {
6
+ readonly defaultValue?: string;
7
+ readonly mode?: TabsMode;
8
+ readonly onValueChange?: (value: string) => void;
9
+ readonly value?: string;
10
+ readonly variant?: TabsVariant;
11
+ }
12
+ export declare function Tabs({ children, className, defaultValue, mode, onValueChange, value, variant, ...props }: TabsProps): import("react").JSX.Element;
13
+ export type TabListProps = HTMLAttributes<HTMLDivElement>;
14
+ export declare function TabList({ className, onKeyDown, ...props }: TabListProps): import("react").JSX.Element;
15
+ export interface TabProps extends Omit<ButtonHTMLAttributes<HTMLButtonElement>, "value"> {
16
+ readonly badge?: ReactNode;
17
+ readonly icon?: ReactNode;
18
+ readonly value: string;
19
+ }
20
+ export declare function Tab({ badge, children, className, disabled, icon, onClick, value, ...props }: TabProps): import("react").JSX.Element;
21
+ export interface TabPanelProps extends HTMLAttributes<HTMLDivElement> {
22
+ readonly value: string;
23
+ }
24
+ export declare function TabPanel({ className, value, ...props }: TabPanelProps): import("react").JSX.Element;
25
+ //# sourceMappingURL=tabs.d.ts.map
@@ -0,0 +1 @@
1
+ {"version":3,"file":"tabs.d.ts","sourceRoot":"","sources":["../../src/tabs/tabs.tsx"],"names":[],"mappings":"AAEA,OAAO,EAOL,KAAK,oBAAoB,EACzB,KAAK,cAAc,EAEnB,KAAK,SAAS,EACf,MAAM,OAAO,CAAC;AAEf,OAAO,YAAY,CAAC;AAEpB,MAAM,MAAM,QAAQ,GAAG,OAAO,GAAG,YAAY,CAAC;AAC9C,MAAM,MAAM,WAAW,GAAG,SAAS,GAAG,WAAW,CAAC;AASlD,MAAM,WAAW,SAAU,SAAQ,IAAI,CAAC,cAAc,CAAC,cAAc,CAAC,EAAE,UAAU,CAAC;IACjF,QAAQ,CAAC,YAAY,CAAC,EAAE,MAAM,CAAC;IAC/B,QAAQ,CAAC,IAAI,CAAC,EAAE,QAAQ,CAAC;IACzB,QAAQ,CAAC,aAAa,CAAC,EAAE,CAAC,KAAK,EAAE,MAAM,KAAK,IAAI,CAAC;IACjD,QAAQ,CAAC,KAAK,CAAC,EAAE,MAAM,CAAC;IACxB,QAAQ,CAAC,OAAO,CAAC,EAAE,WAAW,CAAC;CAChC;AAED,wBAAgB,IAAI,CAAC,EACnB,QAAQ,EACR,SAAS,EACT,YAAiB,EACjB,IAAc,EACd,aAAa,EACb,KAAK,EACL,OAAmB,EACnB,GAAG,KAAK,EACT,EAAE,SAAS,+BA6CX;AAED,MAAM,MAAM,YAAY,GAAG,cAAc,CAAC,cAAc,CAAC,CAAC;AAE1D,wBAAgB,OAAO,CAAC,EAAE,SAAS,EAAE,SAAS,EAAE,GAAG,KAAK,EAAE,EAAE,YAAY,+BAoCvE;AAED,MAAM,WAAW,QAAS,SAAQ,IAAI,CAAC,oBAAoB,CAAC,iBAAiB,CAAC,EAAE,OAAO,CAAC;IACtF,QAAQ,CAAC,KAAK,CAAC,EAAE,SAAS,CAAC;IAC3B,QAAQ,CAAC,IAAI,CAAC,EAAE,SAAS,CAAC;IAC1B,QAAQ,CAAC,KAAK,EAAE,MAAM,CAAC;CACxB;AAED,wBAAgB,GAAG,CAAC,EAClB,KAAK,EACL,QAAQ,EACR,SAAS,EACT,QAAQ,EACR,IAAI,EACJ,OAAO,EACP,KAAK,EACL,GAAG,KAAK,EACT,EAAE,QAAQ,+BA6BV;AAED,MAAM,WAAW,aAAc,SAAQ,cAAc,CAAC,cAAc,CAAC;IACnE,QAAQ,CAAC,KAAK,EAAE,MAAM,CAAC;CACxB;AAED,wBAAgB,QAAQ,CAAC,EAAE,SAAS,EAAE,KAAK,EAAE,GAAG,KAAK,EAAE,EAAE,aAAa,+BAqBrE"}
@@ -0,0 +1,81 @@
1
+ "use client";
2
+ import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
3
+ import { Activity, createContext, useContext, useEffect, useRef, useState, } from "react";
4
+ import "./tabs.css";
5
+ const TabsContext = createContext(null);
6
+ export function Tabs({ children, className, defaultValue = "", mode = "fixed", onValueChange, value, variant = "primary", ...props }) {
7
+ const [uncontrolledValue, setUncontrolledValue] = useState(defaultValue);
8
+ const rootRef = useRef(null);
9
+ const selectedValue = value ?? uncontrolledValue;
10
+ const classes = ["adj-tabs-root", className].filter(Boolean).join(" ");
11
+ useEffect(() => {
12
+ if (mode !== "scrollable")
13
+ return;
14
+ const tabList = rootRef.current?.querySelector(':scope > [role="tablist"]');
15
+ const selectedTab = tabList?.querySelector('[role="tab"][aria-selected="true"]');
16
+ selectedTab?.scrollIntoView({
17
+ behavior: window.matchMedia("(prefers-reduced-motion: reduce)").matches
18
+ ? "auto"
19
+ : "smooth",
20
+ block: "nearest",
21
+ inline: "nearest",
22
+ });
23
+ }, [mode, selectedValue]);
24
+ function select(nextValue) {
25
+ if (value === undefined) {
26
+ setUncontrolledValue(nextValue);
27
+ }
28
+ onValueChange?.(nextValue);
29
+ }
30
+ return (_jsx(TabsContext, { value: { select, selectedValue }, children: _jsx("div", { className: classes, "data-mode": mode, "data-variant": variant, ref: rootRef, ...props, children: children }) }));
31
+ }
32
+ export function TabList({ className, onKeyDown, ...props }) {
33
+ const classes = ["adj-tabs", className].filter(Boolean).join(" ");
34
+ function handleKeyDown(event) {
35
+ onKeyDown?.(event);
36
+ if (event.defaultPrevented)
37
+ return;
38
+ const tabs = Array.from(event.currentTarget.querySelectorAll('[role="tab"]:not(:disabled)'));
39
+ const currentIndex = tabs.indexOf(document.activeElement);
40
+ if (currentIndex < 0 || tabs.length === 0)
41
+ return;
42
+ let nextIndex;
43
+ if (event.key === "ArrowRight")
44
+ nextIndex = (currentIndex + 1) % tabs.length;
45
+ if (event.key === "ArrowLeft")
46
+ nextIndex = (currentIndex - 1 + tabs.length) % tabs.length;
47
+ if (event.key === "Home")
48
+ nextIndex = 0;
49
+ if (event.key === "End")
50
+ nextIndex = tabs.length - 1;
51
+ if (nextIndex === undefined)
52
+ return;
53
+ event.preventDefault();
54
+ tabs[nextIndex]?.focus();
55
+ tabs[nextIndex]?.click();
56
+ }
57
+ return (_jsx("div", { "aria-orientation": "horizontal", className: classes, onKeyDown: handleKeyDown, role: "tablist", ...props }));
58
+ }
59
+ export function Tab({ badge, children, className, disabled, icon, onClick, value, ...props }) {
60
+ const context = useContext(TabsContext);
61
+ if (!context) {
62
+ throw new Error("Tab must be rendered inside Tabs.");
63
+ }
64
+ const selected = context.selectedValue === value;
65
+ const classes = ["adj-tab", className].filter(Boolean).join(" ");
66
+ return (_jsxs("button", { "aria-selected": selected, className: classes, "data-selected": String(selected), disabled: disabled, onClick: (event) => {
67
+ onClick?.(event);
68
+ if (!event.defaultPrevented)
69
+ context.select(value);
70
+ }, role: "tab", tabIndex: selected ? 0 : -1, type: "button", ...props, children: [icon !== undefined ? _jsx("span", { className: "adj-tab__icon", children: icon }) : null, _jsx("span", { className: "adj-tab__label", children: children }), badge !== undefined ? _jsx("span", { className: "adj-tab__badge", children: badge }) : null] }));
71
+ }
72
+ export function TabPanel({ className, value, ...props }) {
73
+ const context = useContext(TabsContext);
74
+ if (!context) {
75
+ throw new Error("TabPanel must be rendered inside Tabs.");
76
+ }
77
+ const selected = context.selectedValue === value;
78
+ const classes = ["adj-tab-panel", className].filter(Boolean).join(" ");
79
+ return (_jsx(Activity, { mode: selected ? "visible" : "hidden", children: _jsx("div", { "aria-hidden": !selected, className: classes, "data-selected": String(selected), role: "tabpanel", tabIndex: 0, ...props }) }));
80
+ }
81
+ //# sourceMappingURL=tabs.js.map
@@ -0,0 +1 @@
1
+ {"version":3,"file":"tabs.js","sourceRoot":"","sources":["../../src/tabs/tabs.tsx"],"names":[],"mappings":"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"}
@@ -0,0 +1,91 @@
1
+ @layer components {
2
+ .adj-text {
3
+ margin: 0;
4
+ color: inherit;
5
+ font-family: inherit;
6
+ font-size: var(--adj-text-size);
7
+ font-weight: var(--adj-text-weight, 400);
8
+ letter-spacing: var(--adj-text-tracking, normal);
9
+ line-height: var(--adj-text-line-height);
10
+ }
11
+
12
+ .adj-text[data-variant="display-large"] {
13
+ --adj-text-size: var(--adj-text-display-large-size, 3.5625rem);
14
+ --adj-text-line-height: var(--adj-text-display-large-line-height, 4rem);
15
+ }
16
+
17
+ .adj-text[data-variant="display-medium"] {
18
+ --adj-text-size: var(--adj-text-display-medium-size, 2.8125rem);
19
+ --adj-text-line-height: var(--adj-text-display-medium-line-height, 3.25rem);
20
+ }
21
+
22
+ .adj-text[data-variant="display-small"] {
23
+ --adj-text-size: var(--adj-text-display-small-size, 2.25rem);
24
+ --adj-text-line-height: var(--adj-text-display-small-line-height, 2.75rem);
25
+ }
26
+
27
+ .adj-text[data-variant="headline-large"] {
28
+ --adj-text-size: var(--adj-text-headline-large-size, 2rem);
29
+ --adj-text-line-height: var(--adj-text-headline-large-line-height, 2.5rem);
30
+ }
31
+
32
+ .adj-text[data-variant="headline-medium"] {
33
+ --adj-text-size: var(--adj-text-headline-medium-size, 1.75rem);
34
+ --adj-text-line-height: var(--adj-text-headline-medium-line-height, 2.25rem);
35
+ }
36
+
37
+ .adj-text[data-variant="headline-small"] {
38
+ --adj-text-size: var(--adj-text-headline-small-size, 1.5rem);
39
+ --adj-text-line-height: var(--adj-text-headline-small-line-height, 2rem);
40
+ }
41
+
42
+ .adj-text[data-variant="title-large"] {
43
+ --adj-text-size: var(--adj-text-title-large-size, 1.375rem);
44
+ --adj-text-line-height: var(--adj-text-title-large-line-height, 1.75rem);
45
+ }
46
+
47
+ .adj-text[data-variant="title-medium"] {
48
+ --adj-text-size: var(--adj-text-title-medium-size, 1rem);
49
+ --adj-text-line-height: var(--adj-text-title-medium-line-height, 1.5rem);
50
+ --adj-text-weight: var(--adj-text-title-medium-weight, 500);
51
+ }
52
+
53
+ .adj-text[data-variant="title-small"] {
54
+ --adj-text-size: var(--adj-text-title-small-size, 0.875rem);
55
+ --adj-text-line-height: var(--adj-text-title-small-line-height, 1.25rem);
56
+ --adj-text-weight: var(--adj-text-title-small-weight, 500);
57
+ }
58
+
59
+ .adj-text[data-variant="body-large"] {
60
+ --adj-text-size: var(--adj-text-body-large-size, 1rem);
61
+ --adj-text-line-height: var(--adj-text-body-large-line-height, 1.5rem);
62
+ }
63
+
64
+ .adj-text[data-variant="body-medium"] {
65
+ --adj-text-size: var(--adj-text-body-medium-size, 0.875rem);
66
+ --adj-text-line-height: var(--adj-text-body-medium-line-height, 1.25rem);
67
+ }
68
+
69
+ .adj-text[data-variant="body-small"] {
70
+ --adj-text-size: var(--adj-text-body-small-size, 0.75rem);
71
+ --adj-text-line-height: var(--adj-text-body-small-line-height, 1rem);
72
+ }
73
+
74
+ .adj-text[data-variant="label-large"] {
75
+ --adj-text-size: var(--adj-text-label-large-size, 0.875rem);
76
+ --adj-text-line-height: var(--adj-text-label-large-line-height, 1.25rem);
77
+ --adj-text-weight: var(--adj-text-label-large-weight, 500);
78
+ }
79
+
80
+ .adj-text[data-variant="label-medium"] {
81
+ --adj-text-size: var(--adj-text-label-medium-size, 0.75rem);
82
+ --adj-text-line-height: var(--adj-text-label-medium-line-height, 1rem);
83
+ --adj-text-weight: var(--adj-text-label-medium-weight, 500);
84
+ }
85
+
86
+ .adj-text[data-variant="label-small"] {
87
+ --adj-text-size: var(--adj-text-label-small-size, 0.6875rem);
88
+ --adj-text-line-height: var(--adj-text-label-small-line-height, 1rem);
89
+ --adj-text-weight: var(--adj-text-label-small-weight, 500);
90
+ }
91
+ }
@@ -0,0 +1,12 @@
1
+ import { type ComponentPropsWithoutRef, type CSSProperties, type ElementType } from "react";
2
+ import "./text.css";
3
+ export type TextVariant = "display-large" | "display-medium" | "display-small" | "headline-large" | "headline-medium" | "headline-small" | "title-large" | "title-medium" | "title-small" | "body-large" | "body-medium" | "body-small" | "label-large" | "label-medium" | "label-small";
4
+ type TextOwnProps<TElement extends ElementType> = {
5
+ readonly as?: TElement;
6
+ readonly lineHeight?: CSSProperties["lineHeight"];
7
+ readonly variant?: TextVariant;
8
+ };
9
+ export type TextProps<TElement extends ElementType = "span"> = TextOwnProps<TElement> & Omit<ComponentPropsWithoutRef<TElement>, keyof TextOwnProps<TElement>>;
10
+ export declare function Text<TElement extends ElementType = "span">({ as, className, lineHeight, style, variant, ...props }: TextProps<TElement>): import("react").ReactElement<any, string | import("react").JSXElementConstructor<any>>;
11
+ export {};
12
+ //# sourceMappingURL=text.d.ts.map
@@ -0,0 +1 @@
1
+ {"version":3,"file":"text.d.ts","sourceRoot":"","sources":["../../src/text/text.tsx"],"names":[],"mappings":"AAAA,OAAO,EAEL,KAAK,wBAAwB,EAC7B,KAAK,aAAa,EAClB,KAAK,WAAW,EACjB,MAAM,OAAO,CAAC;AAEf,OAAO,YAAY,CAAC;AAEpB,MAAM,MAAM,WAAW,GACnB,eAAe,GACf,gBAAgB,GAChB,eAAe,GACf,gBAAgB,GAChB,iBAAiB,GACjB,gBAAgB,GAChB,aAAa,GACb,cAAc,GACd,aAAa,GACb,YAAY,GACZ,aAAa,GACb,YAAY,GACZ,aAAa,GACb,cAAc,GACd,aAAa,CAAC;AAElB,KAAK,YAAY,CAAC,QAAQ,SAAS,WAAW,IAAI;IAChD,QAAQ,CAAC,EAAE,CAAC,EAAE,QAAQ,CAAC;IACvB,QAAQ,CAAC,UAAU,CAAC,EAAE,aAAa,CAAC,YAAY,CAAC,CAAC;IAClD,QAAQ,CAAC,OAAO,CAAC,EAAE,WAAW,CAAC;CAChC,CAAC;AAEF,MAAM,MAAM,SAAS,CAAC,QAAQ,SAAS,WAAW,GAAG,MAAM,IACzD,YAAY,CAAC,QAAQ,CAAC,GACtB,IAAI,CAAC,wBAAwB,CAAC,QAAQ,CAAC,EAAE,MAAM,YAAY,CAAC,QAAQ,CAAC,CAAC,CAAC;AAEzE,wBAAgB,IAAI,CAAC,QAAQ,SAAS,WAAW,GAAG,MAAM,EAAE,EAC1D,EAAE,EACF,SAAS,EACT,UAAU,EACV,KAAK,EACL,OAAuB,EACvB,GAAG,KAAK,EACT,EAAE,SAAS,CAAC,QAAQ,CAAC,0FAcrB"}
@@ -0,0 +1,17 @@
1
+ import { createElement, } from "react";
2
+ import "./text.css";
3
+ export function Text({ as, className, lineHeight, style, variant = "body-medium", ...props }) {
4
+ const element = as ?? "span";
5
+ const classes = ["adj-text", className].filter(Boolean).join(" ");
6
+ const resolvedStyle = {
7
+ ...style,
8
+ ...(lineHeight === undefined ? null : { lineHeight }),
9
+ };
10
+ return createElement(element, {
11
+ ...props,
12
+ className: classes,
13
+ "data-variant": variant,
14
+ style: resolvedStyle,
15
+ });
16
+ }
17
+ //# sourceMappingURL=text.js.map
@@ -0,0 +1 @@
1
+ {"version":3,"file":"text.js","sourceRoot":"","sources":["../../src/text/text.tsx"],"names":[],"mappings":"AAAA,OAAO,EACL,aAAa,GAId,MAAM,OAAO,CAAC;AAEf,OAAO,YAAY,CAAC;AA6BpB,MAAM,UAAU,IAAI,CAAwC,EAC1D,EAAE,EACF,SAAS,EACT,UAAU,EACV,KAAK,EACL,OAAO,GAAG,aAAa,EACvB,GAAG,KAAK,EACY;IACpB,MAAM,OAAO,GAAG,EAAE,IAAI,MAAM,CAAC;IAC7B,MAAM,OAAO,GAAG,CAAC,UAAU,EAAE,SAAS,CAAC,CAAC,MAAM,CAAC,OAAO,CAAC,CAAC,IAAI,CAAC,GAAG,CAAC,CAAC;IAClE,MAAM,aAAa,GAAG;QACpB,GAAG,KAAK;QACR,GAAG,CAAC,UAAU,KAAK,SAAS,CAAC,CAAC,CAAC,IAAI,CAAC,CAAC,CAAC,EAAE,UAAU,EAAE,CAAC;KACrC,CAAC;IAEnB,OAAO,aAAa,CAAC,OAAO,EAAE;QAC5B,GAAG,KAAK;QACR,SAAS,EAAE,OAAO;QAClB,cAAc,EAAE,OAAO;QACvB,KAAK,EAAE,aAAa;KACrB,CAAC,CAAC;AACL,CAAC"}
@@ -0,0 +1,11 @@
1
+ @layer components {
2
+ .adj-text-area .adj-text-field__container {
3
+ align-items: stretch;
4
+ }
5
+
6
+ .adj-text-area__input {
7
+ height: auto;
8
+ min-height: var(--adj-text-area-height, 6rem);
9
+ resize: vertical;
10
+ }
11
+ }
@@ -0,0 +1,13 @@
1
+ import { type ReactNode, type TextareaHTMLAttributes } from "react";
2
+ import type { TextFieldVariant } from "../text-field/text-field.js";
3
+ import "../text-field/text-field.css";
4
+ import "./text-area.css";
5
+ export interface TextAreaProps extends TextareaHTMLAttributes<HTMLTextAreaElement> {
6
+ readonly error?: ReactNode;
7
+ readonly label: ReactNode;
8
+ readonly showCounter?: boolean;
9
+ readonly supportingText?: ReactNode;
10
+ readonly variant?: TextFieldVariant;
11
+ }
12
+ export declare function TextArea({ "aria-describedby": ariaDescribedBy, className, defaultValue, disabled, error, id, label, maxLength, onChange, readOnly, required, rows, showCounter, supportingText, value, variant, ...props }: TextAreaProps): import("react").JSX.Element;
13
+ //# sourceMappingURL=text-area.d.ts.map
@@ -0,0 +1 @@
1
+ {"version":3,"file":"text-area.d.ts","sourceRoot":"","sources":["../../src/text-area/text-area.tsx"],"names":[],"mappings":"AAEA,OAAO,EAIL,KAAK,SAAS,EACd,KAAK,sBAAsB,EAC5B,MAAM,OAAO,CAAC;AAGf,OAAO,KAAK,EAAE,gBAAgB,EAAE,MAAM,6BAA6B,CAAC;AAEpE,OAAO,8BAA8B,CAAC;AACtC,OAAO,iBAAiB,CAAC;AAEzB,MAAM,WAAW,aACf,SAAQ,sBAAsB,CAAC,mBAAmB,CAAC;IACnD,QAAQ,CAAC,KAAK,CAAC,EAAE,SAAS,CAAC;IAC3B,QAAQ,CAAC,KAAK,EAAE,SAAS,CAAC;IAC1B,QAAQ,CAAC,WAAW,CAAC,EAAE,OAAO,CAAC;IAC/B,QAAQ,CAAC,cAAc,CAAC,EAAE,SAAS,CAAC;IACpC,QAAQ,CAAC,OAAO,CAAC,EAAE,gBAAgB,CAAC;CACrC;AAOD,wBAAgB,QAAQ,CAAC,EACvB,kBAAkB,EAAE,eAAe,EACnC,SAAS,EACT,YAAY,EACZ,QAAQ,EACR,KAAK,EACL,EAAE,EACF,KAAK,EACL,SAAS,EACT,QAAQ,EACR,QAAQ,EACR,QAAQ,EACR,IAAQ,EACR,WAAmB,EACnB,cAAc,EACd,KAAK,EACL,OAAoB,EACpB,GAAG,KAAK,EACT,EAAE,aAAa,+BA+Ef"}
@@ -0,0 +1,35 @@
1
+ "use client";
2
+ import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
3
+ import { useId, useState, } from "react";
4
+ import { Text } from "../text/text.js";
5
+ import "../text-field/text-field.css";
6
+ import "./text-area.css";
7
+ function valueLength(value) {
8
+ if (value === undefined || value === null)
9
+ return 0;
10
+ return String(value).length;
11
+ }
12
+ export function TextArea({ "aria-describedby": ariaDescribedBy, className, defaultValue, disabled, error, id, label, maxLength, onChange, readOnly, required, rows = 4, showCounter = false, supportingText, value, variant = "outlined", ...props }) {
13
+ const generatedId = useId();
14
+ const inputId = id ?? `adj-text-area-${generatedId}`;
15
+ const supportingId = `${inputId}-supporting`;
16
+ const [uncontrolledLength, setUncontrolledLength] = useState(valueLength(defaultValue));
17
+ const controlled = value !== undefined;
18
+ const currentLength = controlled ? valueLength(value) : uncontrolledLength;
19
+ const hasError = error !== undefined && error !== null && error !== false;
20
+ const supportingContent = hasError ? error : supportingText;
21
+ const hasSupportingRow = supportingContent !== undefined || showCounter;
22
+ const describedBy = [ariaDescribedBy, hasSupportingRow ? supportingId : undefined]
23
+ .filter(Boolean)
24
+ .join(" ") || undefined;
25
+ const classes = ["adj-text-field", "adj-text-area", className]
26
+ .filter(Boolean)
27
+ .join(" ");
28
+ function handleChange(event) {
29
+ if (!controlled)
30
+ setUncontrolledLength(event.currentTarget.value.length);
31
+ onChange?.(event);
32
+ }
33
+ return (_jsxs("div", { className: classes, "data-disabled": disabled ? "true" : "false", "data-error": hasError ? "true" : "false", "data-read-only": readOnly ? "true" : "false", "data-variant": variant, children: [_jsxs(Text, { as: "label", className: "adj-text-field__label", htmlFor: inputId, variant: "label-large", children: [label, required ? _jsx("span", { "aria-hidden": "true", children: " *" }) : null] }), _jsx("div", { className: "adj-text-field__container", children: _jsx("textarea", { "aria-describedby": describedBy, "aria-invalid": hasError || undefined, className: "adj-text-field__input adj-text-area__input", defaultValue: defaultValue, disabled: disabled, id: inputId, maxLength: maxLength, onChange: handleChange, readOnly: readOnly, required: required, rows: rows, value: value, ...props }) }), hasSupportingRow ? (_jsxs("div", { className: "adj-text-field__supporting", id: supportingId, children: [_jsx(Text, { "aria-live": hasError ? "polite" : undefined, className: "adj-text-field__supporting-text", variant: "body-small", children: supportingContent }), showCounter ? (_jsxs(Text, { className: "adj-text-field__counter", variant: "body-small", children: [currentLength, maxLength === undefined ? null : `/${maxLength}`] })) : null] })) : null] }));
34
+ }
35
+ //# sourceMappingURL=text-area.js.map
@@ -0,0 +1 @@
1
+ {"version":3,"file":"text-area.js","sourceRoot":"","sources":["../../src/text-area/text-area.tsx"],"names":[],"mappings":"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"}