tembro 2.0.3 → 2.0.4

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 (239) hide show
  1. package/dist/components/display/index.cjs +1 -1
  2. package/dist/components/display/index.d.ts +0 -5
  3. package/dist/components/display/index.js +22 -27
  4. package/dist/components/form/demo.cjs +1 -1
  5. package/dist/components/form/demo.js +1 -2
  6. package/dist/components/form/index.cjs +1 -1
  7. package/dist/components/form/index.d.ts +0 -1
  8. package/dist/components/form/index.js +8 -9
  9. package/dist/components/form/public.cjs +1 -1
  10. package/dist/components/form/public.d.ts +0 -1
  11. package/dist/components/form/public.js +8 -9
  12. package/dist/components/inputs/index.cjs +1 -1
  13. package/dist/components/inputs/index.d.ts +0 -2
  14. package/dist/components/inputs/index.js +3 -5
  15. package/dist/components/inputs/public.cjs +1 -1
  16. package/dist/components/inputs/public.d.ts +0 -2
  17. package/dist/components/inputs/public.js +3 -5
  18. package/dist/components/layout/index.cjs +1 -1
  19. package/dist/components/layout/index.d.ts +0 -1
  20. package/dist/components/layout/index.js +4 -5
  21. package/dist/components/layout/public.cjs +1 -1
  22. package/dist/components/layout/public.d.ts +0 -1
  23. package/dist/components/layout/public.js +2 -3
  24. package/dist/components/modern/index.cjs +1 -1
  25. package/dist/components/modern/index.d.ts +0 -4
  26. package/dist/components/modern/index.js +12 -16
  27. package/dist/index.cjs +1 -1
  28. package/dist/index.js +117 -130
  29. package/dist/public-component-surface.cjs +1 -1
  30. package/dist/public-component-surface.js +0 -65
  31. package/dist/showcase/fallback.cjs +3 -3
  32. package/dist/showcase/fallback.js +140 -314
  33. package/dist/showcase/premium/index.cjs +1 -1
  34. package/dist/showcase/premium/index.js +431 -497
  35. package/dist/showcase/registry-quality.cjs +1 -1
  36. package/dist/showcase/registry-quality.js +0 -1
  37. package/dist/showcase/tembro-registry.json.cjs +1 -1
  38. package/dist/showcase/tembro-registry.json.js +3 -11
  39. package/package.json +1 -1
  40. package/packages/cli/dist/index.cjs +2 -2
  41. package/packages/cli/vendor/src/components/display/index.ts +0 -5
  42. package/packages/cli/vendor/src/components/form/demo.tsx +0 -1
  43. package/packages/cli/vendor/src/components/form/index.ts +0 -1
  44. package/packages/cli/vendor/src/components/form/public.ts +0 -2
  45. package/packages/cli/vendor/src/components/inputs/index.ts +0 -2
  46. package/packages/cli/vendor/src/components/inputs/public.ts +0 -2
  47. package/packages/cli/vendor/src/components/layout/index.ts +0 -1
  48. package/packages/cli/vendor/src/components/layout/public.ts +0 -1
  49. package/packages/cli/vendor/src/components/modern/index.ts +1 -5
  50. package/packages/cli/vendor/src/public-component-surface.ts +0 -13
  51. package/packages/cli/vendor/src/showcase/fallback.tsx +3 -164
  52. package/packages/cli/vendor/src/showcase/premium/index.ts +0 -22
  53. package/packages/cli/vendor/src/showcase/registry-quality.ts +0 -2
  54. package/packages/cli/vendor/src/showcase/tembro-registry.json +224 -251
  55. package/registry.json +296 -324
  56. package/dist/components/display/aspect-ratio.cjs +0 -1
  57. package/dist/components/display/aspect-ratio.d.ts +0 -6
  58. package/dist/components/display/aspect-ratio.js +0 -21
  59. package/dist/components/display/float-button.cjs +0 -1
  60. package/dist/components/display/float-button.d.ts +0 -6
  61. package/dist/components/display/float-button.js +0 -20
  62. package/dist/components/display/key-value-card.cjs +0 -1
  63. package/dist/components/display/key-value-card.d.ts +0 -16
  64. package/dist/components/display/key-value-card.js +0 -35
  65. package/dist/components/display/keyboard-shortcut.cjs +0 -1
  66. package/dist/components/display/keyboard-shortcut.d.ts +0 -7
  67. package/dist/components/display/keyboard-shortcut.js +0 -18
  68. package/dist/components/display/skeleton-form.cjs +0 -1
  69. package/dist/components/display/skeleton-form.d.ts +0 -9
  70. package/dist/components/display/skeleton-form.js +0 -31
  71. package/dist/components/display/skeleton-table.cjs +0 -1
  72. package/dist/components/display/skeleton-table.d.ts +0 -9
  73. package/dist/components/display/skeleton-table.js +0 -42
  74. package/dist/components/display/tag-list.cjs +0 -1
  75. package/dist/components/display/tag-list.d.ts +0 -17
  76. package/dist/components/display/tag-list.js +0 -30
  77. package/dist/components/display/watermark.cjs +0 -1
  78. package/dist/components/display/watermark.d.ts +0 -6
  79. package/dist/components/display/watermark.js +0 -23
  80. package/dist/components/form/repeater-field.cjs +0 -1
  81. package/dist/components/form/repeater-field.d.ts +0 -16
  82. package/dist/components/form/repeater-field.js +0 -48
  83. package/dist/components/inputs/cascader.cjs +0 -1
  84. package/dist/components/inputs/cascader.d.ts +0 -13
  85. package/dist/components/inputs/cascader.js +0 -58
  86. package/dist/components/inputs/mention-input.cjs +0 -1
  87. package/dist/components/inputs/mention-input.d.ts +0 -18
  88. package/dist/components/inputs/mention-input.js +0 -96
  89. package/dist/components/layout/stack.cjs +0 -1
  90. package/dist/components/layout/stack.d.ts +0 -23
  91. package/dist/components/layout/stack.js +0 -57
  92. package/dist/components/modern/affix.cjs +0 -1
  93. package/dist/components/modern/affix.d.ts +0 -7
  94. package/dist/components/modern/affix.js +0 -18
  95. package/dist/showcase/premium/affix/index.cjs +0 -1
  96. package/dist/showcase/premium/affix/index.d.ts +0 -2
  97. package/dist/showcase/premium/affix/index.js +0 -3
  98. package/dist/showcase/premium/affix/mock.cjs +0 -12
  99. package/dist/showcase/premium/affix/mock.d.ts +0 -2
  100. package/dist/showcase/premium/affix/mock.js +0 -15
  101. package/dist/showcase/premium/affix/showcase.cjs +0 -1
  102. package/dist/showcase/premium/affix/showcase.d.ts +0 -2
  103. package/dist/showcase/premium/affix/showcase.js +0 -64
  104. package/dist/showcase/premium/aspect-ratio/index.cjs +0 -1
  105. package/dist/showcase/premium/aspect-ratio/index.d.ts +0 -2
  106. package/dist/showcase/premium/aspect-ratio/index.js +0 -3
  107. package/dist/showcase/premium/aspect-ratio/mock.cjs +0 -11
  108. package/dist/showcase/premium/aspect-ratio/mock.d.ts +0 -2
  109. package/dist/showcase/premium/aspect-ratio/mock.js +0 -26
  110. package/dist/showcase/premium/aspect-ratio/showcase.cjs +0 -1
  111. package/dist/showcase/premium/aspect-ratio/showcase.d.ts +0 -2
  112. package/dist/showcase/premium/aspect-ratio/showcase.js +0 -53
  113. package/dist/showcase/premium/cascader/index.cjs +0 -1
  114. package/dist/showcase/premium/cascader/index.d.ts +0 -2
  115. package/dist/showcase/premium/cascader/index.js +0 -3
  116. package/dist/showcase/premium/cascader/mock.cjs +0 -9
  117. package/dist/showcase/premium/cascader/mock.d.ts +0 -2
  118. package/dist/showcase/premium/cascader/mock.js +0 -19
  119. package/dist/showcase/premium/cascader/showcase.cjs +0 -1
  120. package/dist/showcase/premium/cascader/showcase.d.ts +0 -2
  121. package/dist/showcase/premium/cascader/showcase.js +0 -43
  122. package/dist/showcase/premium/float-button/index.cjs +0 -1
  123. package/dist/showcase/premium/float-button/index.d.ts +0 -2
  124. package/dist/showcase/premium/float-button/index.js +0 -3
  125. package/dist/showcase/premium/float-button/mock.cjs +0 -10
  126. package/dist/showcase/premium/float-button/mock.d.ts +0 -2
  127. package/dist/showcase/premium/float-button/mock.js +0 -15
  128. package/dist/showcase/premium/float-button/showcase.cjs +0 -1
  129. package/dist/showcase/premium/float-button/showcase.d.ts +0 -2
  130. package/dist/showcase/premium/float-button/showcase.js +0 -28
  131. package/dist/showcase/premium/keyboard-shortcut/index.cjs +0 -1
  132. package/dist/showcase/premium/keyboard-shortcut/index.d.ts +0 -2
  133. package/dist/showcase/premium/keyboard-shortcut/index.js +0 -3
  134. package/dist/showcase/premium/keyboard-shortcut/mock.cjs +0 -5
  135. package/dist/showcase/premium/keyboard-shortcut/mock.d.ts +0 -2
  136. package/dist/showcase/premium/keyboard-shortcut/mock.js +0 -26
  137. package/dist/showcase/premium/keyboard-shortcut/showcase.cjs +0 -1
  138. package/dist/showcase/premium/keyboard-shortcut/showcase.d.ts +0 -1
  139. package/dist/showcase/premium/keyboard-shortcut/showcase.js +0 -64
  140. package/dist/showcase/premium/mention-input/index.cjs +0 -1
  141. package/dist/showcase/premium/mention-input/index.d.ts +0 -2
  142. package/dist/showcase/premium/mention-input/index.js +0 -3
  143. package/dist/showcase/premium/mention-input/mock.cjs +0 -11
  144. package/dist/showcase/premium/mention-input/mock.d.ts +0 -2
  145. package/dist/showcase/premium/mention-input/mock.js +0 -19
  146. package/dist/showcase/premium/mention-input/showcase.cjs +0 -1
  147. package/dist/showcase/premium/mention-input/showcase.d.ts +0 -2
  148. package/dist/showcase/premium/mention-input/showcase.js +0 -35
  149. package/dist/showcase/premium/skeleton-form/index.cjs +0 -1
  150. package/dist/showcase/premium/skeleton-form/index.d.ts +0 -2
  151. package/dist/showcase/premium/skeleton-form/index.js +0 -3
  152. package/dist/showcase/premium/skeleton-form/mock.cjs +0 -5
  153. package/dist/showcase/premium/skeleton-form/mock.d.ts +0 -2
  154. package/dist/showcase/premium/skeleton-form/mock.js +0 -19
  155. package/dist/showcase/premium/skeleton-form/showcase.cjs +0 -1
  156. package/dist/showcase/premium/skeleton-form/showcase.d.ts +0 -2
  157. package/dist/showcase/premium/skeleton-form/showcase.js +0 -52
  158. package/dist/showcase/premium/skeleton-table/index.cjs +0 -1
  159. package/dist/showcase/premium/skeleton-table/index.d.ts +0 -2
  160. package/dist/showcase/premium/skeleton-table/index.js +0 -3
  161. package/dist/showcase/premium/skeleton-table/mock.cjs +0 -5
  162. package/dist/showcase/premium/skeleton-table/mock.d.ts +0 -2
  163. package/dist/showcase/premium/skeleton-table/mock.js +0 -19
  164. package/dist/showcase/premium/skeleton-table/showcase.cjs +0 -1
  165. package/dist/showcase/premium/skeleton-table/showcase.d.ts +0 -2
  166. package/dist/showcase/premium/skeleton-table/showcase.js +0 -59
  167. package/dist/showcase/premium/stack/index.cjs +0 -1
  168. package/dist/showcase/premium/stack/index.d.ts +0 -2
  169. package/dist/showcase/premium/stack/index.js +0 -3
  170. package/dist/showcase/premium/stack/mock.cjs +0 -10
  171. package/dist/showcase/premium/stack/mock.d.ts +0 -2
  172. package/dist/showcase/premium/stack/mock.js +0 -26
  173. package/dist/showcase/premium/stack/showcase.cjs +0 -1
  174. package/dist/showcase/premium/stack/showcase.d.ts +0 -1
  175. package/dist/showcase/premium/stack/showcase.js +0 -47
  176. package/dist/showcase/premium/tag-list/index.cjs +0 -1
  177. package/dist/showcase/premium/tag-list/index.d.ts +0 -2
  178. package/dist/showcase/premium/tag-list/index.js +0 -3
  179. package/dist/showcase/premium/tag-list/mock.cjs +0 -12
  180. package/dist/showcase/premium/tag-list/mock.d.ts +0 -2
  181. package/dist/showcase/premium/tag-list/mock.js +0 -26
  182. package/dist/showcase/premium/tag-list/showcase.cjs +0 -1
  183. package/dist/showcase/premium/tag-list/showcase.d.ts +0 -2
  184. package/dist/showcase/premium/tag-list/showcase.js +0 -83
  185. package/dist/showcase/premium/watermark/index.cjs +0 -1
  186. package/dist/showcase/premium/watermark/index.d.ts +0 -2
  187. package/dist/showcase/premium/watermark/index.js +0 -3
  188. package/dist/showcase/premium/watermark/mock.cjs +0 -11
  189. package/dist/showcase/premium/watermark/mock.d.ts +0 -2
  190. package/dist/showcase/premium/watermark/mock.js +0 -26
  191. package/dist/showcase/premium/watermark/showcase.cjs +0 -1
  192. package/dist/showcase/premium/watermark/showcase.d.ts +0 -2
  193. package/dist/showcase/premium/watermark/showcase.js +0 -34
  194. package/packages/cli/vendor/src/components/display/aspect-ratio.tsx +0 -22
  195. package/packages/cli/vendor/src/components/display/float-button.tsx +0 -27
  196. package/packages/cli/vendor/src/components/display/key-value-card.tsx +0 -50
  197. package/packages/cli/vendor/src/components/display/keyboard-shortcut.tsx +0 -31
  198. package/packages/cli/vendor/src/components/display/skeleton-form.tsx +0 -51
  199. package/packages/cli/vendor/src/components/display/skeleton-table.tsx +0 -59
  200. package/packages/cli/vendor/src/components/display/tag-list.tsx +0 -52
  201. package/packages/cli/vendor/src/components/display/watermark.tsx +0 -20
  202. package/packages/cli/vendor/src/components/form/repeater-field.tsx +0 -93
  203. package/packages/cli/vendor/src/components/inputs/cascader.tsx +0 -41
  204. package/packages/cli/vendor/src/components/inputs/mention-input.tsx +0 -162
  205. package/packages/cli/vendor/src/components/layout/stack.tsx +0 -106
  206. package/packages/cli/vendor/src/components/modern/affix.tsx +0 -21
  207. package/packages/cli/vendor/src/showcase/premium/affix/index.ts +0 -3
  208. package/packages/cli/vendor/src/showcase/premium/affix/mock.ts +0 -26
  209. package/packages/cli/vendor/src/showcase/premium/affix/showcase.tsx +0 -37
  210. package/packages/cli/vendor/src/showcase/premium/aspect-ratio/index.ts +0 -2
  211. package/packages/cli/vendor/src/showcase/premium/aspect-ratio/mock.ts +0 -26
  212. package/packages/cli/vendor/src/showcase/premium/aspect-ratio/showcase.tsx +0 -37
  213. package/packages/cli/vendor/src/showcase/premium/cascader/index.ts +0 -3
  214. package/packages/cli/vendor/src/showcase/premium/cascader/mock.ts +0 -24
  215. package/packages/cli/vendor/src/showcase/premium/cascader/showcase.tsx +0 -20
  216. package/packages/cli/vendor/src/showcase/premium/float-button/index.ts +0 -3
  217. package/packages/cli/vendor/src/showcase/premium/float-button/mock.ts +0 -24
  218. package/packages/cli/vendor/src/showcase/premium/float-button/showcase.tsx +0 -21
  219. package/packages/cli/vendor/src/showcase/premium/keyboard-shortcut/index.ts +0 -2
  220. package/packages/cli/vendor/src/showcase/premium/keyboard-shortcut/mock.ts +0 -20
  221. package/packages/cli/vendor/src/showcase/premium/keyboard-shortcut/showcase.tsx +0 -42
  222. package/packages/cli/vendor/src/showcase/premium/mention-input/index.ts +0 -3
  223. package/packages/cli/vendor/src/showcase/premium/mention-input/mock.ts +0 -26
  224. package/packages/cli/vendor/src/showcase/premium/mention-input/showcase.tsx +0 -27
  225. package/packages/cli/vendor/src/showcase/premium/skeleton-form/index.ts +0 -3
  226. package/packages/cli/vendor/src/showcase/premium/skeleton-form/mock.ts +0 -20
  227. package/packages/cli/vendor/src/showcase/premium/skeleton-form/showcase.tsx +0 -34
  228. package/packages/cli/vendor/src/showcase/premium/skeleton-table/index.ts +0 -3
  229. package/packages/cli/vendor/src/showcase/premium/skeleton-table/mock.ts +0 -20
  230. package/packages/cli/vendor/src/showcase/premium/skeleton-table/showcase.tsx +0 -37
  231. package/packages/cli/vendor/src/showcase/premium/stack/index.ts +0 -2
  232. package/packages/cli/vendor/src/showcase/premium/stack/mock.ts +0 -25
  233. package/packages/cli/vendor/src/showcase/premium/stack/showcase.tsx +0 -22
  234. package/packages/cli/vendor/src/showcase/premium/tag-list/index.ts +0 -2
  235. package/packages/cli/vendor/src/showcase/premium/tag-list/mock.ts +0 -27
  236. package/packages/cli/vendor/src/showcase/premium/tag-list/showcase.tsx +0 -55
  237. package/packages/cli/vendor/src/showcase/premium/watermark/index.ts +0 -2
  238. package/packages/cli/vendor/src/showcase/premium/watermark/mock.ts +0 -26
  239. package/packages/cli/vendor/src/showcase/premium/watermark/showcase.tsx +0 -26
@@ -1,23 +0,0 @@
1
- import * as React from "react";
2
- type StackGap = "xs" | "sm" | "md" | "lg" | "xl";
3
- type InlineAlign = "start" | "center" | "end" | "stretch";
4
- type InlineJustify = "start" | "center" | "end" | "between";
5
- type GridColumns = 1 | 2 | 3 | 4 | 5 | 6;
6
- export type StackProps = React.ComponentProps<"div"> & {
7
- gap?: StackGap;
8
- splitAfter?: React.ReactNode;
9
- };
10
- declare function Stack({ gap, splitAfter, className, children, ...props }: StackProps): React.JSX.Element;
11
- export type InlineProps = React.ComponentProps<"div"> & {
12
- gap?: StackGap;
13
- align?: InlineAlign;
14
- justify?: InlineJustify;
15
- wrap?: boolean;
16
- };
17
- export type GridProps = React.ComponentProps<"div"> & {
18
- gap?: StackGap;
19
- columns?: GridColumns;
20
- };
21
- declare function Inline({ gap, align, justify, wrap, className, children, ...props }: InlineProps): React.JSX.Element;
22
- declare function Grid({ gap, columns, className, children, ...props }: GridProps): React.JSX.Element;
23
- export { Grid, Inline, Stack };
@@ -1,57 +0,0 @@
1
- import { cn as e } from "../../lib/utils.js";
2
- import "react";
3
- import { jsx as t, jsxs as n } from "react/jsx-runtime";
4
- //#region src/components/layout/stack.tsx
5
- var r = {
6
- xs: "gap-2",
7
- sm: "gap-3",
8
- md: "gap-4",
9
- lg: "gap-6",
10
- xl: "gap-8"
11
- }, i = {
12
- start: "items-start",
13
- center: "items-center",
14
- end: "items-end",
15
- stretch: "items-stretch"
16
- }, a = {
17
- start: "justify-start",
18
- center: "justify-center",
19
- end: "justify-end",
20
- between: "justify-between"
21
- }, o = {
22
- 1: "grid-cols-1",
23
- 2: "grid-cols-2",
24
- 3: "grid-cols-3",
25
- 4: "grid-cols-4",
26
- 5: "grid-cols-5",
27
- 6: "grid-cols-6"
28
- };
29
- function s({ gap: i = "md", splitAfter: a, className: o, children: s, ...c }) {
30
- return /* @__PURE__ */ n("div", {
31
- "data-slot": "stack",
32
- className: e("flex min-w-0 flex-col", r[i], o),
33
- ...c,
34
- children: [s, a ? /* @__PURE__ */ t("div", {
35
- "data-slot": "stack-split-after",
36
- children: a
37
- }) : null]
38
- });
39
- }
40
- function c({ gap: n = "md", align: o = "center", justify: s = "start", wrap: c = !0, className: l, children: u, ...d }) {
41
- return /* @__PURE__ */ t("div", {
42
- "data-slot": "inline",
43
- className: e("flex min-w-0", r[n], i[o], a[s], c ? "flex-wrap" : "flex-nowrap", l),
44
- ...d,
45
- children: u
46
- });
47
- }
48
- function l({ gap: n = "md", columns: i = 2, className: a, children: s, ...c }) {
49
- return /* @__PURE__ */ t("div", {
50
- "data-slot": "grid",
51
- className: e("grid min-w-0", r[n], o[i], a),
52
- ...c,
53
- children: s
54
- });
55
- }
56
- //#endregion
57
- export { l as Grid, c as Inline, s as Stack };
@@ -1 +0,0 @@
1
- Object.defineProperty(exports,Symbol.toStringTag,{value:`Module`});const e=require("../../_virtual/_rolldown/runtime.cjs"),t=require("../../lib/utils.cjs");let n=require("react");n=e.__toESM(n,1);let r=require("react/jsx-runtime");function i({offsetTop:e=0,zIndex:n=30,className:i,style:a,...o}){return(0,r.jsx)(`div`,{"data-slot":`affix`,className:t.cn(`sticky`,i),style:{top:e,zIndex:n,...a},...o})}exports.Affix=i;
@@ -1,7 +0,0 @@
1
- import * as React from "react";
2
- export type AffixProps = React.ComponentProps<"div"> & {
3
- offsetTop?: number;
4
- zIndex?: number;
5
- };
6
- declare function Affix({ offsetTop, zIndex, className, style, ...props }: AffixProps): React.JSX.Element;
7
- export { Affix };
@@ -1,18 +0,0 @@
1
- import { cn as e } from "../../lib/utils.js";
2
- import "react";
3
- import { jsx as t } from "react/jsx-runtime";
4
- //#region src/components/modern/affix.tsx
5
- function n({ offsetTop: n = 0, zIndex: r = 30, className: i, style: a, ...o }) {
6
- return /* @__PURE__ */ t("div", {
7
- "data-slot": "affix",
8
- className: e("sticky", i),
9
- style: {
10
- top: n,
11
- zIndex: r,
12
- ...a
13
- },
14
- ...o
15
- });
16
- }
17
- //#endregion
18
- export { n as Affix };
@@ -1 +0,0 @@
1
- Object.defineProperty(exports,Symbol.toStringTag,{value:`Module`});const e=require("./mock.cjs"),t=require("./showcase.cjs");exports.AffixShowcase=t.AffixShowcase,exports.affixMock=e.affixMock;
@@ -1,2 +0,0 @@
1
- export { affixMock } from "./mock";
2
- export { AffixShowcase } from "./showcase";
@@ -1,3 +0,0 @@
1
- import { affixMock as e } from "./mock.js";
2
- import { AffixShowcase as t } from "./showcase.js";
3
- export { t as AffixShowcase, e as affixMock };
@@ -1,12 +0,0 @@
1
- Object.defineProperty(exports,Symbol.toStringTag,{value:`Module`});var e={code:`import { Affix } from "@/index"
2
-
3
- export function Example() {
4
- return (
5
- <div className="relative h-48 overflow-y-auto border p-3">
6
- <Affix offsetTop={12} zIndex={40} className="bg-primary text-primary-foreground px-3 py-2">
7
- Sticky header
8
- </Affix>
9
- <p className="pt-10">Scroll inside container to test sticky placement.</p>
10
- </div>
11
- )
12
- }`,cliCommand:`npx tembro add affix`,highlights:[`Pin content to an offset within a scrollable container`,`Simple API with top and z-index control`],scenarios:[{title:`Toolbar`,description:`Keep action buttons visible while users scroll long forms.`},{title:`Quick filters`,description:`Keep filters always reachable in long list pages.`}]};exports.affixMock=e;
@@ -1,2 +0,0 @@
1
- import type { ComponentDemoMock } from "../types";
2
- export declare const affixMock: ComponentDemoMock;
@@ -1,15 +0,0 @@
1
- //#region src/showcase/premium/affix/mock.ts
2
- var e = {
3
- code: "import { Affix } from \"@/index\"\n\nexport function Example() {\n return (\n <div className=\"relative h-48 overflow-y-auto border p-3\">\n <Affix offsetTop={12} zIndex={40} className=\"bg-primary text-primary-foreground px-3 py-2\">\n Sticky header\n </Affix>\n <p className=\"pt-10\">Scroll inside container to test sticky placement.</p>\n </div>\n )\n}",
4
- cliCommand: "npx tembro add affix",
5
- highlights: ["Pin content to an offset within a scrollable container", "Simple API with top and z-index control"],
6
- scenarios: [{
7
- title: "Toolbar",
8
- description: "Keep action buttons visible while users scroll long forms."
9
- }, {
10
- title: "Quick filters",
11
- description: "Keep filters always reachable in long list pages."
12
- }]
13
- };
14
- //#endregion
15
- export { e as affixMock };
@@ -1 +0,0 @@
1
- Object.defineProperty(exports,Symbol.toStringTag,{value:`Module`});const e=require("../../../_virtual/_rolldown/runtime.cjs"),t=require("../../../components/modern/affix.cjs");let n=require("react");n=e.__toESM(n,1);let r=require("react/jsx-runtime");function i(){let[e,i]=n.useState(0),[a,o]=n.useState(40);return(0,r.jsxs)(`div`,{className:`space-y-4`,children:[(0,r.jsxs)(`div`,{className:`flex flex-wrap gap-2`,children:[(0,r.jsx)(`button`,{type:`button`,className:`rounded-md border px-2.5 py-1 text-sm`,onClick:()=>i(e=>Math.max(0,e-8)),children:`Offset -8`}),(0,r.jsx)(`button`,{type:`button`,className:`rounded-md border px-2.5 py-1 text-sm`,onClick:()=>i(e=>e+8),children:`Offset +8`}),(0,r.jsx)(`button`,{type:`button`,className:`rounded-md border px-2.5 py-1 text-sm`,onClick:()=>o(e=>e===30?80:30),children:`Toggle z-index`})]}),(0,r.jsxs)(`p`,{className:`text-sm text-muted-foreground`,children:[`Current settings: offsetTop=`,e,`, zIndex=`,a]}),(0,r.jsx)(`div`,{className:`relative h-48 overflow-y-auto rounded-lg border bg-muted/20 p-3`,children:(0,r.jsxs)(`div`,{className:`h-80 space-y-2`,children:[(0,r.jsx)(t.Affix,{offsetTop:e,zIndex:a,className:`mb-3 bg-primary/95 rounded-md px-3 py-2 text-primary-foreground`,children:`Sticky anchor bar`}),(0,r.jsx)(`p`,{children:`Scroll this area to verify sticky behavior.`}),(0,r.jsx)(`p`,{children:`Affix stays visible at the selected top offset.`}),(0,r.jsx)(`p`,{children:`Useful in dashboard toolbars and contextual quick actions.`}),(0,r.jsx)(`p`,{className:`h-64`})]})})]})}exports.AffixShowcase=i;
@@ -1,2 +0,0 @@
1
- import * as React from "react";
2
- export declare function AffixShowcase(): React.JSX.Element;
@@ -1,64 +0,0 @@
1
- import { Affix as e } from "../../../components/modern/affix.js";
2
- import * as t from "react";
3
- import { jsx as n, jsxs as r } from "react/jsx-runtime";
4
- //#region src/showcase/premium/affix/showcase.tsx
5
- function i() {
6
- let [i, a] = t.useState(0), [o, s] = t.useState(40);
7
- return /* @__PURE__ */ r("div", {
8
- className: "space-y-4",
9
- children: [
10
- /* @__PURE__ */ r("div", {
11
- className: "flex flex-wrap gap-2",
12
- children: [
13
- /* @__PURE__ */ n("button", {
14
- type: "button",
15
- className: "rounded-md border px-2.5 py-1 text-sm",
16
- onClick: () => a((e) => Math.max(0, e - 8)),
17
- children: "Offset -8"
18
- }),
19
- /* @__PURE__ */ n("button", {
20
- type: "button",
21
- className: "rounded-md border px-2.5 py-1 text-sm",
22
- onClick: () => a((e) => e + 8),
23
- children: "Offset +8"
24
- }),
25
- /* @__PURE__ */ n("button", {
26
- type: "button",
27
- className: "rounded-md border px-2.5 py-1 text-sm",
28
- onClick: () => s((e) => e === 30 ? 80 : 30),
29
- children: "Toggle z-index"
30
- })
31
- ]
32
- }),
33
- /* @__PURE__ */ r("p", {
34
- className: "text-sm text-muted-foreground",
35
- children: [
36
- "Current settings: offsetTop=",
37
- i,
38
- ", zIndex=",
39
- o
40
- ]
41
- }),
42
- /* @__PURE__ */ n("div", {
43
- className: "relative h-48 overflow-y-auto rounded-lg border bg-muted/20 p-3",
44
- children: /* @__PURE__ */ r("div", {
45
- className: "h-80 space-y-2",
46
- children: [
47
- /* @__PURE__ */ n(e, {
48
- offsetTop: i,
49
- zIndex: o,
50
- className: "mb-3 bg-primary/95 rounded-md px-3 py-2 text-primary-foreground",
51
- children: "Sticky anchor bar"
52
- }),
53
- /* @__PURE__ */ n("p", { children: "Scroll this area to verify sticky behavior." }),
54
- /* @__PURE__ */ n("p", { children: "Affix stays visible at the selected top offset." }),
55
- /* @__PURE__ */ n("p", { children: "Useful in dashboard toolbars and contextual quick actions." }),
56
- /* @__PURE__ */ n("p", { className: "h-64" })
57
- ]
58
- })
59
- })
60
- ]
61
- });
62
- }
63
- //#endregion
64
- export { i as AffixShowcase };
@@ -1 +0,0 @@
1
- Object.defineProperty(exports,Symbol.toStringTag,{value:`Module`});const e=require("./mock.cjs"),t=require("./showcase.cjs");exports.AspectRatioShowcase=t.AspectRatioShowcase,exports.aspectRatioMock=e.aspectRatioMock;
@@ -1,2 +0,0 @@
1
- export { aspectRatioMock } from "./mock";
2
- export { AspectRatioShowcase } from "./showcase";
@@ -1,3 +0,0 @@
1
- import { aspectRatioMock as e } from "./mock.js";
2
- import { AspectRatioShowcase as t } from "./showcase.js";
3
- export { t as AspectRatioShowcase, e as aspectRatioMock };
@@ -1,11 +0,0 @@
1
- Object.defineProperty(exports,Symbol.toStringTag,{value:`Module`});var e={code:`import { AspectRatio } from "@/index"
2
-
3
- export function Example() {
4
- return (
5
- <AspectRatio ratio={16 / 9} className="rounded-xl border bg-muted">
6
- <div className="grid size-full place-items-center text-sm font-medium text-foreground">
7
- 16:9 media slot
8
- </div>
9
- </AspectRatio>
10
- )
11
- }`,cliCommand:`npx tembro add aspect-ratio`,highlights:[`Controls media card proportions in one place`,`Works for images, iframes, and any fixed-ratio container`,`Stable in dashboard and content-heavy layouts`],scenarios:[{title:`Media hero`,description:`Reserve consistent 16:9 ratio for previews.`},{title:`Card media`,description:`Keep media and text alignment predictable.`},{title:`Document preview`,description:`Prevent jumpy layouts while content loads.`}]};exports.aspectRatioMock=e;
@@ -1,2 +0,0 @@
1
- import type { ComponentDemoMock } from "../types";
2
- export declare const aspectRatioMock: ComponentDemoMock;
@@ -1,26 +0,0 @@
1
- //#region src/showcase/premium/aspect-ratio/mock.ts
2
- var e = {
3
- code: "import { AspectRatio } from \"@/index\"\n\nexport function Example() {\n return (\n <AspectRatio ratio={16 / 9} className=\"rounded-xl border bg-muted\">\n <div className=\"grid size-full place-items-center text-sm font-medium text-foreground\">\n 16:9 media slot\n </div>\n </AspectRatio>\n )\n}",
4
- cliCommand: "npx tembro add aspect-ratio",
5
- highlights: [
6
- "Controls media card proportions in one place",
7
- "Works for images, iframes, and any fixed-ratio container",
8
- "Stable in dashboard and content-heavy layouts"
9
- ],
10
- scenarios: [
11
- {
12
- title: "Media hero",
13
- description: "Reserve consistent 16:9 ratio for previews."
14
- },
15
- {
16
- title: "Card media",
17
- description: "Keep media and text alignment predictable."
18
- },
19
- {
20
- title: "Document preview",
21
- description: "Prevent jumpy layouts while content loads."
22
- }
23
- ]
24
- };
25
- //#endregion
26
- export { e as aspectRatioMock };
@@ -1 +0,0 @@
1
- Object.defineProperty(exports,Symbol.toStringTag,{value:`Module`});const e=require("../../../_virtual/_rolldown/runtime.cjs"),t=require("../../../components/ui/button/index.cjs"),n=require("../../../components/display/aspect-ratio.cjs");let r=require("react");r=e.__toESM(r,1);let i=require("react/jsx-runtime");var a=[{label:`16:9`,ratio:16/9},{label:`4:3`,ratio:4/3},{label:`1:1`,ratio:1},{label:`3:4`,ratio:3/4}];function o(){let[e,o]=r.useState(0);return(0,i.jsxs)(`div`,{className:`space-y-5`,children:[(0,i.jsx)(`section`,{className:`flex flex-wrap gap-3`,children:a.map((n,r)=>(0,i.jsx)(t.Button,{variant:e===r?`default`:`outline`,size:`sm`,onClick:()=>o(r),children:n.label},n.label))}),(0,i.jsx)(n.AspectRatio,{ratio:a[e].ratio,className:`rounded-2xl border border-border bg-card`,children:(0,i.jsxs)(`div`,{className:`grid h-full place-items-center bg-[linear-gradient(135deg,color-mix(in_oklch,var(--aui-page-bg),transparent_75%),transparent)] p-6 text-center`,children:[(0,i.jsx)(`p`,{className:`text-sm text-muted-foreground`,children:a[e].label}),(0,i.jsx)(`p`,{className:`text-xl font-semibold text-foreground`,children:`Adaptive ratio surface`})]})})]})}exports.AspectRatioShowcase=o;
@@ -1,2 +0,0 @@
1
- import * as React from "react";
2
- export declare function AspectRatioShowcase(): React.JSX.Element;
@@ -1,53 +0,0 @@
1
- import { Button as e } from "../../../components/ui/button/index.js";
2
- import { AspectRatio as t } from "../../../components/display/aspect-ratio.js";
3
- import * as n from "react";
4
- import { jsx as r, jsxs as i } from "react/jsx-runtime";
5
- //#region src/showcase/premium/aspect-ratio/showcase.tsx
6
- var a = [
7
- {
8
- label: "16:9",
9
- ratio: 16 / 9
10
- },
11
- {
12
- label: "4:3",
13
- ratio: 4 / 3
14
- },
15
- {
16
- label: "1:1",
17
- ratio: 1
18
- },
19
- {
20
- label: "3:4",
21
- ratio: 3 / 4
22
- }
23
- ];
24
- function o() {
25
- let [o, s] = n.useState(0);
26
- return /* @__PURE__ */ i("div", {
27
- className: "space-y-5",
28
- children: [/* @__PURE__ */ r("section", {
29
- className: "flex flex-wrap gap-3",
30
- children: a.map((t, n) => /* @__PURE__ */ r(e, {
31
- variant: o === n ? "default" : "outline",
32
- size: "sm",
33
- onClick: () => s(n),
34
- children: t.label
35
- }, t.label))
36
- }), /* @__PURE__ */ r(t, {
37
- ratio: a[o].ratio,
38
- className: "rounded-2xl border border-border bg-card",
39
- children: /* @__PURE__ */ i("div", {
40
- className: "grid h-full place-items-center bg-[linear-gradient(135deg,color-mix(in_oklch,var(--aui-page-bg),transparent_75%),transparent)] p-6 text-center",
41
- children: [/* @__PURE__ */ r("p", {
42
- className: "text-sm text-muted-foreground",
43
- children: a[o].label
44
- }), /* @__PURE__ */ r("p", {
45
- className: "text-xl font-semibold text-foreground",
46
- children: "Adaptive ratio surface"
47
- })]
48
- })
49
- })]
50
- });
51
- }
52
- //#endregion
53
- export { o as AspectRatioShowcase };
@@ -1 +0,0 @@
1
- Object.defineProperty(exports,Symbol.toStringTag,{value:`Module`});const e=require("./mock.cjs"),t=require("./showcase.cjs");exports.CascaderShowcase=t.CascaderShowcase,exports.cascaderMock=e.cascaderMock;
@@ -1,2 +0,0 @@
1
- export { cascaderMock } from "./mock";
2
- export { CascaderShowcase } from "./showcase";
@@ -1,3 +0,0 @@
1
- import { cascaderMock as e } from "./mock.js";
2
- import { CascaderShowcase as t } from "./showcase.js";
3
- export { t as CascaderShowcase, e as cascaderMock };
@@ -1,9 +0,0 @@
1
- Object.defineProperty(exports,Symbol.toStringTag,{value:`Module`});var e={code:`import { Cascader } from "@/index"
2
-
3
- const options = [{ value: "eu", label: "Europe", children: [{ value: "uk", label: "United Kingdom", children: [{ value: "london", label: "London" }] }] }]
4
-
5
- export function Example() {
6
- const [value, setValue] = useState<string[]>([])
7
-
8
- return <Cascader options={options} value={value} onValueChange={setValue} />
9
- }`,cliCommand:`npx tembro add cascader`,highlights:[`Three-level dependency selects`,`Controlled by string path value`,`Disabled states for unavailable levels`],scenarios:[{title:`Location selector`,description:`Choose region / country / city in one compact control.`},{title:`Category trees`,description:`Pick nested taxonomy in forms.`}]};exports.cascaderMock=e;
@@ -1,2 +0,0 @@
1
- import type { ComponentDemoMock } from "../types";
2
- export declare const cascaderMock: ComponentDemoMock;
@@ -1,19 +0,0 @@
1
- //#region src/showcase/premium/cascader/mock.ts
2
- var e = {
3
- code: "import { Cascader } from \"@/index\"\n\nconst options = [{ value: \"eu\", label: \"Europe\", children: [{ value: \"uk\", label: \"United Kingdom\", children: [{ value: \"london\", label: \"London\" }] }] }]\n\nexport function Example() {\n const [value, setValue] = useState<string[]>([])\n\n return <Cascader options={options} value={value} onValueChange={setValue} />\n}",
4
- cliCommand: "npx tembro add cascader",
5
- highlights: [
6
- "Three-level dependency selects",
7
- "Controlled by string path value",
8
- "Disabled states for unavailable levels"
9
- ],
10
- scenarios: [{
11
- title: "Location selector",
12
- description: "Choose region / country / city in one compact control."
13
- }, {
14
- title: "Category trees",
15
- description: "Pick nested taxonomy in forms."
16
- }]
17
- };
18
- //#endregion
19
- export { e as cascaderMock };
@@ -1 +0,0 @@
1
- Object.defineProperty(exports,Symbol.toStringTag,{value:`Module`});const e=require("../../../_virtual/_rolldown/runtime.cjs"),t=require("../../../components/inputs/cascader.cjs");let n=require("react");n=e.__toESM(n,1);let r=require("react/jsx-runtime");var i=[{value:`eu`,label:`Europe`,children:[{value:`uk`,label:`United Kingdom`,children:[{value:`london`,label:`London`}]}]},{value:`us`,label:`United States`,children:[{value:`ca`,label:`California`,children:[{value:`sf`,label:`San Francisco`}]}]}];function a(){let[e,a]=n.useState([]);return(0,r.jsxs)(`div`,{className:`space-y-3`,children:[(0,r.jsx)(t.Cascader,{options:i,value:e,onValueChange:a}),(0,r.jsxs)(`p`,{className:`text-sm text-muted-foreground`,children:[`Selected path: `,e.length?e.join(` / `):`Not selected`]})]})}exports.CascaderShowcase=a;
@@ -1,2 +0,0 @@
1
- import * as React from "react";
2
- export declare function CascaderShowcase(): React.JSX.Element;
@@ -1,43 +0,0 @@
1
- import { Cascader as e } from "../../../components/inputs/cascader.js";
2
- import * as t from "react";
3
- import { jsx as n, jsxs as r } from "react/jsx-runtime";
4
- //#region src/showcase/premium/cascader/showcase.tsx
5
- var i = [{
6
- value: "eu",
7
- label: "Europe",
8
- children: [{
9
- value: "uk",
10
- label: "United Kingdom",
11
- children: [{
12
- value: "london",
13
- label: "London"
14
- }]
15
- }]
16
- }, {
17
- value: "us",
18
- label: "United States",
19
- children: [{
20
- value: "ca",
21
- label: "California",
22
- children: [{
23
- value: "sf",
24
- label: "San Francisco"
25
- }]
26
- }]
27
- }];
28
- function a() {
29
- let [a, o] = t.useState([]);
30
- return /* @__PURE__ */ r("div", {
31
- className: "space-y-3",
32
- children: [/* @__PURE__ */ n(e, {
33
- options: i,
34
- value: a,
35
- onValueChange: o
36
- }), /* @__PURE__ */ r("p", {
37
- className: "text-sm text-muted-foreground",
38
- children: ["Selected path: ", a.length ? a.join(" / ") : "Not selected"]
39
- })]
40
- });
41
- }
42
- //#endregion
43
- export { a as CascaderShowcase };
@@ -1 +0,0 @@
1
- Object.defineProperty(exports,Symbol.toStringTag,{value:`Module`});const e=require("./mock.cjs"),t=require("./showcase.cjs");exports.FloatButtonShowcase=t.FloatButtonShowcase,exports.floatButtonMock=e.floatButtonMock;
@@ -1,2 +0,0 @@
1
- export { floatButtonMock } from "./mock";
2
- export { FloatButtonShowcase } from "./showcase";
@@ -1,3 +0,0 @@
1
- import { floatButtonMock as e } from "./mock.js";
2
- import { FloatButtonShowcase as t } from "./showcase.js";
3
- export { t as FloatButtonShowcase, e as floatButtonMock };
@@ -1,10 +0,0 @@
1
- Object.defineProperty(exports,Symbol.toStringTag,{value:`Module`});var e={code:`import { FloatButton } from "@/index"
2
- import { Plus } from "lucide-react"
3
-
4
- export function Example() {
5
- return (
6
- <FloatButton placement="bottom-right">
7
- <Plus className="size-4" />
8
- </FloatButton>
9
- )
10
- }`,cliCommand:`npx tembro add float-button`,highlights:[`Fixed-position shortcut button`,`Placement variants across corners`],scenarios:[{title:`Quick action`,description:`Keep add/create action always reachable.`},{title:`Chat widgets`,description:`Mount floating controls without complex absolute layout.`}]};exports.floatButtonMock=e;
@@ -1,2 +0,0 @@
1
- import type { ComponentDemoMock } from "../types";
2
- export declare const floatButtonMock: ComponentDemoMock;
@@ -1,15 +0,0 @@
1
- //#region src/showcase/premium/float-button/mock.ts
2
- var e = {
3
- code: "import { FloatButton } from \"@/index\"\nimport { Plus } from \"lucide-react\"\n\nexport function Example() {\n return (\n <FloatButton placement=\"bottom-right\">\n <Plus className=\"size-4\" />\n </FloatButton>\n )\n}",
4
- cliCommand: "npx tembro add float-button",
5
- highlights: ["Fixed-position shortcut button", "Placement variants across corners"],
6
- scenarios: [{
7
- title: "Quick action",
8
- description: "Keep add/create action always reachable."
9
- }, {
10
- title: "Chat widgets",
11
- description: "Mount floating controls without complex absolute layout."
12
- }]
13
- };
14
- //#endregion
15
- export { e as floatButtonMock };
@@ -1 +0,0 @@
1
- Object.defineProperty(exports,Symbol.toStringTag,{value:`Module`});const e=require("../../../_virtual/_rolldown/runtime.cjs"),t=require("../../../components/display/float-button.cjs");let n=require("react");n=e.__toESM(n,1);let r=require("lucide-react"),i=require("react/jsx-runtime");var a=[`bottom-right`,`bottom-left`,`top-right`,`top-left`];function o(){let[e,o]=n.useState(0),s=a[e%a.length];return(0,i.jsxs)(`div`,{className:`relative h-48 rounded-lg border bg-muted/20 p-6`,children:[(0,i.jsxs)(`p`,{className:`mb-3 text-sm text-muted-foreground`,children:[`Current placement: `,s]}),(0,i.jsx)(t.FloatButton,{onClick:()=>o(e=>e+1),"aria-label":`Open quick actions`,placement:s,children:(0,i.jsx)(r.PlusIcon,{className:`size-5`})})]})}exports.FloatButtonShowcase=o;
@@ -1,2 +0,0 @@
1
- import * as React from "react";
2
- export declare function FloatButtonShowcase(): React.JSX.Element;
@@ -1,28 +0,0 @@
1
- import { FloatButton as e } from "../../../components/display/float-button.js";
2
- import * as t from "react";
3
- import { PlusIcon as n } from "lucide-react";
4
- import { jsx as r, jsxs as i } from "react/jsx-runtime";
5
- //#region src/showcase/premium/float-button/showcase.tsx
6
- var a = [
7
- "bottom-right",
8
- "bottom-left",
9
- "top-right",
10
- "top-left"
11
- ];
12
- function o() {
13
- let [o, s] = t.useState(0), c = a[o % a.length];
14
- return /* @__PURE__ */ i("div", {
15
- className: "relative h-48 rounded-lg border bg-muted/20 p-6",
16
- children: [/* @__PURE__ */ i("p", {
17
- className: "mb-3 text-sm text-muted-foreground",
18
- children: ["Current placement: ", c]
19
- }), /* @__PURE__ */ r(e, {
20
- onClick: () => s((e) => e + 1),
21
- "aria-label": "Open quick actions",
22
- placement: c,
23
- children: /* @__PURE__ */ r(n, { className: "size-5" })
24
- })]
25
- });
26
- }
27
- //#endregion
28
- export { o as FloatButtonShowcase };
@@ -1 +0,0 @@
1
- Object.defineProperty(exports,Symbol.toStringTag,{value:`Module`});const e=require("./mock.cjs"),t=require("./showcase.cjs");exports.KeyboardShortcutShowcase=t.KeyboardShortcutShowcase,exports.keyboardShortcutMock=e.keyboardShortcutMock;
@@ -1,2 +0,0 @@
1
- export { keyboardShortcutMock } from "./mock";
2
- export { KeyboardShortcutShowcase } from "./showcase";
@@ -1,3 +0,0 @@
1
- import { keyboardShortcutMock as e } from "./mock.js";
2
- import { KeyboardShortcutShowcase as t } from "./showcase.js";
3
- export { t as KeyboardShortcutShowcase, e as keyboardShortcutMock };
@@ -1,5 +0,0 @@
1
- Object.defineProperty(exports,Symbol.toStringTag,{value:`Module`});var e={code:`import { KeyboardShortcut } from "@/index"
2
-
3
- export function Example() {
4
- return <KeyboardShortcut keys={["Ctrl", "K"]} />
5
- }`,cliCommand:`npx tembro add keyboard-shortcut`,highlights:[`Compact visual hint for one or many keys`,`Accepts key arrays or raw children`,`Useful inside command palette, docs hints and action toolbars`],scenarios:[{title:`Search hint`,description:`Show the command palette trigger beside a search action.`},{title:`Editor help`,description:`Reveal save or publish shortcuts close to the action.`},{title:`Docs legend`,description:`Document power-user flows without adding a heavy table.`}]};exports.keyboardShortcutMock=e;
@@ -1,2 +0,0 @@
1
- import type { ComponentDemoMock } from "../types";
2
- export declare const keyboardShortcutMock: ComponentDemoMock;
@@ -1,26 +0,0 @@
1
- //#region src/showcase/premium/keyboard-shortcut/mock.ts
2
- var e = {
3
- code: "import { KeyboardShortcut } from \"@/index\"\n\nexport function Example() {\n return <KeyboardShortcut keys={[\"Ctrl\", \"K\"]} />\n}",
4
- cliCommand: "npx tembro add keyboard-shortcut",
5
- highlights: [
6
- "Compact visual hint for one or many keys",
7
- "Accepts key arrays or raw children",
8
- "Useful inside command palette, docs hints and action toolbars"
9
- ],
10
- scenarios: [
11
- {
12
- title: "Search hint",
13
- description: "Show the command palette trigger beside a search action."
14
- },
15
- {
16
- title: "Editor help",
17
- description: "Reveal save or publish shortcuts close to the action."
18
- },
19
- {
20
- title: "Docs legend",
21
- description: "Document power-user flows without adding a heavy table."
22
- }
23
- ]
24
- };
25
- //#endregion
26
- export { e as keyboardShortcutMock };
@@ -1 +0,0 @@
1
- Object.defineProperty(exports,Symbol.toStringTag,{value:`Module`});const e=require("../../../components/ui/button/index.cjs"),t=require("../../../components/display/keyboard-shortcut.cjs");let n=require("react/jsx-runtime");var r=`border-t border-[color:var(--aui-divider)] py-6`;function i(){return(0,n.jsxs)(`div`,{className:`space-y-0`,children:[(0,n.jsxs)(`section`,{className:`pb-6`,children:[(0,n.jsx)(`p`,{className:`text-xs font-semibold uppercase tracking-[0.24em] aui-text-muted`,children:`Installed display primitive`}),(0,n.jsx)(`h3`,{className:`mt-3 text-2xl font-semibold tracking-tight aui-text-strong`,children:`KeyboardShortcut shows power-user hints without noise`}),(0,n.jsx)(`p`,{className:`mt-3 max-w-2xl text-sm leading-6 aui-text-muted`,children:`Keep shortcut chips short and nearby to the action they describe. They should reinforce real behavior, not decorative text.`})]}),(0,n.jsx)(`section`,{className:r,children:(0,n.jsxs)(`div`,{className:`grid gap-6 xl:grid-cols-[1fr_360px]`,children:[(0,n.jsxs)(`div`,{className:`rounded-xl border border-[color:var(--aui-divider)] bg-[color:var(--aui-page-bg-alt)] p-4`,children:[(0,n.jsxs)(`div`,{className:`flex flex-wrap items-center gap-3`,children:[(0,n.jsx)(e.Button,{variant:`outline`,children:`Search routes`}),(0,n.jsx)(t.KeyboardShortcut,{keys:[`Ctrl`,`K`]})]}),(0,n.jsxs)(`div`,{className:`mt-4 flex flex-wrap items-center gap-3`,children:[(0,n.jsx)(e.Button,{variant:`secondary`,children:`Save draft`}),(0,n.jsx)(t.KeyboardShortcut,{keys:[`Ctrl`,`S`]}),(0,n.jsx)(e.Button,{children:`Publish`}),(0,n.jsx)(t.KeyboardShortcut,{keys:[`Shift`,`Enter`]})]})]}),(0,n.jsxs)(`div`,{className:`rounded-xl border border-[color:var(--aui-divider)] p-4`,children:[(0,n.jsx)(`p`,{className:`text-sm font-semibold aui-text-strong`,children:`Guidance`}),(0,n.jsxs)(`div`,{className:`mt-3 space-y-3 text-sm leading-6 aui-text-muted`,children:[(0,n.jsx)(`p`,{children:`Show shortcuts only where the action is relevant. Repeating the same hint everywhere weakens it.`}),(0,n.jsx)(`p`,{children:"Use concise labels like `Ctrl`, `Cmd`, `Shift`, `Enter`, not long prose inside the chip."})]})]})]})})]})}exports.KeyboardShortcutShowcase=i;
@@ -1 +0,0 @@
1
- export declare function KeyboardShortcutShowcase(): import("react").JSX.Element;