@revikornmann/muka-ui 0.27.2 → 0.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 (84) hide show
  1. package/dist/cjs/components/Avatar/Avatar.css +30 -7
  2. package/dist/cjs/components/Avatar/Avatar.js +4 -1
  3. package/dist/cjs/components/Avatar/Avatar.js.map +1 -1
  4. package/dist/cjs/components/DataPieChart/DataPieChart.css +4 -1
  5. package/dist/cjs/components/DataPieChart/DataPieChart.js +1 -1
  6. package/dist/cjs/components/DataPieChart/DataPieChart.js.map +1 -1
  7. package/dist/cjs/components/Dialog/Dialog.css +3 -0
  8. package/dist/cjs/components/Dialog/Dialog.js +66 -3
  9. package/dist/cjs/components/Dialog/Dialog.js.map +1 -1
  10. package/dist/cjs/components/Input/Input.css +21 -0
  11. package/dist/cjs/components/MediaViewer/MediaViewer.css +180 -0
  12. package/dist/cjs/components/MediaViewer/MediaViewer.js +271 -0
  13. package/dist/cjs/components/MediaViewer/MediaViewer.js.map +1 -0
  14. package/dist/cjs/components/MediaViewer/index.js +6 -0
  15. package/dist/cjs/components/MediaViewer/index.js.map +1 -0
  16. package/dist/cjs/components/MediaViewer/mediaViewerGestures.js +65 -0
  17. package/dist/cjs/components/MediaViewer/mediaViewerGestures.js.map +1 -0
  18. package/dist/cjs/components/Thumbnail/Thumbnail.css +11 -0
  19. package/dist/cjs/components/Thumbnail/Thumbnail.js +6 -2
  20. package/dist/cjs/components/Thumbnail/Thumbnail.js.map +1 -1
  21. package/dist/cjs/components/index.js +3 -1
  22. package/dist/cjs/components/index.js.map +1 -1
  23. package/dist/esm/components/Avatar/Avatar.css +30 -7
  24. package/dist/esm/components/Avatar/Avatar.js +4 -1
  25. package/dist/esm/components/Avatar/Avatar.js.map +1 -1
  26. package/dist/esm/components/DataPieChart/DataPieChart.css +4 -1
  27. package/dist/esm/components/DataPieChart/DataPieChart.js +1 -1
  28. package/dist/esm/components/DataPieChart/DataPieChart.js.map +1 -1
  29. package/dist/esm/components/Dialog/Dialog.css +3 -0
  30. package/dist/esm/components/Dialog/Dialog.js +66 -3
  31. package/dist/esm/components/Dialog/Dialog.js.map +1 -1
  32. package/dist/esm/components/Input/Input.css +21 -0
  33. package/dist/esm/components/MediaViewer/MediaViewer.css +180 -0
  34. package/dist/esm/components/MediaViewer/MediaViewer.js +267 -0
  35. package/dist/esm/components/MediaViewer/MediaViewer.js.map +1 -0
  36. package/dist/esm/components/MediaViewer/index.js +2 -0
  37. package/dist/esm/components/MediaViewer/index.js.map +1 -0
  38. package/dist/esm/components/MediaViewer/mediaViewerGestures.js +58 -0
  39. package/dist/esm/components/MediaViewer/mediaViewerGestures.js.map +1 -0
  40. package/dist/esm/components/Thumbnail/Thumbnail.css +11 -0
  41. package/dist/esm/components/Thumbnail/Thumbnail.js +6 -2
  42. package/dist/esm/components/Thumbnail/Thumbnail.js.map +1 -1
  43. package/dist/esm/components/index.js +1 -0
  44. package/dist/esm/components/index.js.map +1 -1
  45. package/dist/styles/base.css +2 -0
  46. package/dist/styles/components/Avatar.css +30 -7
  47. package/dist/styles/components/DataPieChart.css +4 -1
  48. package/dist/styles/components/Dialog.css +3 -0
  49. package/dist/styles/components/Input.css +21 -0
  50. package/dist/styles/components/MediaViewer.css +180 -0
  51. package/dist/styles/components/Thumbnail.css +11 -0
  52. package/dist/styles/index.css +554 -301
  53. package/dist/styles/muka-dark.css +554 -301
  54. package/dist/styles/muka-light.css +554 -301
  55. package/dist/styles/tokens-bouwplan-dark.css +8 -1
  56. package/dist/styles/tokens-bouwplan-light.css +8 -1
  57. package/dist/styles/tokens-fscl-dark.css +8 -1
  58. package/dist/styles/tokens-fscl-light.css +8 -1
  59. package/dist/styles/tokens-grip-dark.css +8 -1
  60. package/dist/styles/tokens-grip-light.css +8 -1
  61. package/dist/styles/tokens-muka-dark.css +8 -1
  62. package/dist/styles/tokens-muka-light.css +8 -1
  63. package/dist/styles/tokens-wireframe-dark.css +8 -1
  64. package/dist/styles/tokens-wireframe-light.css +8 -1
  65. package/dist/styles/wireframe-dark.css +554 -301
  66. package/dist/styles/wireframe-light.css +554 -301
  67. package/dist/types/components/Avatar/Avatar.d.ts +4 -1
  68. package/dist/types/components/Avatar/Avatar.d.ts.map +1 -1
  69. package/dist/types/components/Dialog/Dialog.d.ts.map +1 -1
  70. package/dist/types/components/MediaViewer/MediaViewer.d.ts +86 -0
  71. package/dist/types/components/MediaViewer/MediaViewer.d.ts.map +1 -0
  72. package/dist/types/components/MediaViewer/index.d.ts +2 -0
  73. package/dist/types/components/MediaViewer/index.d.ts.map +1 -0
  74. package/dist/types/components/MediaViewer/mediaViewerGestures.d.ts +35 -0
  75. package/dist/types/components/MediaViewer/mediaViewerGestures.d.ts.map +1 -0
  76. package/dist/types/components/Thumbnail/Thumbnail.d.ts +21 -0
  77. package/dist/types/components/Thumbnail/Thumbnail.d.ts.map +1 -1
  78. package/dist/types/components/index.d.ts +1 -0
  79. package/dist/types/components/index.d.ts.map +1 -1
  80. package/docs/consumers/brand.md +6 -2
  81. package/docs/consumers/setup-instructions.md +35 -3
  82. package/package.json +1 -1
  83. package/skills/setup-muka/SKILL.md +36 -3
  84. package/tokens/t4-components/avatar.json +33 -1
@@ -45,7 +45,10 @@ export interface AvatarProps {
45
45
  * - Loading and error states
46
46
  * - Clickable support
47
47
  *
48
- * @accessibility WCAG 2.1 AA compliant
48
+ * @accessibility WCAG 2.1 AA, except initials contrast
49
+ * - Initials and "+N" use subtle text by design (Figma "Avatar"), about 2.5–3.4:1
50
+ * on the avatar fill, below the 4.5:1 AA text minimum. They are decorative:
51
+ * the accessible name comes from `name`, so always pass it
49
52
  * - Requires alt text when using image
50
53
  * - Uses role="img" with aria-label for non-image avatars
51
54
  * - Status indicators include aria-label
@@ -1 +1 @@
1
- {"version":3,"file":"Avatar.d.ts","sourceRoot":"","sources":["../../../../components/Avatar/Avatar.tsx"],"names":[],"mappings":"AAEA,OAAO,KAAsC,MAAM,OAAO,CAAC;AAE3D,OAAO,cAAc,CAAC;AAEtB;;;GAGG;AACH,MAAM,MAAM,UAAU,GAAG,KAAK,GAAG,KAAK,GAAG,KAAK,GAAG,IAAI,GAAG,IAAI,GAAG,IAAI,GAAG,IAAI,GAAG,IAAI,CAAC;AAElF,MAAM,WAAW,WAAW;IAC1B,uBAAuB;IACvB,GAAG,CAAC,EAAE,MAAM,CAAC;IAEb,yDAAyD;IACzD,GAAG,CAAC,EAAE,MAAM,CAAC;IAEb,0BAA0B;IAC1B,IAAI,CAAC,EAAE,KAAK,CAAC,SAAS,CAAC;IAEvB,mCAAmC;IACnC,IAAI,CAAC,EAAE,MAAM,CAAC;IAEd,0EAA0E;IAC1E,IAAI,CAAC,EAAE,UAAU,CAAC;IAElB,oBAAoB;IACpB,KAAK,CAAC,EAAE,QAAQ,GAAG,QAAQ,CAAC;IAE5B,uBAAuB;IACvB,MAAM,CAAC,EAAE,QAAQ,GAAG,SAAS,GAAG,MAAM,GAAG,MAAM,CAAC;IAEhD,gCAAgC;IAChC,cAAc,CAAC,EAAE,WAAW,GAAG,cAAc,CAAC;IAE9C,oBAAoB;IACpB,OAAO,CAAC,EAAE,MAAM,IAAI,CAAC;IAErB,6BAA6B;IAC7B,SAAS,CAAC,EAAE,MAAM,CAAC;IAEnB,uBAAuB;IACvB,YAAY,CAAC,EAAE,MAAM,CAAC;CACvB;AAaD;;;;;;;;;;;;;;;;;;;;;GAqBG;AACH,eAAO,MAAM,MAAM,EAAE,KAAK,CAAC,EAAE,CAAC,WAAW,CAkKxC,CAAC;AAEF,eAAe,MAAM,CAAC"}
1
+ {"version":3,"file":"Avatar.d.ts","sourceRoot":"","sources":["../../../../components/Avatar/Avatar.tsx"],"names":[],"mappings":"AAEA,OAAO,KAAsC,MAAM,OAAO,CAAC;AAE3D,OAAO,cAAc,CAAC;AAEtB;;;GAGG;AACH,MAAM,MAAM,UAAU,GAAG,KAAK,GAAG,KAAK,GAAG,KAAK,GAAG,IAAI,GAAG,IAAI,GAAG,IAAI,GAAG,IAAI,GAAG,IAAI,CAAC;AAElF,MAAM,WAAW,WAAW;IAC1B,uBAAuB;IACvB,GAAG,CAAC,EAAE,MAAM,CAAC;IAEb,yDAAyD;IACzD,GAAG,CAAC,EAAE,MAAM,CAAC;IAEb,0BAA0B;IAC1B,IAAI,CAAC,EAAE,KAAK,CAAC,SAAS,CAAC;IAEvB,mCAAmC;IACnC,IAAI,CAAC,EAAE,MAAM,CAAC;IAEd,0EAA0E;IAC1E,IAAI,CAAC,EAAE,UAAU,CAAC;IAElB,oBAAoB;IACpB,KAAK,CAAC,EAAE,QAAQ,GAAG,QAAQ,CAAC;IAE5B,uBAAuB;IACvB,MAAM,CAAC,EAAE,QAAQ,GAAG,SAAS,GAAG,MAAM,GAAG,MAAM,CAAC;IAEhD,gCAAgC;IAChC,cAAc,CAAC,EAAE,WAAW,GAAG,cAAc,CAAC;IAE9C,oBAAoB;IACpB,OAAO,CAAC,EAAE,MAAM,IAAI,CAAC;IAErB,6BAA6B;IAC7B,SAAS,CAAC,EAAE,MAAM,CAAC;IAEnB,uBAAuB;IACvB,YAAY,CAAC,EAAE,MAAM,CAAC;CACvB;AAaD;;;;;;;;;;;;;;;;;;;;;;;;GAwBG;AACH,eAAO,MAAM,MAAM,EAAE,KAAK,CAAC,EAAE,CAAC,WAAW,CAkKxC,CAAC;AAEF,eAAe,MAAM,CAAC"}
@@ -1 +1 @@
1
- {"version":3,"file":"Dialog.d.ts","sourceRoot":"","sources":["../../../../components/Dialog/Dialog.tsx"],"names":[],"mappings":"AAEA,OAAO,KAAoE,MAAM,OAAO,CAAC;AAMzF,OAAO,cAAc,CAAC;AAEtB,MAAM,WAAW,WAAW;IAC1B,iCAAiC;IACjC,IAAI,EAAE,OAAO,CAAC;IAEd,yFAAyF;IACzF,OAAO,CAAC,EAAE,MAAM,IAAI,CAAC;IAErB,iCAAiC;IACjC,QAAQ,EAAE,KAAK,CAAC,SAAS,CAAC;IAE1B,iFAAiF;IACjF,IAAI,CAAC,EAAE,IAAI,GAAG,IAAI,GAAG,IAAI,CAAC;IAE1B,0DAA0D;IAC1D,YAAY,CAAC,EAAE,MAAM,GAAG,MAAM,CAAC;IAE/B,gFAAgF;IAChF,KAAK,CAAC,EAAE,OAAO,CAAC;IAEhB,gCAAgC;IAChC,KAAK,CAAC,EAAE,MAAM,CAAC;IAEf,0DAA0D;IAC1D,OAAO,CAAC,EAAE,KAAK,CAAC,SAAS,CAAC;IAE1B,wDAAwD;IACxD,QAAQ,CAAC,EAAE,KAAK,CAAC,SAAS,CAAC;IAE3B,kEAAkE;IAClE,aAAa,CAAC,EAAE,KAAK,CAAC,SAAS,CAAC;IAEhC,iDAAiD;IACjD,aAAa,CAAC,EAAE,SAAS,GAAG,kBAAkB,CAAC;IAE/C;;;;;;;;;;;;;;OAcG;IACH,aAAa,CAAC,EAAE,QAAQ,GAAG,QAAQ,CAAC;IAEpC;;;OAGG;IACH,kBAAkB,CAAC,EAAE,MAAM,CAAC;IAE5B;;;OAGG;IACH,mBAAmB,CAAC,EAAE,MAAM,CAAC;IAE7B,+DAA+D;IAC/D,oBAAoB,CAAC,EAAE,MAAM,IAAI,CAAC;IAElC,gEAAgE;IAChE,qBAAqB,CAAC,EAAE,MAAM,IAAI,CAAC;IAEnC,uBAAuB;IACvB,YAAY,CAAC,EAAE,MAAM,CAAC;IAEtB,0CAA0C;IAC1C,kBAAkB,CAAC,EAAE,MAAM,CAAC;IAE5B,sEAAsE;IACtE,YAAY,CAAC,EAAE,CAAC,GAAG,CAAC,CAAC;IAErB,6BAA6B;IAC7B,SAAS,CAAC,EAAE,MAAM,CAAC;CACpB;AAyDD,eAAO,MAAM,MAAM,EAAE,KAAK,CAAC,EAAE,CAAC,WAAW,CA2SxC,CAAC;AAEF,eAAe,MAAM,CAAC"}
1
+ {"version":3,"file":"Dialog.d.ts","sourceRoot":"","sources":["../../../../components/Dialog/Dialog.tsx"],"names":[],"mappings":"AAEA,OAAO,KAAoE,MAAM,OAAO,CAAC;AAMzF,OAAO,cAAc,CAAC;AAEtB,MAAM,WAAW,WAAW;IAC1B,iCAAiC;IACjC,IAAI,EAAE,OAAO,CAAC;IAEd,yFAAyF;IACzF,OAAO,CAAC,EAAE,MAAM,IAAI,CAAC;IAErB,iCAAiC;IACjC,QAAQ,EAAE,KAAK,CAAC,SAAS,CAAC;IAE1B,iFAAiF;IACjF,IAAI,CAAC,EAAE,IAAI,GAAG,IAAI,GAAG,IAAI,CAAC;IAE1B,0DAA0D;IAC1D,YAAY,CAAC,EAAE,MAAM,GAAG,MAAM,CAAC;IAE/B,gFAAgF;IAChF,KAAK,CAAC,EAAE,OAAO,CAAC;IAEhB,gCAAgC;IAChC,KAAK,CAAC,EAAE,MAAM,CAAC;IAEf,0DAA0D;IAC1D,OAAO,CAAC,EAAE,KAAK,CAAC,SAAS,CAAC;IAE1B,wDAAwD;IACxD,QAAQ,CAAC,EAAE,KAAK,CAAC,SAAS,CAAC;IAE3B,kEAAkE;IAClE,aAAa,CAAC,EAAE,KAAK,CAAC,SAAS,CAAC;IAEhC,iDAAiD;IACjD,aAAa,CAAC,EAAE,SAAS,GAAG,kBAAkB,CAAC;IAE/C;;;;;;;;;;;;;;OAcG;IACH,aAAa,CAAC,EAAE,QAAQ,GAAG,QAAQ,CAAC;IAEpC;;;OAGG;IACH,kBAAkB,CAAC,EAAE,MAAM,CAAC;IAE5B;;;OAGG;IACH,mBAAmB,CAAC,EAAE,MAAM,CAAC;IAE7B,+DAA+D;IAC/D,oBAAoB,CAAC,EAAE,MAAM,IAAI,CAAC;IAElC,gEAAgE;IAChE,qBAAqB,CAAC,EAAE,MAAM,IAAI,CAAC;IAEnC,uBAAuB;IACvB,YAAY,CAAC,EAAE,MAAM,CAAC;IAEtB,0CAA0C;IAC1C,kBAAkB,CAAC,EAAE,MAAM,CAAC;IAE5B,sEAAsE;IACtE,YAAY,CAAC,EAAE,CAAC,GAAG,CAAC,CAAC;IAErB,6BAA6B;IAC7B,SAAS,CAAC,EAAE,MAAM,CAAC;CACpB;AA0FD,eAAO,MAAM,MAAM,EAAE,KAAK,CAAC,EAAE,CAAC,WAAW,CA2UxC,CAAC;AAEF,eAAe,MAAM,CAAC"}
@@ -0,0 +1,86 @@
1
+ import React from 'react';
2
+ import './MediaViewer.css';
3
+ export interface MediaViewerItem {
4
+ /** Image source URL */
5
+ src: string;
6
+ /** Alt text for the image */
7
+ alt?: string;
8
+ /**
9
+ * Stable identity for the item. Defaults to its position, which stays
10
+ * stable when items are appended (pagination) but not when they are
11
+ * inserted before the current one.
12
+ */
13
+ id?: string;
14
+ }
15
+ export interface MediaViewerProps {
16
+ /** Whether the viewer is open */
17
+ open: boolean;
18
+ /** The images to page through, in order */
19
+ items: MediaViewerItem[];
20
+ /** Index of the image shown (controlled) */
21
+ index: number;
22
+ /** Called with the new index after a swipe, arrow key or prev/next button */
23
+ onIndexChange: (index: number) => void;
24
+ /** Called when the viewer should close: close button, Escape or swipe down */
25
+ onClose: () => void;
26
+ /**
27
+ * Caption under the image, e.g. sender, date and message text. Render it for
28
+ * the current `index`: the slots belong to the image on screen.
29
+ */
30
+ caption?: React.ReactNode;
31
+ /** Status slot next to the caption, typically a `Badge` */
32
+ meta?: React.ReactNode;
33
+ /** Action buttons under the caption, e.g. share or "show in chat" */
34
+ actions?: React.ReactNode;
35
+ /**
36
+ * Called when the viewer gets within `endReachedThreshold` items of the end,
37
+ * so the consumer can append the next page to `items`. Called once per
38
+ * `items.length`.
39
+ */
40
+ onEndReached?: () => void;
41
+ /** How many items from the end `onEndReached` fires (default: 3) */
42
+ endReachedThreshold?: number;
43
+ /** Counter text, e.g. "3 / 24" (default) or "3 van 24" */
44
+ counterLabel?: (index: number, total: number) => string;
45
+ /** Accessible label of the close button (default: "Close") */
46
+ closeLabel?: string;
47
+ /** Accessible label of the previous button (default: "Previous") */
48
+ previousLabel?: string;
49
+ /** Accessible label of the next button (default: "Next") */
50
+ nextLabel?: string;
51
+ /** Accessible label of the viewer (default: "Media viewer") */
52
+ 'aria-label'?: string;
53
+ /** Additional CSS classes */
54
+ className?: string;
55
+ }
56
+ /**
57
+ * MediaViewer Component
58
+ *
59
+ * Full-screen viewer that shows a list of images one at a time.
60
+ *
61
+ * - **Touch:** swipe sideways to page; the image follows the finger and snaps
62
+ * to the next or previous image past a quarter of the width or on a flick.
63
+ * It doesn't move past the first or last image. Swipe down to close.
64
+ * - **Desktop:** previous/next buttons on hover or focus, and ← / →.
65
+ * - **Close:** the close button, Escape, or swiping down. A tap on the dark
66
+ * stage does not close it, so a mis-aimed tap can't swallow an action.
67
+ * - **Slots:** `caption`, `meta` (a `Badge`) and `actions` (buttons) render
68
+ * under the image for the current `index`.
69
+ * - **Pagination:** `onEndReached` fires near the end so more items can be
70
+ * appended; appending does not move the current image.
71
+ *
72
+ * The images either side of the current one are rendered (and so preloaded).
73
+ *
74
+ * @accessibility
75
+ * - Native modal `<dialog>`: focus is trapped and returns to the opener
76
+ * - The track is a carousel; each image is a labelled slide
77
+ * - The counter is announced in a polite live region
78
+ * - With reduced motion, images swap without the slide
79
+ *
80
+ * Tokens used: color-black-alpha-12, color-surface-level3,
81
+ * color-text-default-default, color-text-subtle-default, spacing-*,
82
+ * motion-duration-component, motion-easing-default, motion-easing-enter.
83
+ */
84
+ export declare const MediaViewer: React.FC<MediaViewerProps>;
85
+ export default MediaViewer;
86
+ //# sourceMappingURL=MediaViewer.d.ts.map
@@ -0,0 +1 @@
1
+ {"version":3,"file":"MediaViewer.d.ts","sourceRoot":"","sources":["../../../../components/MediaViewer/MediaViewer.tsx"],"names":[],"mappings":"AAEA,OAAO,KAAoE,MAAM,OAAO,CAAC;AAWzF,OAAO,mBAAmB,CAAC;AAE3B,MAAM,WAAW,eAAe;IAC9B,uBAAuB;IACvB,GAAG,EAAE,MAAM,CAAC;IAEZ,6BAA6B;IAC7B,GAAG,CAAC,EAAE,MAAM,CAAC;IAEb;;;;OAIG;IACH,EAAE,CAAC,EAAE,MAAM,CAAC;CACb;AAED,MAAM,WAAW,gBAAgB;IAC/B,iCAAiC;IACjC,IAAI,EAAE,OAAO,CAAC;IAEd,2CAA2C;IAC3C,KAAK,EAAE,eAAe,EAAE,CAAC;IAEzB,4CAA4C;IAC5C,KAAK,EAAE,MAAM,CAAC;IAEd,6EAA6E;IAC7E,aAAa,EAAE,CAAC,KAAK,EAAE,MAAM,KAAK,IAAI,CAAC;IAEvC,8EAA8E;IAC9E,OAAO,EAAE,MAAM,IAAI,CAAC;IAEpB;;;OAGG;IACH,OAAO,CAAC,EAAE,KAAK,CAAC,SAAS,CAAC;IAE1B,2DAA2D;IAC3D,IAAI,CAAC,EAAE,KAAK,CAAC,SAAS,CAAC;IAEvB,qEAAqE;IACrE,OAAO,CAAC,EAAE,KAAK,CAAC,SAAS,CAAC;IAE1B;;;;OAIG;IACH,YAAY,CAAC,EAAE,MAAM,IAAI,CAAC;IAE1B,oEAAoE;IACpE,mBAAmB,CAAC,EAAE,MAAM,CAAC;IAE7B,0DAA0D;IAC1D,YAAY,CAAC,EAAE,CAAC,KAAK,EAAE,MAAM,EAAE,KAAK,EAAE,MAAM,KAAK,MAAM,CAAC;IAExD,8DAA8D;IAC9D,UAAU,CAAC,EAAE,MAAM,CAAC;IAEpB,oEAAoE;IACpE,aAAa,CAAC,EAAE,MAAM,CAAC;IAEvB,4DAA4D;IAC5D,SAAS,CAAC,EAAE,MAAM,CAAC;IAEnB,+DAA+D;IAC/D,YAAY,CAAC,EAAE,MAAM,CAAC;IAEtB,6BAA6B;IAC7B,SAAS,CAAC,EAAE,MAAM,CAAC;CACpB;AA0BD;;;;;;;;;;;;;;;;;;;;;;;;;;;GA2BG;AACH,eAAO,MAAM,WAAW,EAAE,KAAK,CAAC,EAAE,CAAC,gBAAgB,CAyVlD,CAAC;AAIF,eAAe,WAAW,CAAC"}
@@ -0,0 +1,2 @@
1
+ export { MediaViewer, type MediaViewerProps, type MediaViewerItem } from './MediaViewer';
2
+ //# sourceMappingURL=index.d.ts.map
@@ -0,0 +1 @@
1
+ {"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../../components/MediaViewer/index.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,WAAW,EAAE,KAAK,gBAAgB,EAAE,KAAK,eAAe,EAAE,MAAM,eAAe,CAAC"}
@@ -0,0 +1,35 @@
1
+ /**
2
+ * Pure gesture maths for `MediaViewer`, kept out of the component so the
3
+ * swipe and dismiss decisions are unit-testable without pointer events.
4
+ */
5
+ /** Movement (px) before a drag commits to an axis. */
6
+ export declare const AXIS_LOCK_DISTANCE = 8;
7
+ /** Fraction of the stage width a slow horizontal drag must pass to page. */
8
+ export declare const SWIPE_DISTANCE_RATIO = 0.25;
9
+ /** Velocity (px/ms) that pages even on a short horizontal flick. */
10
+ export declare const SWIPE_VELOCITY = 0.5;
11
+ /** Minimum distance (px) a flick must travel to count. */
12
+ export declare const FLICK_MIN_DISTANCE = 20;
13
+ /** Downward distance (px) that dismisses on a slow drag. */
14
+ export declare const DISMISS_DISTANCE = 120;
15
+ /** Downward velocity (px/ms) that dismisses on a short flick. */
16
+ export declare const DISMISS_VELOCITY = 0.5;
17
+ export type DragAxis = 'x' | 'y';
18
+ /**
19
+ * Decide which axis a drag belongs to, or null while it is still within the
20
+ * lock distance. Horizontal wins ties so a diagonal flick still pages.
21
+ */
22
+ export declare function lockAxis(dx: number, dy: number): DragAxis | null;
23
+ /**
24
+ * Clamp a horizontal drag so it cannot move past the first or last item:
25
+ * there is nothing to reveal there, so the image stays put (no rubber band).
26
+ */
27
+ export declare function clampDragX(dx: number, hasPrevious: boolean, hasNext: boolean): number;
28
+ /**
29
+ * Where a released horizontal drag goes: `1` to the next item, `-1` to the
30
+ * previous one, `0` back to the current one. `dx` is already clamped.
31
+ */
32
+ export declare function resolveSwipe(dx: number, velocityX: number, stageWidth: number): -1 | 0 | 1;
33
+ /** Whether a released downward drag dismisses the viewer. */
34
+ export declare function resolveDismiss(dy: number, velocityY: number): boolean;
35
+ //# sourceMappingURL=mediaViewerGestures.d.ts.map
@@ -0,0 +1 @@
1
+ {"version":3,"file":"mediaViewerGestures.d.ts","sourceRoot":"","sources":["../../../../components/MediaViewer/mediaViewerGestures.ts"],"names":[],"mappings":"AAAA;;;GAGG;AAEH,sDAAsD;AACtD,eAAO,MAAM,kBAAkB,IAAI,CAAC;AAEpC,4EAA4E;AAC5E,eAAO,MAAM,oBAAoB,OAAO,CAAC;AAEzC,oEAAoE;AACpE,eAAO,MAAM,cAAc,MAAM,CAAC;AAElC,0DAA0D;AAC1D,eAAO,MAAM,kBAAkB,KAAK,CAAC;AAErC,4DAA4D;AAC5D,eAAO,MAAM,gBAAgB,MAAM,CAAC;AAEpC,iEAAiE;AACjE,eAAO,MAAM,gBAAgB,MAAM,CAAC;AAEpC,MAAM,MAAM,QAAQ,GAAG,GAAG,GAAG,GAAG,CAAC;AAEjC;;;GAGG;AACH,wBAAgB,QAAQ,CAAC,EAAE,EAAE,MAAM,EAAE,EAAE,EAAE,MAAM,GAAG,QAAQ,GAAG,IAAI,CAGhE;AAED;;;GAGG;AACH,wBAAgB,UAAU,CAAC,EAAE,EAAE,MAAM,EAAE,WAAW,EAAE,OAAO,EAAE,OAAO,EAAE,OAAO,GAAG,MAAM,CAIrF;AAED;;;GAGG;AACH,wBAAgB,YAAY,CAAC,EAAE,EAAE,MAAM,EAAE,SAAS,EAAE,MAAM,EAAE,UAAU,EAAE,MAAM,GAAG,CAAC,CAAC,GAAG,CAAC,GAAG,CAAC,CAQ1F;AAED,6DAA6D;AAC7D,wBAAgB,cAAc,CAAC,EAAE,EAAE,MAAM,EAAE,SAAS,EAAE,MAAM,GAAG,OAAO,CAIrE"}
@@ -12,6 +12,24 @@ export interface ThumbnailProps extends Omit<React.HTMLAttributes<HTMLDivElement
12
12
  * - `'ellipse'` — 120×120 circle
13
13
  */
14
14
  shape?: 'ellipse' | '1:1' | '4:3';
15
+ /**
16
+ * When true the tile fills its parent's width and takes its height from the
17
+ * shape's aspect ratio, instead of the fixed 160×120 / 120×120 size. Use it
18
+ * for responsive grids, e.g. a 3-column photo gallery.
19
+ */
20
+ fluid?: boolean;
21
+ /**
22
+ * When true the image is lazy loaded (`loading="lazy"`): the browser fetches
23
+ * it only as it nears the viewport. Until then the empty frame shows its
24
+ * neutral surface. Use it for long galleries.
25
+ */
26
+ lazy?: boolean;
27
+ /**
28
+ * Extra attributes for the `<img>`, e.g. `srcSet` and `sizes` to serve a small
29
+ * rendition, or `onError`. `src`, `alt` and `className` are set by the
30
+ * component.
31
+ */
32
+ imgProps?: Omit<React.ImgHTMLAttributes<HTMLImageElement>, 'src' | 'alt' | 'className'>;
15
33
  /**
16
34
  * When true the thumbnail shows an upload overlay with a progress donut.
17
35
  * Interaction (hover zoom, click, remove) is suppressed while loading.
@@ -67,6 +85,9 @@ export interface ThumbnailProps extends Omit<React.HTMLAttributes<HTMLDivElement
67
85
  * and clicking activates `onClick` (e.g. to enlarge in a dialog).
68
86
  * - **removable** — a tertiary × button in the top-right corner calls
69
87
  * `onRemove` to delete the photo.
88
+ * - **fluid** — fills its parent's width at the shape's aspect ratio, for
89
+ * responsive grids; **lazy** defers loading the image until it nears the
90
+ * viewport.
70
91
  *
71
92
  * Tokens used: border-radius-lg, color-black-alpha-3, dialog-color-backdrop,
72
93
  * button-color-tertiary-*, alias-color-state-error-*, alert-color-error-accent,
@@ -1 +1 @@
1
- {"version":3,"file":"Thumbnail.d.ts","sourceRoot":"","sources":["../../../../components/Thumbnail/Thumbnail.tsx"],"names":[],"mappings":"AAEA,OAAO,KAAqB,MAAM,OAAO,CAAC;AAG1C,OAAO,iBAAiB,CAAC;AAEzB,MAAM,WAAW,cACf,SAAQ,IAAI,CAAC,KAAK,CAAC,cAAc,CAAC,cAAc,CAAC,EAAE,SAAS,CAAC;IAC7D,uBAAuB;IACvB,GAAG,EAAE,MAAM,CAAC;IAEZ,6BAA6B;IAC7B,GAAG,CAAC,EAAE,MAAM,CAAC;IAEb;;;;;OAKG;IACH,KAAK,CAAC,EAAE,SAAS,GAAG,KAAK,GAAG,KAAK,CAAC;IAElC;;;OAGG;IACH,OAAO,CAAC,EAAE,OAAO,CAAC;IAElB,yEAAyE;IACzE,QAAQ,CAAC,EAAE,MAAM,CAAC;IAElB;;;;OAIG;IACH,UAAU,CAAC,EAAE,OAAO,CAAC;IAErB;;;;OAIG;IACH,KAAK,CAAC,EAAE,OAAO,CAAC;IAEhB,kEAAkE;IAClE,OAAO,CAAC,EAAE,MAAM,CAAC;IAEjB,2EAA2E;IAC3E,WAAW,CAAC,EAAE,MAAM,CAAC;IAErB;;;OAGG;IACH,QAAQ,CAAC,EAAE,MAAM,IAAI,CAAC;IAEtB;;;OAGG;IACH,OAAO,CAAC,EAAE,MAAM,IAAI,CAAC;IAErB,uEAAuE;IACvE,WAAW,CAAC,EAAE,MAAM,CAAC;IAErB,uEAAuE;IACvE,SAAS,CAAC,EAAE,MAAM,CAAC;IAEnB,6BAA6B;IAC7B,SAAS,CAAC,EAAE,MAAM,CAAC;CACpB;AAED;;;;;;;;;;;;;;;;;;;GAmBG;AACH,eAAO,MAAM,SAAS,uFAuGrB,CAAC;AAIF,eAAe,SAAS,CAAC"}
1
+ {"version":3,"file":"Thumbnail.d.ts","sourceRoot":"","sources":["../../../../components/Thumbnail/Thumbnail.tsx"],"names":[],"mappings":"AAEA,OAAO,KAAqB,MAAM,OAAO,CAAC;AAG1C,OAAO,iBAAiB,CAAC;AAEzB,MAAM,WAAW,cACf,SAAQ,IAAI,CAAC,KAAK,CAAC,cAAc,CAAC,cAAc,CAAC,EAAE,SAAS,CAAC;IAC7D,uBAAuB;IACvB,GAAG,EAAE,MAAM,CAAC;IAEZ,6BAA6B;IAC7B,GAAG,CAAC,EAAE,MAAM,CAAC;IAEb;;;;;OAKG;IACH,KAAK,CAAC,EAAE,SAAS,GAAG,KAAK,GAAG,KAAK,CAAC;IAElC;;;;OAIG;IACH,KAAK,CAAC,EAAE,OAAO,CAAC;IAEhB;;;;OAIG;IACH,IAAI,CAAC,EAAE,OAAO,CAAC;IAEf;;;;OAIG;IACH,QAAQ,CAAC,EAAE,IAAI,CAAC,KAAK,CAAC,iBAAiB,CAAC,gBAAgB,CAAC,EAAE,KAAK,GAAG,KAAK,GAAG,WAAW,CAAC,CAAC;IAExF;;;OAGG;IACH,OAAO,CAAC,EAAE,OAAO,CAAC;IAElB,yEAAyE;IACzE,QAAQ,CAAC,EAAE,MAAM,CAAC;IAElB;;;;OAIG;IACH,UAAU,CAAC,EAAE,OAAO,CAAC;IAErB;;;;OAIG;IACH,KAAK,CAAC,EAAE,OAAO,CAAC;IAEhB,kEAAkE;IAClE,OAAO,CAAC,EAAE,MAAM,CAAC;IAEjB,2EAA2E;IAC3E,WAAW,CAAC,EAAE,MAAM,CAAC;IAErB;;;OAGG;IACH,QAAQ,CAAC,EAAE,MAAM,IAAI,CAAC;IAEtB;;;OAGG;IACH,OAAO,CAAC,EAAE,MAAM,IAAI,CAAC;IAErB,uEAAuE;IACvE,WAAW,CAAC,EAAE,MAAM,CAAC;IAErB,uEAAuE;IACvE,SAAS,CAAC,EAAE,MAAM,CAAC;IAEnB,6BAA6B;IAC7B,SAAS,CAAC,EAAE,MAAM,CAAC;CACpB;AAED;;;;;;;;;;;;;;;;;;;;;;GAsBG;AACH,eAAO,MAAM,SAAS,uFAoHrB,CAAC;AAIF,eAAe,SAAS,CAAC"}
@@ -88,6 +88,7 @@ export { LicensePlateInput, type LicensePlateInputProps, } from './LicensePlateI
88
88
  export { SocialSignInButton, type SocialSignInButtonProps, type SocialSignInProvider, type SocialSignInColor, type SocialSignInSize, type SocialSignInLabel, } from './SocialSignInButton';
89
89
  export type { AccordionProps, AccordionItemProps, AccordionTriggerProps, AccordionContentProps, } from './Accordion';
90
90
  export { Thumbnail, type ThumbnailProps } from './Thumbnail';
91
+ export { MediaViewer, type MediaViewerProps, type MediaViewerItem, } from './MediaViewer';
91
92
  export { PhotoUploader, type PhotoUploaderProps, } from './PhotoUploader';
92
93
  export { TextLink, type TextLinkProps } from './TextLink';
93
94
  //# sourceMappingURL=index.d.ts.map
@@ -1 +1 @@
1
- {"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../components/index.ts"],"names":[],"mappings":"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"}
1
+ {"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../components/index.ts"],"names":[],"mappings":"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"}
@@ -214,8 +214,12 @@ const link = document.getElementById('muka-theme') as HTMLLinkElement;
214
214
  link.href = `/styles/tokens-acme-${mode}.css`;
215
215
  ```
216
216
 
217
- Copy the generated CSS into your static/public directory so those hrefs resolve.
218
- This is exactly how Muka's own Storybook switches between its ten themes.
217
+ Those hrefs need the generated CSS at a stable URL: have your token build write
218
+ or copy it into your static/public directory, as part of the same `build:tokens`
219
+ step described under [Keeping your brand current](#keeping-your-brand-current).
220
+ Don't keep a hand-made copy there — it stays frozen while the light stylesheet
221
+ moves on, and any token missing from the dark copy shows its light value in dark
222
+ mode. This is exactly how Muka's own Storybook switches between its ten themes.
219
223
 
220
224
  ## Keeping your brand current
221
225
 
@@ -71,9 +71,41 @@ document.getElementById('muka-theme').href =
71
71
  `/styles/tokens-${brand}-${mode}.css`;
72
72
  ```
73
73
 
74
- Copy the token CSS you need into your static/public directory (or let your
75
- bundler emit it at a stable URL) so those hrefs resolve. Muka's own Storybook
76
- switches between all ten themes exactly this way — see
74
+ Those hrefs need the token CSS at a stable URL. Copy it from the installed
75
+ package **as part of every `dev` and `build`** (or let your bundler emit it), so
76
+ it always matches the Muka version you have installed:
77
+
78
+ ```js
79
+ // scripts/sync-theme-tokens.mjs
80
+ import { copyFileSync, mkdirSync } from 'node:fs';
81
+ import { createRequire } from 'node:module';
82
+
83
+ const require = createRequire(import.meta.url);
84
+ mkdirSync('public/styles', { recursive: true });
85
+ for (const mode of ['light', 'dark']) {
86
+ const file = `tokens-muka-${mode}.css`;
87
+ copyFileSync(require.resolve(`@revikornmann/muka-ui/styles/${file}`), `public/styles/${file}`);
88
+ }
89
+ ```
90
+
91
+ ```json
92
+ "scripts": {
93
+ "sync:themes": "node scripts/sync-theme-tokens.mjs",
94
+ "dev": "npm run sync:themes && next dev",
95
+ "build": "npm run sync:themes && next build"
96
+ }
97
+ ```
98
+
99
+ Gitignore the copies (`public/styles/tokens-*.css`). Chain the script into
100
+ `dev` and `build` rather than using `predev` / `prebuild`: pnpm 9 skips `pre*`
101
+ scripts by default.
102
+
103
+ **Never commit a hand-made copy.** It is frozen at the version you copied, and
104
+ each Muka release adds tokens it lacks. A token missing from the dark copy keeps
105
+ the value from the light stylesheet, so new components show light colours in
106
+ dark mode (e.g. a white ring around grouped avatars).
107
+
108
+ Muka's own Storybook switches between all ten themes this way — see
77
109
  `.storybook/ThemeDecorator.ts` in the repo.
78
110
 
79
111
  ### `data-layout`: the one attribute that does do something
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "@revikornmann/muka-ui",
3
- "version": "0.27.2",
3
+ "version": "0.28.0",
4
4
  "description": "Muka Design System - Multi-brand design tokens and React components",
5
5
  "main": "dist/cjs/components/index.js",
6
6
  "module": "dist/esm/components/index.js",
@@ -82,9 +82,42 @@ const link = document.getElementById('muka-theme') as HTMLLinkElement;
82
82
  link.href = `/styles/tokens-${brand}-${mode}.css`;
83
83
  ```
84
84
 
85
- Copy the brand's token CSS into the app's static/public directory (or let the
86
- bundler emit it with a stable URL) so those hrefs resolve. This is exactly what
87
- Muka's own Storybook does.
85
+ Those hrefs need the brand's token CSS at a stable URL. Add a script that copies
86
+ it from the installed package into the app's static/public directory, run it
87
+ before `dev` and `build`, and gitignore the copies (or let the bundler emit the
88
+ CSS). Use the brand the app actually loads in place of `muka`:
89
+
90
+ ```js
91
+ // scripts/sync-theme-tokens.mjs
92
+ import { copyFileSync, mkdirSync } from 'node:fs';
93
+ import { createRequire } from 'node:module';
94
+
95
+ const require = createRequire(import.meta.url);
96
+ mkdirSync('public/styles', { recursive: true });
97
+ for (const mode of ['light', 'dark']) {
98
+ const file = `tokens-muka-${mode}.css`;
99
+ copyFileSync(require.resolve(`@revikornmann/muka-ui/styles/${file}`), `public/styles/${file}`);
100
+ }
101
+ ```
102
+
103
+ ```json
104
+ "scripts": {
105
+ "sync:themes": "node scripts/sync-theme-tokens.mjs",
106
+ "dev": "npm run sync:themes && next dev",
107
+ "build": "npm run sync:themes && next build"
108
+ }
109
+ ```
110
+
111
+ Gitignore the copies (`public/styles/tokens-*.css`). Chain the script into
112
+ `dev` and `build` rather than using `predev` / `prebuild`: pnpm 9 skips `pre*`
113
+ scripts by default.
114
+
115
+ **Never commit a hand-made copy.** It is frozen at the version you copied, and
116
+ each Muka release adds tokens it lacks. A token missing from the dark copy keeps
117
+ the value from the light stylesheet, so new components show light colours in
118
+ dark mode (e.g. a white ring around grouped avatars).
119
+
120
+ This is exactly how Muka's own Storybook switches themes.
88
121
 
89
122
  ### Fonts come from Muka — do not load them yourself
90
123
 
@@ -38,6 +38,38 @@
38
38
  "$value": "{size.10xl}"
39
39
  }
40
40
  },
41
+ "icon": {
42
+ "size": {
43
+ "3xs": {
44
+ "$type": "sizing",
45
+ "$value": "{size.md}"
46
+ },
47
+ "2xs": {
48
+ "$type": "sizing",
49
+ "$value": "{size.lg}"
50
+ },
51
+ "xs": {
52
+ "$type": "sizing",
53
+ "$value": "{size.xl}"
54
+ },
55
+ "sm": {
56
+ "$type": "sizing",
57
+ "$value": "{size.2xl}"
58
+ },
59
+ "md": {
60
+ "$type": "sizing",
61
+ "$value": "{size.3xl}"
62
+ },
63
+ "lg": {
64
+ "$type": "sizing",
65
+ "$value": "{size.4xl}"
66
+ },
67
+ "xl": {
68
+ "$type": "sizing",
69
+ "$value": "{size.6xl}"
70
+ }
71
+ }
72
+ },
41
73
  "color": {
42
74
  "background": {
43
75
  "default": {
@@ -52,7 +84,7 @@
52
84
  "foreground": {
53
85
  "default": {
54
86
  "$type": "color",
55
- "$value": "{color.text.default.default}"
87
+ "$value": "{color.text.subtle.default}"
56
88
  },
57
89
  "muted": {
58
90
  "$type": "color",