@brandlab-digital/site-next 3.7.0 → 3.8.0

package/dist/ui-kit/brandlab-skin.d.ts

@@ -0,0 +1,17 @@
+/**
+ * A site's whole look for the ui-kit: one entry per shared component it renders (`src/site/skin.ts`, written with
+ * `satisfies BrandlabSkin`). Each release adds the entries for its components. K2 checks that every rendered
+ * component has an entry and that no reference-skin class ships.
+ */
+import type { ButtonLinkSkin, PhoneLinkSkin, TextLinkSkin } from './primitives/links.js';
+import type { QuoteButtonSkin } from './primitives/quote-button.js';
+import type { ContainerSkin, SectionHeadingSkin } from './primitives/layout.js';
+export interface BrandlabSkin {
+    readonly buttonLink?: ButtonLinkSkin;
+    readonly textLink?: TextLinkSkin;
+    readonly phoneLink?: PhoneLinkSkin;
+    readonly quoteButton?: QuoteButtonSkin;
+    readonly container?: ContainerSkin;
+    readonly sectionHeading?: SectionHeadingSkin;
+}
+//# sourceMappingURL=brandlab-skin.d.ts.map

package/dist/ui-kit/brandlab-skin.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"brandlab-skin.d.ts","sourceRoot":"","sources":["../../src/ui-kit/brandlab-skin.ts"],"names":[],"mappings":"AAAA;;;;GAIG;AACH,OAAO,KAAK,EAAE,cAAc,EAAE,aAAa,EAAE,YAAY,EAAE,MAAM,uBAAuB,CAAA;AACxF,OAAO,KAAK,EAAE,eAAe,EAAE,MAAM,8BAA8B,CAAA;AACnE,OAAO,KAAK,EAAE,aAAa,EAAE,kBAAkB,EAAE,MAAM,wBAAwB,CAAA;AAE/E,MAAM,WAAW,YAAY;IAC3B,QAAQ,CAAC,UAAU,CAAC,EAAE,cAAc,CAAA;IACpC,QAAQ,CAAC,QAAQ,CAAC,EAAE,YAAY,CAAA;IAChC,QAAQ,CAAC,SAAS,CAAC,EAAE,aAAa,CAAA;IAClC,QAAQ,CAAC,WAAW,CAAC,EAAE,eAAe,CAAA;IACtC,QAAQ,CAAC,SAAS,CAAC,EAAE,aAAa,CAAA;IAClC,QAAQ,CAAC,cAAc,CAAC,EAAE,kBAAkB,CAAA;CAC7C"}

package/dist/ui-kit/brandlab-skin.js

@@ -0,0 +1,2 @@
+export {};
+//# sourceMappingURL=brandlab-skin.js.map

package/dist/ui-kit/brandlab-skin.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"brandlab-skin.js","sourceRoot":"","sources":["../../src/ui-kit/brandlab-skin.ts"],"names":[],"mappings":"","sourcesContent":["/**\n * A site's whole look for the ui-kit: one entry per shared component it renders (`src/site/skin.ts`, written with\n * `satisfies BrandlabSkin`). Each release adds the entries for its components. K2 checks that every rendered\n * component has an entry and that no reference-skin class ships.\n */\nimport type { ButtonLinkSkin, PhoneLinkSkin, TextLinkSkin } from './primitives/links.js'\nimport type { QuoteButtonSkin } from './primitives/quote-button.js'\nimport type { ContainerSkin, SectionHeadingSkin } from './primitives/layout.js'\n\nexport interface BrandlabSkin {\n  readonly buttonLink?: ButtonLinkSkin\n  readonly textLink?: TextLinkSkin\n  readonly phoneLink?: PhoneLinkSkin\n  readonly quoteButton?: QuoteButtonSkin\n  readonly container?: ContainerSkin\n  readonly sectionHeading?: SectionHeadingSkin\n}\n"]}

package/dist/ui-kit/icons.d.ts

@@ -0,0 +1,15 @@
+import type { UiSocialKind } from './types.js';
+export interface IconProps {
+    readonly className?: string | undefined;
+}
+export declare const UI_ICON_NAMES: readonly ["phone", "chevron", "arrow", "arrow-up", "menu", "close", "star", "check", "camera", "mail", "facebook", "instagram", "google", "linkedin", "youtube", "tiktok"];
+export type UiIconName = (typeof UI_ICON_NAMES)[number];
+/** One icon from the set by name. */
+export declare function Icon({ name, className }: IconProps & {
+    name: UiIconName;
+}): import("react/jsx-runtime").JSX.Element;
+/** The icon for a social or Business Profile link. */
+export declare function SocialIcon({ kind, className }: IconProps & {
+    kind: UiSocialKind;
+}): import("react/jsx-runtime").JSX.Element;
+//# sourceMappingURL=icons.d.ts.map

package/dist/ui-kit/icons.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"icons.d.ts","sourceRoot":"","sources":["../../src/ui-kit/icons.tsx"],"names":[],"mappings":"AAMA,OAAO,KAAK,EAAE,YAAY,EAAE,MAAM,YAAY,CAAA;AAE9C,MAAM,WAAW,SAAS;IACxB,QAAQ,CAAC,SAAS,CAAC,EAAE,MAAM,GAAG,SAAS,CAAA;CACxC;AAED,eAAO,MAAM,aAAa,4KAiBhB,CAAA;AACV,MAAM,MAAM,UAAU,GAAG,CAAC,OAAO,aAAa,CAAC,CAAC,MAAM,CAAC,CAAA;AAwGvD,qCAAqC;AACrC,wBAAgB,IAAI,CAAC,EAAE,IAAI,EAAE,SAAS,EAAE,EAAE,SAAS,GAAG;IAAE,IAAI,EAAE,UAAU,CAAA;CAAE,2CAOzE;AAED,sDAAsD;AACtD,wBAAgB,UAAU,CAAC,EAAE,IAAI,EAAE,SAAS,EAAE,EAAE,SAAS,GAAG;IAAE,IAAI,EAAE,YAAY,CAAA;CAAE,2CAEjF"}

package/dist/ui-kit/icons.js

@@ -0,0 +1,72 @@
+import { jsx as _jsx, Fragment as _Fragment, jsxs as _jsxs } from "react/jsx-runtime";
+export const UI_ICON_NAMES = [
+    'phone',
+    'chevron',
+    'arrow',
+    'arrow-up',
+    'menu',
+    'close',
+    'star',
+    'check',
+    'camera',
+    'mail',
+    'facebook',
+    'instagram',
+    'google',
+    'linkedin',
+    'youtube',
+    'tiktok',
+];
+function Svg({ name, viewBox = '0 0 24 24', className, children }) {
+    return (_jsx("svg", { "aria-hidden": "true", focusable: "false", viewBox: viewBox, className: className, "data-icon": name, children: children }));
+}
+const stroke = { fill: 'none', stroke: 'currentColor', strokeLinecap: 'round', strokeLinejoin: 'round' };
+const GLYPHS = {
+    phone: {
+        body: (_jsx("path", { ...stroke, strokeWidth: "1.6", d: "M2.25 6.75c0 8.284 6.716 15 15 15h2.25a2.25 2.25 0 0 0 2.25-2.25v-1.372c0-.516-.351-.966-.852-1.091l-4.423-1.106a1.125 1.125 0 0 0-1.173.417l-.97 1.293a1.125 1.125 0 0 1-1.21.38 12.035 12.035 0 0 1-7.143-7.143 1.125 1.125 0 0 1 .38-1.21l1.293-.97c.363-.271.527-.734.417-1.173L6.963 3.102a1.125 1.125 0 0 0-1.091-.852H4.5A2.25 2.25 0 0 0 2.25 4.5v2.25Z" })),
+    },
+    chevron: { body: _jsx("path", { ...stroke, strokeWidth: "1.8", d: "m6 9 6 6 6-6" }) },
+    arrow: { body: _jsx("path", { ...stroke, strokeWidth: "1.6", d: "M13.5 4.5 21 12l-7.5 7.5M3 12h17.25" }) },
+    'arrow-up': { body: _jsx("path", { ...stroke, strokeWidth: "1.8", d: "M12 20V4m0 0-7 7m7-7 7 7" }) },
+    menu: { body: _jsx("path", { ...stroke, strokeWidth: "1.7", d: "M4 7h16M4 12h16M4 17h16" }) },
+    close: { body: _jsx("path", { ...stroke, strokeWidth: "1.7", d: "M6 18 18 6M6 6l12 12" }) },
+    star: {
+        viewBox: '0 0 20 20',
+        body: _jsx("path", { fill: "currentColor", d: "M10 1.6 12.6 7l5.9.7-4.4 4 1.2 5.8L10 14.6l-5.3 2.9L5.9 11.7l-4.4-4L7.4 7 10 1.6Z" }),
+    },
+    check: { body: _jsx("path", { ...stroke, strokeWidth: "2", d: "m4.5 12.75 6 6 9-13.5" }) },
+    camera: {
+        body: (_jsxs(_Fragment, { children: [_jsx("path", { ...stroke, strokeWidth: "1.6", d: "M3 8.25A2.25 2.25 0 0 1 5.25 6h1.372c.516 0 .966-.351 1.091-.852l.38-1.52A1.125 1.125 0 0 1 9.184 2.7h5.632c.516 0 .966.351 1.091.852l.38 1.52c.125.5.575.852 1.091.852h1.372A2.25 2.25 0 0 1 21 8.25v9.75a2.25 2.25 0 0 1-2.25 2.25H5.25A2.25 2.25 0 0 1 3 18V8.25Z" }), _jsx("circle", { ...stroke, strokeWidth: "1.6", cx: "12", cy: "12.75", r: "3.75" })] })),
+    },
+    mail: {
+        body: (_jsx("path", { ...stroke, strokeWidth: "1.6", d: "M21.75 6.75v10.5a2.25 2.25 0 0 1-2.25 2.25h-15a2.25 2.25 0 0 1-2.25-2.25V6.75m19.5 0A2.25 2.25 0 0 0 19.5 4.5h-15a2.25 2.25 0 0 0-2.25 2.25m19.5 0-8.69 5.6a2.25 2.25 0 0 1-2.12 0l-8.69-5.6" })),
+    },
+    facebook: {
+        body: (_jsx("path", { fill: "currentColor", d: "M9 8H6v4h3v12h5V12h3.642L18 8h-4V6.333C14 5.378 14.192 5 15.115 5H18V0h-3.808C10.596 0 9 1.583 9 4.615V8Z" })),
+    },
+    instagram: {
+        body: (_jsxs(_Fragment, { children: [_jsx("rect", { x: "3", y: "3", width: "18", height: "18", rx: "5", fill: "none", stroke: "currentColor", strokeWidth: "2" }), _jsx("circle", { cx: "12", cy: "12", r: "4.2", fill: "none", stroke: "currentColor", strokeWidth: "2" }), _jsx("circle", { cx: "17.4", cy: "6.6", r: "1.3", fill: "currentColor" })] })),
+    },
+    google: {
+        body: (_jsx("path", { fill: "currentColor", d: "M21.6 12.23c0-.68-.06-1.33-.17-1.96H12v3.7h5.39a4.6 4.6 0 0 1-2 3.02v2.5h3.24c1.9-1.75 2.97-4.32 2.97-7.26ZM12 22c2.7 0 4.96-.9 6.62-2.43l-3.24-2.5c-.9.6-2.04.95-3.38.95-2.6 0-4.8-1.75-5.59-4.11H3.07v2.59A10 10 0 0 0 12 22Zm-5.59-8.09A6 6 0 0 1 6.1 12c0-.66.11-1.31.31-1.91V7.5H3.07A10 10 0 0 0 2 12c0 1.61.39 3.14 1.07 4.5l3.34-2.59ZM12 5.98c1.47 0 2.79.5 3.83 1.5l2.87-2.87A9.6 9.6 0 0 0 12 2a10 10 0 0 0-8.93 5.5l3.34 2.59C7.2 7.73 9.4 5.98 12 5.98Z" })),
+    },
+    linkedin: {
+        body: (_jsx("path", { fill: "currentColor", d: "M4.98 3.5a2.5 2.5 0 1 1 0 5 2.5 2.5 0 0 1 0-5ZM3 9.75h4v11.5H3V9.75Zm6.5 0h3.83v1.57h.06c.53-1 1.84-2.07 3.79-2.07 4.05 0 4.8 2.67 4.8 6.13v5.87h-4v-5.2c0-1.24-.02-2.84-1.73-2.84-1.73 0-2 1.35-2 2.75v5.29h-4V9.75Z" })),
+    },
+    youtube: {
+        body: (_jsx("path", { fill: "currentColor", d: "M23 7.2a3 3 0 0 0-2.1-2.1C19 4.6 12 4.6 12 4.6s-7 0-8.9.5A3 3 0 0 0 1 7.2 31 31 0 0 0 .5 12a31 31 0 0 0 .5 4.8 3 3 0 0 0 2.1 2.1c1.9.5 8.9.5 8.9.5s7 0 8.9-.5a3 3 0 0 0 2.1-2.1 31 31 0 0 0 .5-4.8 31 31 0 0 0-.5-4.8ZM9.75 15.02V8.98L15.5 12l-5.75 3.02Z" })),
+    },
+    tiktok: {
+        body: (_jsx("path", { fill: "currentColor", d: "M16.6 2h-3.4v13.4a2.9 2.9 0 1 1-2.9-2.9c.3 0 .6 0 .9.1V9.1a6.3 6.3 0 1 0 5.4 6.3V8.6a8.1 8.1 0 0 0 4.4 1.3V6.5a4.5 4.5 0 0 1-4.4-4.5Z" })),
+    },
+};
+/** One icon from the set by name. */
+export function Icon({ name, className }) {
+    const glyph = GLYPHS[name];
+    return (_jsx(Svg, { name: name, viewBox: glyph.viewBox, className: className, children: glyph.body }));
+}
+/** The icon for a social or Business Profile link. */
+export function SocialIcon({ kind, className }) {
+    return _jsx(Icon, { name: kind, className: className });
+}
+//# sourceMappingURL=icons.js.map

package/dist/ui-kit/icons.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"icons.js","sourceRoot":"","sources":["../../src/ui-kit/icons.tsx"],"names":[],"mappings":"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","sourcesContent":["/**\n * The ui-kit's inline SVG icon set (no icon font). Every icon is decorative (`aria-hidden`, not focusable): the\n * control around it carries the accessible name. Stroke and fill use `currentColor`, so a skin colours them through\n * its classes or tokens. `data-icon` names the glyph for skins and tests.\n */\nimport type { ReactNode } from 'react'\nimport type { UiSocialKind } from './types.js'\n\nexport interface IconProps {\n  readonly className?: string | undefined\n}\n\nexport const UI_ICON_NAMES = [\n  'phone',\n  'chevron',\n  'arrow',\n  'arrow-up',\n  'menu',\n  'close',\n  'star',\n  'check',\n  'camera',\n  'mail',\n  'facebook',\n  'instagram',\n  'google',\n  'linkedin',\n  'youtube',\n  'tiktok',\n] as const\nexport type UiIconName = (typeof UI_ICON_NAMES)[number]\n\nfunction Svg({ name, viewBox = '0 0 24 24', className, children }: IconProps & { name: UiIconName; viewBox?: string; children: ReactNode }) {\n  return (\n    <svg aria-hidden=\"true\" focusable=\"false\" viewBox={viewBox} className={className} data-icon={name}>\n      {children}\n    </svg>\n  )\n}\n\nconst stroke = { fill: 'none', stroke: 'currentColor', strokeLinecap: 'round', strokeLinejoin: 'round' } as const\n\nconst GLYPHS: Record<UiIconName, { viewBox?: string; body: ReactNode }> = {\n  phone: {\n    body: (\n      <path\n        {...stroke}\n        strokeWidth=\"1.6\"\n        d=\"M2.25 6.75c0 8.284 6.716 15 15 15h2.25a2.25 2.25 0 0 0 2.25-2.25v-1.372c0-.516-.351-.966-.852-1.091l-4.423-1.106a1.125 1.125 0 0 0-1.173.417l-.97 1.293a1.125 1.125 0 0 1-1.21.38 12.035 12.035 0 0 1-7.143-7.143 1.125 1.125 0 0 1 .38-1.21l1.293-.97c.363-.271.527-.734.417-1.173L6.963 3.102a1.125 1.125 0 0 0-1.091-.852H4.5A2.25 2.25 0 0 0 2.25 4.5v2.25Z\"\n      />\n    ),\n  },\n  chevron: { body: <path {...stroke} strokeWidth=\"1.8\" d=\"m6 9 6 6 6-6\" /> },\n  arrow: { body: <path {...stroke} strokeWidth=\"1.6\" d=\"M13.5 4.5 21 12l-7.5 7.5M3 12h17.25\" /> },\n  'arrow-up': { body: <path {...stroke} strokeWidth=\"1.8\" d=\"M12 20V4m0 0-7 7m7-7 7 7\" /> },\n  menu: { body: <path {...stroke} strokeWidth=\"1.7\" d=\"M4 7h16M4 12h16M4 17h16\" /> },\n  close: { body: <path {...stroke} strokeWidth=\"1.7\" d=\"M6 18 18 6M6 6l12 12\" /> },\n  star: {\n    viewBox: '0 0 20 20',\n    body: <path fill=\"currentColor\" d=\"M10 1.6 12.6 7l5.9.7-4.4 4 1.2 5.8L10 14.6l-5.3 2.9L5.9 11.7l-4.4-4L7.4 7 10 1.6Z\" />,\n  },\n  check: { body: <path {...stroke} strokeWidth=\"2\" d=\"m4.5 12.75 6 6 9-13.5\" /> },\n  camera: {\n    body: (\n      <>\n        <path\n          {...stroke}\n          strokeWidth=\"1.6\"\n          d=\"M3 8.25A2.25 2.25 0 0 1 5.25 6h1.372c.516 0 .966-.351 1.091-.852l.38-1.52A1.125 1.125 0 0 1 9.184 2.7h5.632c.516 0 .966.351 1.091.852l.38 1.52c.125.5.575.852 1.091.852h1.372A2.25 2.25 0 0 1 21 8.25v9.75a2.25 2.25 0 0 1-2.25 2.25H5.25A2.25 2.25 0 0 1 3 18V8.25Z\"\n        />\n        <circle {...stroke} strokeWidth=\"1.6\" cx=\"12\" cy=\"12.75\" r=\"3.75\" />\n      </>\n    ),\n  },\n  mail: {\n    body: (\n      <path\n        {...stroke}\n        strokeWidth=\"1.6\"\n        d=\"M21.75 6.75v10.5a2.25 2.25 0 0 1-2.25 2.25h-15a2.25 2.25 0 0 1-2.25-2.25V6.75m19.5 0A2.25 2.25 0 0 0 19.5 4.5h-15a2.25 2.25 0 0 0-2.25 2.25m19.5 0-8.69 5.6a2.25 2.25 0 0 1-2.12 0l-8.69-5.6\"\n      />\n    ),\n  },\n  facebook: {\n    body: (\n      <path\n        fill=\"currentColor\"\n        d=\"M9 8H6v4h3v12h5V12h3.642L18 8h-4V6.333C14 5.378 14.192 5 15.115 5H18V0h-3.808C10.596 0 9 1.583 9 4.615V8Z\"\n      />\n    ),\n  },\n  instagram: {\n    body: (\n      <>\n        <rect x=\"3\" y=\"3\" width=\"18\" height=\"18\" rx=\"5\" fill=\"none\" stroke=\"currentColor\" strokeWidth=\"2\" />\n        <circle cx=\"12\" cy=\"12\" r=\"4.2\" fill=\"none\" stroke=\"currentColor\" strokeWidth=\"2\" />\n        <circle cx=\"17.4\" cy=\"6.6\" r=\"1.3\" fill=\"currentColor\" />\n      </>\n    ),\n  },\n  google: {\n    body: (\n      <path\n        fill=\"currentColor\"\n        d=\"M21.6 12.23c0-.68-.06-1.33-.17-1.96H12v3.7h5.39a4.6 4.6 0 0 1-2 3.02v2.5h3.24c1.9-1.75 2.97-4.32 2.97-7.26ZM12 22c2.7 0 4.96-.9 6.62-2.43l-3.24-2.5c-.9.6-2.04.95-3.38.95-2.6 0-4.8-1.75-5.59-4.11H3.07v2.59A10 10 0 0 0 12 22Zm-5.59-8.09A6 6 0 0 1 6.1 12c0-.66.11-1.31.31-1.91V7.5H3.07A10 10 0 0 0 2 12c0 1.61.39 3.14 1.07 4.5l3.34-2.59ZM12 5.98c1.47 0 2.79.5 3.83 1.5l2.87-2.87A9.6 9.6 0 0 0 12 2a10 10 0 0 0-8.93 5.5l3.34 2.59C7.2 7.73 9.4 5.98 12 5.98Z\"\n      />\n    ),\n  },\n  linkedin: {\n    body: (\n      <path\n        fill=\"currentColor\"\n        d=\"M4.98 3.5a2.5 2.5 0 1 1 0 5 2.5 2.5 0 0 1 0-5ZM3 9.75h4v11.5H3V9.75Zm6.5 0h3.83v1.57h.06c.53-1 1.84-2.07 3.79-2.07 4.05 0 4.8 2.67 4.8 6.13v5.87h-4v-5.2c0-1.24-.02-2.84-1.73-2.84-1.73 0-2 1.35-2 2.75v5.29h-4V9.75Z\"\n      />\n    ),\n  },\n  youtube: {\n    body: (\n      <path\n        fill=\"currentColor\"\n        d=\"M23 7.2a3 3 0 0 0-2.1-2.1C19 4.6 12 4.6 12 4.6s-7 0-8.9.5A3 3 0 0 0 1 7.2 31 31 0 0 0 .5 12a31 31 0 0 0 .5 4.8 3 3 0 0 0 2.1 2.1c1.9.5 8.9.5 8.9.5s7 0 8.9-.5a3 3 0 0 0 2.1-2.1 31 31 0 0 0 .5-4.8 31 31 0 0 0-.5-4.8ZM9.75 15.02V8.98L15.5 12l-5.75 3.02Z\"\n      />\n    ),\n  },\n  tiktok: {\n    body: (\n      <path\n        fill=\"currentColor\"\n        d=\"M16.6 2h-3.4v13.4a2.9 2.9 0 1 1-2.9-2.9c.3 0 .6 0 .9.1V9.1a6.3 6.3 0 1 0 5.4 6.3V8.6a8.1 8.1 0 0 0 4.4 1.3V6.5a4.5 4.5 0 0 1-4.4-4.5Z\"\n      />\n    ),\n  },\n}\n\n/** One icon from the set by name. */\nexport function Icon({ name, className }: IconProps & { name: UiIconName }) {\n  const glyph = GLYPHS[name]\n  return (\n    <Svg name={name} viewBox={glyph.viewBox} className={className}>\n      {glyph.body}\n    </Svg>\n  )\n}\n\n/** The icon for a social or Business Profile link. */\nexport function SocialIcon({ kind, className }: IconProps & { kind: UiSocialKind }) {\n  return <Icon name={kind} className={className} />\n}\n"]}

package/dist/ui-kit/primitives/index.d.ts

@@ -0,0 +1,6 @@
+export { BUTTON_VARIANTS, ButtonLink, PhoneLink, TextLink, type ButtonLinkProps, type ButtonLinkSkin, type ButtonLinkSlot, type ButtonVariant, type PhoneLinkProps, type PhoneLinkSkin, type PhoneLinkSlot, type TextLinkProps, type TextLinkSkin, type TextLinkSlot, } from './links.js';
+export { CONTAINER_WIDTHS, Container, RatingStars, SECTION_TONES, Section, SectionHeading, VisuallyHidden, type ContainerSkin, type ContainerWidth, type SectionHeadingProps, type SectionHeadingSkin, type SectionHeadingSlot, type SectionProps, type SectionSlot, type SectionTone, } from './layout.js';
+export { QuoteButton, type QuoteButtonProps, type QuoteButtonSkin, type QuoteButtonSlot } from './quote-button.js';
+export { Icon, SocialIcon, UI_ICON_NAMES, type IconProps, type UiIconName } from '../icons.js';
+export { UI_SOCIAL_KINDS, type UiLink, type UiPhone, type UiSocial, type UiSocialKind } from '../types.js';
+//# sourceMappingURL=index.d.ts.map

package/dist/ui-kit/primitives/index.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../src/ui-kit/primitives/index.ts"],"names":[],"mappings":"AAAA,OAAO,EACL,eAAe,EACf,UAAU,EACV,SAAS,EACT,QAAQ,EACR,KAAK,eAAe,EACpB,KAAK,cAAc,EACnB,KAAK,cAAc,EACnB,KAAK,aAAa,EAClB,KAAK,cAAc,EACnB,KAAK,aAAa,EAClB,KAAK,aAAa,EAClB,KAAK,aAAa,EAClB,KAAK,YAAY,EACjB,KAAK,YAAY,GAClB,MAAM,YAAY,CAAA;AACnB,OAAO,EACL,gBAAgB,EAChB,SAAS,EACT,WAAW,EACX,aAAa,EACb,OAAO,EACP,cAAc,EACd,cAAc,EACd,KAAK,aAAa,EAClB,KAAK,cAAc,EACnB,KAAK,mBAAmB,EACxB,KAAK,kBAAkB,EACvB,KAAK,kBAAkB,EACvB,KAAK,YAAY,EACjB,KAAK,WAAW,EAChB,KAAK,WAAW,GACjB,MAAM,aAAa,CAAA;AACpB,OAAO,EAAE,WAAW,EAAE,KAAK,gBAAgB,EAAE,KAAK,eAAe,EAAE,KAAK,eAAe,EAAE,MAAM,mBAAmB,CAAA;AAClH,OAAO,EAAE,IAAI,EAAE,UAAU,EAAE,aAAa,EAAE,KAAK,SAAS,EAAE,KAAK,UAAU,EAAE,MAAM,aAAa,CAAA;AAC9F,OAAO,EAAE,eAAe,EAAE,KAAK,MAAM,EAAE,KAAK,OAAO,EAAE,KAAK,QAAQ,EAAE,KAAK,YAAY,EAAE,MAAM,aAAa,CAAA"}

package/dist/ui-kit/primitives/index.js

@@ -0,0 +1,6 @@
+export { BUTTON_VARIANTS, ButtonLink, PhoneLink, TextLink, } from './links.js';
+export { CONTAINER_WIDTHS, Container, RatingStars, SECTION_TONES, Section, SectionHeading, VisuallyHidden, } from './layout.js';
+export { QuoteButton } from './quote-button.js';
+export { Icon, SocialIcon, UI_ICON_NAMES } from '../icons.js';
+export { UI_SOCIAL_KINDS } from '../types.js';
+//# sourceMappingURL=index.js.map

package/dist/ui-kit/primitives/index.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"index.js","sourceRoot":"","sources":["../../../src/ui-kit/primitives/index.ts"],"names":[],"mappings":"AAAA,OAAO,EACL,eAAe,EACf,UAAU,EACV,SAAS,EACT,QAAQ,GAWT,MAAM,YAAY,CAAA;AACnB,OAAO,EACL,gBAAgB,EAChB,SAAS,EACT,WAAW,EACX,aAAa,EACb,OAAO,EACP,cAAc,EACd,cAAc,GASf,MAAM,aAAa,CAAA;AACpB,OAAO,EAAE,WAAW,EAAqE,MAAM,mBAAmB,CAAA;AAClH,OAAO,EAAE,IAAI,EAAE,UAAU,EAAE,aAAa,EAAmC,MAAM,aAAa,CAAA;AAC9F,OAAO,EAAE,eAAe,EAA+D,MAAM,aAAa,CAAA","sourcesContent":["export {\n  BUTTON_VARIANTS,\n  ButtonLink,\n  PhoneLink,\n  TextLink,\n  type ButtonLinkProps,\n  type ButtonLinkSkin,\n  type ButtonLinkSlot,\n  type ButtonVariant,\n  type PhoneLinkProps,\n  type PhoneLinkSkin,\n  type PhoneLinkSlot,\n  type TextLinkProps,\n  type TextLinkSkin,\n  type TextLinkSlot,\n} from './links.js'\nexport {\n  CONTAINER_WIDTHS,\n  Container,\n  RatingStars,\n  SECTION_TONES,\n  Section,\n  SectionHeading,\n  VisuallyHidden,\n  type ContainerSkin,\n  type ContainerWidth,\n  type SectionHeadingProps,\n  type SectionHeadingSkin,\n  type SectionHeadingSlot,\n  type SectionProps,\n  type SectionSlot,\n  type SectionTone,\n} from './layout.js'\nexport { QuoteButton, type QuoteButtonProps, type QuoteButtonSkin, type QuoteButtonSlot } from './quote-button.js'\nexport { Icon, SocialIcon, UI_ICON_NAMES, type IconProps, type UiIconName } from '../icons.js'\nexport { UI_SOCIAL_KINDS, type UiLink, type UiPhone, type UiSocial, type UiSocialKind } from '../types.js'\n"]}

package/dist/ui-kit/primitives/layout.d.ts

@@ -0,0 +1,73 @@
+/**
+ * Layout primitives: `Container`, `Section`, `SectionHeading`, `Eyebrow`, `RatingStars` and `VisuallyHidden`.
+ * Server components. Heading levels come from the page outline (one H1 in the hero or page header, an H2 per
+ * section), never from a look.
+ */
+import type { ReactNode } from 'react';
+import type { PhoneCallPlacement } from '../../analytics.js';
+import { type SkinEntry } from '../skin.js';
+export declare const CONTAINER_WIDTHS: readonly ["default", "narrow", "wide"];
+export type ContainerWidth = (typeof CONTAINER_WIDTHS)[number];
+export type ContainerSkin = SkinEntry<'root', never, {
+    width?: ContainerWidth;
+}>;
+/** One container width shared by the header, the page and the footer (`--bl-container`, `--bl-gutter`). */
+export declare function Container({ children, layout, classes }: ContainerSkin & {
+    readonly children: ReactNode;
+}): import("react/jsx-runtime").JSX.Element;
+/** The four section tones `SectionSequence` assigns: two alternating grounds, one optional band, one photo ground. */
+export declare const SECTION_TONES: readonly ["canvas", "surface", "band", "photo"];
+export type SectionTone = (typeof SECTION_TONES)[number];
+export type SectionSlot = 'root' | 'inner';
+export interface SectionProps {
+    /** The matrix id, rendered as `data-bl-section` (for example `reviews`, `cta`, `faqs`). */
+    readonly id: string;
+    /** The id of the section's H2. A section is a `<section>` labelled by its heading. */
+    readonly labelledBy: string;
+    readonly tone?: SectionTone | undefined;
+    readonly variant?: string | undefined;
+    readonly classes?: Readonly<Partial<Record<SectionSlot, string>>> | undefined;
+    /** Signature art, rendered `aria-hidden`. */
+    readonly decoration?: ReactNode;
+    /**
+     * Extra layout hooks on the root, for example `{ 'data-columns': '3' }`. They cannot override `data-bl-section`,
+     * `data-variant`, `data-tone` or `data-phone-location`.
+     */
+    readonly hooks?: Readonly<Record<`data-${string}`, string | undefined>>;
+    /** The placement a `tel:` link inside the section reports when it has none of its own. */
+    readonly phonePlacement?: PhoneCallPlacement | undefined;
+    readonly children: ReactNode;
+}
+/**
+ * The root every section component renders: `<section data-bl-section aria-labelledby>`, its tone and variant, an
+ * optional `aria-hidden` decoration and the inner container slot.
+ */
+export declare function Section({ id, labelledBy, tone, variant, classes, decoration, hooks, phonePlacement, children }: SectionProps): import("react/jsx-runtime").JSX.Element;
+export type SectionHeadingSlot = 'head' | 'eyebrow' | 'heading' | 'lead';
+export type SectionHeadingSkin = SkinEntry<SectionHeadingSlot, never, {
+    align?: 'start' | 'center';
+}>;
+export interface SectionHeadingProps extends SectionHeadingSkin {
+    /** The H2's id, which the section's `aria-labelledby` points at. */
+    readonly id: string;
+    readonly title: ReactNode;
+    /** A short label above the H2 (at least 13 px; never the only label for the section). */
+    readonly eyebrow?: ReactNode;
+    readonly lead?: ReactNode;
+}
+/** A section's heading block: an optional eyebrow, the H2 and an optional lead paragraph. */
+export declare function SectionHeading({ id, title, eyebrow, lead, layout, classes }: SectionHeadingProps): import("react/jsx-runtime").JSX.Element;
+/**
+ * Five stars with one text alternative ("Rated 4.9 out of 5"). The stars use `--bl-color-star`; whole stars only,
+ * rounded to the nearest. The rating always comes from the feed, never typed by hand (T4).
+ */
+export declare function RatingStars({ rating, label, className }: {
+    readonly rating: number;
+    readonly label?: string;
+    readonly className?: string;
+}): import("react/jsx-runtime").JSX.Element;
+/** Text for assistive technology only. */
+export declare function VisuallyHidden({ children }: {
+    readonly children: ReactNode;
+}): import("react/jsx-runtime").JSX.Element;
+//# sourceMappingURL=layout.d.ts.map

package/dist/ui-kit/primitives/layout.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"layout.d.ts","sourceRoot":"","sources":["../../../src/ui-kit/primitives/layout.tsx"],"names":[],"mappings":"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"}

package/dist/ui-kit/primitives/layout.js

@@ -0,0 +1,34 @@
+import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
+import { Icon } from '../icons.js';
+import { slot } from '../skin.js';
+export const CONTAINER_WIDTHS = ['default', 'narrow', 'wide'];
+/** One container width shared by the header, the page and the footer (`--bl-container`, `--bl-gutter`). */
+export function Container({ children, layout, classes }) {
+    return (_jsx("div", { "data-bl": "container", "data-width": layout?.width ?? 'default', className: classes?.root, children: children }));
+}
+/** The four section tones `SectionSequence` assigns: two alternating grounds, one optional band, one photo ground. */
+export const SECTION_TONES = ['canvas', 'surface', 'band', 'photo'];
+/**
+ * The root every section component renders: `<section data-bl-section aria-labelledby>`, its tone and variant, an
+ * optional `aria-hidden` decoration and the inner container slot.
+ */
+export function Section({ id, labelledBy, tone, variant, classes, decoration, hooks, phonePlacement, children }) {
+    return (_jsxs("section", { ...hooks, "data-bl-section": id, "data-variant": variant, "data-tone": tone, "data-phone-location": phonePlacement, "aria-labelledby": labelledBy, className: classes?.root, children: [decoration ? (_jsx("div", { "data-slot": "decoration", "aria-hidden": "true", children: decoration })) : null, _jsx("div", { ...slot(classes, 'inner'), children: children })] }));
+}
+/** A section's heading block: an optional eyebrow, the H2 and an optional lead paragraph. */
+export function SectionHeading({ id, title, eyebrow, lead, layout, classes }) {
+    return (_jsxs("div", { ...slot(classes, 'head'), "data-align": layout?.align ?? 'start', children: [eyebrow ? _jsx("p", { ...slot(classes, 'eyebrow'), children: eyebrow }) : null, _jsx("h2", { id: id, ...slot(classes, 'heading'), children: title }), lead ? _jsx("p", { ...slot(classes, 'lead'), children: lead }) : null] }));
+}
+/**
+ * Five stars with one text alternative ("Rated 4.9 out of 5"). The stars use `--bl-color-star`; whole stars only,
+ * rounded to the nearest. The rating always comes from the feed, never typed by hand (T4).
+ */
+export function RatingStars({ rating, label, className }) {
+    const filled = Math.max(0, Math.min(5, Math.round(rating)));
+    return (_jsx("span", { "data-bl": "stars", role: "img", "aria-label": label ?? `Rated ${rating.toFixed(1)} out of 5`, className: className, children: Array.from({ length: 5 }, (_, index) => (_jsx("span", { "data-slot": "star", "data-state": index < filled ? 'on' : 'off', children: _jsx(Icon, { name: "star" }) }, index))) }));
+}
+/** Text for assistive technology only. */
+export function VisuallyHidden({ children }) {
+    return _jsx("span", { "data-bl-visually-hidden": "", children: children });
+}
+//# sourceMappingURL=layout.js.map

package/dist/ui-kit/primitives/layout.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"layout.js","sourceRoot":"","sources":["../../../src/ui-kit/primitives/layout.tsx"],"names":[],"mappings":"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","sourcesContent":["/**\n * Layout primitives: `Container`, `Section`, `SectionHeading`, `Eyebrow`, `RatingStars` and `VisuallyHidden`.\n * Server components. Heading levels come from the page outline (one H1 in the hero or page header, an H2 per\n * section), never from a look.\n */\nimport type { ReactNode } from 'react'\nimport type { PhoneCallPlacement } from '../../analytics.js'\nimport { Icon } from '../icons.js'\nimport { slot, type SkinEntry } from '../skin.js'\n\nexport const CONTAINER_WIDTHS = ['default', 'narrow', 'wide'] as const\nexport type ContainerWidth = (typeof CONTAINER_WIDTHS)[number]\nexport type ContainerSkin = SkinEntry<'root', never, { width?: ContainerWidth }>\n\n/** One container width shared by the header, the page and the footer (`--bl-container`, `--bl-gutter`). */\nexport function Container({ children, layout, classes }: ContainerSkin & { readonly children: ReactNode }) {\n  return (\n    <div data-bl=\"container\" data-width={layout?.width ?? 'default'} className={classes?.root}>\n      {children}\n    </div>\n  )\n}\n\n/** The four section tones `SectionSequence` assigns: two alternating grounds, one optional band, one photo ground. */\nexport const SECTION_TONES = ['canvas', 'surface', 'band', 'photo'] as const\nexport type SectionTone = (typeof SECTION_TONES)[number]\n\nexport type SectionSlot = 'root' | 'inner'\n\nexport interface SectionProps {\n  /** The matrix id, rendered as `data-bl-section` (for example `reviews`, `cta`, `faqs`). */\n  readonly id: string\n  /** The id of the section's H2. A section is a `<section>` labelled by its heading. */\n  readonly labelledBy: string\n  readonly tone?: SectionTone | undefined\n  readonly variant?: string | undefined\n  readonly classes?: Readonly<Partial<Record<SectionSlot, string>>> | undefined\n  /** Signature art, rendered `aria-hidden`. */\n  readonly decoration?: ReactNode\n  /**\n   * Extra layout hooks on the root, for example `{ 'data-columns': '3' }`. They cannot override `data-bl-section`,\n   * `data-variant`, `data-tone` or `data-phone-location`.\n   */\n  readonly hooks?: Readonly<Record<`data-${string}`, string | undefined>>\n  /** The placement a `tel:` link inside the section reports when it has none of its own. */\n  readonly phonePlacement?: PhoneCallPlacement | undefined\n  readonly children: ReactNode\n}\n\n/**\n * The root every section component renders: `<section data-bl-section aria-labelledby>`, its tone and variant, an\n * optional `aria-hidden` decoration and the inner container slot.\n */\nexport function Section({ id, labelledBy, tone, variant, classes, decoration, hooks, phonePlacement, children }: SectionProps) {\n  return (\n    <section\n      {...hooks}\n      data-bl-section={id}\n      data-variant={variant}\n      data-tone={tone}\n      data-phone-location={phonePlacement}\n      aria-labelledby={labelledBy}\n      className={classes?.root}\n    >\n      {decoration ? (\n        <div data-slot=\"decoration\" aria-hidden=\"true\">\n          {decoration}\n        </div>\n      ) : null}\n      <div {...slot(classes, 'inner')}>{children}</div>\n    </section>\n  )\n}\n\nexport type SectionHeadingSlot = 'head' | 'eyebrow' | 'heading' | 'lead'\nexport type SectionHeadingSkin = SkinEntry<SectionHeadingSlot, never, { align?: 'start' | 'center' }>\n\nexport interface SectionHeadingProps extends SectionHeadingSkin {\n  /** The H2's id, which the section's `aria-labelledby` points at. */\n  readonly id: string\n  readonly title: ReactNode\n  /** A short label above the H2 (at least 13 px; never the only label for the section). */\n  readonly eyebrow?: ReactNode\n  readonly lead?: ReactNode\n}\n\n/** A section's heading block: an optional eyebrow, the H2 and an optional lead paragraph. */\nexport function SectionHeading({ id, title, eyebrow, lead, layout, classes }: SectionHeadingProps) {\n  return (\n    <div {...slot(classes, 'head')} data-align={layout?.align ?? 'start'}>\n      {eyebrow ? <p {...slot(classes, 'eyebrow')}>{eyebrow}</p> : null}\n      <h2 id={id} {...slot(classes, 'heading')}>\n        {title}\n      </h2>\n      {lead ? <p {...slot(classes, 'lead')}>{lead}</p> : null}\n    </div>\n  )\n}\n\n/**\n * Five stars with one text alternative (\"Rated 4.9 out of 5\"). The stars use `--bl-color-star`; whole stars only,\n * rounded to the nearest. The rating always comes from the feed, never typed by hand (T4).\n */\nexport function RatingStars({ rating, label, className }: { readonly rating: number; readonly label?: string; readonly className?: string }) {\n  const filled = Math.max(0, Math.min(5, Math.round(rating)))\n  return (\n    <span data-bl=\"stars\" role=\"img\" aria-label={label ?? `Rated ${rating.toFixed(1)} out of 5`} className={className}>\n      {Array.from({ length: 5 }, (_, index) => (\n        <span key={index} data-slot=\"star\" data-state={index < filled ? 'on' : 'off'}>\n          <Icon name=\"star\" />\n        </span>\n      ))}\n    </span>\n  )\n}\n\n/** Text for assistive technology only. */\nexport function VisuallyHidden({ children }: { readonly children: ReactNode }) {\n  return <span data-bl-visually-hidden=\"\">{children}</span>\n}\n"]}

package/dist/ui-kit/primitives/links.d.ts

@@ -0,0 +1,48 @@
+import type { ReactNode } from 'react';
+import type { PhoneCallPlacement } from '../../analytics.js';
+import { type UiIconName } from '../icons.js';
+import { type SkinEntry } from '../skin.js';
+import type { UiPhone } from '../types.js';
+export type ButtonLinkSlot = 'root' | 'label' | 'icon';
+export declare const BUTTON_VARIANTS: readonly ["primary", "secondary", "quiet"];
+export type ButtonVariant = (typeof BUTTON_VARIANTS)[number];
+export type ButtonLinkSkin = SkinEntry<ButtonLinkSlot, ButtonVariant, {
+    size?: 'regular' | 'large';
+}>;
+export interface ButtonLinkProps extends ButtonLinkSkin {
+    readonly href: string;
+    readonly children: ReactNode;
+    /** An icon after the label (`arrow`) or before it (`phone`). */
+    readonly icon?: UiIconName;
+    readonly iconPosition?: 'start' | 'end';
+    /** Force external handling; by default `http(s)://` links are external. */
+    readonly external?: boolean;
+}
+/** A link styled as a button. A primary action is at least 44 px tall (structure.css). */
+export declare function ButtonLink({ href, children, icon, iconPosition, external, variant, layout, classes }: ButtonLinkProps): import("react/jsx-runtime").JSX.Element;
+export type TextLinkSlot = 'root';
+export type TextLinkSkin = SkinEntry<TextLinkSlot, 'inline' | 'standalone'>;
+export interface TextLinkProps extends TextLinkSkin {
+    readonly href: string;
+    readonly children: ReactNode;
+    readonly external?: boolean;
+}
+/** An inline or standalone text link. */
+export declare function TextLink({ href, children, external, variant, classes }: TextLinkProps): import("react/jsx-runtime").JSX.Element;
+export type PhoneLinkSlot = 'root' | 'icon' | 'label' | 'number';
+export type PhoneLinkSkin = SkinEntry<PhoneLinkSlot, 'text' | 'button'>;
+export interface PhoneLinkProps extends PhoneLinkSkin {
+    readonly phone: UiPhone;
+    /** Where the link sits, for `phone_link_click`. Required: a section sets its own. */
+    readonly placement: PhoneCallPlacement;
+    /** Optional words before the number, for example "Call". The accessible name is always the visible text. */
+    readonly label?: string;
+    /** The phone icon on the left (header and hero). */
+    readonly showIcon?: boolean;
+}
+/**
+ * A `tel:` link. Its accessible name is its visible text, which always includes the number (WCAG 2.5.3). Use it for
+ * every call link: a literal `tel:` anywhere else fails lint (K1) and C10 checks the href against the evidence file.
+ */
+export declare function PhoneLink({ phone, placement, label, showIcon, variant, classes }: PhoneLinkProps): import("react/jsx-runtime").JSX.Element;
+//# sourceMappingURL=links.d.ts.map

package/dist/ui-kit/primitives/links.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"links.d.ts","sourceRoot":"","sources":["../../../src/ui-kit/primitives/links.tsx"],"names":[],"mappings":"AAMA,OAAO,KAAK,EAAE,SAAS,EAAE,MAAM,OAAO,CAAA;AACtC,OAAO,KAAK,EAAE,kBAAkB,EAAE,MAAM,oBAAoB,CAAA;AAC5D,OAAO,EAAQ,KAAK,UAAU,EAAE,MAAM,aAAa,CAAA;AACnD,OAAO,EAAQ,KAAK,SAAS,EAAE,MAAM,YAAY,CAAA;AACjD,OAAO,KAAK,EAAE,OAAO,EAAE,MAAM,aAAa,CAAA;AAwB1C,MAAM,MAAM,cAAc,GAAG,MAAM,GAAG,OAAO,GAAG,MAAM,CAAA;AACtD,eAAO,MAAM,eAAe,4CAA6C,CAAA;AACzE,MAAM,MAAM,aAAa,GAAG,CAAC,OAAO,eAAe,CAAC,CAAC,MAAM,CAAC,CAAA;AAC5D,MAAM,MAAM,cAAc,GAAG,SAAS,CAAC,cAAc,EAAE,aAAa,EAAE;IAAE,IAAI,CAAC,EAAE,SAAS,GAAG,OAAO,CAAA;CAAE,CAAC,CAAA;AAErG,MAAM,WAAW,eAAgB,SAAQ,cAAc;IACrD,QAAQ,CAAC,IAAI,EAAE,MAAM,CAAA;IACrB,QAAQ,CAAC,QAAQ,EAAE,SAAS,CAAA;IAC5B,gEAAgE;IAChE,QAAQ,CAAC,IAAI,CAAC,EAAE,UAAU,CAAA;IAC1B,QAAQ,CAAC,YAAY,CAAC,EAAE,OAAO,GAAG,KAAK,CAAA;IACvC,2EAA2E;IAC3E,QAAQ,CAAC,QAAQ,CAAC,EAAE,OAAO,CAAA;CAC5B;AAED,0FAA0F;AAC1F,wBAAgB,UAAU,CAAC,EAAE,IAAI,EAAE,QAAQ,EAAE,IAAI,EAAE,YAAoB,EAAE,QAAQ,EAAE,OAAmB,EAAE,MAAM,EAAE,OAAO,EAAE,EAAE,eAAe,2CAazI;AAED,MAAM,MAAM,YAAY,GAAG,MAAM,CAAA;AACjC,MAAM,MAAM,YAAY,GAAG,SAAS,CAAC,YAAY,EAAE,QAAQ,GAAG,YAAY,CAAC,CAAA;AAE3E,MAAM,WAAW,aAAc,SAAQ,YAAY;IACjD,QAAQ,CAAC,IAAI,EAAE,MAAM,CAAA;IACrB,QAAQ,CAAC,QAAQ,EAAE,SAAS,CAAA;IAC5B,QAAQ,CAAC,QAAQ,CAAC,EAAE,OAAO,CAAA;CAC5B;AAED,yCAAyC;AACzC,wBAAgB,QAAQ,CAAC,EAAE,IAAI,EAAE,QAAQ,EAAE,QAAQ,EAAE,OAAkB,EAAE,OAAO,EAAE,EAAE,aAAa,2CAMhG;AAED,MAAM,MAAM,aAAa,GAAG,MAAM,GAAG,MAAM,GAAG,OAAO,GAAG,QAAQ,CAAA;AAChE,MAAM,MAAM,aAAa,GAAG,SAAS,CAAC,aAAa,EAAE,MAAM,GAAG,QAAQ,CAAC,CAAA;AAEvE,MAAM,WAAW,cAAe,SAAQ,aAAa;IACnD,QAAQ,CAAC,KAAK,EAAE,OAAO,CAAA;IACvB,qFAAqF;IACrF,QAAQ,CAAC,SAAS,EAAE,kBAAkB,CAAA;IACtC,4GAA4G;IAC5G,QAAQ,CAAC,KAAK,CAAC,EAAE,MAAM,CAAA;IACvB,oDAAoD;IACpD,QAAQ,CAAC,QAAQ,CAAC,EAAE,OAAO,CAAA;CAC5B;AAED;;;GAGG;AACH,wBAAgB,SAAS,CAAC,EAAE,KAAK,EAAE,SAAS,EAAE,KAAK,EAAE,QAAgB,EAAE,OAAgB,EAAE,OAAO,EAAE,EAAE,cAAc,2CAgBjH"}

package/dist/ui-kit/primitives/links.js

@@ -0,0 +1,36 @@
+import { jsx as _jsx, jsxs as _jsxs, Fragment as _Fragment } from "react/jsx-runtime";
+/**
+ * Link primitives: `ButtonLink`, `TextLink` and `PhoneLink`. Server components; every link is a real `<a href>`.
+ * External links open in a new tab with `rel="noopener noreferrer"`. `PhoneLink` requires a typed placement, which the
+ * shared instrumentation reads to send one `phone_link_click` per tap; nothing here emits events itself.
+ */
+import Link from 'next/link';
+import { Icon } from '../icons.js';
+import { slot } from '../skin.js';
+function isExternal(href) {
+    return /^https?:\/\//i.test(href);
+}
+function Anchor({ href, external, hooks, children }) {
+    if (external ?? isExternal(href)) {
+        return (_jsx("a", { href: href, target: "_blank", rel: "noopener noreferrer", ...hooks, children: children }));
+    }
+    return (_jsx(Link, { href: href, ...hooks, children: children }));
+}
+export const BUTTON_VARIANTS = ['primary', 'secondary', 'quiet'];
+/** A link styled as a button. A primary action is at least 44 px tall (structure.css). */
+export function ButtonLink({ href, children, icon, iconPosition = 'end', external, variant = 'primary', layout, classes }) {
+    const iconNode = icon ? _jsx("span", { ...slot(classes, 'icon'), children: _jsx(Icon, { name: icon }) }) : null;
+    return (_jsxs(Anchor, { href: href, external: external, hooks: { 'data-bl': 'button', 'data-variant': variant, 'data-size': layout?.size ?? 'regular', className: classes?.root }, children: [iconPosition === 'start' ? iconNode : null, _jsx("span", { ...slot(classes, 'label'), children: children }), iconPosition === 'end' ? iconNode : null] }));
+}
+/** An inline or standalone text link. */
+export function TextLink({ href, children, external, variant = 'inline', classes }) {
+    return (_jsx(Anchor, { href: href, external: external, hooks: { 'data-bl': 'text-link', 'data-variant': variant, className: classes?.root }, children: children }));
+}
+/**
+ * A `tel:` link. Its accessible name is its visible text, which always includes the number (WCAG 2.5.3). Use it for
+ * every call link: a literal `tel:` anywhere else fails lint (K1) and C10 checks the href against the evidence file.
+ */
+export function PhoneLink({ phone, placement, label, showIcon = false, variant = 'text', classes }) {
+    return (_jsxs("a", { href: phone.telHref, "data-bl": "phone-link", "data-variant": variant, "data-phone-location": placement, className: classes?.root, children: [showIcon ? (_jsx("span", { ...slot(classes, 'icon'), children: _jsx(Icon, { name: "phone" }) })) : null, label ? (_jsxs(_Fragment, { children: [_jsx("span", { ...slot(classes, 'label'), children: label }), ' '] })) : null, _jsx("span", { ...slot(classes, 'number'), children: phone.display })] }));
+}
+//# sourceMappingURL=links.js.map

package/dist/ui-kit/primitives/links.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"links.js","sourceRoot":"","sources":["../../../src/ui-kit/primitives/links.tsx"],"names":[],"mappings":"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","sourcesContent":["/**\n * Link primitives: `ButtonLink`, `TextLink` and `PhoneLink`. Server components; every link is a real `<a href>`.\n * External links open in a new tab with `rel=\"noopener noreferrer\"`. `PhoneLink` requires a typed placement, which the\n * shared instrumentation reads to send one `phone_link_click` per tap; nothing here emits events itself.\n */\nimport Link from 'next/link'\nimport type { ReactNode } from 'react'\nimport type { PhoneCallPlacement } from '../../analytics.js'\nimport { Icon, type UiIconName } from '../icons.js'\nimport { slot, type SkinEntry } from '../skin.js'\nimport type { UiPhone } from '../types.js'\n\nfunction isExternal(href: string) {\n  return /^https?:\\/\\//i.test(href)\n}\n\n/** Data hooks and the skin class for an anchor's root. */\ntype AnchorHooks = { readonly className: string | undefined } & Readonly<Record<`data-${string}`, string | undefined>>\n\nfunction Anchor({ href, external, hooks, children }: { href: string; external?: boolean | undefined; hooks: AnchorHooks; children: ReactNode }) {\n  if (external ?? isExternal(href)) {\n    return (\n      <a href={href} target=\"_blank\" rel=\"noopener noreferrer\" {...hooks}>\n        {children}\n      </a>\n    )\n  }\n  return (\n    <Link href={href} {...hooks}>\n      {children}\n    </Link>\n  )\n}\n\nexport type ButtonLinkSlot = 'root' | 'label' | 'icon'\nexport const BUTTON_VARIANTS = ['primary', 'secondary', 'quiet'] as const\nexport type ButtonVariant = (typeof BUTTON_VARIANTS)[number]\nexport type ButtonLinkSkin = SkinEntry<ButtonLinkSlot, ButtonVariant, { size?: 'regular' | 'large' }>\n\nexport interface ButtonLinkProps extends ButtonLinkSkin {\n  readonly href: string\n  readonly children: ReactNode\n  /** An icon after the label (`arrow`) or before it (`phone`). */\n  readonly icon?: UiIconName\n  readonly iconPosition?: 'start' | 'end'\n  /** Force external handling; by default `http(s)://` links are external. */\n  readonly external?: boolean\n}\n\n/** A link styled as a button. A primary action is at least 44 px tall (structure.css). */\nexport function ButtonLink({ href, children, icon, iconPosition = 'end', external, variant = 'primary', layout, classes }: ButtonLinkProps) {\n  const iconNode = icon ? <span {...slot(classes, 'icon')}><Icon name={icon} /></span> : null\n  return (\n    <Anchor\n      href={href}\n      external={external}\n      hooks={{ 'data-bl': 'button', 'data-variant': variant, 'data-size': layout?.size ?? 'regular', className: classes?.root }}\n    >\n      {iconPosition === 'start' ? iconNode : null}\n      <span {...slot(classes, 'label')}>{children}</span>\n      {iconPosition === 'end' ? iconNode : null}\n    </Anchor>\n  )\n}\n\nexport type TextLinkSlot = 'root'\nexport type TextLinkSkin = SkinEntry<TextLinkSlot, 'inline' | 'standalone'>\n\nexport interface TextLinkProps extends TextLinkSkin {\n  readonly href: string\n  readonly children: ReactNode\n  readonly external?: boolean\n}\n\n/** An inline or standalone text link. */\nexport function TextLink({ href, children, external, variant = 'inline', classes }: TextLinkProps) {\n  return (\n    <Anchor href={href} external={external} hooks={{ 'data-bl': 'text-link', 'data-variant': variant, className: classes?.root }}>\n      {children}\n    </Anchor>\n  )\n}\n\nexport type PhoneLinkSlot = 'root' | 'icon' | 'label' | 'number'\nexport type PhoneLinkSkin = SkinEntry<PhoneLinkSlot, 'text' | 'button'>\n\nexport interface PhoneLinkProps extends PhoneLinkSkin {\n  readonly phone: UiPhone\n  /** Where the link sits, for `phone_link_click`. Required: a section sets its own. */\n  readonly placement: PhoneCallPlacement\n  /** Optional words before the number, for example \"Call\". The accessible name is always the visible text. */\n  readonly label?: string\n  /** The phone icon on the left (header and hero). */\n  readonly showIcon?: boolean\n}\n\n/**\n * A `tel:` link. Its accessible name is its visible text, which always includes the number (WCAG 2.5.3). Use it for\n * every call link: a literal `tel:` anywhere else fails lint (K1) and C10 checks the href against the evidence file.\n */\nexport function PhoneLink({ phone, placement, label, showIcon = false, variant = 'text', classes }: PhoneLinkProps) {\n  return (\n    <a href={phone.telHref} data-bl=\"phone-link\" data-variant={variant} data-phone-location={placement} className={classes?.root}>\n      {showIcon ? (\n        <span {...slot(classes, 'icon')}>\n          <Icon name=\"phone\" />\n        </span>\n      ) : null}\n      {label ? (\n        <>\n          <span {...slot(classes, 'label')}>{label}</span>{' '}\n        </>\n      ) : null}\n      <span {...slot(classes, 'number')}>{phone.display}</span>\n    </a>\n  )\n}\n"]}

package/dist/ui-kit/primitives/quote-button.d.ts

@@ -0,0 +1,20 @@
+import type { LeadCtaPlacement } from '../../analytics.js';
+import { type SkinEntry } from '../skin.js';
+import type { ButtonVariant } from './links.js';
+export type QuoteButtonSlot = 'root' | 'label' | 'icon';
+export type QuoteButtonSkin = SkinEntry<QuoteButtonSlot, ButtonVariant, {
+    size?: 'regular' | 'large';
+    icon?: boolean;
+}>;
+export interface QuoteButtonProps extends QuoteButtonSkin {
+    /** The site's recorded quote label, or one from the closed list (C5), for example "Get a free quote". */
+    readonly label: string;
+    /** The quote form this falls back to without scripts, for example `/contact#quote`. */
+    readonly href: string;
+    /** Where the button sits, for `lead_cta_click`. */
+    readonly placement: LeadCtaPlacement;
+    /** A stable id for `lead_cta_click`, for example `quote-header` or `quote-cta`. */
+    readonly ctaId: string;
+}
+export declare function QuoteButton({ label, href, placement, ctaId, variant, layout, classes }: QuoteButtonProps): import("react/jsx-runtime").JSX.Element;
+//# sourceMappingURL=quote-button.d.ts.map

package/dist/ui-kit/primitives/quote-button.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"quote-button.d.ts","sourceRoot":"","sources":["../../../src/ui-kit/primitives/quote-button.tsx"],"names":[],"mappings":"AAQA,OAAO,KAAK,EAAE,gBAAgB,EAAE,MAAM,oBAAoB,CAAA;AAE1D,OAAO,EAAQ,KAAK,SAAS,EAAE,MAAM,YAAY,CAAA;AACjD,OAAO,KAAK,EAAE,aAAa,EAAE,MAAM,YAAY,CAAA;AAE/C,MAAM,MAAM,eAAe,GAAG,MAAM,GAAG,OAAO,GAAG,MAAM,CAAA;AACvD,MAAM,MAAM,eAAe,GAAG,SAAS,CAAC,eAAe,EAAE,aAAa,EAAE;IAAE,IAAI,CAAC,EAAE,SAAS,GAAG,OAAO,CAAC;IAAC,IAAI,CAAC,EAAE,OAAO,CAAA;CAAE,CAAC,CAAA;AAEvH,MAAM,WAAW,gBAAiB,SAAQ,eAAe;IACvD,yGAAyG;IACzG,QAAQ,CAAC,KAAK,EAAE,MAAM,CAAA;IACtB,uFAAuF;IACvF,QAAQ,CAAC,IAAI,EAAE,MAAM,CAAA;IACrB,mDAAmD;IACnD,QAAQ,CAAC,SAAS,EAAE,gBAAgB,CAAA;IACpC,mFAAmF;IACnF,QAAQ,CAAC,KAAK,EAAE,MAAM,CAAA;CACvB;AAED,wBAAgB,WAAW,CAAC,EAAE,KAAK,EAAE,IAAI,EAAE,SAAS,EAAE,KAAK,EAAE,OAAmB,EAAE,MAAM,EAAE,OAAO,EAAE,EAAE,gBAAgB,2CAmBpH"}

package/dist/ui-kit/primitives/quote-button.js

@@ -0,0 +1,15 @@
+import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
+/**
+ * `QuoteButton`: the quote action. A server-rendered link to the page's quote form (for example `/contact#quote`), so
+ * it works before scripts run. When a `QuoteDialog` is on the page (3.10.0) it opens the dialog instead; on the
+ * contact page the link scrolls to the form. It carries the `data-bl-cta` hooks only: from 3.9.0 the shared
+ * instrumentation reads them and sends `lead_cta_click` when lead diagnostics are on. Nothing is sent in 3.8.0, and
+ * nothing here emits events itself.
+ */
+import Link from 'next/link';
+import { Icon } from '../icons.js';
+import { slot } from '../skin.js';
+export function QuoteButton({ label, href, placement, ctaId, variant = 'primary', layout, classes }) {
+    return (_jsxs(Link, { href: href, "data-bl": "quote-button", "data-variant": variant, "data-size": layout?.size ?? 'regular', "data-bl-cta": ctaId, "data-bl-cta-placement": placement, className: classes?.root, children: [_jsx("span", { ...slot(classes, 'label'), children: label }), layout?.icon === false ? null : (_jsx("span", { ...slot(classes, 'icon'), children: _jsx(Icon, { name: "arrow" }) }))] }));
+}
+//# sourceMappingURL=quote-button.js.map

package/dist/ui-kit/primitives/quote-button.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"quote-button.js","sourceRoot":"","sources":["../../../src/ui-kit/primitives/quote-button.tsx"],"names":[],"mappings":";AAAA;;;;;;GAMG;AACH,OAAO,IAAI,MAAM,WAAW,CAAA;AAE5B,OAAO,EAAE,IAAI,EAAE,MAAM,aAAa,CAAA;AAClC,OAAO,EAAE,IAAI,EAAkB,MAAM,YAAY,CAAA;AAiBjD,MAAM,UAAU,WAAW,CAAC,EAAE,KAAK,EAAE,IAAI,EAAE,SAAS,EAAE,KAAK,EAAE,OAAO,GAAG,SAAS,EAAE,MAAM,EAAE,OAAO,EAAoB;IACnH,OAAO,CACL,MAAC,IAAI,IACH,IAAI,EAAE,IAAI,aACF,cAAc,kBACR,OAAO,eACV,MAAM,EAAE,IAAI,IAAI,SAAS,iBACvB,KAAK,2BACK,SAAS,EAChC,SAAS,EAAE,OAAO,EAAE,IAAI,aAExB,kBAAU,IAAI,CAAC,OAAO,EAAE,OAAO,CAAC,YAAG,KAAK,GAAQ,EAC/C,MAAM,EAAE,IAAI,KAAK,KAAK,CAAC,CAAC,CAAC,IAAI,CAAC,CAAC,CAAC,CAC/B,kBAAU,IAAI,CAAC,OAAO,EAAE,MAAM,CAAC,YAC7B,KAAC,IAAI,IAAC,IAAI,EAAC,OAAO,GAAG,GAChB,CACR,IACI,CACR,CAAA;AACH,CAAC","sourcesContent":["/**\n * `QuoteButton`: the quote action. A server-rendered link to the page's quote form (for example `/contact#quote`), so\n * it works before scripts run. When a `QuoteDialog` is on the page (3.10.0) it opens the dialog instead; on the\n * contact page the link scrolls to the form. It carries the `data-bl-cta` hooks only: from 3.9.0 the shared\n * instrumentation reads them and sends `lead_cta_click` when lead diagnostics are on. Nothing is sent in 3.8.0, and\n * nothing here emits events itself.\n */\nimport Link from 'next/link'\nimport type { LeadCtaPlacement } from '../../analytics.js'\nimport { Icon } from '../icons.js'\nimport { slot, type SkinEntry } from '../skin.js'\nimport type { ButtonVariant } from './links.js'\n\nexport type QuoteButtonSlot = 'root' | 'label' | 'icon'\nexport type QuoteButtonSkin = SkinEntry<QuoteButtonSlot, ButtonVariant, { size?: 'regular' | 'large'; icon?: boolean }>\n\nexport interface QuoteButtonProps extends QuoteButtonSkin {\n  /** The site's recorded quote label, or one from the closed list (C5), for example \"Get a free quote\". */\n  readonly label: string\n  /** The quote form this falls back to without scripts, for example `/contact#quote`. */\n  readonly href: string\n  /** Where the button sits, for `lead_cta_click`. */\n  readonly placement: LeadCtaPlacement\n  /** A stable id for `lead_cta_click`, for example `quote-header` or `quote-cta`. */\n  readonly ctaId: string\n}\n\nexport function QuoteButton({ label, href, placement, ctaId, variant = 'primary', layout, classes }: QuoteButtonProps) {\n  return (\n    <Link\n      href={href}\n      data-bl=\"quote-button\"\n      data-variant={variant}\n      data-size={layout?.size ?? 'regular'}\n      data-bl-cta={ctaId}\n      data-bl-cta-placement={placement}\n      className={classes?.root}\n    >\n      <span {...slot(classes, 'label')}>{label}</span>\n      {layout?.icon === false ? null : (\n        <span {...slot(classes, 'icon')}>\n          <Icon name=\"arrow\" />\n        </span>\n      )}\n    </Link>\n  )\n}\n"]}

package/dist/ui-kit/skin-index.d.ts

@@ -0,0 +1,3 @@
+export { cx, skinned, slot, type SkinEntry, type SkinEntryOf, type SkinnedProps, type SlotClasses } from './skin.js';
+export type { BrandlabSkin } from './brandlab-skin.js';
+//# sourceMappingURL=skin-index.d.ts.map

package/dist/ui-kit/skin-index.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"skin-index.d.ts","sourceRoot":"","sources":["../../src/ui-kit/skin-index.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,EAAE,EAAE,OAAO,EAAE,IAAI,EAAE,KAAK,SAAS,EAAE,KAAK,WAAW,EAAE,KAAK,YAAY,EAAE,KAAK,WAAW,EAAE,MAAM,WAAW,CAAA;AACpH,YAAY,EAAE,YAAY,EAAE,MAAM,oBAAoB,CAAA"}

package/dist/ui-kit/skin-index.js

@@ -0,0 +1,2 @@
+export { cx, skinned, slot } from './skin.js';
+//# sourceMappingURL=skin-index.js.map

package/dist/ui-kit/skin-index.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"skin-index.js","sourceRoot":"","sources":["../../src/ui-kit/skin-index.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,EAAE,EAAE,OAAO,EAAE,IAAI,EAAyE,MAAM,WAAW,CAAA","sourcesContent":["export { cx, skinned, slot, type SkinEntry, type SkinEntryOf, type SkinnedProps, type SlotClasses } from './skin.js'\nexport type { BrandlabSkin } from './brandlab-skin.js'\n"]}

package/dist/ui-kit/skin.d.ts

@@ -0,0 +1,48 @@
+/**
+ * The skin model of the Brandlab ui-kit. A site gives every shared component its own look through one skin entry per
+ * component: a variant from the component's closed list, typed layout options and one class string per named slot.
+ * Colours, fonts and shapes come from the site's `--bl-*` tokens and these classes; behaviour, semantics, accessible
+ * names and analytics hooks never appear here, so a skin can't change them.
+ */
+import { type ComponentType } from 'react';
+/** One class string per named slot. Tailwind v4 utilities, CSS Module class names or nothing (plain CSS on hooks). */
+export type SlotClasses<Slot extends string> = Readonly<Partial<Record<Slot, string>>>;
+/** A component's skin: its variant, its layout options and its slot classes. Every field is optional. */
+export interface SkinEntry<Slot extends string, Variant extends string = never, Layout extends object = Record<never, never>> {
+    readonly variant?: Variant;
+    readonly layout?: Readonly<Layout>;
+    readonly classes?: SlotClasses<Slot>;
+}
+type SkinKeys = 'variant' | 'layout' | 'classes';
+/** The part of a component's props a skin entry supplies. */
+export type SkinEntryOf<P> = Pick<P, Extract<keyof P, SkinKeys>>;
+/** What a page passes to a skinned component: its data, and at most a `layout` adjustment within the contract. */
+export type SkinnedProps<P> = Omit<P, 'variant' | 'classes'>;
+/**
+ * Bind a component to the site's skin entry, so pages pass data only. Returns a plain function component (no
+ * context, no client code), so it works in server components and client components alike. The skin's layout merges
+ * under the page's `layout`; the variant and classes come from the skin only.
+ *
+ * ```tsx
+ * // src/site/ui.tsx
+ * export const ReviewsBand = skinned(UI.ReviewsBand, skin.reviewsBand)
+ * ```
+ */
+export declare function skinned<P extends {
+    variant?: unknown;
+    layout?: object;
+    classes?: object;
+}>(Component: ComponentType<P>, entry: SkinEntryOf<P>): ComponentType<SkinnedProps<P>>;
+/** Join class strings, dropping empty parts. Returns `undefined` when nothing is left, so no empty `class` renders. */
+export declare function cx(...parts: readonly (string | false | null | undefined)[]): string | undefined;
+/**
+ * The stable hook for one named part: `data-slot` plus the skin's class for it. Spread it onto the element:
+ * `<div {...slot(classes, 'inner')}>`. Slot names, nesting and element types are public API (a minor release to
+ * change); a skin's class never replaces the hook.
+ */
+export declare function slot<Slot extends string>(classes: SlotClasses<Slot> | undefined, name: Slot, extra?: string): {
+    'data-slot': Slot;
+    className: string | undefined;
+};
+export {};
+//# sourceMappingURL=skin.d.ts.map

package/dist/ui-kit/skin.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"skin.d.ts","sourceRoot":"","sources":["../../src/ui-kit/skin.ts"],"names":[],"mappings":"AAAA;;;;;GAKG;AACH,OAAO,EAAiB,KAAK,aAAa,EAAkB,MAAM,OAAO,CAAA;AAEzE,sHAAsH;AACtH,MAAM,MAAM,WAAW,CAAC,IAAI,SAAS,MAAM,IAAI,QAAQ,CAAC,OAAO,CAAC,MAAM,CAAC,IAAI,EAAE,MAAM,CAAC,CAAC,CAAC,CAAA;AAEtF,yGAAyG;AACzG,MAAM,WAAW,SAAS,CACxB,IAAI,SAAS,MAAM,EACnB,OAAO,SAAS,MAAM,GAAG,KAAK,EAC9B,MAAM,SAAS,MAAM,GAAG,MAAM,CAAC,KAAK,EAAE,KAAK,CAAC;IAE5C,QAAQ,CAAC,OAAO,CAAC,EAAE,OAAO,CAAA;IAC1B,QAAQ,CAAC,MAAM,CAAC,EAAE,QAAQ,CAAC,MAAM,CAAC,CAAA;IAClC,QAAQ,CAAC,OAAO,CAAC,EAAE,WAAW,CAAC,IAAI,CAAC,CAAA;CACrC;AAED,KAAK,QAAQ,GAAG,SAAS,GAAG,QAAQ,GAAG,SAAS,CAAA;AAEhD,6DAA6D;AAC7D,MAAM,MAAM,WAAW,CAAC,CAAC,IAAI,IAAI,CAAC,CAAC,EAAE,OAAO,CAAC,MAAM,CAAC,EAAE,QAAQ,CAAC,CAAC,CAAA;AAEhE,kHAAkH;AAClH,MAAM,MAAM,YAAY,CAAC,CAAC,IAAI,IAAI,CAAC,CAAC,EAAE,SAAS,GAAG,SAAS,CAAC,CAAA;AAE5D;;;;;;;;;GASG;AACH,wBAAgB,OAAO,CAAC,CAAC,SAAS;IAAE,OAAO,CAAC,EAAE,OAAO,CAAC;IAAC,MAAM,CAAC,EAAE,MAAM,CAAC;IAAC,OAAO,CAAC,EAAE,MAAM,CAAA;CAAE,EACxF,SAAS,EAAE,aAAa,CAAC,CAAC,CAAC,EAC3B,KAAK,EAAE,WAAW,CAAC,CAAC,CAAC,GACpB,aAAa,CAAC,YAAY,CAAC,CAAC,CAAC,CAAC,CAehC;AAED,uHAAuH;AACvH,wBAAgB,EAAE,CAAC,GAAG,KAAK,EAAE,SAAS,CAAC,MAAM,GAAG,KAAK,GAAG,IAAI,GAAG,SAAS,CAAC,EAAE,GAAG,MAAM,GAAG,SAAS,CAG/F;AAED;;;;GAIG;AACH,wBAAgB,IAAI,CAAC,IAAI,SAAS,MAAM,EACtC,OAAO,EAAE,WAAW,CAAC,IAAI,CAAC,GAAG,SAAS,EACtC,IAAI,EAAE,IAAI,EACV,KAAK,CAAC,EAAE,MAAM,GACb;IAAE,WAAW,EAAE,IAAI,CAAC;IAAC,SAAS,EAAE,MAAM,GAAG,SAAS,CAAA;CAAE,CAEtD"}

package/dist/ui-kit/skin.js

@@ -0,0 +1,47 @@
+/**
+ * The skin model of the Brandlab ui-kit. A site gives every shared component its own look through one skin entry per
+ * component: a variant from the component's closed list, typed layout options and one class string per named slot.
+ * Colours, fonts and shapes come from the site's `--bl-*` tokens and these classes; behaviour, semantics, accessible
+ * names and analytics hooks never appear here, so a skin can't change them.
+ */
+import { createElement } from 'react';
+/**
+ * Bind a component to the site's skin entry, so pages pass data only. Returns a plain function component (no
+ * context, no client code), so it works in server components and client components alike. The skin's layout merges
+ * under the page's `layout`; the variant and classes come from the skin only.
+ *
+ * ```tsx
+ * // src/site/ui.tsx
+ * export const ReviewsBand = skinned(UI.ReviewsBand, skin.reviewsBand)
+ * ```
+ */
+export function skinned(Component, entry) {
+    const skin = entry;
+    function Skinned(props) {
+        const pageLayout = props.layout;
+        const layout = skin.layout || pageLayout ? { ...(skin.layout ?? {}), ...(pageLayout ?? {}) } : undefined;
+        const merged = {
+            ...props,
+            ...(skin.variant !== undefined ? { variant: skin.variant } : {}),
+            ...(layout ? { layout } : {}),
+            ...(skin.classes ? { classes: skin.classes } : {}),
+        };
+        return createElement(Component, merged);
+    }
+    Skinned.displayName = `Skinned(${Component.displayName ?? Component.name ?? 'Component'})`;
+    return Skinned;
+}
+/** Join class strings, dropping empty parts. Returns `undefined` when nothing is left, so no empty `class` renders. */
+export function cx(...parts) {
+    const joined = parts.filter(Boolean).join(' ');
+    return joined === '' ? undefined : joined;
+}
+/**
+ * The stable hook for one named part: `data-slot` plus the skin's class for it. Spread it onto the element:
+ * `<div {...slot(classes, 'inner')}>`. Slot names, nesting and element types are public API (a minor release to
+ * change); a skin's class never replaces the hook.
+ */
+export function slot(classes, name, extra) {
+    return { 'data-slot': name, className: cx(classes?.[name], extra) };
+}
+//# sourceMappingURL=skin.js.map

package/dist/ui-kit/skin.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"skin.js","sourceRoot":"","sources":["../../src/ui-kit/skin.ts"],"names":[],"mappings":"AAAA;;;;;GAKG;AACH,OAAO,EAAE,aAAa,EAAsC,MAAM,OAAO,CAAA;AAwBzE;;;;;;;;;GASG;AACH,MAAM,UAAU,OAAO,CACrB,SAA2B,EAC3B,KAAqB;IAErB,MAAM,IAAI,GAAG,KAAiE,CAAA;IAC9E,SAAS,OAAO,CAAC,KAAsB;QACrC,MAAM,UAAU,GAAI,KAA6B,CAAC,MAAM,CAAA;QACxD,MAAM,MAAM,GAAG,IAAI,CAAC,MAAM,IAAI,UAAU,CAAC,CAAC,CAAC,EAAE,GAAG,CAAC,IAAI,CAAC,MAAM,IAAI,EAAE,CAAC,EAAE,GAAG,CAAC,UAAU,IAAI,EAAE,CAAC,EAAE,CAAC,CAAC,CAAC,SAAS,CAAA;QACxG,MAAM,MAAM,GAAG;YACb,GAAG,KAAK;YACR,GAAG,CAAC,IAAI,CAAC,OAAO,KAAK,SAAS,CAAC,CAAC,CAAC,EAAE,OAAO,EAAE,IAAI,CAAC,OAAO,EAAE,CAAC,CAAC,CAAC,EAAE,CAAC;YAChE,GAAG,CAAC,MAAM,CAAC,CAAC,CAAC,EAAE,MAAM,EAAE,CAAC,CAAC,CAAC,EAAE,CAAC;YAC7B,GAAG,CAAC,IAAI,CAAC,OAAO,CAAC,CAAC,CAAC,EAAE,OAAO,EAAE,IAAI,CAAC,OAAO,EAAE,CAAC,CAAC,CAAC,EAAE,CAAC;SACnC,CAAA;QACjB,OAAO,aAAa,CAAC,SAAS,EAAE,MAAM,CAAC,CAAA;IACzC,CAAC;IACD,OAAO,CAAC,WAAW,GAAG,WAAW,SAAS,CAAC,WAAW,IAAI,SAAS,CAAC,IAAI,IAAI,WAAW,GAAG,CAAA;IAC1F,OAAO,OAAO,CAAA;AAChB,CAAC;AAED,uHAAuH;AACvH,MAAM,UAAU,EAAE,CAAC,GAAG,KAAqD;IACzE,MAAM,MAAM,GAAG,KAAK,CAAC,MAAM,CAAC,OAAO,CAAC,CAAC,IAAI,CAAC,GAAG,CAAC,CAAA;IAC9C,OAAO,MAAM,KAAK,EAAE,CAAC,CAAC,CAAC,SAAS,CAAC,CAAC,CAAC,MAAM,CAAA;AAC3C,CAAC;AAED;;;;GAIG;AACH,MAAM,UAAU,IAAI,CAClB,OAAsC,EACtC,IAAU,EACV,KAAc;IAEd,OAAO,EAAE,WAAW,EAAE,IAAI,EAAE,SAAS,EAAE,EAAE,CAAC,OAAO,EAAE,CAAC,IAAI,CAAC,EAAE,KAAK,CAAC,EAAE,CAAA;AACrE,CAAC","sourcesContent":["/**\n * The skin model of the Brandlab ui-kit. A site gives every shared component its own look through one skin entry per\n * component: a variant from the component's closed list, typed layout options and one class string per named slot.\n * Colours, fonts and shapes come from the site's `--bl-*` tokens and these classes; behaviour, semantics, accessible\n * names and analytics hooks never appear here, so a skin can't change them.\n */\nimport { createElement, type ComponentType, type ReactNode } from 'react'\n\n/** One class string per named slot. Tailwind v4 utilities, CSS Module class names or nothing (plain CSS on hooks). */\nexport type SlotClasses<Slot extends string> = Readonly<Partial<Record<Slot, string>>>\n\n/** A component's skin: its variant, its layout options and its slot classes. Every field is optional. */\nexport interface SkinEntry<\n  Slot extends string,\n  Variant extends string = never,\n  Layout extends object = Record<never, never>,\n> {\n  readonly variant?: Variant\n  readonly layout?: Readonly<Layout>\n  readonly classes?: SlotClasses<Slot>\n}\n\ntype SkinKeys = 'variant' | 'layout' | 'classes'\n\n/** The part of a component's props a skin entry supplies. */\nexport type SkinEntryOf<P> = Pick<P, Extract<keyof P, SkinKeys>>\n\n/** What a page passes to a skinned component: its data, and at most a `layout` adjustment within the contract. */\nexport type SkinnedProps<P> = Omit<P, 'variant' | 'classes'>\n\n/**\n * Bind a component to the site's skin entry, so pages pass data only. Returns a plain function component (no\n * context, no client code), so it works in server components and client components alike. The skin's layout merges\n * under the page's `layout`; the variant and classes come from the skin only.\n *\n * ```tsx\n * // src/site/ui.tsx\n * export const ReviewsBand = skinned(UI.ReviewsBand, skin.reviewsBand)\n * ```\n */\nexport function skinned<P extends { variant?: unknown; layout?: object; classes?: object }>(\n  Component: ComponentType<P>,\n  entry: SkinEntryOf<P>,\n): ComponentType<SkinnedProps<P>> {\n  const skin = entry as { variant?: unknown; layout?: object; classes?: object }\n  function Skinned(props: SkinnedProps<P>): ReactNode {\n    const pageLayout = (props as { layout?: object }).layout\n    const layout = skin.layout || pageLayout ? { ...(skin.layout ?? {}), ...(pageLayout ?? {}) } : undefined\n    const merged = {\n      ...props,\n      ...(skin.variant !== undefined ? { variant: skin.variant } : {}),\n      ...(layout ? { layout } : {}),\n      ...(skin.classes ? { classes: skin.classes } : {}),\n    } as unknown as P\n    return createElement(Component, merged)\n  }\n  Skinned.displayName = `Skinned(${Component.displayName ?? Component.name ?? 'Component'})`\n  return Skinned\n}\n\n/** Join class strings, dropping empty parts. Returns `undefined` when nothing is left, so no empty `class` renders. */\nexport function cx(...parts: readonly (string | false | null | undefined)[]): string | undefined {\n  const joined = parts.filter(Boolean).join(' ')\n  return joined === '' ? undefined : joined\n}\n\n/**\n * The stable hook for one named part: `data-slot` plus the skin's class for it. Spread it onto the element:\n * `<div {...slot(classes, 'inner')}>`. Slot names, nesting and element types are public API (a minor release to\n * change); a skin's class never replaces the hook.\n */\nexport function slot<Slot extends string>(\n  classes: SlotClasses<Slot> | undefined,\n  name: Slot,\n  extra?: string,\n): { 'data-slot': Slot; className: string | undefined } {\n  return { 'data-slot': name, className: cx(classes?.[name], extra) }\n}\n"]}

package/dist/ui-kit/structure.css

@@ -0,0 +1,123 @@
+/* @brandlab-digital/site-next ui-kit structure.css: behaviour and layout only. Each site styles the components. */
+@layer theme, base, bl-structure, components, utilities;
+
+@layer bl-structure {
+  /* 00-base.css */
+  /* Base: scoped resets, focus, scroll padding, the visually-hidden utility and reduced motion. */
+
+  :where([data-bl], [data-bl-section]),
+  :where([data-bl], [data-bl-section]) *,
+  :where([data-bl], [data-bl-section]) *::before,
+  :where([data-bl], [data-bl-section]) *::after {
+    box-sizing: border-box;
+  }
+
+  :where([data-bl], [data-bl-section]) :where(svg) {
+    display: block;
+    flex-shrink: 0;
+  }
+
+  :where([data-bl], [data-bl-section]) :where([hidden]:not([hidden='until-found'])) {
+    display: none !important;
+  }
+
+  /* WCAG 2.4.11: a focused element is never hidden under the sticky header or the call bar. */
+  html {
+    scroll-padding-top: calc(var(--bl-header-height, 0px) + 0.5rem);
+    scroll-padding-bottom: calc(var(--bl-callbar-height, 0px) + 0.5rem);
+  }
+
+  :where([data-bl], [data-bl-section]) :focus-visible {
+    outline: 2px solid var(--bl-color-focus, currentColor);
+    outline-offset: 3px;
+  }
+
+  [data-bl-visually-hidden] {
+    position: absolute !important;
+    width: 1px !important;
+    height: 1px !important;
+    overflow: hidden !important;
+    clip-path: inset(50%) !important;
+    white-space: nowrap !important;
+  }
+
+  [data-bl='container'] {
+    width: 100%;
+    max-width: var(--bl-container, 80rem);
+    margin-inline: auto;
+    padding-inline: var(--bl-gutter, 1.25rem);
+  }
+  [data-bl='container'][data-width='narrow'] {
+    max-width: min(var(--bl-container, 80rem), 48rem);
+  }
+  [data-bl='container'][data-width='wide'] {
+    max-width: calc(var(--bl-container, 80rem) + 12rem);
+  }
+
+  [data-bl-section] {
+    position: relative;
+    padding-block: var(--bl-space-section, 4rem);
+  }
+  [data-bl-section] > [data-slot='inner'] {
+    position: relative;
+    max-width: var(--bl-container, 80rem);
+    margin-inline: auto;
+    padding-inline: var(--bl-gutter, 1.25rem);
+  }
+  [data-bl-section] > [data-slot='decoration'] {
+    position: absolute;
+    inset: 0;
+    pointer-events: none;
+    overflow: hidden;
+  }
+
+  /* WCAG 2.5.8 and the 44 px rule for primary actions. */
+  [data-bl='button'],
+  [data-bl='quote-button'] {
+    display: inline-flex;
+    align-items: center;
+    justify-content: center;
+    gap: 0.5rem;
+    min-height: 44px;
+    text-decoration: none;
+  }
+  [data-bl='phone-link'] {
+    display: inline-flex;
+    align-items: center;
+    gap: 0.5rem;
+    min-height: 24px;
+  }
+  [data-bl='phone-link'][data-variant='button'] {
+    min-height: 44px;
+  }
+  :where([data-bl='button'], [data-bl='quote-button'], [data-bl='phone-link']) [data-slot='icon'] svg {
+    width: 1.25em;
+    height: 1.25em;
+  }
+
+  [data-bl='stars'] {
+    display: inline-flex;
+    gap: 0.125rem;
+    color: var(--bl-color-star, #f5b301);
+  }
+  [data-bl='stars'] [data-slot='star'] svg {
+    width: 1em;
+    height: 1em;
+  }
+  [data-bl='stars'] [data-slot='star'][data-state='off'] {
+    opacity: 0.3;
+  }
+
+  @media (prefers-reduced-motion: reduce) {
+    :where([data-bl], [data-bl-section]),
+    :where([data-bl], [data-bl-section]) *,
+    :where([data-bl], [data-bl-section]) *::before,
+    :where([data-bl], [data-bl-section]) *::after {
+      animation-duration: 0.01ms !important;
+      animation-iteration-count: 1 !important;
+      transition-duration: 0.01ms !important;
+      scroll-behavior: auto !important;
+    }
+  }
+
+}

package/dist/ui-kit/types.d.ts

@@ -0,0 +1,27 @@
+/**
+ * Data shapes shared by the ui-kit components. A site passes data in these shapes; it never passes markup, ARIA or
+ * event props, so behaviour and semantics stay locked in the components.
+ */
+/**
+ * A phone number ready to render: the number as the business shows it and its `tel:` href. Take both from the
+ * derived business facts (`deriveBusinessFacts(business).phone`), never type them by hand: C10 holds every `tel:` to
+ * the evidence-file phone. Mobiles and landlines use `tel:+61…`; 13, 1300 and 1800 numbers use their national digits.
+ */
+export interface UiPhone {
+    readonly display: string;
+    readonly telHref: string;
+}
+/** A plain link. */
+export interface UiLink {
+    readonly label: string;
+    readonly href: string;
+}
+export declare const UI_SOCIAL_KINDS: readonly ["facebook", "instagram", "google", "linkedin", "youtube", "tiktok"];
+export type UiSocialKind = (typeof UI_SOCIAL_KINDS)[number];
+/** A social or Business Profile link. `label` is the accessible name, for example "Abloom on Facebook". */
+export interface UiSocial {
+    readonly kind: UiSocialKind;
+    readonly label: string;
+    readonly href: string;
+}
+//# sourceMappingURL=types.d.ts.map

package/dist/ui-kit/types.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"types.d.ts","sourceRoot":"","sources":["../../src/ui-kit/types.ts"],"names":[],"mappings":"AAAA;;;GAGG;AAEH;;;;GAIG;AACH,MAAM,WAAW,OAAO;IACtB,QAAQ,CAAC,OAAO,EAAE,MAAM,CAAA;IACxB,QAAQ,CAAC,OAAO,EAAE,MAAM,CAAA;CACzB;AAED,oBAAoB;AACpB,MAAM,WAAW,MAAM;IACrB,QAAQ,CAAC,KAAK,EAAE,MAAM,CAAA;IACtB,QAAQ,CAAC,IAAI,EAAE,MAAM,CAAA;CACtB;AAED,eAAO,MAAM,eAAe,+EAAgF,CAAA;AAC5G,MAAM,MAAM,YAAY,GAAG,CAAC,OAAO,eAAe,CAAC,CAAC,MAAM,CAAC,CAAA;AAE3D,2GAA2G;AAC3G,MAAM,WAAW,QAAQ;IACvB,QAAQ,CAAC,IAAI,EAAE,YAAY,CAAA;IAC3B,QAAQ,CAAC,KAAK,EAAE,MAAM,CAAA;IACtB,QAAQ,CAAC,IAAI,EAAE,MAAM,CAAA;CACtB"}

package/dist/ui-kit/types.js

@@ -0,0 +1,6 @@
+/**
+ * Data shapes shared by the ui-kit components. A site passes data in these shapes; it never passes markup, ARIA or
+ * event props, so behaviour and semantics stay locked in the components.
+ */
+export const UI_SOCIAL_KINDS = ['facebook', 'instagram', 'google', 'linkedin', 'youtube', 'tiktok'];
+//# sourceMappingURL=types.js.map

package/dist/ui-kit/types.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"types.js","sourceRoot":"","sources":["../../src/ui-kit/types.ts"],"names":[],"mappings":"AAAA;;;GAGG;AAkBH,MAAM,CAAC,MAAM,eAAe,GAAG,CAAC,UAAU,EAAE,WAAW,EAAE,QAAQ,EAAE,UAAU,EAAE,SAAS,EAAE,QAAQ,CAAU,CAAA","sourcesContent":["/**\n * Data shapes shared by the ui-kit components. A site passes data in these shapes; it never passes markup, ARIA or\n * event props, so behaviour and semantics stay locked in the components.\n */\n\n/**\n * A phone number ready to render: the number as the business shows it and its `tel:` href. Take both from the\n * derived business facts (`deriveBusinessFacts(business).phone`), never type them by hand: C10 holds every `tel:` to\n * the evidence-file phone. Mobiles and landlines use `tel:+61…`; 13, 1300 and 1800 numbers use their national digits.\n */\nexport interface UiPhone {\n  readonly display: string\n  readonly telHref: string\n}\n\n/** A plain link. */\nexport interface UiLink {\n  readonly label: string\n  readonly href: string\n}\n\nexport const UI_SOCIAL_KINDS = ['facebook', 'instagram', 'google', 'linkedin', 'youtube', 'tiktok'] as const\nexport type UiSocialKind = (typeof UI_SOCIAL_KINDS)[number]\n\n/** A social or Business Profile link. `label` is the accessible name, for example \"Abloom on Facebook\". */\nexport interface UiSocial {\n  readonly kind: UiSocialKind\n  readonly label: string\n  readonly href: string\n}\n"]}

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@brandlab-digital/site-next",
-  "version": "3.7.0",
+  "version": "3.8.0",
   "license": "UNLICENSED",
   "repository": {
     "type": "git",
@@ -10,7 +10,8 @@
   "private": false,
   "type": "module",
   "sideEffects": [
-    "./dist/image-runtime.js"
+    "./dist/image-runtime.js",
+    "./dist/ui-kit/structure.css"
   ],
   "files": [
     "dist"
@@ -19,12 +20,12 @@
     "access": "public"
   },
   "scripts": {
-    "build": "rm -rf dist && tsc -p tsconfig.json",
+    "build": "rm -rf dist && tsc -p tsconfig.json && node scripts/build-structure-css.mjs",
     "test": "vitest run",
     "typecheck": "tsc --noEmit -p tsconfig.json"
   },
   "dependencies": {
-    "@brandlab-digital/site-core": "3.7.0",
+    "@brandlab-digital/site-core": "3.8.0",
     "browser-image-compression": "2.0.2",
     "pdf-lib": "1.17.1",
     "server-only": "0.0.1",
@@ -152,6 +153,18 @@
     "./testing/server-only": {
       "types": "./dist/testing/server-only.d.ts",
       "import": "./dist/testing/server-only.js"
+    },
+    "./ui-kit/skin": {
+      "types": "./dist/ui-kit/skin-index.d.ts",
+      "import": "./dist/ui-kit/skin-index.js"
+    },
+    "./ui-kit/primitives": {
+      "types": "./dist/ui-kit/primitives/index.d.ts",
+      "import": "./dist/ui-kit/primitives/index.js"
+    },
+    "./ui-kit/structure.css": {
+      "style": "./dist/ui-kit/structure.css",
+      "default": "./dist/ui-kit/structure.css"
     }
   }
 }