kasy-cli 1.31.14 → 1.34.0

package/templates/firebase/DESIGN_SYSTEM.md

@@ -0,0 +1,234 @@
+# Kasy Design System
+
+**Version 1.0.0** · last updated 2026-06-11
+
+The single source of truth for how the app looks. Everything here lives in code
+under `lib/core/theme/` and `lib/components/`, so changing a token in one place
+updates the whole app (web, Android, iOS) at once. This document just writes the
+rules down so anyone, including projects generated by the Kasy CLI, inherits the
+same standard without guessing.
+
+Design principle: **clean, modern, minimal**. Lots of surface, one accent colour
+used sparingly, no loud weights. The Home screen (sidebar + header + elevated
+`KasyCard`) is the reference for "what good looks like"; new screens should
+mirror it.
+
+---
+
+## The golden rule
+
+Use **tokens and roles**, never bespoke values.
+
+| Instead of…                         | Use…                                         |
+| ----------------------------------- | -------------------------------------------- |
+| `fontSize: 16, fontWeight: w600`    | `context.textTheme.*` / `KasyTextTheme.*`    |
+| `Icon(size: 20)`                    | `Icon(size: KasyIconSize.lg)`                |
+| `EdgeInsets.all(16)`                | `EdgeInsets.all(KasySpacing.md)`             |
+| `BorderRadius.circular(16)`         | `BorderRadius.circular(KasyRadius.lg)`       |
+| `Color(0xFF…)` / `Colors.*`         | `context.colors.*`                           |
+| `ElevatedButton`, `TextButton`      | `KasyButton`                                 |
+| `AlertDialog`, `SnackBar`           | `showKasyConfirmDialog`, `showKasyToast`     |
+
+A bespoke number is only acceptable when a component is being *calibrated* (the
+sidebar, the date-picker grid, badges) and there is no token that fits. When in
+doubt, add or reuse a role rather than hardcoding.
+
+---
+
+## Typography — `KasyTextTheme` (`lib/core/theme/texts.dart`)
+
+### HeroUI scale (the raw roles, Inter)
+
+| Role            | Size / weight / line-height |
+| --------------- | --------------------------- |
+| `heading1`      | 36 / w800 / 40              |
+| `heading2`      | 24 / w700 / 32              |
+| `heading3`      | 20 / w600 / 28              |
+| `heading4`      | 16 / w600 / 24              |
+| `bodyBase`      | 16 / w400                   |
+| `bodyBaseMedium`| 16 / w500                   |
+| `bodySm`        | 14 / w400                   |
+| `bodySmMedium`  | 14 / w500                   |
+| `bodyXs`        | 12 / w400                   |
+| `bodyXsMedium`  | 12 / w500                   |
+
+### Semantic app roles (prefer these on screens)
+
+| Role           | Maps to                        | Use for                                   |
+| -------------- | ------------------------------ | ----------------------------------------- |
+| `pageTitle`    | `heading2` (24/w700)           | Screen / page titles, onboarding titles   |
+| `sectionTitle` | `heading4` (16/w600)           | Detail / section headings                 |
+| `sectionLabel` | 12 / w600 / letter-spacing 0.5 | Uppercase group eyebrows (lists, settings)|
+| `rowTitle`     | `bodySmMedium` (14/w500)       | List / settings row titles                |
+| `rowValue`     | `bodySm` (14/w400)             | List / settings row values                |
+| `cardTitle`    | `bodySmMedium` (14/w500)       | Card titles                               |
+| `cardSubtitle` | `bodyXs` (12/w400)             | Card secondary text                       |
+| `caption`      | `bodyXs` (12/w400)             | Captions, helper text                     |
+
+Access roles in widgets via `context.textTheme.*` (Material slots, colour
+applied) or `KasyTextTheme.*` (raw role, apply colour with `.copyWith`).
+
+Material → role mapping: `headlineMedium = heading2`, `headlineSmall =
+titleLarge = heading3`, `titleMedium = heading4`.
+
+The chrome/app-bar title is **w700** (not w900). Black weights read as heavy and
+fight the rest of the UI.
+
+---
+
+## Icon sizes — `KasyIconSize` (`lib/core/theme/icon_sizes.dart`)
+
+| Token       | px | Token alias  | = |
+| ----------- | -- | ------------ | -- |
+| `xxs`       | 12 | `rowLeading` | `lg` (20) |
+| `xs`        | 14 | `rowTrailing`| `sm` (16) |
+| `sm`        | 16 | `chrome`     | `lg` (20) |
+| `md`        | 18 | `inline`     | `md` (18) |
+| `lg`        | 20 | | |
+| `xl`        | 24 | | |
+| `xxl`       | 28 | | |
+| `display`   | 36 | | |
+| `hero`      | 72 | | |
+
+Never pass a numeric `size:` to `Icon`; use a token so re-scaling is one edit.
+
+---
+
+## Spacing — `KasySpacing` (`lib/core/theme/spacing.dart`)
+
+`xs 4 · sm 8 · smd 12 · md 16 · lg 24 · xl 32 · xxl 48 · xxxl 64`
+
+`pageHorizontalGutter = md (16)` · `pageVerticalGutter = sm (8)` ·
+`belowChromeContentGap = 20`.
+
+## Radius — `KasyRadius` (`lib/core/theme/radius.dart`)
+
+Semantic: `xs 4 · sm 8 · md 12 · lg 16 · xl 24 · full 999`.
+`KasyCard` defaults to `lg` (16).
+
+---
+
+## Colours — `KasyColors`, via `context.colors.*`
+
+Always pull colours from `context.colors.*` so light/dark resolve automatically.
+Key tokens: `primary`, `onPrimary`, `surface`, `onSurface`, `onBackground`,
+`muted`, `fieldLabel`, `outline`, `error` / `onError`, `success`, `warning`,
+`surfacePrimarySoft`, `surfaceNeutralSoft`, `surfaceErrorSoft`.
+
+Brand: avocado green `#D2F51E` (accent), deep green `#011820` (dark ground).
+Disabled state: blend the colour toward the surface (opaque), never raw opacity.
+
+---
+
+## Components
+
+### `KasyButton`
+Sizes (height): `small 40` · `medium 45` (default) · `large 54`. Radius
+`KasyRadius.md`. Variants: primary, secondary, tertiary, destructive,
+destructiveSoft, inverse, link, soft, neutral, outline, ghost.
+
+### `KasyTextField`
+Canonical single-line height: **`singleLineHeight = 45`** (drives the field's
+vertical padding so the box itself is exactly that tall on every platform — web
+density is normalised to `standard`). Matches the medium button.
+
+Variants:
+- **primary** — surface fill + hairline border + soft shadow (floats; good on a
+  bare background).
+- **secondary** — elevated fill (contrasts on a card) + border, no shadow.
+- **flat** — primary's surface fill + a soft border, **no shadow**. For fields
+  sitting on a same-coloured card. Border comes from
+  `KasyShadows.inputFieldFlatBorder` (derived from `onSurface`, so it reads in
+  both light and dark; subtle by design).
+- **embedded** — transparent, no border, no shadow.
+
+Auth screens (sign in / sign up / recover) use **flat** on every breakpoint.
+A custom `contentPadding` opts a field out of the 45 lock (e.g. the compact
+header search). Use `forceFocusBorder` to show the "active" focused border from
+state without taking real focus (composite triggers like the date picker).
+
+### `KasyTextArea`
+Multi-line sibling of `KasyTextField`; same variants (primary / secondary / flat
+/ embedded). Height grows with content (not locked to 45).
+
+### `KasyDatePicker`
+Reuses `KasyTextField` as a read-only trigger, so it inherits the field look and
+the 45 height. The "open" border is painted from state (`forceFocusBorder`), so
+a mouse click never doubles the keyboard focus ring and the border never drops
+while the calendar is open.
+
+### `KasyCard`
+Elevated surface panel, radius `KasyRadius.lg` (16). The base for screen content.
+
+### `KasyScreen`
+Opt-in screen scaffold. A new page wrapped in it gets the internal-screen
+contract for free: page background, a centred content column capped at
+`maxContentWidth` (~600), the page gutter, scroll handling and an optional
+`KasyCard`. It is a thin convenience over `Scaffold` (same `appBar` /
+`floatingActionButton` / `bottomNavigationBar` slots), so it never blocks a
+screen that needs bespoke chrome.
+
+```dart
+KasyScreen(
+  appBar: KasyAppBar.root(title: 'Settings'),
+  card: true,
+  child: Column(children: [...]),
+)
+```
+
+---
+
+## Internal-screen contract
+
+New internal screens follow the sidebar / Home ruler:
+- Body text 14, icons 20 (`KasyIconSize.lg`), titles ~16-17 (`sectionTitle`).
+- `KasyCard` radius 16, content width contained (~600), no oversized boxes.
+- Use `KasyButton`, `showKasyConfirmDialog`, `showKasyToast` — not raw Material.
+- Haptics only on native (`if (!kIsWeb)`); "hide chrome on scroll" only on the
+  phone breakpoint (`width < 768`).
+
+---
+
+## Keeping it consistent — the guard-rail (optional)
+
+`tool/design_check.dart` is a plain Dart script that flags a **feature screen**
+reaching around the design system (raw `fontSize`, raw `Color`, raw Material
+widgets, literal icon sizes). The design system's own code (`lib/components`,
+`lib/core`, `lib/main.dart`) is out of scope — that is where the primitives are
+built.
+
+```bash
+dart run tool/design_check.dart
+```
+
+It is **opt-in and non-blocking by default**: nothing runs it automatically (not
+wired into `flutter analyze`, builds or git hooks). Run it locally or add it to
+CI to turn the convention into a gate. It has no extra dependency — read it, tune
+the allowlists at the top, or delete it. For a deliberate one-off, put
+`// design-check: ignore` on the line.
+
+This is intentionally not a cage: a project built with the kit can relax or drop
+it freely, and rebranding is still a token change (colours / type) in one place.
+
+---
+
+## Changelog
+
+### 1.1.0 — 2026-06-11
+- `KasyScreen` scaffold added (opt-in internal-screen contract).
+- Design guard-rail added (`tool/design_check.dart`), opt-in / non-blocking.
+- Feature layer brought to a green baseline against the guard-rail (deliberate
+  exceptions marked with `// design-check: ignore`).
+
+
+### 1.0.0 — 2026-06-11
+- Icon sizes centralised into `KasyIconSize`; product migrated off numeric sizes.
+- Semantic typography roles added (`pageTitle`, `sectionTitle`, `sectionLabel`,
+  `rowTitle`, …).
+- `KasyTextField`: `flat` variant + `forceFocusBorder`; single-line height
+  locked to **45** via derived padding (platform-independent); flat border role
+  `inputFieldFlatBorder` (visible in both themes, subtle).
+- `KasyButton` medium height aligned to **45**.
+- `KasyTextArea` gained the variant set.
+- App-bar title weight `w900 → w700`; onboarding titles `28/26 → 24` (page-title
+  scale); notifications group eyebrow → `sectionLabel`.

package/templates/firebase/docs/auth-setup.en.md

@@ -69,7 +69,13 @@ Requires an [Apple Developer](https://developer.apple.com) account (paid).
 1. Open `ios/Runner.xcworkspace` in Xcode
 2. Target **Runner** → **Signing & Capabilities** → **+ Capability** → add **Sign In with Apple**
 
-> **Android and Web**: no additional setup needed. The Firebase SDK handles the flow on Android. For Web, the Services ID (Step 3) already covers the redirect flow via `firebaseapp.com`.
+> **iOS / macOS**: the Apple button shows automatically once the steps above are done.
+>
+> **Android**: the Apple button is hidden by design (it needs the paid Services ID web flow and adds little on Android for a SaaS). Leave it hidden.
+>
+> **Web (Firebase)**: after Steps 1-3, run `kasy apple-web` — it writes the Services ID + Team ID + Key ID + `.p8` into the Firebase Apple provider and turns on `withAppleWebSignin` (which ships `false`). The Services ID Return URL (`firebaseapp.com/__/auth/handler`) covers the popup flow. Firebase re-signs the secret itself (never expires).
+>
+> **Web (Supabase)**: Apple on the web for Supabase is **not wired in the app yet** (roadmap) — the button stays hidden on web. On Supabase, Apple works on **native iOS only** (already set up by `kasy new`). See `ROADMAP.md`.
 
 ---
 

package/templates/firebase/docs/auth-setup.es.md

@@ -69,7 +69,13 @@ Requiere cuenta de [Apple Developer](https://developer.apple.com) (de pago).
 1. Abre `ios/Runner.xcworkspace` en Xcode
 2. Target **Runner** → **Signing & Capabilities** → **+ Capability** → agrega **Sign In with Apple**
 
-> **Android y Web**: no se necesita configuración adicional. El SDK de Firebase gestiona el flujo en Android. Para Web, el Services ID (Paso 3) ya cubre el flujo de redirect vía `firebaseapp.com`.
+> **iOS / macOS**: el botón Apple aparece automáticamente tras los pasos anteriores.
+>
+> **Android**: el botón Apple queda oculto por defecto (necesita el flujo del Services ID de pago y aporta poco en Android para un SaaS). Déjalo oculto.
+>
+> **Web (Firebase)**: tras los Pasos 1 a 3, ejecuta `kasy apple-web` — escribe el Services ID + Team ID + Key ID + `.p8` en el proveedor Apple de Firebase y activa `withAppleWebSignin` (que viene `false`). La Return URL del Services ID (`firebaseapp.com/__/auth/handler`) cubre el flujo de popup. Firebase vuelve a firmar el secret solo (no expira).
+>
+> **Web (Supabase)**: Apple en la web para Supabase **aún no viene activado en la app** (roadmap) — el botón queda oculto en la web. En Supabase, Apple funciona solo en **iOS nativo** (ya configurado por `kasy new`). Consulta `ROADMAP.md`.
 
 ---
 

package/templates/firebase/docs/auth-setup.pt.md

@@ -69,7 +69,13 @@ Requer conta [Apple Developer](https://developer.apple.com) (paga).
 1. Abra `ios/Runner.xcworkspace` no Xcode
 2. Target **Runner** → **Signing & Capabilities** → **+ Capability** → adicione **Sign In with Apple**
 
-> **Android e Web**: não precisam de configuração adicional. O Firebase SDK gerencia o fluxo no Android. Para Web, o Services ID (Passo 3) já cobre o fluxo de redirect via `firebaseapp.com`.
+> **iOS / macOS**: o botão Apple aparece automaticamente depois dos passos acima.
+>
+> **Android**: o botão Apple fica escondido por padrão (exige o fluxo do Services ID pago e agrega pouco no Android para um SaaS). Deixe escondido.
+>
+> **Web (Firebase)**: depois dos Passos 1 a 3, rode `kasy apple-web` — ele grava o Services ID + Team ID + Key ID + `.p8` no provedor Apple do Firebase e liga `withAppleWebSignin` (que nasce `false`). A Return URL do Services ID (`firebaseapp.com/__/auth/handler`) cobre o fluxo de popup. O Firebase re-assina o secret sozinho (não expira).
+>
+> **Web (Supabase)**: Apple na web no Supabase **não vem ligado no app ainda** (roadmap) — o botão fica escondido na web. No Supabase, o Apple funciona só no **iOS nativo** (já configurado pelo `kasy new`). Veja `ROADMAP.md`.
 
 ---
 

package/templates/firebase/functions/src/subscriptions/stripe_functions.ts

@@ -125,6 +125,8 @@ export const createCheckoutSession = onCall(
     const price = await stripe.prices.retrieve(priceId, {expand: ["product"]});
     const trialDays = trialDaysFor(price, price.product as Stripe.Product);
 
+    const allowPromoCodes = request.data?.allowPromoCodes as boolean | undefined;
+
     const session = await stripe.checkout.sessions.create({
       mode: "subscription",
       customer: customerId,
@@ -136,13 +138,70 @@ export const createCheckoutSession = onCall(
         metadata: {firebaseUID: uid},
         ...(trialDays ? {trial_period_days: trialDays} : {}),
       },
+      ...(allowPromoCodes ? {allow_promotion_codes: true} : {}),
     });
     return {url: session.url};
   },
 );
 
 // ---------------------------------------------------------------------------
-// createPortalSession — Stripe Customer Portal (manage / cancel).
+// getOrCreatePortalConfig — creates (once) a Customer Portal configuration
+// with subscription_update (plan switching) enabled and caches its ID in
+// Firestore so we don't recreate it on every portal open. Falls back to
+// undefined (default portal) if there are no prices to switch between.
+// ---------------------------------------------------------------------------
+async function getOrCreatePortalConfig(stripe: Stripe): Promise<string | undefined> {
+  const db = admin.firestore();
+  const configRef = db.doc("_config/stripe_portal");
+  const snap = await configRef.get();
+  const cachedId = snap.data()?.configId as string | undefined;
+  if (cachedId) {
+    try {
+      const cfg = await stripe.billingPortal.configurations.retrieve(cachedId);
+      if (cfg.active) return cachedId;
+    } catch {
+      // Cached config was deleted on Stripe — recreate below
+    }
+  }
+
+  // Build allowed-prices list grouped by product. STRIPE_PRODUCT_ID narrows the
+  // query to a single product; if it's not set we use all active recurring prices.
+  const productId = stripeProductId.value();
+  const priceParams: Stripe.PriceListParams = {active: true, type: "recurring", limit: 100};
+  if (productId) priceParams.product = productId;
+  const {data: prices} = await stripe.prices.list(priceParams);
+
+  if (prices.length === 0) return undefined;
+
+  const byProduct: Record<string, string[]> = {};
+  for (const p of prices) {
+    const pid = typeof p.product === "string" ? p.product : p.product.id;
+    if (!byProduct[pid]) byProduct[pid] = [];
+    byProduct[pid].push(p.id);
+  }
+  const products = Object.entries(byProduct).map(([prod, priceIds]) => ({
+    product: prod,
+    prices: priceIds,
+  }));
+
+  const config = await stripe.billingPortal.configurations.create({
+    features: {
+      subscription_update: {
+        enabled: true,
+        default_allowed_updates: ["price"],
+        products,
+      },
+      subscription_cancel: {enabled: true, mode: "at_period_end"},
+      payment_method_update: {enabled: true},
+    },
+  });
+
+  await configRef.set({configId: config.id}, {merge: true});
+  return config.id;
+}
+
+// ---------------------------------------------------------------------------
+// createPortalSession — Stripe Customer Portal (manage / cancel / switch plan).
 // ---------------------------------------------------------------------------
 export const createPortalSession = onCall(
   {secrets: [stripeSecretKey]},
@@ -150,6 +209,7 @@ export const createPortalSession = onCall(
     const uid = request.auth?.uid;
     if (!uid) throw new HttpsError("unauthenticated", "Sign in required");
     const returnUrl = (request.data?.returnUrl as string | undefined) ?? "";
+    const planSwitching = request.data?.planSwitching as boolean | undefined;
 
     const stripe = stripeClient();
     const snap = await admin
@@ -161,9 +221,16 @@ export const createPortalSession = onCall(
     if (!customerId) {
       throw new HttpsError("failed-precondition", "No Stripe customer for user");
     }
+
+    // When plan switching is requested, resolve (or create) a portal configuration
+    // that has subscription_update enabled. This removes the need for any manual
+    // setup in the Stripe dashboard.
+    const configId = planSwitching ? await getOrCreatePortalConfig(stripe) : undefined;
+
     const session = await stripe.billingPortal.sessions.create({
       customer: customerId,
       return_url: returnUrl,
+      ...(configId ? {configuration: configId} : {}),
     });
     return {url: session.url};
   },
@@ -189,11 +256,18 @@ async function upsertFromStripeSubscription(sub: Stripe.Subscription): Promise<v
     console.log("[stripe-webhook] subscription without firebaseUID metadata, skipping");
     return;
   }
+  // Skip if the user no longer exists. Deleting an account cancels the Stripe
+  // customer, which fires customer.subscription.deleted AFTER deleteUserAccount
+  // already removed subscriptions/{uid} — without this guard the webhook would
+  // re-create an orphan doc for a user that is gone. (The Supabase webhook does
+  // the same check.) The lookup also gives us the email to denormalize below.
+  const user = await usersRepository.getFromId(uid);
+  if (!user) {
+    console.log(`[stripe-webhook] user ${uid} not found (likely deleted), skipping`);
+    return;
+  }
   const now = Timestamp.now();
   const existing = await subscriptionsRepository.getFromUserId(uid);
-  // Denormalize the subscriber's email onto the Firestore subscription doc (see
-  // SubscriptionData.email) so a subscribers list reads it without a second hop.
-  const user = await usersRepository.getFromId(uid);
   // In Stripe API v18 the billing period lives on each subscription item.
   const item = sub.items.data[0];
   const priceId = item?.price?.id ?? "";
@@ -211,7 +285,7 @@ async function upsertFromStripeSubscription(sub: Stripe.Subscription): Promise<v
       expirationDate: expiration,
       store: Stores.STRIPE,
       productId: priceId,
-      email: user?.email,
+      email: user.email,
     },
     subscriptionsRepository,
   );

package/templates/firebase/lib/components/components.dart

@@ -21,6 +21,7 @@ export 'kasy_date_picker.dart';
 export 'kasy_dialog.dart';
 export 'kasy_image_viewer.dart';
 export 'kasy_otp_verification_bottom_sheet.dart';
+export 'kasy_screen.dart';
 export 'kasy_sidebar.dart';
 export 'kasy_skeleton.dart';
 export 'kasy_status_tag.dart';

package/templates/firebase/lib/components/kasy_accordion.dart

@@ -366,7 +366,7 @@ class _TrailingChevron extends StatelessWidget {
         duration: const Duration(milliseconds: 200),
         child: Icon(
           KasyIcons.chevronDown,
-          size: 18.5,
+          size: KasyIconSize.md,
           color: context.colors.muted,
         ),
       );
@@ -376,7 +376,7 @@ class _TrailingChevron extends StatelessWidget {
       duration: const Duration(milliseconds: 200),
       child: Icon(
         KasyIcons.chevronRight,
-        size: 18.5,
+        size: KasyIconSize.md,
         color: context.colors.muted,
       ),
     );

package/templates/firebase/lib/components/kasy_alert.dart

@@ -232,7 +232,7 @@ class KasyAlertCircleButton extends StatelessWidget {
           height: 36,
           child: Icon(
             icon,
-            size: 19,
+            size: KasyIconSize.md,
             color: context.colors.onSurface.withValues(alpha: 0.58),
           ),
         ),

package/templates/firebase/lib/components/kasy_app_bar.dart

@@ -292,7 +292,7 @@ class KasyAppBar extends StatelessWidget {
       ),
       _ => KasyChromeOrbIconButton(
         icon: KasyIcons.arrowBackIos,
-        iconSize: 18,
+        iconSize: KasyIconSize.md,
         foregroundColor: orbFg,
         fillColor: orbFill,
         onPressed: handleBack,
@@ -304,7 +304,10 @@ class KasyAppBar extends StatelessWidget {
         context.textTheme.headlineSmall ?? context.textTheme.titleLarge;
     final TextStyle? titleStyle = titleRef?.copyWith(
       fontSize: (titleRef.fontSize ?? 24) * kasyAppBarTitleFontScale,
-      fontWeight: FontWeight.w900,
+      // w700 (not w900): a clean page-title weight that matches the Home /
+      // sidebar scale. w900 read as a heavy "black" that fought the rest of
+      // the chrome.
+      fontWeight: FontWeight.w700,
       letterSpacing: -0.35,
       color: context.colors.onBackground,
     );
@@ -404,7 +407,7 @@ class KasyAppBar extends StatelessWidget {
       case KasyAppBarStyle.subpage:
         return KasyChromeOrbIconButton(
           icon: isDark ? KasyIcons.lightMode : KasyIcons.darkMode,
-          iconSize: 20,
+          iconSize: KasyIconSize.lg,
           foregroundColor: iconFg,
           fillColor: orbFill,
           onPressed: () {
@@ -421,7 +424,7 @@ class KasyAppBar extends StatelessWidget {
         if (trailing != null) return trailing!;
         return KasyChromeOrbIconButton(
           icon: isDark ? KasyIcons.lightMode : KasyIcons.darkMode,
-          iconSize: 20,
+          iconSize: KasyIconSize.lg,
           foregroundColor: iconFg,
           fillColor: orbFill,
           onPressed: () {

package/templates/firebase/lib/components/kasy_bottom_sheet.dart

@@ -298,7 +298,7 @@ class _IconBubble extends StatelessWidget {
       width: 72,
       height: 72,
       decoration: BoxDecoration(color: p.background, shape: BoxShape.circle),
-      child: Icon(icon, size: 30, color: p.foreground),
+      child: Icon(icon, size: KasyIconSize.xxl, color: p.foreground),
     );
   }
 

package/templates/firebase/lib/components/kasy_button.dart

@@ -417,17 +417,17 @@ class KasyButton extends StatelessWidget {
         iconOnlyExtent: 40,
         horizontalPadding: EdgeInsets.symmetric(horizontal: 16),
         labelFontSize: 13,
-        iconSize: 16,
-        iconOnlyGlyphSize: 12,
+        iconSize: KasyIconSize.sm,
+        iconOnlyGlyphSize: KasyIconSize.xxs,
         loadingSpinnerExtent: 13,
       ),
       KasyButtonSize.medium => const _KasyButtonMetrics(
-        height: 47,
-        iconOnlyExtent: 47,
+        height: 45,
+        iconOnlyExtent: 45,
         horizontalPadding: EdgeInsets.symmetric(horizontal: 18),
         labelFontSize: 14,
-        iconSize: 18,
-        iconOnlyGlyphSize: 14,
+        iconSize: KasyIconSize.md,
+        iconOnlyGlyphSize: KasyIconSize.xs,
         loadingSpinnerExtent: 14,
       ),
       KasyButtonSize.large => const _KasyButtonMetrics(
@@ -435,8 +435,8 @@ class KasyButton extends StatelessWidget {
         iconOnlyExtent: 54,
         horizontalPadding: EdgeInsets.symmetric(horizontal: 22),
         labelFontSize: 15,
-        iconSize: 19,
-        iconOnlyGlyphSize: 18,
+        iconSize: KasyIconSize.md,
+        iconOnlyGlyphSize: KasyIconSize.md,
         loadingSpinnerExtent: 15,
       ),
     };

package/templates/firebase/lib/components/kasy_chip.dart

@@ -36,7 +36,7 @@ class KasyChip extends StatelessWidget {
     final KasyColors c = context.colors;
     final Widget? avatar = icon == null
         ? null
-        : Icon(icon, size: 18, color: enabled ? c.primary : c.muted);
+        : Icon(icon, size: KasyIconSize.md, color: enabled ? c.primary : c.muted);
     final OutlinedBorder chipShape = RoundedRectangleBorder(
       borderRadius: BorderRadius.circular(KasyRadius.full),
       side: BorderSide(color: c.outline.withValues(alpha: 0.45)),