@moshevents/tokens 0.3.0 → 0.4.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 (7) hide show
  1. package/README.md +55 -1
  2. package/dist/icons.d.ts +10 -0
  3. package/dist/icons.js +121 -0
  4. package/dist/theme.css +8 -0
  5. package/dist/tokens.css +9 -1
  6. package/icons/icons.json +89 -0
  7. package/package.json +12 -4
package/README.md CHANGED
@@ -4,13 +4,17 @@
4
4
  (`tokens.json`), regenerate, and every platform consumes the same values.
5
5
 
6
6
  ```
7
- tokens.json ← the ONLY file you hand-edit (colors, surfaces, type, spacing, radii, …)
7
+ tokens.json ← hand-edited: colors, surfaces, type, spacing, radii, …
8
+ icons/icons.json ← hand-edited: the icon set, product-name aliases, stroke rule
8
9
  build.mjs ← dependency-free generator (run with plain node)
9
10
  dist/ → npm package @moshevents/tokens (web/admin)
10
11
  tokens.css → website (Next.js): CSS custom properties
11
12
  theme.css → admin (Tailwind v4): an @theme block, mapped into Tailwind namespaces
13
+ icons.js / icons.d.ts → icon markup, aliases, stroke rule, iconSvg() helper
12
14
  Sources/MoshTokens/ → SwiftPM package MoshTokens (iOS)
13
15
  MoshTokens.swift → UIColor / SwiftUI Color + CGFloat / UIFont.Weight constants
16
+ MoshIconData.swift → every icon flattened to native path data (generated)
17
+ MoshIcon.swift → MoshIcon view + UIKit image helper (hand-written)
14
18
  Package.swift ← SwiftPM manifest
15
19
  showcase/ → the human-facing bundle synced to the claude.ai "Mosh Design System"
16
20
  ```
@@ -91,6 +95,52 @@ buttons, errors, status meanings (success/warning/danger) or focus rings. One vi
91
95
  type per view, like one primary button per view. The dashboard slots `--vd-secondary` /
92
96
  `--vd-secondary-text` live in the website's `packages/ui/base.css`.
93
97
 
98
+ ### Switches and navigation
99
+
100
+ - **Switches:** `--color-switch-on` (green) when on, `--color-switch-off` when off — on web
101
+ and iOS alike. Never black, never brand red (Garrett, 2026-11-07).
102
+ - **Tabs / nav:** the selected item is its **filled** icon in `--color-nav-selected`
103
+ (black on light, white on dark); unselected items are the outline icon in
104
+ `--color-nav-unselected`. Never brand red (2026-11-06). `--text-brand` is for links and
105
+ brand moments, not selected nav.
106
+
107
+ ## Icons
108
+
109
+ One icon set for web and iOS, in `icons/icons.json`. Icons are **stock Lucide** under
110
+ their Lucide names (the same set `lucide-react` ships), so the app matches the web
111
+ dashboard, plus two Mosh custom icons: `concierge` (bell with a knob) and `payouts`
112
+ (a stack of cash). Product names map to icons through `aliases` (`door` → `door-open`,
113
+ `audience` → `users-round`, …). `filled` holds the selected-tab variants.
114
+
115
+ **One visual weight across sizes:** stroke 2px at 24, 1.75px at 20, 1.5px at 16
116
+ (interpolated between). Both platforms apply it for you.
117
+
118
+ **Web:**
119
+
120
+ ```js
121
+ import { iconSvg, resolveIcon, ICON_ALIASES, CUSTOM_ICONS } from "@moshevents/tokens/icons";
122
+ el.innerHTML = iconSvg("payouts", { size: 20 }); // custom icons come from here
123
+ const name = resolveIcon("door"); // "door-open" → <DoorOpen /> in lucide-react
124
+ ```
125
+
126
+ Stock icons can keep rendering through `lucide-react`; use `ICON_ALIASES` for product
127
+ names and `iconSvg` for `CUSTOM_ICONS`.
128
+
129
+ **iOS:**
130
+
131
+ ```swift
132
+ import MoshTokens
133
+ MoshIcon(.payouts, size: 20) // SwiftUI; color from .foregroundStyle
134
+ MoshIcon(.home, size: 24, filled: true) // selected tab
135
+ MoshIconName.home.image(size: 24, filled: true) // UIKit template image (tab bar items)
136
+ MoshIconName(product: "door") // product or Lucide name → icon
137
+ ```
138
+
139
+ No SF Symbols or one-off image assets for anything this set covers. Adding an icon: paste
140
+ its Lucide markup into `icons` (or a filled variant into `filled`), run `npm run build`.
141
+ Masks, groups and transforms aren't supported (iOS draws plain paths) — express a cut-out
142
+ as an `evenodd` fill instead. Lucide is © Lucide Contributors, ISC License.
143
+
94
144
  ## Releasing
95
145
 
96
146
  Publishing is **Trusted Publishing (OIDC)** — no token or secret. One-time setup:
@@ -112,6 +162,10 @@ is where a designer views the palette, type scale, and — as we add them — co
112
162
  galleries, without checking out code. `tokens.json` is the machine source; the claude.ai
113
163
  project is the rendered view of the same values. **One source, two audiences.**
114
164
 
165
+ Changes flow one way: decide it here, build, then `/design-sync` to the claude.ai project.
166
+ Never edit the claude.ai project directly — the next sync overwrites it and the apps never
167
+ see the change.
168
+
115
169
  ## Notes / open decisions
116
170
 
117
171
  - **Light values are the neutral ramp** (matches iOS `Theme.swift` and the public website:
package/dist/icons.d.ts ADDED
@@ -0,0 +1,10 @@
1
+ /* AUTO-GENERATED from icons/icons.json by build.mjs — do not edit by hand. */
2
+ export declare const ICONS: Record<string, string>;
3
+ export declare const FILLED_ICONS: Record<string, string>;
4
+ export declare const ICON_ALIASES: Record<string, string>;
5
+ export declare const ICON_STROKE_WIDTHS: Record<string, number>;
6
+ export declare const CUSTOM_ICONS: string[];
7
+ export declare const ICON_NAMES: string[];
8
+ export declare function resolveIcon(name: string): string | undefined;
9
+ export declare function iconStrokeWidth(size: number): number;
10
+ export declare function iconSvg(name: string, options?: { size?: number; filled?: boolean; title?: string }): string;
package/dist/icons.js ADDED
@@ -0,0 +1,121 @@
1
+ /* AUTO-GENERATED from icons/icons.json by build.mjs — do not edit by hand. */
2
+ // Mosh icon set for web. Stock icons are Lucide (same names as lucide-react); `custom`
3
+ // lists the Mosh-only icons. Markup is the inner content of a 24×24 viewBox.
4
+ const DATA = {
5
+ "icons": {
6
+ "banknote": "<rect width=\"20\" height=\"12\" x=\"2\" y=\"6\" rx=\"2\"/><circle cx=\"12\" cy=\"12\" r=\"2\"/><path d=\"M6 12h.01M18 12h.01\"/>",
7
+ "bell": "<path d=\"M10.268 21a2 2 0 0 0 3.464 0\"/><path d=\"M3.262 15.326A1 1 0 0 0 4 17h16a1 1 0 0 0 .74-1.673C19.41 13.956 18 12.499 18 8A6 6 0 0 0 6 8c0 4.499-1.411 5.956-2.738 7.326\"/>",
8
+ "calendar": "<path d=\"M8 2v4\"/><path d=\"M16 2v4\"/><rect width=\"18\" height=\"18\" x=\"3\" y=\"4\" rx=\"2\"/><path d=\"M3 10h18\"/>",
9
+ "check": "<path d=\"M20 6 9 17l-5-5\"/>",
10
+ "chevron-down": "<path d=\"m6 9 6 6 6-6\"/>",
11
+ "chevron-left": "<path d=\"m15 18-6-6 6-6\"/>",
12
+ "chevron-right": "<path d=\"m9 18 6-6-6-6\"/>",
13
+ "chevrons-up-down": "<path d=\"m7 15 5 5 5-5\"/><path d=\"m7 9 5-5 5 5\"/>",
14
+ "concierge": "<path d=\"M3 21a1 1 0 0 1-1-1v-1a2 2 0 0 1 2-2h16a2 2 0 0 1 2 2v1a1 1 0 0 1-1 1Z\"/><path d=\"M21 17a9 9 0 1 0-18 0\"/><path d=\"M10 5a2 2 0 0 1 4 0\"/>",
15
+ "concierge-bell": "<path d=\"M3 20a1 1 0 0 1-1-1v-1a2 2 0 0 1 2-2h16a2 2 0 0 1 2 2v1a1 1 0 0 1-1 1Z\"/><path d=\"M20 16a8 8 0 1 0-16 0\"/><path d=\"M12 4v4\"/><path d=\"M10 4h4\"/>",
16
+ "copy": "<rect width=\"14\" height=\"14\" x=\"8\" y=\"8\" rx=\"2\" ry=\"2\"/><path d=\"M4 16c-1.1 0-2-.9-2-2V4c0-1.1.9-2 2-2h10c1.1 0 2 .9 2 2\"/>",
17
+ "credit-card": "<rect width=\"20\" height=\"14\" x=\"2\" y=\"5\" rx=\"2\"/><line x1=\"2\" x2=\"22\" y1=\"10\" y2=\"10\"/>",
18
+ "dollar-sign": "<line x1=\"12\" x2=\"12\" y1=\"2\" y2=\"22\"/><path d=\"M17 5H9.5a3.5 3.5 0 0 0 0 7h5a3.5 3.5 0 0 1 0 7H6\"/>",
19
+ "door-open": "<path d=\"M11 20H2\"/><path d=\"M11 4.562v16.157a1 1 0 0 0 1.242.97L19 20V5.562a2 2 0 0 0-1.515-1.94l-4-1A2 2 0 0 0 11 4.561z\"/><path d=\"M11 4H8a2 2 0 0 0-2 2v14\"/><path d=\"M14 12h.01\"/><path d=\"M22 20h-3\"/>",
20
+ "ellipsis": "<circle cx=\"12\" cy=\"12\" r=\"1\"/><circle cx=\"19\" cy=\"12\" r=\"1\"/><circle cx=\"5\" cy=\"12\" r=\"1\"/>",
21
+ "external-link": "<path d=\"M15 3h6v6\"/><path d=\"M10 14 21 3\"/><path d=\"M18 13v6a2 2 0 0 1-2 2H5a2 2 0 0 1-2-2V8a2 2 0 0 1 2-2h6\"/>",
22
+ "globe": "<circle cx=\"12\" cy=\"12\" r=\"10\"/><path d=\"M12 2a14.5 14.5 0 0 0 0 20 14.5 14.5 0 0 0 0-20\"/><path d=\"M2 12h20\"/>",
23
+ "house": "<path d=\"M3 10a2 2 0 0 1 .7-1.5l7-6a2 2 0 0 1 2.6 0l7 6a2 2 0 0 1 .7 1.5v9a2 2 0 0 1-2 2H5a2 2 0 0 1-2-2z\"/><path d=\"M15 21v-8a1 1 0 0 0-1-1h-4a1 1 0 0 0-1 1v8\"/>",
24
+ "id-card": "<rect width=\"20\" height=\"14\" x=\"2\" y=\"5\" rx=\"2\"/><circle cx=\"8\" cy=\"12\" r=\"2\"/><path d=\"M14 10h4\"/><path d=\"M14 14h4\"/>",
25
+ "inbox": "<polyline points=\"22 12 16 12 14 15 10 15 8 12 2 12\"/><path d=\"M5.45 5.11 2 12v6a2 2 0 0 0 2 2h16a2 2 0 0 0 2-2v-6l-3.45-6.89A2 2 0 0 0 16.76 4H7.24a2 2 0 0 0-1.79 1.11z\"/>",
26
+ "instagram": "<rect width=\"20\" height=\"20\" x=\"2\" y=\"2\" rx=\"5\" ry=\"5\"/><path d=\"M16 11.37A4 4 0 1 1 12.63 8 4 4 0 0 1 16 11.37z\"/><line x1=\"17.5\" x2=\"17.51\" y1=\"6.5\" y2=\"6.5\"/>",
27
+ "mail": "<rect width=\"20\" height=\"16\" x=\"2\" y=\"4\" rx=\"2\"/><path d=\"m22 7-8.97 5.7a1.94 1.94 0 0 1-2.06 0L2 7\"/>",
28
+ "map-pin": "<path d=\"M20 10c0 4.993-5.539 10.193-7.399 11.799a1 1 0 0 1-1.202 0C9.539 20.193 4 14.993 4 10a8 8 0 0 1 16 0\"/><circle cx=\"12\" cy=\"10\" r=\"3\"/>",
29
+ "maximize-2": "<polyline points=\"15 3 21 3 21 9\"/><polyline points=\"9 21 3 21 3 15\"/><line x1=\"21\" x2=\"14\" y1=\"3\" y2=\"10\"/><line x1=\"3\" x2=\"10\" y1=\"21\" y2=\"14\"/>",
30
+ "message-circle": "<path d=\"M7.9 20A9 9 0 1 0 4 16.1L2 22Z\"/>",
31
+ "nfc": "<path d=\"M6 8.32a7.43 7.43 0 0 1 0 7.36\"/><path d=\"M9.46 6.21a11.76 11.76 0 0 1 0 11.58\"/><path d=\"M12.91 4.1a15.91 15.91 0 0 1 .01 15.8\"/><path d=\"M16.37 2a20.16 20.16 0 0 1 0 20\"/>",
32
+ "palette": "<path d=\"M12 22a1 1 0 0 1 0-20 10 9 0 0 1 10 9 5 5 0 0 1-5 5h-2.25a1.75 1.75 0 0 0-1.4 2.8l.3.4a1.75 1.75 0 0 1-1.4 2.8z\"/><circle cx=\"13.5\" cy=\"6.5\" r=\".5\" fill=\"currentColor\"/><circle cx=\"17.5\" cy=\"10.5\" r=\".5\" fill=\"currentColor\"/><circle cx=\"6.5\" cy=\"12.5\" r=\".5\" fill=\"currentColor\"/><circle cx=\"8.5\" cy=\"7.5\" r=\".5\" fill=\"currentColor\"/>",
33
+ "payouts": "<path d=\"M6 6V5a2 2 0 0 1 2-2h12a2 2 0 0 1 2 2v8a2 2 0 0 1-2 2h-1\"/><rect width=\"16\" height=\"12\" x=\"2\" y=\"8\" rx=\"2\"/><circle cx=\"10\" cy=\"14\" r=\"2\"/>",
34
+ "pencil": "<path d=\"M21.174 6.812a1 1 0 0 0-3.986-3.987L3.842 16.174a2 2 0 0 0-.5.83l-1.321 4.352a.5.5 0 0 0 .623.622l4.353-1.32a2 2 0 0 0 .83-.497z\"/><path d=\"m15 5 4 4\"/>",
35
+ "plug": "<path d=\"M12 22v-5\"/><path d=\"M9 8V2\"/><path d=\"M15 8V2\"/><path d=\"M18 8v5a4 4 0 0 1-4 4h-4a4 4 0 0 1-4-4V8Z\"/>",
36
+ "plus": "<path d=\"M5 12h14\"/><path d=\"M12 5v14\"/>",
37
+ "qr-code": "<rect width=\"5\" height=\"5\" x=\"3\" y=\"3\" rx=\"1\"/><rect width=\"5\" height=\"5\" x=\"16\" y=\"3\" rx=\"1\"/><rect width=\"5\" height=\"5\" x=\"3\" y=\"16\" rx=\"1\"/><path d=\"M21 16h-3a2 2 0 0 0-2 2v3\"/><path d=\"M21 21v.01\"/><path d=\"M12 7v3a2 2 0 0 1-2 2H7\"/><path d=\"M3 12h.01\"/><path d=\"M12 3h.01\"/><path d=\"M12 16v.01\"/><path d=\"M16 12h1\"/><path d=\"M21 12v.01\"/><path d=\"M12 21v-1\"/>",
38
+ "scan-line": "<path d=\"M3 7V5a2 2 0 0 1 2-2h2\"/><path d=\"M17 3h2a2 2 0 0 1 2 2v2\"/><path d=\"M21 17v2a2 2 0 0 1-2 2h-2\"/><path d=\"M7 21H5a2 2 0 0 1-2-2v-2\"/><path d=\"M7 12h10\"/>",
39
+ "search": "<circle cx=\"11\" cy=\"11\" r=\"8\"/><path d=\"m21 21-4.3-4.3\"/>",
40
+ "settings": "<path d=\"M12.22 2h-.44a2 2 0 0 0-2 2v.18a2 2 0 0 1-1 1.73l-.43.25a2 2 0 0 1-2 0l-.15-.08a2 2 0 0 0-2.73.73l-.22.38a2 2 0 0 0 .73 2.73l.15.1a2 2 0 0 1 1 1.72v.51a2 2 0 0 1-1 1.74l-.15.09a2 2 0 0 0-.73 2.73l.22.38a2 2 0 0 0 2.73.73l.15-.08a2 2 0 0 1 2 0l.43.25a2 2 0 0 1 1 1.73V20a2 2 0 0 0 2 2h.44a2 2 0 0 0 2-2v-.18a2 2 0 0 1 1-1.73l.43-.25a2 2 0 0 1 2 0l.15.08a2 2 0 0 0 2.73-.73l.22-.39a2 2 0 0 0-.73-2.73l-.15-.08a2 2 0 0 1-1-1.74v-.5a2 2 0 0 1 1-1.74l.15-.09a2 2 0 0 0 .73-2.73l-.22-.38a2 2 0 0 0-2.73-.73l-.15.08a2 2 0 0 1-2 0l-.43-.25a2 2 0 0 1-1-1.73V4a2 2 0 0 0-2-2z\"/><circle cx=\"12\" cy=\"12\" r=\"3\"/>",
41
+ "shield-alert": "<path d=\"M20 13c0 5-3.5 7.5-7.66 8.95a1 1 0 0 1-.67-.01C7.5 20.5 4 18 4 13V6a1 1 0 0 1 1-1c2 0 4.5-1.2 6.24-2.72a1.17 1.17 0 0 1 1.52 0C14.51 3.81 17 5 19 5a1 1 0 0 1 1 1z\"/><path d=\"M12 8v4\"/><path d=\"M12 16h.01\"/>",
42
+ "square-check": "<rect width=\"18\" height=\"18\" x=\"3\" y=\"3\" rx=\"2\"/><path d=\"m9 12 2 2 4-4\"/>",
43
+ "star": "<path d=\"M11.525 2.295a.53.53 0 0 1 .95 0l2.31 4.679a2.123 2.123 0 0 0 1.595 1.16l5.166.756a.53.53 0 0 1 .294.904l-3.736 3.638a2.123 2.123 0 0 0-.611 1.878l.882 5.14a.53.53 0 0 1-.771.56l-4.618-2.428a2.122 2.122 0 0 0-1.973 0L6.396 21.01a.53.53 0 0 1-.77-.56l.881-5.139a2.122 2.122 0 0 0-.611-1.879L2.16 9.795a.53.53 0 0 1 .294-.906l5.165-.755a2.122 2.122 0 0 0 1.597-1.16z\"/>",
44
+ "store": "<path d=\"m2 7 4.41-4.41A2 2 0 0 1 7.83 2h8.34a2 2 0 0 1 1.42.59L22 7\"/><path d=\"M4 12v8a2 2 0 0 0 2 2h12a2 2 0 0 0 2-2v-8\"/><path d=\"M15 22v-4a2 2 0 0 0-2-2h-2a2 2 0 0 0-2 2v4\"/><path d=\"M2 7h20\"/><path d=\"M22 7v3a2 2 0 0 1-2 2a2.7 2.7 0 0 1-1.59-.63.7.7 0 0 0-.82 0A2.7 2.7 0 0 1 16 12a2.7 2.7 0 0 1-1.59-.63.7.7 0 0 0-.82 0A2.7 2.7 0 0 1 12 12a2.7 2.7 0 0 1-1.59-.63.7.7 0 0 0-.82 0A2.7 2.7 0 0 1 8 12a2.7 2.7 0 0 1-1.59-.63.7.7 0 0 0-.82 0A2.7 2.7 0 0 1 4 12a2 2 0 0 1-2-2V7\"/>",
45
+ "ticket": "<path d=\"M2 9a3 3 0 0 1 0 6v2a2 2 0 0 0 2 2h16a2 2 0 0 0 2-2v-2a3 3 0 0 1 0-6V7a2 2 0 0 0-2-2H4a2 2 0 0 0-2 2Z\"/><path d=\"M13 5v2\"/><path d=\"M13 17v2\"/><path d=\"M13 11v2\"/>",
46
+ "user-round": "<circle cx=\"12\" cy=\"8\" r=\"5\"/><path d=\"M20 21a8 8 0 0 0-16 0\"/>",
47
+ "users": "<path d=\"M16 21v-2a4 4 0 0 0-4-4H6a4 4 0 0 0-4 4v2\"/><circle cx=\"9\" cy=\"7\" r=\"4\"/><path d=\"M22 21v-2a4 4 0 0 0-3-3.87\"/><path d=\"M16 3.13a4 4 0 0 1 0 7.75\"/>",
48
+ "users-round": "<path d=\"M18 21a8 8 0 0 0-16 0\"/><circle cx=\"10\" cy=\"8\" r=\"5\"/><path d=\"M22 20c0-3.37-2-6.5-4-8a5 5 0 0 0-.45-8.3\"/>",
49
+ "x": "<path d=\"M18 6 6 18\"/><path d=\"m6 6 12 12\"/>"
50
+ },
51
+ "filled": {
52
+ "house": "<path fill=\"currentColor\" stroke=\"none\" fill-rule=\"evenodd\" d=\"M2.00 19.00 L2.03 19.42 L2.15 19.93 L2.32 20.36 L2.52 20.69 L2.77 21.00 L3.15 21.36 L3.53 21.61 L3.88 21.78 L4.38 21.94 L4.84 22.00 L9.50 22.00 L9.50 14.00 L9.53 13.74 L9.63 13.50 L9.79 13.29 L10.00 13.13 L10.24 13.03 L10.50 13.00 L13.50 13.00 L13.76 13.03 L14.00 13.13 L14.21 13.29 L14.37 13.50 L14.47 13.74 L14.50 14.00 L14.50 22.00 L19.16 22.00 L19.81 21.89 L20.36 21.68 L20.69 21.48 L21.00 21.23 L21.23 21.00 L21.48 20.69 L21.68 20.36 L21.83 20.00 L21.98 19.36 L22.00 19.00 L22.00 9.90 L21.90 9.23 L21.66 8.64 L21.38 8.19 L21.02 7.80 L13.95 1.74 L13.64 1.51 L13.23 1.28 L12.90 1.16 L12.56 1.07 L12.15 1.02 L11.79 1.03 L11.33 1.10 L10.93 1.22 L10.61 1.36 L10.05 1.74 L3.04 7.75 L2.62 8.19 L2.29 8.74 L2.10 9.27 L2.00 9.90Z\"/>",
53
+ "calendar": "<rect x=\"3\" y=\"4\" width=\"18\" height=\"18\" rx=\"2\" fill=\"currentColor\" stroke=\"currentColor\" stroke-width=\"2\"/><path d=\"M8 2v4M16 2v4\" stroke=\"currentColor\" stroke-width=\"2\" stroke-linecap=\"round\"/>",
54
+ "inbox": "<path fill=\"currentColor\" stroke=\"none\" fill-rule=\"evenodd\" d=\"M4.56 4.66 L1.11 11.55 L1.06 11.68 L1.13 11.50 L1.29 11.29 L1.50 11.13 L1.74 11.03 L2.00 11.00 L8.00 11.00 L8.24 11.03 L8.47 11.12 L8.67 11.26 L8.83 11.45 L10.54 14.00 L13.46 14.00 L15.17 11.45 L15.33 11.26 L15.53 11.12 L15.76 11.03 L16.00 11.00 L22.00 11.00 L22.26 11.03 L22.50 11.13 L22.71 11.29 L22.87 11.50 L22.94 11.68 L22.89 11.55 L19.32 4.44 L19.05 4.07 L18.69 3.71 L18.32 3.44 L17.82 3.20 L17.29 3.05 L16.78 3.00 L6.94 3.02 L6.53 3.09 L6.18 3.20 L5.88 3.33 L5.53 3.54 L5.20 3.80 L4.95 4.07 L4.75 4.33ZM1.03 11.77 L1.00 12.00 L1.03 11.75ZM1.00 18.00 L1.05 18.55 L1.17 19.00 L1.39 19.47 L1.72 19.95 L2.15 20.36 L2.53 20.61 L3.07 20.85 L3.58 20.97 L4.00 21.00 L20.00 21.00 L20.42 20.97 L20.81 20.89 L21.18 20.76 L21.53 20.58 L21.85 20.36 L22.14 20.10 L22.40 19.80 L22.61 19.47 L22.78 19.12 L22.91 18.74 L22.98 18.36 L23.00 18.00 L23.00 12.00 L22.97 12.26 L22.87 12.50 L22.71 12.71 L22.50 12.87 L22.26 12.97 L22.00 13.00 L16.54 13.00 L14.83 15.55 L14.67 15.74 L14.47 15.88 L14.24 15.97 L14.00 16.00 L10.00 16.00 L9.76 15.97 L9.53 15.88 L9.33 15.74 L9.17 15.55 L7.46 13.00 L2.00 13.00 L1.74 12.97 L1.50 12.87 L1.29 12.71 L1.13 12.50 L1.03 12.26 L1.00 12.00ZM22.97 11.77 L22.97 11.75 L23.00 12.00Z\"/>",
55
+ "map-pin": "<path fill-rule=\"evenodd\" fill=\"currentColor\" stroke=\"none\" d=\"M12 23.2c-.4 0-.75-.2-.95-.55L5.5 14.4A7.6 7.6 0 1 1 18.5 14.4l-5.55 8.25c-.2.35-.55.55-.95.55ZM12 6.1a3 3 0 1 0 0 6a3 3 0 0 0 0-6Z\"/>"
56
+ },
57
+ "aliases": {
58
+ "profile": "store",
59
+ "door": "door-open",
60
+ "door-scanner": "scan-line",
61
+ "bookings": "calendar",
62
+ "memberships": "id-card",
63
+ "connections": "plug",
64
+ "team": "users",
65
+ "audience": "users-round",
66
+ "ticketing": "ticket",
67
+ "home": "house",
68
+ "user": "user-round",
69
+ "edit": "pencil",
70
+ "more": "ellipsis",
71
+ "switch": "chevrons-up-down",
72
+ "contactless": "nfc",
73
+ "brand": "palette"
74
+ },
75
+ "strokeWidth": {
76
+ "16": 1.5,
77
+ "20": 1.75,
78
+ "24": 2
79
+ },
80
+ "custom": [
81
+ "concierge",
82
+ "payouts"
83
+ ]
84
+ };
85
+
86
+ export const ICONS = DATA.icons;
87
+ export const FILLED_ICONS = DATA.filled;
88
+ /** Product names → icon names, e.g. ICON_ALIASES.payouts === "payouts", ICON_ALIASES.door === "door-open". */
89
+ export const ICON_ALIASES = DATA.aliases;
90
+ /** Stroke width in px at each design size: 2 at 24, 1.75 at 20, 1.5 at 16. */
91
+ export const ICON_STROKE_WIDTHS = DATA.strokeWidth;
92
+ /** Icons that are not in Lucide and must come from this package. */
93
+ export const CUSTOM_ICONS = DATA.custom;
94
+ export const ICON_NAMES = Object.keys(DATA.icons);
95
+
96
+ /** Resolve a product name or icon name to an icon name (undefined if unknown). */
97
+ export function resolveIcon(name) {
98
+ const n = DATA.aliases[name] || name;
99
+ return DATA.icons[n] ? n : undefined;
100
+ }
101
+
102
+ /** Stroke width in px for an icon rendered at `size` px (interpolates between design sizes). */
103
+ export function iconStrokeWidth(size) {
104
+ const pts = Object.entries(DATA.strokeWidth).map(([s, w]) => [+s, w]).sort((a, b) => a[0] - b[0]);
105
+ if (size <= pts[0][0]) return pts[0][1];
106
+ for (let i = 1; i < pts.length; i++) {
107
+ const [s0, w0] = pts[i - 1], [s1, w1] = pts[i];
108
+ if (size <= s1) return w0 + ((w1 - w0) * (size - s0)) / (s1 - s0);
109
+ }
110
+ return pts[pts.length - 1][1];
111
+ }
112
+
113
+ /** Full <svg> markup for an icon. Colors follow `currentColor`. */
114
+ export function iconSvg(name, { size = 20, filled = false, title } = {}) {
115
+ const n = resolveIcon(name);
116
+ if (!n) throw new Error(`Unknown Mosh icon: ${name}`);
117
+ const body = (filled && DATA.filled[n]) || DATA.icons[n];
118
+ const sw = (iconStrokeWidth(size) * 24) / size;
119
+ const label = title ? `role="img" aria-label="${title}"` : 'aria-hidden="true"';
120
+ return `<svg xmlns="http://www.w3.org/2000/svg" width="${size}" height="${size}" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="${+sw.toFixed(3)}" stroke-linecap="round" stroke-linejoin="round" ${label}>${body}</svg>`;
121
+ }
package/dist/theme.css CHANGED
@@ -47,6 +47,10 @@
47
47
  --color-fill-active: rgba(0, 0, 0, 0.12);
48
48
  --color-scrim: rgba(0, 0, 0, 0.50);
49
49
  --color-scrim-strong: rgba(0, 0, 0, 0.70);
50
+ --color-switch-on: #16a34a;
51
+ --color-switch-off: #d4d4d8;
52
+ --color-nav-selected: #111111;
53
+ --color-nav-unselected: #6e6e73;
50
54
  --color-success: #16a34a;
51
55
  --color-success-bright: #4ade80;
52
56
  --color-danger: #ef4444;
@@ -134,6 +138,10 @@
134
138
  --color-fill-ghost: rgba(255, 255, 255, 0.04);
135
139
  --color-fill-hover: rgba(255, 255, 255, 0.08);
136
140
  --color-fill-active: rgba(255, 255, 255, 0.12);
141
+ --color-switch-on: #22c55e;
142
+ --color-switch-off: #3a3a3a;
143
+ --color-nav-selected: #ffffff;
144
+ --color-nav-unselected: #aaaaaa;
137
145
  --color-success: #22c55e;
138
146
  --gradient-surface: linear-gradient(145deg, #2a2a2a, #1a1a1a);
139
147
  --shadow-sm: 0 2px 8px rgba(0, 0, 0, 0.5);
package/dist/tokens.css CHANGED
@@ -38,7 +38,7 @@
38
38
  --text-faint: #9a9a9f;
39
39
  --text-disabled: #a8a8ad;
40
40
  --text-on-brand: #ffffff; /* text/icon on a brand-red fill */
41
- --text-brand: #ff2929; /* brand-colored text (selected nav, links) — full red vibrates on black, so dark uses the light red */
41
+ --text-brand: #ff2929; /* brand-colored text (links, brand moments) — not selected nav, which uses color-nav-selected. Full red vibrates on black, so dark uses the light red */
42
42
  --text-success: #15803d; /* status text; light value darkened for contrast on white */
43
43
  --text-warning: #b45309;
44
44
  --text-danger: #dc2626;
@@ -52,6 +52,10 @@
52
52
  --fill-active: rgba(0, 0, 0, 0.12);
53
53
  --scrim: rgba(0, 0, 0, 0.50);
54
54
  --scrim-strong: rgba(0, 0, 0, 0.70);
55
+ --color-switch-on: #16a34a; /* switch track when ON — always green, web and iOS; never black or brand red (Garrett, 2026-11-07) */
56
+ --color-switch-off: #d4d4d8; /* switch track when OFF */
57
+ --color-nav-selected: #111111; /* selected tab / nav item: the FILLED icon in this color — never brand red (Garrett, 2026-11-06) */
58
+ --color-nav-unselected: #6e6e73; /* unselected tab / nav item: the outline icon in this color */
55
59
  --color-success: #16a34a;
56
60
  --color-success-bright: #4ade80;
57
61
  --color-danger: #ef4444;
@@ -140,6 +144,10 @@
140
144
  --fill-ghost: rgba(255, 255, 255, 0.04);
141
145
  --fill-hover: rgba(255, 255, 255, 0.08);
142
146
  --fill-active: rgba(255, 255, 255, 0.12);
147
+ --color-switch-on: #22c55e;
148
+ --color-switch-off: #3a3a3a;
149
+ --color-nav-selected: #ffffff;
150
+ --color-nav-unselected: #aaaaaa;
143
151
  --color-success: #22c55e;
144
152
  --gradient-surface: linear-gradient(145deg, #2a2a2a, #1a1a1a);
145
153
  --shadow-sm: 0 2px 8px rgba(0, 0, 0, 0.5);
package/icons/icons.json ADDED
@@ -0,0 +1,89 @@
1
+ {
2
+ "$description": "Mosh icon set: the single source for every icon on web and iOS. Stock Lucide (lucide.dev, the set lucide-react uses on web) under their Lucide names, plus two Mosh custom icons. Markup is the inner content of a 24×24 viewBox drawn with stroke=currentColor, stroke-width 2, round caps and joins, fill none unless an element says otherwise. Edit HERE, then `npm run build`.",
3
+ "$license": "Lucide icons © Lucide Contributors, ISC License (https://lucide.dev/license). Custom Mosh icons (concierge, payouts) © Mosh Technologies, Inc.",
4
+ "$decisions": [
5
+ "Icons are stock Lucide so iOS matches the web dashboard (Garrett, 2026-11-06).",
6
+ "Two custom icons: concierge (bell with a knob, not a stem) and payouts (a stack of cash) (2026-11-06).",
7
+ "One visual weight across sizes: stroke 2px at 24, 1.75px at 20, 1.5px at 16 (2026-11-06).",
8
+ "Selected tab = the filled variant in nav-selected (black/white), unselected = outline in nav-unselected; never brand red (2026-11-06)."
9
+ ],
10
+ "strokeWidth": {
11
+ "16": 1.5,
12
+ "20": 1.75,
13
+ "24": 2
14
+ },
15
+ "custom": [
16
+ "concierge",
17
+ "payouts"
18
+ ],
19
+ "aliases": {
20
+ "profile": "store",
21
+ "door": "door-open",
22
+ "door-scanner": "scan-line",
23
+ "bookings": "calendar",
24
+ "memberships": "id-card",
25
+ "connections": "plug",
26
+ "team": "users",
27
+ "audience": "users-round",
28
+ "ticketing": "ticket",
29
+ "home": "house",
30
+ "user": "user-round",
31
+ "edit": "pencil",
32
+ "more": "ellipsis",
33
+ "switch": "chevrons-up-down",
34
+ "contactless": "nfc",
35
+ "brand": "palette"
36
+ },
37
+ "icons": {
38
+ "banknote": "<rect width=\"20\" height=\"12\" x=\"2\" y=\"6\" rx=\"2\"/><circle cx=\"12\" cy=\"12\" r=\"2\"/><path d=\"M6 12h.01M18 12h.01\"/>",
39
+ "bell": "<path d=\"M10.268 21a2 2 0 0 0 3.464 0\"/><path d=\"M3.262 15.326A1 1 0 0 0 4 17h16a1 1 0 0 0 .74-1.673C19.41 13.956 18 12.499 18 8A6 6 0 0 0 6 8c0 4.499-1.411 5.956-2.738 7.326\"/>",
40
+ "calendar": "<path d=\"M8 2v4\"/><path d=\"M16 2v4\"/><rect width=\"18\" height=\"18\" x=\"3\" y=\"4\" rx=\"2\"/><path d=\"M3 10h18\"/>",
41
+ "check": "<path d=\"M20 6 9 17l-5-5\"/>",
42
+ "chevron-down": "<path d=\"m6 9 6 6 6-6\"/>",
43
+ "chevron-left": "<path d=\"m15 18-6-6 6-6\"/>",
44
+ "chevron-right": "<path d=\"m9 18 6-6-6-6\"/>",
45
+ "chevrons-up-down": "<path d=\"m7 15 5 5 5-5\"/><path d=\"m7 9 5-5 5 5\"/>",
46
+ "concierge": "<path d=\"M3 21a1 1 0 0 1-1-1v-1a2 2 0 0 1 2-2h16a2 2 0 0 1 2 2v1a1 1 0 0 1-1 1Z\"/><path d=\"M21 17a9 9 0 1 0-18 0\"/><path d=\"M10 5a2 2 0 0 1 4 0\"/>",
47
+ "concierge-bell": "<path d=\"M3 20a1 1 0 0 1-1-1v-1a2 2 0 0 1 2-2h16a2 2 0 0 1 2 2v1a1 1 0 0 1-1 1Z\"/><path d=\"M20 16a8 8 0 1 0-16 0\"/><path d=\"M12 4v4\"/><path d=\"M10 4h4\"/>",
48
+ "copy": "<rect width=\"14\" height=\"14\" x=\"8\" y=\"8\" rx=\"2\" ry=\"2\"/><path d=\"M4 16c-1.1 0-2-.9-2-2V4c0-1.1.9-2 2-2h10c1.1 0 2 .9 2 2\"/>",
49
+ "credit-card": "<rect width=\"20\" height=\"14\" x=\"2\" y=\"5\" rx=\"2\"/><line x1=\"2\" x2=\"22\" y1=\"10\" y2=\"10\"/>",
50
+ "dollar-sign": "<line x1=\"12\" x2=\"12\" y1=\"2\" y2=\"22\"/><path d=\"M17 5H9.5a3.5 3.5 0 0 0 0 7h5a3.5 3.5 0 0 1 0 7H6\"/>",
51
+ "door-open": "<path d=\"M11 20H2\"/><path d=\"M11 4.562v16.157a1 1 0 0 0 1.242.97L19 20V5.562a2 2 0 0 0-1.515-1.94l-4-1A2 2 0 0 0 11 4.561z\"/><path d=\"M11 4H8a2 2 0 0 0-2 2v14\"/><path d=\"M14 12h.01\"/><path d=\"M22 20h-3\"/>",
52
+ "ellipsis": "<circle cx=\"12\" cy=\"12\" r=\"1\"/><circle cx=\"19\" cy=\"12\" r=\"1\"/><circle cx=\"5\" cy=\"12\" r=\"1\"/>",
53
+ "external-link": "<path d=\"M15 3h6v6\"/><path d=\"M10 14 21 3\"/><path d=\"M18 13v6a2 2 0 0 1-2 2H5a2 2 0 0 1-2-2V8a2 2 0 0 1 2-2h6\"/>",
54
+ "globe": "<circle cx=\"12\" cy=\"12\" r=\"10\"/><path d=\"M12 2a14.5 14.5 0 0 0 0 20 14.5 14.5 0 0 0 0-20\"/><path d=\"M2 12h20\"/>",
55
+ "house": "<path d=\"M3 10a2 2 0 0 1 .7-1.5l7-6a2 2 0 0 1 2.6 0l7 6a2 2 0 0 1 .7 1.5v9a2 2 0 0 1-2 2H5a2 2 0 0 1-2-2z\"/><path d=\"M15 21v-8a1 1 0 0 0-1-1h-4a1 1 0 0 0-1 1v8\"/>",
56
+ "id-card": "<rect width=\"20\" height=\"14\" x=\"2\" y=\"5\" rx=\"2\"/><circle cx=\"8\" cy=\"12\" r=\"2\"/><path d=\"M14 10h4\"/><path d=\"M14 14h4\"/>",
57
+ "inbox": "<polyline points=\"22 12 16 12 14 15 10 15 8 12 2 12\"/><path d=\"M5.45 5.11 2 12v6a2 2 0 0 0 2 2h16a2 2 0 0 0 2-2v-6l-3.45-6.89A2 2 0 0 0 16.76 4H7.24a2 2 0 0 0-1.79 1.11z\"/>",
58
+ "instagram": "<rect width=\"20\" height=\"20\" x=\"2\" y=\"2\" rx=\"5\" ry=\"5\"/><path d=\"M16 11.37A4 4 0 1 1 12.63 8 4 4 0 0 1 16 11.37z\"/><line x1=\"17.5\" x2=\"17.51\" y1=\"6.5\" y2=\"6.5\"/>",
59
+ "mail": "<rect width=\"20\" height=\"16\" x=\"2\" y=\"4\" rx=\"2\"/><path d=\"m22 7-8.97 5.7a1.94 1.94 0 0 1-2.06 0L2 7\"/>",
60
+ "map-pin": "<path d=\"M20 10c0 4.993-5.539 10.193-7.399 11.799a1 1 0 0 1-1.202 0C9.539 20.193 4 14.993 4 10a8 8 0 0 1 16 0\"/><circle cx=\"12\" cy=\"10\" r=\"3\"/>",
61
+ "maximize-2": "<polyline points=\"15 3 21 3 21 9\"/><polyline points=\"9 21 3 21 3 15\"/><line x1=\"21\" x2=\"14\" y1=\"3\" y2=\"10\"/><line x1=\"3\" x2=\"10\" y1=\"21\" y2=\"14\"/>",
62
+ "message-circle": "<path d=\"M7.9 20A9 9 0 1 0 4 16.1L2 22Z\"/>",
63
+ "nfc": "<path d=\"M6 8.32a7.43 7.43 0 0 1 0 7.36\"/><path d=\"M9.46 6.21a11.76 11.76 0 0 1 0 11.58\"/><path d=\"M12.91 4.1a15.91 15.91 0 0 1 .01 15.8\"/><path d=\"M16.37 2a20.16 20.16 0 0 1 0 20\"/>",
64
+ "palette": "<path d=\"M12 22a1 1 0 0 1 0-20 10 9 0 0 1 10 9 5 5 0 0 1-5 5h-2.25a1.75 1.75 0 0 0-1.4 2.8l.3.4a1.75 1.75 0 0 1-1.4 2.8z\"/><circle cx=\"13.5\" cy=\"6.5\" r=\".5\" fill=\"currentColor\"/><circle cx=\"17.5\" cy=\"10.5\" r=\".5\" fill=\"currentColor\"/><circle cx=\"6.5\" cy=\"12.5\" r=\".5\" fill=\"currentColor\"/><circle cx=\"8.5\" cy=\"7.5\" r=\".5\" fill=\"currentColor\"/>",
65
+ "payouts": "<path d=\"M6 6V5a2 2 0 0 1 2-2h12a2 2 0 0 1 2 2v8a2 2 0 0 1-2 2h-1\"/><rect width=\"16\" height=\"12\" x=\"2\" y=\"8\" rx=\"2\"/><circle cx=\"10\" cy=\"14\" r=\"2\"/>",
66
+ "pencil": "<path d=\"M21.174 6.812a1 1 0 0 0-3.986-3.987L3.842 16.174a2 2 0 0 0-.5.83l-1.321 4.352a.5.5 0 0 0 .623.622l4.353-1.32a2 2 0 0 0 .83-.497z\"/><path d=\"m15 5 4 4\"/>",
67
+ "plug": "<path d=\"M12 22v-5\"/><path d=\"M9 8V2\"/><path d=\"M15 8V2\"/><path d=\"M18 8v5a4 4 0 0 1-4 4h-4a4 4 0 0 1-4-4V8Z\"/>",
68
+ "plus": "<path d=\"M5 12h14\"/><path d=\"M12 5v14\"/>",
69
+ "qr-code": "<rect width=\"5\" height=\"5\" x=\"3\" y=\"3\" rx=\"1\"/><rect width=\"5\" height=\"5\" x=\"16\" y=\"3\" rx=\"1\"/><rect width=\"5\" height=\"5\" x=\"3\" y=\"16\" rx=\"1\"/><path d=\"M21 16h-3a2 2 0 0 0-2 2v3\"/><path d=\"M21 21v.01\"/><path d=\"M12 7v3a2 2 0 0 1-2 2H7\"/><path d=\"M3 12h.01\"/><path d=\"M12 3h.01\"/><path d=\"M12 16v.01\"/><path d=\"M16 12h1\"/><path d=\"M21 12v.01\"/><path d=\"M12 21v-1\"/>",
70
+ "scan-line": "<path d=\"M3 7V5a2 2 0 0 1 2-2h2\"/><path d=\"M17 3h2a2 2 0 0 1 2 2v2\"/><path d=\"M21 17v2a2 2 0 0 1-2 2h-2\"/><path d=\"M7 21H5a2 2 0 0 1-2-2v-2\"/><path d=\"M7 12h10\"/>",
71
+ "search": "<circle cx=\"11\" cy=\"11\" r=\"8\"/><path d=\"m21 21-4.3-4.3\"/>",
72
+ "settings": "<path d=\"M12.22 2h-.44a2 2 0 0 0-2 2v.18a2 2 0 0 1-1 1.73l-.43.25a2 2 0 0 1-2 0l-.15-.08a2 2 0 0 0-2.73.73l-.22.38a2 2 0 0 0 .73 2.73l.15.1a2 2 0 0 1 1 1.72v.51a2 2 0 0 1-1 1.74l-.15.09a2 2 0 0 0-.73 2.73l.22.38a2 2 0 0 0 2.73.73l.15-.08a2 2 0 0 1 2 0l.43.25a2 2 0 0 1 1 1.73V20a2 2 0 0 0 2 2h.44a2 2 0 0 0 2-2v-.18a2 2 0 0 1 1-1.73l.43-.25a2 2 0 0 1 2 0l.15.08a2 2 0 0 0 2.73-.73l.22-.39a2 2 0 0 0-.73-2.73l-.15-.08a2 2 0 0 1-1-1.74v-.5a2 2 0 0 1 1-1.74l.15-.09a2 2 0 0 0 .73-2.73l-.22-.38a2 2 0 0 0-2.73-.73l-.15.08a2 2 0 0 1-2 0l-.43-.25a2 2 0 0 1-1-1.73V4a2 2 0 0 0-2-2z\"/><circle cx=\"12\" cy=\"12\" r=\"3\"/>",
73
+ "shield-alert": "<path d=\"M20 13c0 5-3.5 7.5-7.66 8.95a1 1 0 0 1-.67-.01C7.5 20.5 4 18 4 13V6a1 1 0 0 1 1-1c2 0 4.5-1.2 6.24-2.72a1.17 1.17 0 0 1 1.52 0C14.51 3.81 17 5 19 5a1 1 0 0 1 1 1z\"/><path d=\"M12 8v4\"/><path d=\"M12 16h.01\"/>",
74
+ "square-check": "<rect width=\"18\" height=\"18\" x=\"3\" y=\"3\" rx=\"2\"/><path d=\"m9 12 2 2 4-4\"/>",
75
+ "star": "<path d=\"M11.525 2.295a.53.53 0 0 1 .95 0l2.31 4.679a2.123 2.123 0 0 0 1.595 1.16l5.166.756a.53.53 0 0 1 .294.904l-3.736 3.638a2.123 2.123 0 0 0-.611 1.878l.882 5.14a.53.53 0 0 1-.771.56l-4.618-2.428a2.122 2.122 0 0 0-1.973 0L6.396 21.01a.53.53 0 0 1-.77-.56l.881-5.139a2.122 2.122 0 0 0-.611-1.879L2.16 9.795a.53.53 0 0 1 .294-.906l5.165-.755a2.122 2.122 0 0 0 1.597-1.16z\"/>",
76
+ "store": "<path d=\"m2 7 4.41-4.41A2 2 0 0 1 7.83 2h8.34a2 2 0 0 1 1.42.59L22 7\"/><path d=\"M4 12v8a2 2 0 0 0 2 2h12a2 2 0 0 0 2-2v-8\"/><path d=\"M15 22v-4a2 2 0 0 0-2-2h-2a2 2 0 0 0-2 2v4\"/><path d=\"M2 7h20\"/><path d=\"M22 7v3a2 2 0 0 1-2 2a2.7 2.7 0 0 1-1.59-.63.7.7 0 0 0-.82 0A2.7 2.7 0 0 1 16 12a2.7 2.7 0 0 1-1.59-.63.7.7 0 0 0-.82 0A2.7 2.7 0 0 1 12 12a2.7 2.7 0 0 1-1.59-.63.7.7 0 0 0-.82 0A2.7 2.7 0 0 1 8 12a2.7 2.7 0 0 1-1.59-.63.7.7 0 0 0-.82 0A2.7 2.7 0 0 1 4 12a2 2 0 0 1-2-2V7\"/>",
77
+ "ticket": "<path d=\"M2 9a3 3 0 0 1 0 6v2a2 2 0 0 0 2 2h16a2 2 0 0 0 2-2v-2a3 3 0 0 1 0-6V7a2 2 0 0 0-2-2H4a2 2 0 0 0-2 2Z\"/><path d=\"M13 5v2\"/><path d=\"M13 17v2\"/><path d=\"M13 11v2\"/>",
78
+ "user-round": "<circle cx=\"12\" cy=\"8\" r=\"5\"/><path d=\"M20 21a8 8 0 0 0-16 0\"/>",
79
+ "users": "<path d=\"M16 21v-2a4 4 0 0 0-4-4H6a4 4 0 0 0-4 4v2\"/><circle cx=\"9\" cy=\"7\" r=\"4\"/><path d=\"M22 21v-2a4 4 0 0 0-3-3.87\"/><path d=\"M16 3.13a4 4 0 0 1 0 7.75\"/>",
80
+ "users-round": "<path d=\"M18 21a8 8 0 0 0-16 0\"/><circle cx=\"10\" cy=\"8\" r=\"5\"/><path d=\"M22 20c0-3.37-2-6.5-4-8a5 5 0 0 0-.45-8.3\"/>",
81
+ "x": "<path d=\"M18 6 6 18\"/><path d=\"m6 6 12 12\"/>"
82
+ },
83
+ "filled": {
84
+ "house": "<path fill=\"currentColor\" stroke=\"none\" fill-rule=\"evenodd\" d=\"M2.00 19.00 L2.03 19.42 L2.15 19.93 L2.32 20.36 L2.52 20.69 L2.77 21.00 L3.15 21.36 L3.53 21.61 L3.88 21.78 L4.38 21.94 L4.84 22.00 L9.50 22.00 L9.50 14.00 L9.53 13.74 L9.63 13.50 L9.79 13.29 L10.00 13.13 L10.24 13.03 L10.50 13.00 L13.50 13.00 L13.76 13.03 L14.00 13.13 L14.21 13.29 L14.37 13.50 L14.47 13.74 L14.50 14.00 L14.50 22.00 L19.16 22.00 L19.81 21.89 L20.36 21.68 L20.69 21.48 L21.00 21.23 L21.23 21.00 L21.48 20.69 L21.68 20.36 L21.83 20.00 L21.98 19.36 L22.00 19.00 L22.00 9.90 L21.90 9.23 L21.66 8.64 L21.38 8.19 L21.02 7.80 L13.95 1.74 L13.64 1.51 L13.23 1.28 L12.90 1.16 L12.56 1.07 L12.15 1.02 L11.79 1.03 L11.33 1.10 L10.93 1.22 L10.61 1.36 L10.05 1.74 L3.04 7.75 L2.62 8.19 L2.29 8.74 L2.10 9.27 L2.00 9.90Z\"/>",
85
+ "calendar": "<rect x=\"3\" y=\"4\" width=\"18\" height=\"18\" rx=\"2\" fill=\"currentColor\" stroke=\"currentColor\" stroke-width=\"2\"/><path d=\"M8 2v4M16 2v4\" stroke=\"currentColor\" stroke-width=\"2\" stroke-linecap=\"round\"/>",
86
+ "inbox": "<path fill=\"currentColor\" stroke=\"none\" fill-rule=\"evenodd\" d=\"M4.56 4.66 L1.11 11.55 L1.06 11.68 L1.13 11.50 L1.29 11.29 L1.50 11.13 L1.74 11.03 L2.00 11.00 L8.00 11.00 L8.24 11.03 L8.47 11.12 L8.67 11.26 L8.83 11.45 L10.54 14.00 L13.46 14.00 L15.17 11.45 L15.33 11.26 L15.53 11.12 L15.76 11.03 L16.00 11.00 L22.00 11.00 L22.26 11.03 L22.50 11.13 L22.71 11.29 L22.87 11.50 L22.94 11.68 L22.89 11.55 L19.32 4.44 L19.05 4.07 L18.69 3.71 L18.32 3.44 L17.82 3.20 L17.29 3.05 L16.78 3.00 L6.94 3.02 L6.53 3.09 L6.18 3.20 L5.88 3.33 L5.53 3.54 L5.20 3.80 L4.95 4.07 L4.75 4.33ZM1.03 11.77 L1.00 12.00 L1.03 11.75ZM1.00 18.00 L1.05 18.55 L1.17 19.00 L1.39 19.47 L1.72 19.95 L2.15 20.36 L2.53 20.61 L3.07 20.85 L3.58 20.97 L4.00 21.00 L20.00 21.00 L20.42 20.97 L20.81 20.89 L21.18 20.76 L21.53 20.58 L21.85 20.36 L22.14 20.10 L22.40 19.80 L22.61 19.47 L22.78 19.12 L22.91 18.74 L22.98 18.36 L23.00 18.00 L23.00 12.00 L22.97 12.26 L22.87 12.50 L22.71 12.71 L22.50 12.87 L22.26 12.97 L22.00 13.00 L16.54 13.00 L14.83 15.55 L14.67 15.74 L14.47 15.88 L14.24 15.97 L14.00 16.00 L10.00 16.00 L9.76 15.97 L9.53 15.88 L9.33 15.74 L9.17 15.55 L7.46 13.00 L2.00 13.00 L1.74 12.97 L1.50 12.87 L1.29 12.71 L1.13 12.50 L1.03 12.26 L1.00 12.00ZM22.97 11.77 L22.97 11.75 L23.00 12.00Z\"/>",
87
+ "map-pin": "<path fill-rule=\"evenodd\" fill=\"currentColor\" stroke=\"none\" d=\"M12 23.2c-.4 0-.75-.2-.95-.55L5.5 14.4A7.6 7.6 0 1 1 18.5 14.4l-5.55 8.25c-.2.35-.55.55-.95.55ZM12 6.1a3 3 0 1 0 0 6a3 3 0 0 0 0-6Z\"/>"
88
+ }
89
+ }
package/package.json CHANGED
@@ -1,15 +1,23 @@
1
1
  {
2
2
  "name": "@moshevents/tokens",
3
- "version": "0.3.0",
4
- "description": "Mosh Design System — design tokens (CSS variables + Tailwind theme) for web/admin; iOS consumes the SwiftPM target.",
3
+ "version": "0.4.0",
4
+ "description": "Mosh Design System — design tokens (CSS variables + Tailwind theme) and the Mosh icon set for web/admin; iOS consumes the SwiftPM target.",
5
5
  "type": "module",
6
6
  "files": [
7
7
  "dist/tokens.css",
8
- "dist/theme.css"
8
+ "dist/theme.css",
9
+ "dist/icons.js",
10
+ "dist/icons.d.ts",
11
+ "icons/icons.json"
9
12
  ],
10
13
  "exports": {
11
14
  "./tokens.css": "./dist/tokens.css",
12
- "./theme.css": "./dist/theme.css"
15
+ "./theme.css": "./dist/theme.css",
16
+ "./icons": {
17
+ "types": "./dist/icons.d.ts",
18
+ "default": "./dist/icons.js"
19
+ },
20
+ "./icons.json": "./icons/icons.json"
13
21
  },
14
22
  "scripts": {
15
23
  "build": "node build.mjs",