From c98510aff7af2f626cb95a2fbd8247029a6f1cf7 Mon Sep 17 00:00:00 2001 From: dev Date: Sat, 23 May 2026 13:34:48 +0200 Subject: [PATCH] demo(alert-dialog): expose variant/size chips for Action and Cancel MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit Surfaces the Button visual props that AlertDialog.Action and AlertDialog.Cancel now forward (post `c6f063dc`) so the demo isn't lying about the component's API: - Action: 6 chips (full ButtonVariant — primary CTA), 5 size chips. Intent is NOT exposed as a separate chip because it inherits from the dialog's own `intent` prop (already a Live control above). - Cancel: 3 chips (ControlVariant — narrowed per DEMO_AUTHORING_GUIDE §12.7), 5 size chips. Always neutral palette regardless of dialog intent. Live preview wires both bindings into the rendered Action/Cancel; API tables list the new props with type, default, and the snippet shape (`Snippet<[{ props; intent }]>` for Action's `child`). Co-Authored-By: Claude Opus 4.7 (1M context) --- .../uix/components/alert-dialog/+page.svelte | 111 +++++++++++++++++- 1 file changed, 109 insertions(+), 2 deletions(-) diff --git a/web/routes/uix/components/alert-dialog/+page.svelte b/web/routes/uix/components/alert-dialog/+page.svelte index be2bec65e..2a7a7b6ce 100644 --- a/web/routes/uix/components/alert-dialog/+page.svelte +++ b/web/routes/uix/components/alert-dialog/+page.svelte @@ -41,6 +41,15 @@ let triggerLabel = $state('Delete project…'); let actionText = $state('Delete project'); let cancelText = $state('Cancel'); + // Eidos · Action visual props (forwarded to + {/each} + + + + + + +
+ eidos Cancel + + · variant narrowed to ControlVariant; always neutral palette + +
+
+ + +
+
@@ -485,6 +582,11 @@ aria-labelstring"Confirm"Overrides the default accessible name. onclick(e: MouseEvent) => void—Business handler. The default close runs LAST — consumer logic gets first chance to gate. + variant eidosButtonVariant: 'solid' | 'soft' | 'surface' | 'outline' | 'ghost' | 'plain''solid'Forwarded to the inner <Button>. Keeps the full ButtonVariant since Action is the primary call-to-action. + size eidos'xs' | 'sm' | 'md' | 'lg' | 'xl''md'Button size scale. + intent eidos'neutral' | 'affirm' | 'fulfill' | 'risk' | 'threat' | 'loss'inheritsWhen omitted, reads the parent AlertDialog.intent (neutral · risk · threat) so a flagged dialog paints a matching Action automatically. + color · rounded · iconOnly · icon · endIcon eidosButton props—Standard Button visual knobs forwarded through. + child{`Snippet<[{ props; intent }]>`}—Opt out of <Button> entirely. The dialog's resolved intent is passed alongside props. …native button attrsPrimitiveButtonAttributes—Renders a native <button type='button'>. @@ -497,6 +599,11 @@ aria-labelstring"Cancel"Overrides the default accessible name. onclick(e: MouseEvent) => void—Business handler. Default close runs last. + variant eidosControlVariant: 'surface' | 'outline' | 'ghost''outline'Forwarded to <Button>. Narrowed from ButtonVariant per DEMO_AUTHORING_GUIDE §12.7 (form-control surface). + size eidos'xs' | 'sm' | 'md' | 'lg' | 'xl''md'Button size scale. + intent eidosButtonIntent'neutral'Stays neutral by default so it contrasts with the (potentially destructive) Action. + color eidosColorRole'neutral'Forced to neutral so the outline reads as gray regardless of Button's default primary. + rounded · iconOnly · icon · endIcon eidosButton props—Standard Button visual knobs. …native button attrsPrimitiveButtonAttributes—By convention, receives initial focus — render BEFORE Action in DOM order.