@flipdish/ui-library 0.35.1 → 0.36.0

package/dist/components/atoms/Badge/Badge.styles.cjs

@@ -0,0 +1,194 @@
+'use strict';
+
+var badge_types = require('./badge.types.cjs');
+
+const filledColors = {
+    gray: {
+        root: 'bg-utility-neutral-50 text-utility-neutral-700 ring-utility-neutral-200',
+        addon: 'text-utility-neutral-500',
+        dotColor: 'utility-neutral-500',
+        addonButton: 'hover:bg-utility-neutral-100 text-utility-neutral-400 hover:text-utility-neutral-500',
+    },
+    brand: {
+        root: 'bg-utility-brand-50 text-utility-brand-700 ring-utility-brand-200',
+        addon: 'text-utility-brand-500',
+        dotColor: 'utility-brand-500',
+        addonButton: 'hover:bg-utility-brand-100 text-utility-brand-400 hover:text-utility-brand-500',
+    },
+    error: {
+        root: 'bg-utility-red-50 text-utility-red-700 ring-utility-red-200',
+        addon: 'text-utility-red-500',
+        dotColor: 'utility-red-500',
+        addonButton: 'hover:bg-utility-red-100 text-utility-red-400 hover:text-utility-red-500',
+    },
+    warning: {
+        root: 'bg-utility-yellow-50 text-utility-yellow-700 ring-utility-yellow-200',
+        addon: 'text-utility-yellow-500',
+        dotColor: 'utility-yellow-500',
+        addonButton: 'hover:bg-utility-yellow-100 text-utility-yellow-400 hover:text-utility-yellow-500',
+    },
+    success: {
+        root: 'bg-utility-green-50 text-utility-green-700 ring-utility-green-200',
+        addon: 'text-utility-green-500',
+        dotColor: 'utility-green-500',
+        addonButton: 'hover:bg-utility-green-100 text-utility-green-400 hover:text-utility-green-500',
+    },
+    slate: {
+        root: 'bg-utility-slate-50 text-utility-slate-700 ring-utility-slate-200',
+        addon: 'text-utility-slate-500',
+        dotColor: 'utility-slate-500',
+        addonButton: 'hover:bg-utility-slate-100 text-utility-slate-400 hover:text-utility-slate-500',
+    },
+    sky: {
+        root: 'bg-utility-sky-50 text-utility-sky-700 ring-utility-sky-200',
+        addon: 'text-utility-sky-500',
+        dotColor: 'utility-sky-500',
+        addonButton: 'hover:bg-utility-sky-100 text-utility-sky-400 hover:text-utility-sky-500',
+    },
+    blue: {
+        root: 'bg-utility-blue-50 text-utility-blue-700 ring-utility-blue-200',
+        addon: 'text-utility-blue-500',
+        dotColor: 'utility-blue-500',
+        addonButton: 'hover:bg-utility-blue-100 text-utility-blue-400 hover:text-utility-blue-500',
+    },
+    indigo: {
+        root: 'bg-utility-indigo-50 text-utility-indigo-700 ring-utility-indigo-200',
+        addon: 'text-utility-indigo-500',
+        dotColor: 'utility-indigo-500',
+        addonButton: 'hover:bg-utility-indigo-100 text-utility-indigo-400 hover:text-utility-indigo-500',
+    },
+    purple: {
+        root: 'bg-utility-purple-50 text-utility-purple-700 ring-utility-purple-200',
+        addon: 'text-utility-purple-500',
+        dotColor: 'utility-purple-500',
+        addonButton: 'hover:bg-utility-purple-100 text-utility-purple-400 hover:text-utility-purple-500',
+    },
+    pink: {
+        root: 'bg-utility-pink-50 text-utility-pink-700 ring-utility-pink-200',
+        addon: 'text-utility-pink-500',
+        dotColor: 'utility-pink-500',
+        addonButton: 'hover:bg-utility-pink-100 text-utility-pink-400 hover:text-utility-pink-500',
+    },
+    orange: {
+        root: 'bg-utility-orange-50 text-utility-orange-700 ring-utility-orange-200',
+        addon: 'text-utility-orange-500',
+        dotColor: 'utility-orange-500',
+        addonButton: 'hover:bg-utility-orange-100 text-utility-orange-400 hover:text-utility-orange-500',
+    },
+};
+const addonOnlyColors = Object.fromEntries(Object.entries(filledColors).map(([key, value]) => [key, { root: '', addon: value.addon, dotColor: value.dotColor }]));
+const modernGray = {
+    gray: {
+        root: 'bg-primary text-secondary ring-primary',
+        addon: 'text-fg-quaternary',
+        dotColor: 'fg-quaternary',
+        addonButton: 'hover:bg-utility-neutral-100 text-utility-neutral-400 hover:text-utility-neutral-500',
+    },
+};
+const shapeCommon = {
+    [badge_types.badgeTypes.pillColor]: 'size-max flex items-center whitespace-nowrap rounded-full ring-1 ring-inset',
+    [badge_types.badgeTypes.badgeColor]: 'size-max flex items-center whitespace-nowrap rounded-md ring-1 ring-inset',
+    [badge_types.badgeTypes.badgeModern]: 'size-max flex items-center whitespace-nowrap rounded-md ring-1 ring-inset shadow-xs',
+};
+/** Pill sizes, and the square-cornered sizes the `color` and `modern` types share. */
+const bySize = (pill, badge) => ({
+    [badge_types.badgeTypes.pillColor]: pill,
+    [badge_types.badgeTypes.badgeColor]: badge,
+    [badge_types.badgeTypes.badgeModern]: badge,
+});
+/**
+ * Shared `Badge` style config, read by `index.tsx` (and by `index.native.tsx` once it exists).
+ *
+ * `types.standard` serves `Badge`, `BadgeWithFlag`, `BadgeWithImage`, `BadgeWithButton` and `BadgeIcon`:
+ * its `modern` type only offers `gray`, with the fill in `root`. `types.addon` serves `BadgeWithDot`
+ * and `BadgeWithIcon`: its `modern` type takes every colour, which tints only the dot or icon while
+ * the fill sits in `common`.
+ *
+ * Complete literal class names, never template literals — Tailwind scans source for whole candidates.
+ */
+const styles = {
+    types: {
+        standard: {
+            [badge_types.badgeTypes.pillColor]: { common: shapeCommon[badge_types.badgeTypes.pillColor], styles: filledColors },
+            [badge_types.badgeTypes.badgeColor]: { common: shapeCommon[badge_types.badgeTypes.badgeColor], styles: filledColors },
+            [badge_types.badgeTypes.badgeModern]: { common: shapeCommon[badge_types.badgeTypes.badgeModern], styles: modernGray },
+        },
+        addon: {
+            [badge_types.badgeTypes.pillColor]: { common: shapeCommon[badge_types.badgeTypes.pillColor], styles: filledColors },
+            [badge_types.badgeTypes.badgeColor]: { common: shapeCommon[badge_types.badgeTypes.badgeColor], styles: filledColors },
+            [badge_types.badgeTypes.badgeModern]: {
+                common: 'size-max flex items-center whitespace-nowrap rounded-md ring-1 ring-inset bg-primary text-secondary ring-primary shadow-xs',
+                styles: addonOnlyColors,
+            },
+        },
+    },
+    sizes: {
+        label: bySize({
+            sm: 'py-0.5 px-2 text-xs font-medium',
+            md: 'py-0.5 px-2.5 text-sm font-medium',
+            lg: 'py-1 px-3 text-sm font-medium',
+        }, {
+            sm: 'py-0.5 px-1.5 text-xs font-medium',
+            md: 'py-0.5 px-2 text-sm font-medium',
+            lg: 'py-1 px-2.5 text-sm font-medium rounded-lg',
+        }),
+        dot: bySize({
+            sm: 'gap-1 py-0.5 pl-1.5 pr-2 text-xs font-medium',
+            md: 'gap-1.5 py-0.5 pl-2 pr-2.5 text-sm font-medium',
+            lg: 'gap-1.5 py-1 pl-2.5 pr-3 text-sm font-medium',
+        }, {
+            sm: 'gap-1 py-0.5 px-1.5 text-xs font-medium',
+            md: 'gap-1.5 py-0.5 px-2 text-sm font-medium',
+            lg: 'gap-1.5 py-1 px-2.5 text-sm font-medium rounded-lg',
+        }),
+        icon: bySize({
+            sm: {
+                trailing: 'gap-0.5 py-0.5 pl-2 pr-1.5 text-xs font-medium',
+                leading: 'gap-0.5 py-0.5 pr-2 pl-1.5 text-xs font-medium',
+            },
+            md: {
+                trailing: 'gap-1 py-0.5 pl-2.5 pr-2 text-sm font-medium',
+                leading: 'gap-1 py-0.5 pr-2.5 pl-2 text-sm font-medium',
+            },
+            lg: {
+                trailing: 'gap-1 py-1 pl-3 pr-2.5 text-sm font-medium',
+                leading: 'gap-1 py-1 pr-3 pl-2.5 text-sm font-medium',
+            },
+        }, {
+            sm: {
+                trailing: 'gap-0.5 py-0.5 pl-2 pr-1.5 text-xs font-medium',
+                leading: 'gap-0.5 py-0.5 pr-2 pl-1.5 text-xs font-medium',
+            },
+            md: {
+                trailing: 'gap-1 py-0.5 pl-2 pr-1.5 text-sm font-medium',
+                leading: 'gap-1 py-0.5 pr-2 pl-1.5 text-sm font-medium',
+            },
+            lg: {
+                trailing: 'gap-1 py-1 pl-2.5 pr-2 text-sm font-medium rounded-lg',
+                leading: 'gap-1 py-1 pr-2.5 pl-2 text-sm font-medium rounded-lg',
+            },
+        }),
+        /** Shared by `BadgeWithFlag` and `BadgeWithImage`, whose media sits flush to the leading edge. */
+        media: bySize({
+            sm: 'gap-1 py-0.5 pl-0.75 pr-2 text-xs font-medium',
+            md: 'gap-1.5 py-0.5 pl-1 pr-2.5 text-sm font-medium',
+            lg: 'gap-1.5 py-1 pl-1.5 pr-3 text-sm font-medium',
+        }, {
+            sm: 'gap-1 py-0.5 pl-1 pr-1.5 text-xs font-medium',
+            md: 'gap-1.5 py-0.5 pl-1.5 pr-2 text-sm font-medium',
+            lg: 'gap-1.5 py-1 pl-2 pr-2.5 text-sm font-medium rounded-lg',
+        }),
+        button: bySize({
+            sm: 'gap-0.5 py-0.5 pl-2 pr-0.75 text-xs font-medium',
+            md: 'gap-0.5 py-0.5 pl-2.5 pr-1 text-sm font-medium',
+            lg: 'gap-0.5 py-1 pl-3 pr-1.5 text-sm font-medium',
+        }, {
+            sm: 'gap-0.5 py-0.5 pl-1.5 pr-0.75 text-xs font-medium',
+            md: 'gap-0.5 py-0.5 pl-2 pr-1 text-sm font-medium',
+            lg: 'gap-0.5 py-1 pl-2.5 pr-1.5 text-sm font-medium rounded-lg',
+        }),
+        iconOnly: bySize({ sm: 'p-1.25', md: 'p-1.5', lg: 'p-2' }, { sm: 'p-1.25', md: 'p-1.5', lg: 'p-2 rounded-lg' }),
+    }};
+
+exports.styles = styles;
+//# sourceMappingURL=Badge.styles.cjs.map

package/dist/components/atoms/Badge/Badge.styles.cjs.map

@@ -0,0 +1 @@
+{"version":3,"file":"Badge.styles.cjs","sources":["../../../../src/components/atoms/Badge/Badge.styles.ts"],"sourcesContent":[null],"names":["badgeTypes"],"mappings":"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"}

package/dist/components/atoms/Badge/Badge.styles.d.ts

@@ -0,0 +1,236 @@
+import type { DotColor } from '@flipdish/ui-library/components/atoms/Dot';
+import type { BadgeColors, BadgeTypes, Sizes } from './badge.types';
+/** React Native colour set for one badge colour: `View` classes plus the hex values `Text` and icons need. */
+export type NativeTone = {
+    bg: string;
+    border: string;
+    text: string;
+    addon: string;
+    button: string;
+    buttonPressed: string;
+    buttonPressedBg: string;
+};
+export type BadgeColorStyles = {
+    root: string;
+    addon: string;
+    dotColor: DotColor;
+    addonButton: string;
+};
+/**
+ * Shared `Badge` style config, read by `index.tsx` (and by `index.native.tsx` once it exists).
+ *
+ * `types.standard` serves `Badge`, `BadgeWithFlag`, `BadgeWithImage`, `BadgeWithButton` and `BadgeIcon`:
+ * its `modern` type only offers `gray`, with the fill in `root`. `types.addon` serves `BadgeWithDot`
+ * and `BadgeWithIcon`: its `modern` type takes every colour, which tints only the dot or icon while
+ * the fill sits in `common`.
+ *
+ * Complete literal class names, never template literals — Tailwind scans source for whole candidates.
+ */
+export declare const styles: {
+    types: {
+        standard: {
+            "pill-color": {
+                common: string;
+                styles: Record<BadgeColors, BadgeColorStyles>;
+            };
+            color: {
+                common: string;
+                styles: Record<BadgeColors, BadgeColorStyles>;
+            };
+            modern: {
+                common: string;
+                styles: {
+                    gray: {
+                        root: string;
+                        addon: string;
+                        dotColor: "fg-quaternary";
+                        addonButton: string;
+                    };
+                };
+            };
+        };
+        addon: {
+            "pill-color": {
+                common: string;
+                styles: Record<BadgeColors, BadgeColorStyles>;
+            };
+            color: {
+                common: string;
+                styles: Record<BadgeColors, BadgeColorStyles>;
+            };
+            modern: {
+                common: string;
+                styles: Record<BadgeColors, Omit<BadgeColorStyles, "addonButton">>;
+            };
+        };
+    };
+    sizes: {
+        label: Record<BadgeTypes, Record<Sizes, string>>;
+        dot: Record<BadgeTypes, Record<Sizes, string>>;
+        icon: Record<BadgeTypes, Record<Sizes, {
+            trailing: string;
+            leading: string;
+        }>>;
+        /** Shared by `BadgeWithFlag` and `BadgeWithImage`, whose media sits flush to the leading edge. */
+        media: Record<BadgeTypes, Record<Sizes, string>>;
+        button: Record<BadgeTypes, Record<Sizes, string>>;
+        iconOnly: Record<BadgeTypes, Record<Sizes, string>>;
+    };
+    /**
+     * React Native only. Text and icon colours are light-mode hex rather than tokens: `Text` ignores
+     * `className` under the current `react-native-css` preview (see `Avatar/index.native.tsx`) and an icon
+     * has no `currentColor` to inherit, so both take an explicit value, as `Button` does. `text` mirrors
+     * web's `*-700`, `addon` its `*-500`, and `button`, `buttonPressed` and `buttonPressedBg` the dismiss button's resting tint and `hover:` state.
+     * `bg` and `border` are classes because a `View` resolves them. Primitive hex values are
+     * Tailwind's, so they match web in light mode only.
+     */
+    native: {
+        common: {
+            "pill-color": string;
+            color: string;
+            modern: string;
+        };
+        colors: {
+            gray: {
+                bg: string;
+                border: string;
+                text: string;
+                addon: string;
+                button: string;
+                buttonPressed: string;
+                buttonPressedBg: string;
+            };
+            brand: {
+                bg: string;
+                border: string;
+                text: string;
+                addon: string;
+                button: string;
+                buttonPressed: string;
+                buttonPressedBg: string;
+            };
+            error: {
+                bg: string;
+                border: string;
+                text: string;
+                addon: string;
+                button: string;
+                buttonPressed: string;
+                buttonPressedBg: string;
+            };
+            warning: {
+                bg: string;
+                border: string;
+                text: string;
+                addon: string;
+                button: string;
+                buttonPressed: string;
+                buttonPressedBg: string;
+            };
+            success: {
+                bg: string;
+                border: string;
+                text: string;
+                addon: string;
+                button: string;
+                buttonPressed: string;
+                buttonPressedBg: string;
+            };
+            slate: {
+                bg: string;
+                border: string;
+                text: string;
+                addon: string;
+                button: string;
+                buttonPressed: string;
+                buttonPressedBg: string;
+            };
+            sky: {
+                bg: string;
+                border: string;
+                text: string;
+                addon: string;
+                button: string;
+                buttonPressed: string;
+                buttonPressedBg: string;
+            };
+            blue: {
+                bg: string;
+                border: string;
+                text: string;
+                addon: string;
+                button: string;
+                buttonPressed: string;
+                buttonPressedBg: string;
+            };
+            indigo: {
+                bg: string;
+                border: string;
+                text: string;
+                addon: string;
+                button: string;
+                buttonPressed: string;
+                buttonPressedBg: string;
+            };
+            purple: {
+                bg: string;
+                border: string;
+                text: string;
+                addon: string;
+                button: string;
+                buttonPressed: string;
+                buttonPressedBg: string;
+            };
+            pink: {
+                bg: string;
+                border: string;
+                text: string;
+                addon: string;
+                button: string;
+                buttonPressed: string;
+                buttonPressedBg: string;
+            };
+            orange: {
+                bg: string;
+                border: string;
+                text: string;
+                addon: string;
+                button: string;
+                buttonPressed: string;
+                buttonPressedBg: string;
+            };
+        };
+        /** The neutral `modern` fill; `text` is `text-secondary` and `addon` is `fg-quaternary`. */
+        modern: {
+            bg: string;
+            border: string;
+            text: string;
+            addon: string;
+            button: string;
+            buttonPressed: string;
+            buttonPressedBg: string;
+        };
+        /** Pixel size of the leading, trailing and dismiss icons — web's `size-3`. */
+        iconSize: number;
+        /** Stroke width of those icons, in the 24px icon viewBox — web's `stroke-3`. */
+        iconStrokeWidth: number;
+        /** Diameter of the image in `BadgeWithImage` — web's `size-4`. */
+        imageSize: number;
+        /** Label type scale, web's `text-xs` for `sm` and `text-sm` otherwise. */
+        text: {
+            sm: {
+                fontSize: number;
+                lineHeight: number;
+            };
+            md: {
+                fontSize: number;
+                lineHeight: number;
+            };
+            lg: {
+                fontSize: number;
+                lineHeight: number;
+            };
+        };
+    };
+};
+//# sourceMappingURL=Badge.styles.d.ts.map

package/dist/components/atoms/Badge/Badge.styles.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"Badge.styles.d.ts","sourceRoot":"","sources":["../../../../src/components/atoms/Badge/Badge.styles.ts"],"names":[],"mappings":"AAAA,OAAO,KAAK,EAAE,QAAQ,EAAE,MAAM,2CAA2C,CAAC;AAC1E,OAAO,KAAK,EAAE,WAAW,EAAE,UAAU,EAAE,KAAK,EAAE,MAAM,eAAe,CAAC;AAGpE,8GAA8G;AAC9G,MAAM,MAAM,UAAU,GAAG;IACvB,EAAE,EAAE,MAAM,CAAC;IACX,MAAM,EAAE,MAAM,CAAC;IACf,IAAI,EAAE,MAAM,CAAC;IACb,KAAK,EAAE,MAAM,CAAC;IACd,MAAM,EAAE,MAAM,CAAC;IACf,aAAa,EAAE,MAAM,CAAC;IACtB,eAAe,EAAE,MAAM,CAAC;CACzB,CAAC;AAEF,MAAM,MAAM,gBAAgB,GAAG;IAAE,IAAI,EAAE,MAAM,CAAC;IAAC,KAAK,EAAE,MAAM,CAAC;IAAC,QAAQ,EAAE,QAAQ,CAAC;IAAC,WAAW,EAAE,MAAM,CAAA;CAAE,CAAC;AAuGxG;;;;;;;;;GASG;AACH,eAAO,MAAM,MAAM;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;QAuEf,kGAAkG;;;;;IA2BpG;;;;;;;OAOG;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;QAiID,4FAA4F;;;;;;;;;;QAW5F,8EAA8E;;QAE9E,gFAAgF;;QAEhF,kEAAkE;;QAElE,0EAA0E;;;;;;;;;;;;;;;;CAO7E,CAAC"}

package/dist/components/atoms/Badge/Badge.styles.js

@@ -0,0 +1,192 @@
+import { badgeTypes } from './badge.types.js';
+
+const filledColors = {
+    gray: {
+        root: 'bg-utility-neutral-50 text-utility-neutral-700 ring-utility-neutral-200',
+        addon: 'text-utility-neutral-500',
+        dotColor: 'utility-neutral-500',
+        addonButton: 'hover:bg-utility-neutral-100 text-utility-neutral-400 hover:text-utility-neutral-500',
+    },
+    brand: {
+        root: 'bg-utility-brand-50 text-utility-brand-700 ring-utility-brand-200',
+        addon: 'text-utility-brand-500',
+        dotColor: 'utility-brand-500',
+        addonButton: 'hover:bg-utility-brand-100 text-utility-brand-400 hover:text-utility-brand-500',
+    },
+    error: {
+        root: 'bg-utility-red-50 text-utility-red-700 ring-utility-red-200',
+        addon: 'text-utility-red-500',
+        dotColor: 'utility-red-500',
+        addonButton: 'hover:bg-utility-red-100 text-utility-red-400 hover:text-utility-red-500',
+    },
+    warning: {
+        root: 'bg-utility-yellow-50 text-utility-yellow-700 ring-utility-yellow-200',
+        addon: 'text-utility-yellow-500',
+        dotColor: 'utility-yellow-500',
+        addonButton: 'hover:bg-utility-yellow-100 text-utility-yellow-400 hover:text-utility-yellow-500',
+    },
+    success: {
+        root: 'bg-utility-green-50 text-utility-green-700 ring-utility-green-200',
+        addon: 'text-utility-green-500',
+        dotColor: 'utility-green-500',
+        addonButton: 'hover:bg-utility-green-100 text-utility-green-400 hover:text-utility-green-500',
+    },
+    slate: {
+        root: 'bg-utility-slate-50 text-utility-slate-700 ring-utility-slate-200',
+        addon: 'text-utility-slate-500',
+        dotColor: 'utility-slate-500',
+        addonButton: 'hover:bg-utility-slate-100 text-utility-slate-400 hover:text-utility-slate-500',
+    },
+    sky: {
+        root: 'bg-utility-sky-50 text-utility-sky-700 ring-utility-sky-200',
+        addon: 'text-utility-sky-500',
+        dotColor: 'utility-sky-500',
+        addonButton: 'hover:bg-utility-sky-100 text-utility-sky-400 hover:text-utility-sky-500',
+    },
+    blue: {
+        root: 'bg-utility-blue-50 text-utility-blue-700 ring-utility-blue-200',
+        addon: 'text-utility-blue-500',
+        dotColor: 'utility-blue-500',
+        addonButton: 'hover:bg-utility-blue-100 text-utility-blue-400 hover:text-utility-blue-500',
+    },
+    indigo: {
+        root: 'bg-utility-indigo-50 text-utility-indigo-700 ring-utility-indigo-200',
+        addon: 'text-utility-indigo-500',
+        dotColor: 'utility-indigo-500',
+        addonButton: 'hover:bg-utility-indigo-100 text-utility-indigo-400 hover:text-utility-indigo-500',
+    },
+    purple: {
+        root: 'bg-utility-purple-50 text-utility-purple-700 ring-utility-purple-200',
+        addon: 'text-utility-purple-500',
+        dotColor: 'utility-purple-500',
+        addonButton: 'hover:bg-utility-purple-100 text-utility-purple-400 hover:text-utility-purple-500',
+    },
+    pink: {
+        root: 'bg-utility-pink-50 text-utility-pink-700 ring-utility-pink-200',
+        addon: 'text-utility-pink-500',
+        dotColor: 'utility-pink-500',
+        addonButton: 'hover:bg-utility-pink-100 text-utility-pink-400 hover:text-utility-pink-500',
+    },
+    orange: {
+        root: 'bg-utility-orange-50 text-utility-orange-700 ring-utility-orange-200',
+        addon: 'text-utility-orange-500',
+        dotColor: 'utility-orange-500',
+        addonButton: 'hover:bg-utility-orange-100 text-utility-orange-400 hover:text-utility-orange-500',
+    },
+};
+const addonOnlyColors = Object.fromEntries(Object.entries(filledColors).map(([key, value]) => [key, { root: '', addon: value.addon, dotColor: value.dotColor }]));
+const modernGray = {
+    gray: {
+        root: 'bg-primary text-secondary ring-primary',
+        addon: 'text-fg-quaternary',
+        dotColor: 'fg-quaternary',
+        addonButton: 'hover:bg-utility-neutral-100 text-utility-neutral-400 hover:text-utility-neutral-500',
+    },
+};
+const shapeCommon = {
+    [badgeTypes.pillColor]: 'size-max flex items-center whitespace-nowrap rounded-full ring-1 ring-inset',
+    [badgeTypes.badgeColor]: 'size-max flex items-center whitespace-nowrap rounded-md ring-1 ring-inset',
+    [badgeTypes.badgeModern]: 'size-max flex items-center whitespace-nowrap rounded-md ring-1 ring-inset shadow-xs',
+};
+/** Pill sizes, and the square-cornered sizes the `color` and `modern` types share. */
+const bySize = (pill, badge) => ({
+    [badgeTypes.pillColor]: pill,
+    [badgeTypes.badgeColor]: badge,
+    [badgeTypes.badgeModern]: badge,
+});
+/**
+ * Shared `Badge` style config, read by `index.tsx` (and by `index.native.tsx` once it exists).
+ *
+ * `types.standard` serves `Badge`, `BadgeWithFlag`, `BadgeWithImage`, `BadgeWithButton` and `BadgeIcon`:
+ * its `modern` type only offers `gray`, with the fill in `root`. `types.addon` serves `BadgeWithDot`
+ * and `BadgeWithIcon`: its `modern` type takes every colour, which tints only the dot or icon while
+ * the fill sits in `common`.
+ *
+ * Complete literal class names, never template literals — Tailwind scans source for whole candidates.
+ */
+const styles = {
+    types: {
+        standard: {
+            [badgeTypes.pillColor]: { common: shapeCommon[badgeTypes.pillColor], styles: filledColors },
+            [badgeTypes.badgeColor]: { common: shapeCommon[badgeTypes.badgeColor], styles: filledColors },
+            [badgeTypes.badgeModern]: { common: shapeCommon[badgeTypes.badgeModern], styles: modernGray },
+        },
+        addon: {
+            [badgeTypes.pillColor]: { common: shapeCommon[badgeTypes.pillColor], styles: filledColors },
+            [badgeTypes.badgeColor]: { common: shapeCommon[badgeTypes.badgeColor], styles: filledColors },
+            [badgeTypes.badgeModern]: {
+                common: 'size-max flex items-center whitespace-nowrap rounded-md ring-1 ring-inset bg-primary text-secondary ring-primary shadow-xs',
+                styles: addonOnlyColors,
+            },
+        },
+    },
+    sizes: {
+        label: bySize({
+            sm: 'py-0.5 px-2 text-xs font-medium',
+            md: 'py-0.5 px-2.5 text-sm font-medium',
+            lg: 'py-1 px-3 text-sm font-medium',
+        }, {
+            sm: 'py-0.5 px-1.5 text-xs font-medium',
+            md: 'py-0.5 px-2 text-sm font-medium',
+            lg: 'py-1 px-2.5 text-sm font-medium rounded-lg',
+        }),
+        dot: bySize({
+            sm: 'gap-1 py-0.5 pl-1.5 pr-2 text-xs font-medium',
+            md: 'gap-1.5 py-0.5 pl-2 pr-2.5 text-sm font-medium',
+            lg: 'gap-1.5 py-1 pl-2.5 pr-3 text-sm font-medium',
+        }, {
+            sm: 'gap-1 py-0.5 px-1.5 text-xs font-medium',
+            md: 'gap-1.5 py-0.5 px-2 text-sm font-medium',
+            lg: 'gap-1.5 py-1 px-2.5 text-sm font-medium rounded-lg',
+        }),
+        icon: bySize({
+            sm: {
+                trailing: 'gap-0.5 py-0.5 pl-2 pr-1.5 text-xs font-medium',
+                leading: 'gap-0.5 py-0.5 pr-2 pl-1.5 text-xs font-medium',
+            },
+            md: {
+                trailing: 'gap-1 py-0.5 pl-2.5 pr-2 text-sm font-medium',
+                leading: 'gap-1 py-0.5 pr-2.5 pl-2 text-sm font-medium',
+            },
+            lg: {
+                trailing: 'gap-1 py-1 pl-3 pr-2.5 text-sm font-medium',
+                leading: 'gap-1 py-1 pr-3 pl-2.5 text-sm font-medium',
+            },
+        }, {
+            sm: {
+                trailing: 'gap-0.5 py-0.5 pl-2 pr-1.5 text-xs font-medium',
+                leading: 'gap-0.5 py-0.5 pr-2 pl-1.5 text-xs font-medium',
+            },
+            md: {
+                trailing: 'gap-1 py-0.5 pl-2 pr-1.5 text-sm font-medium',
+                leading: 'gap-1 py-0.5 pr-2 pl-1.5 text-sm font-medium',
+            },
+            lg: {
+                trailing: 'gap-1 py-1 pl-2.5 pr-2 text-sm font-medium rounded-lg',
+                leading: 'gap-1 py-1 pr-2.5 pl-2 text-sm font-medium rounded-lg',
+            },
+        }),
+        /** Shared by `BadgeWithFlag` and `BadgeWithImage`, whose media sits flush to the leading edge. */
+        media: bySize({
+            sm: 'gap-1 py-0.5 pl-0.75 pr-2 text-xs font-medium',
+            md: 'gap-1.5 py-0.5 pl-1 pr-2.5 text-sm font-medium',
+            lg: 'gap-1.5 py-1 pl-1.5 pr-3 text-sm font-medium',
+        }, {
+            sm: 'gap-1 py-0.5 pl-1 pr-1.5 text-xs font-medium',
+            md: 'gap-1.5 py-0.5 pl-1.5 pr-2 text-sm font-medium',
+            lg: 'gap-1.5 py-1 pl-2 pr-2.5 text-sm font-medium rounded-lg',
+        }),
+        button: bySize({
+            sm: 'gap-0.5 py-0.5 pl-2 pr-0.75 text-xs font-medium',
+            md: 'gap-0.5 py-0.5 pl-2.5 pr-1 text-sm font-medium',
+            lg: 'gap-0.5 py-1 pl-3 pr-1.5 text-sm font-medium',
+        }, {
+            sm: 'gap-0.5 py-0.5 pl-1.5 pr-0.75 text-xs font-medium',
+            md: 'gap-0.5 py-0.5 pl-2 pr-1 text-sm font-medium',
+            lg: 'gap-0.5 py-1 pl-2.5 pr-1.5 text-sm font-medium rounded-lg',
+        }),
+        iconOnly: bySize({ sm: 'p-1.25', md: 'p-1.5', lg: 'p-2' }, { sm: 'p-1.25', md: 'p-1.5', lg: 'p-2 rounded-lg' }),
+    }};
+
+export { styles };
+//# sourceMappingURL=Badge.styles.js.map

package/dist/components/atoms/Badge/Badge.styles.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"Badge.styles.js","sources":["../../../../src/components/atoms/Badge/Badge.styles.ts"],"sourcesContent":[null],"names":[],"mappings":"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"}

package/dist/components/atoms/Badge/badge.types.cjs.map

@@ -1 +1 @@
-{"version":3,"file":"badge.types.cjs","sources":["../../../../src/components/atoms/Badge/badge.types.ts"],"sourcesContent":[null],"names":[],"mappings":";;AAgBO,MAAM,UAAU,GAAG;AACxB,IAAA,SAAS,EAAE,YAAY;AACvB,IAAA,UAAU,EAAE,OAAO;AACnB,IAAA,WAAW,EAAE,QAAQ;;;"}
+{"version":3,"file":"badge.types.cjs","sources":["../../../../src/components/atoms/Badge/badge.types.ts"],"sourcesContent":[null],"names":[],"mappings":";;AAaO,MAAM,UAAU,GAAG;AACxB,IAAA,SAAS,EAAE,YAAY;AACvB,IAAA,UAAU,EAAE,OAAO;AACnB,IAAA,WAAW,EAAE,QAAQ;;;"}

package/dist/components/atoms/Badge/badge.types.d.ts

@@ -1,11 +1,9 @@
-import type { CountryCode } from '@flipdish/ui-library/components/atoms/Flag';
 export type IconComponentType = React.FunctionComponent<{
     className?: string;
     strokeWidth?: string | number;
 }>;
 export type Sizes = 'sm' | 'md' | 'lg';
 export type BadgeColors = 'gray' | 'brand' | 'error' | 'warning' | 'success' | 'slate' | 'sky' | 'blue' | 'indigo' | 'purple' | 'pink' | 'orange';
-export type FlagTypes = CountryCode;
 export type ExtractColorKeys<T> = T extends {
     styles: infer C;
 } ? keyof C : never;