@godxjp/ui 31.27.0 → 31.28.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 (52) hide show
  1. package/agent/START-HERE.md +7 -7
  2. package/agent/components/BlockEditor.json +8 -0
  3. package/agent/components/CommandPalette.json +5 -0
  4. package/agent/components/EmojiPicker.json +78 -0
  5. package/agent/components/Markdown.json +11 -0
  6. package/agent/components/PageContainer.json +11 -1
  7. package/agent/components/PageCover.json +75 -0
  8. package/agent/components/Tree.json +6 -0
  9. package/agent/components-index.json +10 -0
  10. package/agent/components.json +194 -1
  11. package/agent/index.json +8 -8
  12. package/agent/llms.txt +7 -7
  13. package/agent/tokens.json +79 -1
  14. package/dist/components/data-display/tree.js +5 -0
  15. package/dist/components/data-entry/command-palette.d.ts +5 -0
  16. package/dist/components/data-entry/command-palette.js +1 -0
  17. package/dist/components/data-entry/emoji-data.d.ts +43 -0
  18. package/dist/components/data-entry/emoji-data.js +54 -0
  19. package/dist/components/data-entry/emoji-picker.d.ts +13 -0
  20. package/dist/components/data-entry/emoji-picker.js +272 -0
  21. package/dist/components/data-entry/index.d.ts +2 -0
  22. package/dist/components/data-entry/index.js +2 -0
  23. package/dist/components/layout/index.d.ts +2 -0
  24. package/dist/components/layout/index.js +2 -0
  25. package/dist/components/layout/page-container.d.ts +1 -1
  26. package/dist/components/layout/page-container.js +8 -1
  27. package/dist/components/layout/page-cover.d.ts +14 -0
  28. package/dist/components/layout/page-cover.js +127 -0
  29. package/dist/contracts/measurement.json +1 -1
  30. package/dist/i18n/messages/en.json +25 -0
  31. package/dist/i18n/messages/ja.json +25 -0
  32. package/dist/i18n/messages/vi.json +25 -0
  33. package/dist/props/components/data-display.prop.d.ts +6 -0
  34. package/dist/props/components/data-entry.prop.d.ts +26 -0
  35. package/dist/props/components/layout.prop.d.ts +49 -2
  36. package/dist/props/registry.d.ts +85 -1
  37. package/dist/props/registry.js +95 -1
  38. package/dist/styles/control.css +81 -0
  39. package/dist/styles/data-display-layout.css +94 -0
  40. package/dist/styles/focus-ring.css +2 -0
  41. package/dist/styles/layers.json +17 -1
  42. package/dist/styles/layout.css +113 -0
  43. package/dist/tokens/components/control.css +10 -0
  44. package/dist/tokens/components/data-display.css +1 -0
  45. package/dist/tokens/semantic/layout.css +14 -0
  46. package/docs/FRAME-COVERAGE-REPORT.md +4 -2
  47. package/docs/data-entry/emoji-picker.tsx +35 -0
  48. package/docs/i18n/messages/en.json +16 -0
  49. package/docs/i18n/messages/ja.json +16 -0
  50. package/docs/i18n/messages/vi.json +16 -0
  51. package/docs/layout/page-cover.tsx +56 -0
  52. package/package.json +5 -2
@@ -0,0 +1,56 @@
1
+ import * as React from "react";
2
+ import { Prose } from "@godxjp/ui/data-display";
3
+ import { EmojiPicker } from "@godxjp/ui/data-entry";
4
+ import { Button, Text } from "@godxjp/ui/general";
5
+ import { useTranslation } from "@godxjp/ui/i18n";
6
+ import { PageContainer, PageCover } from "@godxjp/ui/layout";
7
+
8
+ import shot from "../assets/shot-landscape.svg";
9
+
10
+ /**
11
+ * PageCover + PageContainer `icon` / headerScale="display" (gh#1160) — a Notion / note.com page:
12
+ * a banner cover you can reposition (drag, or the arrow keys while repositioning), the page icon
13
+ * over its edge (chosen with EmojiPicker), and the article's display-size title.
14
+ */
15
+ export default function Demo() {
16
+ const { t } = useTranslation();
17
+ const [y, setY] = React.useState(40);
18
+ const [moving, setMoving] = React.useState(false);
19
+ const [icon, setIcon] = React.useState<string | null>("📘");
20
+ return (
21
+ <PageContainer
22
+ title={t("pageCoverDocs.title")}
23
+ headerScale="display"
24
+ icon={
25
+ <EmojiPicker
26
+ value={icon}
27
+ onValueChange={setIcon}
28
+ size="lg"
29
+ aria-label={t("pageCoverDocs.icon")}
30
+ />
31
+ }
32
+ cover={
33
+ <PageCover
34
+ src={shot}
35
+ alt=""
36
+ positionY={y}
37
+ onPositionChange={setY}
38
+ repositioning={moving}
39
+ onRepositioningChange={setMoving}
40
+ actions={
41
+ <Button size="sm" variant="secondary" onClick={() => setMoving((m) => !m)}>
42
+ {moving ? t("pageCoverDocs.done") : t("pageCoverDocs.reposition")}
43
+ </Button>
44
+ }
45
+ />
46
+ }
47
+ >
48
+ <Prose measure="medium">
49
+ <p>{t("pageCoverDocs.body")}</p>
50
+ </Prose>
51
+ <Text size="sm" tone="muted">
52
+ {t("pageCoverDocs.position", { value: y })}
53
+ </Text>
54
+ </PageContainer>
55
+ );
56
+ }
package/package.json CHANGED
@@ -1,7 +1,7 @@
1
1
  {
2
2
  "name": "@godxjp/ui",
3
- "version": "31.27.0",
4
- "godxUiMcp": "31.27.0",
3
+ "version": "31.28.0",
4
+ "godxUiMcp": "31.28.0",
5
5
  "license": "Apache-2.0",
6
6
  "repository": {
7
7
  "type": "git",
@@ -483,6 +483,7 @@
483
483
  "cmdk": "^1.1.1",
484
484
  "date-fns": "^4.1.0",
485
485
  "embla-carousel-react": "^8.6.0",
486
+ "emojibase-data": "^17.0.0",
486
487
  "input-otp": "^1.5.0",
487
488
  "lucide-react": "^1.37.0",
488
489
  "qrcode.react": "4.2.0",
@@ -546,11 +547,13 @@
546
547
  "jsqr": "^1.4.0",
547
548
  "mdast-util-directive": "^3.1.1",
548
549
  "mdast-util-from-markdown": "^2.1.0",
550
+ "mdast-util-frontmatter": "^2.0.1",
549
551
  "mdast-util-gfm": "^3.1.0",
550
552
  "mdast-util-to-markdown": "^2.2.0",
551
553
  "mermaid": "^11.17.2",
552
554
  "micromark-extension-cjk-friendly": "^2.0.2",
553
555
  "micromark-extension-directive": "^4.0.0",
556
+ "micromark-extension-frontmatter": "^2.0.0",
554
557
  "micromark-extension-gfm": "^3.0.0",
555
558
  "micromark-util-types": "^2.0.3",
556
559
  "playwright": "^1.62.1",