@trading-game/design-intelligence-layer 0.17.2 → 0.17.3
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.
- package/README.md +14 -2
- package/dist/index.cjs +83 -35
- package/dist/index.cjs.map +1 -1
- package/dist/index.d.cts +8 -4
- package/dist/index.d.ts +8 -4
- package/dist/index.js +83 -35
- package/dist/index.js.map +1 -1
- package/guides/design-system-guide/trading-game-ds-guide.md +3 -2
- package/package.json +1 -1
- package/src/styles.css +6 -0
|
@@ -416,6 +416,7 @@ The design system uses a custom radius scale (base = 10px). Use these named toke
|
|
|
416
416
|
| `secondary` | transparent | `text-on-prominent` | `border-[1.5px] border-border-prominent` | `bg-secondary-hover` | Light surfaces |
|
|
417
417
|
| `secondary-inverse` | transparent | `text-on-prominent-inverse` | `border-[1.5px] border-primary-inverse` | `bg-primary-inverse/10` | Dark/coloured surfaces |
|
|
418
418
|
| `tertiary` | transparent | `text-primary` | none | `bg-primary/[0.08]` | Light surfaces |
|
|
419
|
+
| `tertiary-inverse` | transparent | `text-on-primary` | none | `bg-on-primary/[0.10]` | Dark/coloured surfaces |
|
|
419
420
|
|
|
420
421
|
### 6.2 — Sizes
|
|
421
422
|
|
|
@@ -546,8 +547,8 @@ import { Dialog, DialogTrigger, DialogContent, DialogHeader, DialogTitle, Dialog
|
|
|
546
547
|
| Field | [complex] | FieldLabel, FieldDescription, FieldError, FieldGroup, FieldLegend, FieldSet, FieldContent, FieldTitle, FieldSeparator |
|
|
547
548
|
| Form | [complex] | FormField, FormItem, FormLabel, FormControl, FormDescription, FormMessage |
|
|
548
549
|
| HoverCard | [composed] | HoverCardTrigger, HoverCardContent |
|
|
549
|
-
| Input | [simple] | — |
|
|
550
|
-
| InputGroup | [composed] | InputGroupAddon, InputGroupInput, InputGroupButton, InputGroupText, InputGroupTextarea |
|
|
550
|
+
| Input | [simple] | — variants: `default`, `inverse` (dark sunken fill + white text, for use on `bg-primary` and other brand-coloured surfaces). |
|
|
551
|
+
| InputGroup | [composed] | InputGroupAddon, InputGroupInput, InputGroupButton, InputGroupText, InputGroupTextarea. Variants: `default`, `inverse` (propagates to nested controls via context — addon / text / input all swap to the inverse recipe automatically). |
|
|
551
552
|
| InputOTP | [composed] | InputOTPGroup, InputOTPSlot, InputOTPSeparator. Variants: OTP 4 digits, OTP 6 digits, OTP 6 split, OTP 8 digits, OTP 6 separated |
|
|
552
553
|
| Item | [composed] | ItemGroup, ItemContent, ItemTitle, ItemDescription, ItemMedia, ItemActions, ItemHeader, ItemFooter, ItemSeparator |
|
|
553
554
|
| Kbd | [simple] | KbdGroup |
|
package/package.json
CHANGED
package/src/styles.css
CHANGED
|
@@ -40,6 +40,7 @@
|
|
|
40
40
|
--color-sidebar: var(--sidebar);
|
|
41
41
|
--color-ring: var(--ring);
|
|
42
42
|
--color-input: var(--input);
|
|
43
|
+
--color-input-inverse-surface: var(--input-inverse-surface);
|
|
43
44
|
--color-border: var(--border);
|
|
44
45
|
/* @deprecated — use border-border-subtle or border-border-prominent */
|
|
45
46
|
--color-border-subtle: var(--border-subtle);
|
|
@@ -393,6 +394,11 @@
|
|
|
393
394
|
--popover: var(--primitive-mono-50);
|
|
394
395
|
--popover-foreground: oklch(0.07 0.012 165);
|
|
395
396
|
--input: var(--border-subtle);
|
|
397
|
+
/* Sunken dark fill for Input/InputGroup variant="inverse" — sits on
|
|
398
|
+
coloured surfaces (brand-blue, etc.) where a frosted-white fill would
|
|
399
|
+
blend into the surrounding chrome. 35 % black overlay deepens the
|
|
400
|
+
surface enough for white text to read cleanly. */
|
|
401
|
+
--input-inverse-surface: oklch(0 0 0 / 0.35);
|
|
396
402
|
--alert-info-text: var(--semantic-info);
|
|
397
403
|
--alert-info-border: var(--semantic-info);
|
|
398
404
|
--alert-error-text: var(--semantic-error);
|