@hyalo/angular 0.0.0-stage → 0.3.1

package/fesm2022/hyalo-angular-blocks.mjs

@@ -0,0 +1,985 @@
+import * as i0 from "@angular/core";
+import { ChangeDetectionStrategy, Component, input, model } from "@angular/core";
+import { HyButton } from "@hyalo/angular/button";
+import { HyCard } from "@hyalo/angular/card";
+import { HyNumberTicker } from "@hyalo/angular/number-ticker";
+import { HyStat } from "@hyalo/angular/stat";
+import { HyFilterBar } from "@hyalo/angular/filter";
+var HyHeroBlock = class HyHeroBlock {
+	eyebrow = input("", ...ngDevMode ? [{ debugName: "eyebrow" }] : /* istanbul ignore next */ []);
+	heading = input.required(...ngDevMode ? [{ debugName: "heading" }] : /* istanbul ignore next */ []);
+	description = input("", ...ngDevMode ? [{ debugName: "description" }] : /* istanbul ignore next */ []);
+	actionHref = input("", ...ngDevMode ? [{ debugName: "actionHref" }] : /* istanbul ignore next */ []);
+	actionLabel = input("Get started", ...ngDevMode ? [{ debugName: "actionLabel" }] : /* istanbul ignore next */ []);
+	static ɵfac = i0.ɵɵngDeclareFactory({
+		minVersion: "12.0.0",
+		version: "22.2.3",
+		ngImport: i0,
+		type: HyHeroBlock,
+		deps: [],
+		target: i0.ɵɵFactoryTarget.Component
+	});
+	static ɵcmp = i0.ɵɵngDeclareComponent({
+		minVersion: "17.0.0",
+		version: "22.2.3",
+		type: HyHeroBlock,
+		isStandalone: true,
+		selector: "hy-hero-block",
+		inputs: {
+			eyebrow: {
+				classPropertyName: "eyebrow",
+				publicName: "eyebrow",
+				isSignal: true,
+				isRequired: false,
+				transformFunction: null
+			},
+			heading: {
+				classPropertyName: "heading",
+				publicName: "heading",
+				isSignal: true,
+				isRequired: true,
+				transformFunction: null
+			},
+			description: {
+				classPropertyName: "description",
+				publicName: "description",
+				isSignal: true,
+				isRequired: false,
+				transformFunction: null
+			},
+			actionHref: {
+				classPropertyName: "actionHref",
+				publicName: "actionHref",
+				isSignal: true,
+				isRequired: false,
+				transformFunction: null
+			},
+			actionLabel: {
+				classPropertyName: "actionLabel",
+				publicName: "actionLabel",
+				isSignal: true,
+				isRequired: false,
+				transformFunction: null
+			}
+		},
+		ngImport: i0,
+		template: "<section>\n  <div>\n    <p class=\"eyebrow\">{{ eyebrow() }}</p>\n    <h2>{{ heading() }}</h2>\n    <p>{{ description() }}</p>\n    <div class=\"actions\">\n      @if (actionHref()) {\n        <a hyButton [href]=\"actionHref()\">{{ actionLabel() }}</a>\n      }\n      <ng-content select=\"[hyBlockActions]\" />\n    </div>\n  </div>\n  <div class=\"stage\"><ng-content select=\"[hyBlockMedia]\" /></div>\n</section>\n",
+		styles: [":host{display:block}section{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));align-items:center;gap:clamp(1.5rem,5vw,5rem);padding-block:clamp(2rem,6vw,6rem)}h2{font-size:clamp(2rem,5vw,4rem);line-height:1.1;margin:.5rem 0;max-inline-size:16ch}p{line-height:1.7;color:var(--hy-ink-2)}.eyebrow{font-size:.75rem;letter-spacing:.12em;text-transform:uppercase}.actions{display:flex;flex-wrap:wrap;gap:.75rem}.stage{min-inline-size:0}@media(max-width:48rem){section{grid-template-columns:1fr}}\n"],
+		dependencies: [{
+			kind: "component",
+			type: HyButton,
+			selector: "button[hyButton], a[hyButton]",
+			inputs: [
+				"variant",
+				"size",
+				"tone",
+				"iconOnly",
+				"loading",
+				"disabled"
+			]
+		}],
+		changeDetection: i0.ChangeDetectionStrategy.OnPush
+	});
+};
+i0.ɵɵngDeclareClassMetadata({
+	minVersion: "12.0.0",
+	version: "22.2.3",
+	ngImport: i0,
+	type: HyHeroBlock,
+	decorators: [{
+		type: Component,
+		args: [{
+			selector: "hy-hero-block",
+			imports: [HyButton],
+			changeDetection: ChangeDetectionStrategy.OnPush,
+			template: "<section>\n  <div>\n    <p class=\"eyebrow\">{{ eyebrow() }}</p>\n    <h2>{{ heading() }}</h2>\n    <p>{{ description() }}</p>\n    <div class=\"actions\">\n      @if (actionHref()) {\n        <a hyButton [href]=\"actionHref()\">{{ actionLabel() }}</a>\n      }\n      <ng-content select=\"[hyBlockActions]\" />\n    </div>\n  </div>\n  <div class=\"stage\"><ng-content select=\"[hyBlockMedia]\" /></div>\n</section>\n",
+			styles: [":host{display:block}section{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));align-items:center;gap:clamp(1.5rem,5vw,5rem);padding-block:clamp(2rem,6vw,6rem)}h2{font-size:clamp(2rem,5vw,4rem);line-height:1.1;margin:.5rem 0;max-inline-size:16ch}p{line-height:1.7;color:var(--hy-ink-2)}.eyebrow{font-size:.75rem;letter-spacing:.12em;text-transform:uppercase}.actions{display:flex;flex-wrap:wrap;gap:.75rem}.stage{min-inline-size:0}@media(max-width:48rem){section{grid-template-columns:1fr}}\n"]
+		}]
+	}],
+	propDecorators: {
+		eyebrow: [{
+			type: i0.Input,
+			args: [{
+				isSignal: true,
+				alias: "eyebrow",
+				required: false
+			}]
+		}],
+		heading: [{
+			type: i0.Input,
+			args: [{
+				isSignal: true,
+				alias: "heading",
+				required: true
+			}]
+		}],
+		description: [{
+			type: i0.Input,
+			args: [{
+				isSignal: true,
+				alias: "description",
+				required: false
+			}]
+		}],
+		actionHref: [{
+			type: i0.Input,
+			args: [{
+				isSignal: true,
+				alias: "actionHref",
+				required: false
+			}]
+		}],
+		actionLabel: [{
+			type: i0.Input,
+			args: [{
+				isSignal: true,
+				alias: "actionLabel",
+				required: false
+			}]
+		}]
+	}
+});
+var HyPricingBlock = class HyPricingBlock {
+	heading = input("Plans for your next chapter", ...ngDevMode ? [{ debugName: "heading" }] : /* istanbul ignore next */ []);
+	plans = input.required(...ngDevMode ? [{ debugName: "plans" }] : /* istanbul ignore next */ []);
+	billing = model("monthly", ...ngDevMode ? [{ debugName: "billing" }] : /* istanbul ignore next */ []);
+	locale = input(...ngDevMode ? [void 0, { debugName: "locale" }] : /* istanbul ignore next */ []);
+	currencyFormat = input({
+		style: "currency",
+		currency: "USD",
+		maximumFractionDigits: 0
+	}, ...ngDevMode ? [{ debugName: "currencyFormat" }] : /* istanbul ignore next */ []);
+	monthlyLabel = input("Monthly", ...ngDevMode ? [{ debugName: "monthlyLabel" }] : /* istanbul ignore next */ []);
+	annualLabel = input("Annual", ...ngDevMode ? [{ debugName: "annualLabel" }] : /* istanbul ignore next */ []);
+	billingLabel = input("Billing period", ...ngDevMode ? [{ debugName: "billingLabel" }] : /* istanbul ignore next */ []);
+	actionLabel = input("Choose", ...ngDevMode ? [{ debugName: "actionLabel" }] : /* istanbul ignore next */ []);
+	static ɵfac = i0.ɵɵngDeclareFactory({
+		minVersion: "12.0.0",
+		version: "22.2.3",
+		ngImport: i0,
+		type: HyPricingBlock,
+		deps: [],
+		target: i0.ɵɵFactoryTarget.Component
+	});
+	static ɵcmp = i0.ɵɵngDeclareComponent({
+		minVersion: "17.0.0",
+		version: "22.2.3",
+		type: HyPricingBlock,
+		isStandalone: true,
+		selector: "hy-pricing-block",
+		inputs: {
+			heading: {
+				classPropertyName: "heading",
+				publicName: "heading",
+				isSignal: true,
+				isRequired: false,
+				transformFunction: null
+			},
+			plans: {
+				classPropertyName: "plans",
+				publicName: "plans",
+				isSignal: true,
+				isRequired: true,
+				transformFunction: null
+			},
+			billing: {
+				classPropertyName: "billing",
+				publicName: "billing",
+				isSignal: true,
+				isRequired: false,
+				transformFunction: null
+			},
+			locale: {
+				classPropertyName: "locale",
+				publicName: "locale",
+				isSignal: true,
+				isRequired: false,
+				transformFunction: null
+			},
+			currencyFormat: {
+				classPropertyName: "currencyFormat",
+				publicName: "currencyFormat",
+				isSignal: true,
+				isRequired: false,
+				transformFunction: null
+			},
+			monthlyLabel: {
+				classPropertyName: "monthlyLabel",
+				publicName: "monthlyLabel",
+				isSignal: true,
+				isRequired: false,
+				transformFunction: null
+			},
+			annualLabel: {
+				classPropertyName: "annualLabel",
+				publicName: "annualLabel",
+				isSignal: true,
+				isRequired: false,
+				transformFunction: null
+			},
+			billingLabel: {
+				classPropertyName: "billingLabel",
+				publicName: "billingLabel",
+				isSignal: true,
+				isRequired: false,
+				transformFunction: null
+			},
+			actionLabel: {
+				classPropertyName: "actionLabel",
+				publicName: "actionLabel",
+				isSignal: true,
+				isRequired: false,
+				transformFunction: null
+			}
+		},
+		outputs: { billing: "billingChange" },
+		ngImport: i0,
+		template: "<section>\n  <h2>{{ heading() }}</h2>\n  <div class=\"billing\" role=\"group\" [attr.aria-label]=\"billingLabel()\">\n    <button\n      type=\"button\"\n      [attr.aria-pressed]=\"billing() === 'monthly'\"\n      (click)=\"billing.set('monthly')\"\n    >\n      {{ monthlyLabel() }}</button\n    ><button\n      type=\"button\"\n      [attr.aria-pressed]=\"billing() === 'annual'\"\n      (click)=\"billing.set('annual')\"\n    >\n      {{ annualLabel() }}\n    </button>\n  </div>\n  <div class=\"plans\">\n    @for (plan of plans(); track plan.id) {\n      <hy-card material=\"tinted\" [class.featured]=\"plan.featured\"\n        ><h3>{{ plan.name }}</h3>\n        <p>{{ plan.description }}</p>\n        <strong\n          ><hy-number-ticker\n            [value]=\"billing() === 'monthly' ? plan.monthly : plan.annual\"\n            [locale]=\"locale()\"\n            [format]=\"currencyFormat()\"\n        /></strong>\n        <p>{{ billing() === 'monthly' ? monthlyLabel() : annualLabel() }}</p>\n        <ul>\n          @for (feature of plan.features; track feature) {\n            <li>{{ feature }}</li>\n          }\n        </ul>\n        <a hyButton [href]=\"plan.href\">{{ actionLabel() }} {{ plan.name }}</a></hy-card\n      >\n    }\n  </div>\n</section>\n",
+		styles: [":host{display:block}h2{font-size:clamp(1.5rem,3vw,2.5rem)}.billing{display:flex;gap:.5rem;margin-block:1rem}.plans{display:grid;grid-template-columns:repeat(auto-fit,minmax(min(100%,16rem),1fr));gap:1rem}hy-card{padding:1.5rem}.featured{outline:2px solid var(--hy-primary)}strong{font-size:2rem}p,li{color:var(--hy-ink-2);line-height:1.7}button{min-block-size:44px;font:inherit;background:var(--hy-surface-1);color:var(--hy-ink);border:1px solid var(--hy-line);border-radius:var(--hy-radius-s);padding:.5rem 1rem;cursor:pointer}button[aria-pressed=true]{background:var(--hy-primary-wash)}button:focus-visible{outline:2px solid var(--hy-primary);outline-offset:2px}\n"],
+		dependencies: [
+			{
+				kind: "component",
+				type: HyCard,
+				selector: "hy-card",
+				inputs: ["padding"]
+			},
+			{
+				kind: "component",
+				type: HyButton,
+				selector: "button[hyButton], a[hyButton]",
+				inputs: [
+					"variant",
+					"size",
+					"tone",
+					"iconOnly",
+					"loading",
+					"disabled"
+				]
+			},
+			{
+				kind: "component",
+				type: HyNumberTicker,
+				selector: "hy-number-ticker",
+				inputs: [
+					"value",
+					"locale",
+					"format",
+					"animate",
+					"prefix",
+					"suffix"
+				]
+			}
+		],
+		changeDetection: i0.ChangeDetectionStrategy.OnPush
+	});
+};
+i0.ɵɵngDeclareClassMetadata({
+	minVersion: "12.0.0",
+	version: "22.2.3",
+	ngImport: i0,
+	type: HyPricingBlock,
+	decorators: [{
+		type: Component,
+		args: [{
+			selector: "hy-pricing-block",
+			imports: [
+				HyCard,
+				HyButton,
+				HyNumberTicker
+			],
+			changeDetection: ChangeDetectionStrategy.OnPush,
+			template: "<section>\n  <h2>{{ heading() }}</h2>\n  <div class=\"billing\" role=\"group\" [attr.aria-label]=\"billingLabel()\">\n    <button\n      type=\"button\"\n      [attr.aria-pressed]=\"billing() === 'monthly'\"\n      (click)=\"billing.set('monthly')\"\n    >\n      {{ monthlyLabel() }}</button\n    ><button\n      type=\"button\"\n      [attr.aria-pressed]=\"billing() === 'annual'\"\n      (click)=\"billing.set('annual')\"\n    >\n      {{ annualLabel() }}\n    </button>\n  </div>\n  <div class=\"plans\">\n    @for (plan of plans(); track plan.id) {\n      <hy-card material=\"tinted\" [class.featured]=\"plan.featured\"\n        ><h3>{{ plan.name }}</h3>\n        <p>{{ plan.description }}</p>\n        <strong\n          ><hy-number-ticker\n            [value]=\"billing() === 'monthly' ? plan.monthly : plan.annual\"\n            [locale]=\"locale()\"\n            [format]=\"currencyFormat()\"\n        /></strong>\n        <p>{{ billing() === 'monthly' ? monthlyLabel() : annualLabel() }}</p>\n        <ul>\n          @for (feature of plan.features; track feature) {\n            <li>{{ feature }}</li>\n          }\n        </ul>\n        <a hyButton [href]=\"plan.href\">{{ actionLabel() }} {{ plan.name }}</a></hy-card\n      >\n    }\n  </div>\n</section>\n",
+			styles: [":host{display:block}h2{font-size:clamp(1.5rem,3vw,2.5rem)}.billing{display:flex;gap:.5rem;margin-block:1rem}.plans{display:grid;grid-template-columns:repeat(auto-fit,minmax(min(100%,16rem),1fr));gap:1rem}hy-card{padding:1.5rem}.featured{outline:2px solid var(--hy-primary)}strong{font-size:2rem}p,li{color:var(--hy-ink-2);line-height:1.7}button{min-block-size:44px;font:inherit;background:var(--hy-surface-1);color:var(--hy-ink);border:1px solid var(--hy-line);border-radius:var(--hy-radius-s);padding:.5rem 1rem;cursor:pointer}button[aria-pressed=true]{background:var(--hy-primary-wash)}button:focus-visible{outline:2px solid var(--hy-primary);outline-offset:2px}\n"]
+		}]
+	}],
+	propDecorators: {
+		heading: [{
+			type: i0.Input,
+			args: [{
+				isSignal: true,
+				alias: "heading",
+				required: false
+			}]
+		}],
+		plans: [{
+			type: i0.Input,
+			args: [{
+				isSignal: true,
+				alias: "plans",
+				required: true
+			}]
+		}],
+		billing: [{
+			type: i0.Input,
+			args: [{
+				isSignal: true,
+				alias: "billing",
+				required: false
+			}]
+		}, {
+			type: i0.Output,
+			args: ["billingChange"]
+		}],
+		locale: [{
+			type: i0.Input,
+			args: [{
+				isSignal: true,
+				alias: "locale",
+				required: false
+			}]
+		}],
+		currencyFormat: [{
+			type: i0.Input,
+			args: [{
+				isSignal: true,
+				alias: "currencyFormat",
+				required: false
+			}]
+		}],
+		monthlyLabel: [{
+			type: i0.Input,
+			args: [{
+				isSignal: true,
+				alias: "monthlyLabel",
+				required: false
+			}]
+		}],
+		annualLabel: [{
+			type: i0.Input,
+			args: [{
+				isSignal: true,
+				alias: "annualLabel",
+				required: false
+			}]
+		}],
+		billingLabel: [{
+			type: i0.Input,
+			args: [{
+				isSignal: true,
+				alias: "billingLabel",
+				required: false
+			}]
+		}],
+		actionLabel: [{
+			type: i0.Input,
+			args: [{
+				isSignal: true,
+				alias: "actionLabel",
+				required: false
+			}]
+		}]
+	}
+});
+var HyFeatureBlock = class HyFeatureBlock {
+	heading = input("Built for the way you work", ...ngDevMode ? [{ debugName: "heading" }] : /* istanbul ignore next */ []);
+	features = input.required(...ngDevMode ? [{ debugName: "features" }] : /* istanbul ignore next */ []);
+	static ɵfac = i0.ɵɵngDeclareFactory({
+		minVersion: "12.0.0",
+		version: "22.2.3",
+		ngImport: i0,
+		type: HyFeatureBlock,
+		deps: [],
+		target: i0.ɵɵFactoryTarget.Component
+	});
+	static ɵcmp = i0.ɵɵngDeclareComponent({
+		minVersion: "17.0.0",
+		version: "22.2.3",
+		type: HyFeatureBlock,
+		isStandalone: true,
+		selector: "hy-feature-block",
+		inputs: {
+			heading: {
+				classPropertyName: "heading",
+				publicName: "heading",
+				isSignal: true,
+				isRequired: false,
+				transformFunction: null
+			},
+			features: {
+				classPropertyName: "features",
+				publicName: "features",
+				isSignal: true,
+				isRequired: true,
+				transformFunction: null
+			}
+		},
+		ngImport: i0,
+		template: "<section>\n  <h2>{{ heading() }}</h2>\n  <div class=\"grid\">\n    @for (feature of features(); track feature.id) {\n      <hy-card material=\"tinted\"\n        ><h3>{{ feature.title }}</h3>\n        <p>{{ feature.description }}</p></hy-card\n      >\n    }\n    <ng-content />\n  </div>\n</section>\n",
+		styles: [":host{display:block}.grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:1rem}hy-card{padding:1.5rem}hy-card:first-child{grid-column:span 2}p{line-height:1.7;color:var(--hy-ink-2)}@media(max-width:40rem){.grid{grid-template-columns:1fr}hy-card:first-child{grid-column:auto}}\n"],
+		dependencies: [{
+			kind: "component",
+			type: HyCard,
+			selector: "hy-card",
+			inputs: ["padding"]
+		}],
+		changeDetection: i0.ChangeDetectionStrategy.OnPush
+	});
+};
+i0.ɵɵngDeclareClassMetadata({
+	minVersion: "12.0.0",
+	version: "22.2.3",
+	ngImport: i0,
+	type: HyFeatureBlock,
+	decorators: [{
+		type: Component,
+		args: [{
+			selector: "hy-feature-block",
+			imports: [HyCard],
+			changeDetection: ChangeDetectionStrategy.OnPush,
+			template: "<section>\n  <h2>{{ heading() }}</h2>\n  <div class=\"grid\">\n    @for (feature of features(); track feature.id) {\n      <hy-card material=\"tinted\"\n        ><h3>{{ feature.title }}</h3>\n        <p>{{ feature.description }}</p></hy-card\n      >\n    }\n    <ng-content />\n  </div>\n</section>\n",
+			styles: [":host{display:block}.grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:1rem}hy-card{padding:1.5rem}hy-card:first-child{grid-column:span 2}p{line-height:1.7;color:var(--hy-ink-2)}@media(max-width:40rem){.grid{grid-template-columns:1fr}hy-card:first-child{grid-column:auto}}\n"]
+		}]
+	}],
+	propDecorators: {
+		heading: [{
+			type: i0.Input,
+			args: [{
+				isSignal: true,
+				alias: "heading",
+				required: false
+			}]
+		}],
+		features: [{
+			type: i0.Input,
+			args: [{
+				isSignal: true,
+				alias: "features",
+				required: true
+			}]
+		}]
+	}
+});
+var HyTestimonialsBlock = class HyTestimonialsBlock {
+	heading = input("Trusted by thoughtful teams", ...ngDevMode ? [{ debugName: "heading" }] : /* istanbul ignore next */ []);
+	items = input.required(...ngDevMode ? [{ debugName: "items" }] : /* istanbul ignore next */ []);
+	static ɵfac = i0.ɵɵngDeclareFactory({
+		minVersion: "12.0.0",
+		version: "22.2.3",
+		ngImport: i0,
+		type: HyTestimonialsBlock,
+		deps: [],
+		target: i0.ɵɵFactoryTarget.Component
+	});
+	static ɵcmp = i0.ɵɵngDeclareComponent({
+		minVersion: "17.0.0",
+		version: "22.2.3",
+		type: HyTestimonialsBlock,
+		isStandalone: true,
+		selector: "hy-testimonials-block",
+		inputs: {
+			heading: {
+				classPropertyName: "heading",
+				publicName: "heading",
+				isSignal: true,
+				isRequired: false,
+				transformFunction: null
+			},
+			items: {
+				classPropertyName: "items",
+				publicName: "items",
+				isSignal: true,
+				isRequired: true,
+				transformFunction: null
+			}
+		},
+		ngImport: i0,
+		template: "<section>\n  <h2>{{ heading() }}</h2>\n  <div class=\"wall\">\n    @for (item of items(); track item.id) {\n      <hy-card material=\"tinted\"\n        ><figure>\n          <blockquote>{{ item.quote }}</blockquote>\n          <figcaption>\n            <strong>{{ item.author }}</strong\n            ><span>{{ item.role }}</span>\n          </figcaption>\n        </figure></hy-card\n      >\n    }\n  </div>\n</section>\n",
+		styles: [":host{display:block}.wall{columns:18rem;column-gap:1rem}hy-card{display:block;break-inside:avoid;margin-block-end:1rem;padding:1.5rem}figure,blockquote{margin:0}blockquote{line-height:1.8}figcaption{display:grid;gap:.25rem;margin-block-start:1.5rem}span{font-size:.875rem;color:var(--hy-ink-2)}\n"],
+		dependencies: [{
+			kind: "component",
+			type: HyCard,
+			selector: "hy-card",
+			inputs: ["padding"]
+		}],
+		changeDetection: i0.ChangeDetectionStrategy.OnPush
+	});
+};
+i0.ɵɵngDeclareClassMetadata({
+	minVersion: "12.0.0",
+	version: "22.2.3",
+	ngImport: i0,
+	type: HyTestimonialsBlock,
+	decorators: [{
+		type: Component,
+		args: [{
+			selector: "hy-testimonials-block",
+			imports: [HyCard],
+			changeDetection: ChangeDetectionStrategy.OnPush,
+			template: "<section>\n  <h2>{{ heading() }}</h2>\n  <div class=\"wall\">\n    @for (item of items(); track item.id) {\n      <hy-card material=\"tinted\"\n        ><figure>\n          <blockquote>{{ item.quote }}</blockquote>\n          <figcaption>\n            <strong>{{ item.author }}</strong\n            ><span>{{ item.role }}</span>\n          </figcaption>\n        </figure></hy-card\n      >\n    }\n  </div>\n</section>\n",
+			styles: [":host{display:block}.wall{columns:18rem;column-gap:1rem}hy-card{display:block;break-inside:avoid;margin-block-end:1rem;padding:1.5rem}figure,blockquote{margin:0}blockquote{line-height:1.8}figcaption{display:grid;gap:.25rem;margin-block-start:1.5rem}span{font-size:.875rem;color:var(--hy-ink-2)}\n"]
+		}]
+	}],
+	propDecorators: {
+		heading: [{
+			type: i0.Input,
+			args: [{
+				isSignal: true,
+				alias: "heading",
+				required: false
+			}]
+		}],
+		items: [{
+			type: i0.Input,
+			args: [{
+				isSignal: true,
+				alias: "items",
+				required: true
+			}]
+		}]
+	}
+});
+var HyProductBlock = class HyProductBlock {
+	category = input("", ...ngDevMode ? [{ debugName: "category" }] : /* istanbul ignore next */ []);
+	heading = input.required(...ngDevMode ? [{ debugName: "heading" }] : /* istanbul ignore next */ []);
+	description = input("", ...ngDevMode ? [{ debugName: "description" }] : /* istanbul ignore next */ []);
+	price = input.required(...ngDevMode ? [{ debugName: "price" }] : /* istanbul ignore next */ []);
+	actionHref = input.required(...ngDevMode ? [{ debugName: "actionHref" }] : /* istanbul ignore next */ []);
+	actionLabel = input("View product", ...ngDevMode ? [{ debugName: "actionLabel" }] : /* istanbul ignore next */ []);
+	static ɵfac = i0.ɵɵngDeclareFactory({
+		minVersion: "12.0.0",
+		version: "22.2.3",
+		ngImport: i0,
+		type: HyProductBlock,
+		deps: [],
+		target: i0.ɵɵFactoryTarget.Component
+	});
+	static ɵcmp = i0.ɵɵngDeclareComponent({
+		minVersion: "17.1.0",
+		version: "22.2.3",
+		type: HyProductBlock,
+		isStandalone: true,
+		selector: "hy-product-block",
+		inputs: {
+			category: {
+				classPropertyName: "category",
+				publicName: "category",
+				isSignal: true,
+				isRequired: false,
+				transformFunction: null
+			},
+			heading: {
+				classPropertyName: "heading",
+				publicName: "heading",
+				isSignal: true,
+				isRequired: true,
+				transformFunction: null
+			},
+			description: {
+				classPropertyName: "description",
+				publicName: "description",
+				isSignal: true,
+				isRequired: false,
+				transformFunction: null
+			},
+			price: {
+				classPropertyName: "price",
+				publicName: "price",
+				isSignal: true,
+				isRequired: true,
+				transformFunction: null
+			},
+			actionHref: {
+				classPropertyName: "actionHref",
+				publicName: "actionHref",
+				isSignal: true,
+				isRequired: true,
+				transformFunction: null
+			},
+			actionLabel: {
+				classPropertyName: "actionLabel",
+				publicName: "actionLabel",
+				isSignal: true,
+				isRequired: false,
+				transformFunction: null
+			}
+		},
+		ngImport: i0,
+		template: "<section>\n  <div class=\"media\"><ng-content select=\"[hyBlockMedia]\" /></div>\n  <div>\n    <p>{{ category() }}</p>\n    <h2>{{ heading() }}</h2>\n    <p>{{ description() }}</p>\n    <strong>{{ price() }}</strong>\n    <div class=\"choices\"><ng-content select=\"[hyBlockOptions]\" /></div>\n    <a hyButton [href]=\"actionHref()\">{{ actionLabel() }}</a\n    ><ng-content />\n  </div>\n</section>\n",
+		styles: [":host{display:block}section{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));align-items:center;gap:2rem}.media{min-inline-size:0}h2{font-size:clamp(1.75rem,4vw,3rem)}p{color:var(--hy-ink-2);line-height:1.8}.choices{margin-block:1.5rem}strong{font-size:1.5rem}@media(max-width:48rem){section{grid-template-columns:1fr}}\n"],
+		dependencies: [{
+			kind: "component",
+			type: HyButton,
+			selector: "button[hyButton], a[hyButton]",
+			inputs: [
+				"variant",
+				"size",
+				"tone",
+				"iconOnly",
+				"loading",
+				"disabled"
+			]
+		}],
+		changeDetection: i0.ChangeDetectionStrategy.OnPush
+	});
+};
+i0.ɵɵngDeclareClassMetadata({
+	minVersion: "12.0.0",
+	version: "22.2.3",
+	ngImport: i0,
+	type: HyProductBlock,
+	decorators: [{
+		type: Component,
+		args: [{
+			selector: "hy-product-block",
+			imports: [HyButton],
+			changeDetection: ChangeDetectionStrategy.OnPush,
+			template: "<section>\n  <div class=\"media\"><ng-content select=\"[hyBlockMedia]\" /></div>\n  <div>\n    <p>{{ category() }}</p>\n    <h2>{{ heading() }}</h2>\n    <p>{{ description() }}</p>\n    <strong>{{ price() }}</strong>\n    <div class=\"choices\"><ng-content select=\"[hyBlockOptions]\" /></div>\n    <a hyButton [href]=\"actionHref()\">{{ actionLabel() }}</a\n    ><ng-content />\n  </div>\n</section>\n",
+			styles: [":host{display:block}section{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));align-items:center;gap:2rem}.media{min-inline-size:0}h2{font-size:clamp(1.75rem,4vw,3rem)}p{color:var(--hy-ink-2);line-height:1.8}.choices{margin-block:1.5rem}strong{font-size:1.5rem}@media(max-width:48rem){section{grid-template-columns:1fr}}\n"]
+		}]
+	}],
+	propDecorators: {
+		category: [{
+			type: i0.Input,
+			args: [{
+				isSignal: true,
+				alias: "category",
+				required: false
+			}]
+		}],
+		heading: [{
+			type: i0.Input,
+			args: [{
+				isSignal: true,
+				alias: "heading",
+				required: true
+			}]
+		}],
+		description: [{
+			type: i0.Input,
+			args: [{
+				isSignal: true,
+				alias: "description",
+				required: false
+			}]
+		}],
+		price: [{
+			type: i0.Input,
+			args: [{
+				isSignal: true,
+				alias: "price",
+				required: true
+			}]
+		}],
+		actionHref: [{
+			type: i0.Input,
+			args: [{
+				isSignal: true,
+				alias: "actionHref",
+				required: true
+			}]
+		}],
+		actionLabel: [{
+			type: i0.Input,
+			args: [{
+				isSignal: true,
+				alias: "actionLabel",
+				required: false
+			}]
+		}]
+	}
+});
+var HyDashboardBlock = class HyDashboardBlock {
+	static ɵfac = i0.ɵɵngDeclareFactory({
+		minVersion: "12.0.0",
+		version: "22.2.3",
+		ngImport: i0,
+		type: HyDashboardBlock,
+		deps: [],
+		target: i0.ɵɵFactoryTarget.Component
+	});
+	static ɵcmp = i0.ɵɵngDeclareComponent({
+		minVersion: "14.0.0",
+		version: "22.2.3",
+		type: HyDashboardBlock,
+		isStandalone: true,
+		selector: "hy-dashboard-block",
+		ngImport: i0,
+		template: "<div class=\"shell\">\n  <aside><ng-content select=\"[hyBlockSidebar]\" /></aside>\n  <div class=\"main\">\n    <header><ng-content select=\"[hyBlockToolbar]\" /></header>\n    <ng-content />\n  </div>\n</div>\n",
+		styles: [":host{display:block}.shell{display:grid;grid-template-columns:auto minmax(0,1fr);gap:1.5rem}.main{min-inline-size:0}header{position:sticky;inset-block-start:0;z-index:1;background:var(--hy-surface-1);padding-block:.75rem}@media(max-width:40rem){.shell{grid-template-columns:1fr}aside{overflow:auto}}\n"],
+		changeDetection: i0.ChangeDetectionStrategy.OnPush
+	});
+};
+i0.ɵɵngDeclareClassMetadata({
+	minVersion: "12.0.0",
+	version: "22.2.3",
+	ngImport: i0,
+	type: HyDashboardBlock,
+	decorators: [{
+		type: Component,
+		args: [{
+			selector: "hy-dashboard-block",
+			changeDetection: ChangeDetectionStrategy.OnPush,
+			template: "<div class=\"shell\">\n  <aside><ng-content select=\"[hyBlockSidebar]\" /></aside>\n  <div class=\"main\">\n    <header><ng-content select=\"[hyBlockToolbar]\" /></header>\n    <ng-content />\n  </div>\n</div>\n",
+			styles: [":host{display:block}.shell{display:grid;grid-template-columns:auto minmax(0,1fr);gap:1.5rem}.main{min-inline-size:0}header{position:sticky;inset-block-start:0;z-index:1;background:var(--hy-surface-1);padding-block:.75rem}@media(max-width:40rem){.shell{grid-template-columns:1fr}aside{overflow:auto}}\n"]
+		}]
+	}]
+});
+var HyKpiStripBlock = class HyKpiStripBlock {
+	items = input.required(...ngDevMode ? [{ debugName: "items" }] : /* istanbul ignore next */ []);
+	locale = input(...ngDevMode ? [void 0, { debugName: "locale" }] : /* istanbul ignore next */ []);
+	static ɵfac = i0.ɵɵngDeclareFactory({
+		minVersion: "12.0.0",
+		version: "22.2.3",
+		ngImport: i0,
+		type: HyKpiStripBlock,
+		deps: [],
+		target: i0.ɵɵFactoryTarget.Component
+	});
+	static ɵcmp = i0.ɵɵngDeclareComponent({
+		minVersion: "17.0.0",
+		version: "22.2.3",
+		type: HyKpiStripBlock,
+		isStandalone: true,
+		selector: "hy-kpi-strip-block",
+		inputs: {
+			items: {
+				classPropertyName: "items",
+				publicName: "items",
+				isSignal: true,
+				isRequired: true,
+				transformFunction: null
+			},
+			locale: {
+				classPropertyName: "locale",
+				publicName: "locale",
+				isSignal: true,
+				isRequired: false,
+				transformFunction: null
+			}
+		},
+		ngImport: i0,
+		template: "<div class=\"strip\">\n  @for (item of items(); track item.id) {\n    <hy-stat\n      [label]=\"item.label\"\n      [value]=\"item.value\"\n      [trend]=\"item.trend ?? ''\"\n      [prefix]=\"item.prefix ?? ''\"\n      [suffix]=\"item.suffix ?? ''\"\n      [locale]=\"locale()\"\n    />\n  }\n</div>\n",
+		styles: [":host{display:block}.strip{display:grid;grid-template-columns:repeat(auto-fit,minmax(min(100%,12rem),1fr));gap:1rem}\n"],
+		dependencies: [{
+			kind: "component",
+			type: HyStat,
+			selector: "hy-stat",
+			inputs: [
+				"value",
+				"label",
+				"trend",
+				"locale",
+				"format",
+				"animate",
+				"prefix",
+				"suffix"
+			]
+		}],
+		changeDetection: i0.ChangeDetectionStrategy.OnPush
+	});
+};
+i0.ɵɵngDeclareClassMetadata({
+	minVersion: "12.0.0",
+	version: "22.2.3",
+	ngImport: i0,
+	type: HyKpiStripBlock,
+	decorators: [{
+		type: Component,
+		args: [{
+			selector: "hy-kpi-strip-block",
+			imports: [HyStat],
+			changeDetection: ChangeDetectionStrategy.OnPush,
+			template: "<div class=\"strip\">\n  @for (item of items(); track item.id) {\n    <hy-stat\n      [label]=\"item.label\"\n      [value]=\"item.value\"\n      [trend]=\"item.trend ?? ''\"\n      [prefix]=\"item.prefix ?? ''\"\n      [suffix]=\"item.suffix ?? ''\"\n      [locale]=\"locale()\"\n    />\n  }\n</div>\n",
+			styles: [":host{display:block}.strip{display:grid;grid-template-columns:repeat(auto-fit,minmax(min(100%,12rem),1fr));gap:1rem}\n"]
+		}]
+	}],
+	propDecorators: {
+		items: [{
+			type: i0.Input,
+			args: [{
+				isSignal: true,
+				alias: "items",
+				required: true
+			}]
+		}],
+		locale: [{
+			type: i0.Input,
+			args: [{
+				isSignal: true,
+				alias: "locale",
+				required: false
+			}]
+		}]
+	}
+});
+var HyActivityBlock = class HyActivityBlock {
+	heading = input("Recent activity", ...ngDevMode ? [{ debugName: "heading" }] : /* istanbul ignore next */ []);
+	items = input.required(...ngDevMode ? [{ debugName: "items" }] : /* istanbul ignore next */ []);
+	static ɵfac = i0.ɵɵngDeclareFactory({
+		minVersion: "12.0.0",
+		version: "22.2.3",
+		ngImport: i0,
+		type: HyActivityBlock,
+		deps: [],
+		target: i0.ɵɵFactoryTarget.Component
+	});
+	static ɵcmp = i0.ɵɵngDeclareComponent({
+		minVersion: "17.0.0",
+		version: "22.2.3",
+		type: HyActivityBlock,
+		isStandalone: true,
+		selector: "hy-activity-block",
+		inputs: {
+			heading: {
+				classPropertyName: "heading",
+				publicName: "heading",
+				isSignal: true,
+				isRequired: false,
+				transformFunction: null
+			},
+			items: {
+				classPropertyName: "items",
+				publicName: "items",
+				isSignal: true,
+				isRequired: true,
+				transformFunction: null
+			}
+		},
+		ngImport: i0,
+		template: "<section>\n  <h2>{{ heading() }}</h2>\n  <ol>\n    @for (item of items(); track item.id) {\n      <li>\n        <div>\n          <strong>{{ item.heading }}</strong>\n          <p>{{ item.description }}</p>\n        </div>\n        <time [attr.datetime]=\"item.dateTime\">{{ item.time }}</time>\n      </li>\n    }\n  </ol>\n  <ng-content />\n</section>\n",
+		styles: [":host{display:block}ol{list-style:none;padding:0}li{display:flex;justify-content:space-between;gap:1rem;padding-block:1rem;border-block-end:1px solid var(--hy-line)}p,time{color:var(--hy-ink-2);font-size:.875rem}p{margin-block:.5rem 0}time{white-space:nowrap}\n"],
+		changeDetection: i0.ChangeDetectionStrategy.OnPush
+	});
+};
+i0.ɵɵngDeclareClassMetadata({
+	minVersion: "12.0.0",
+	version: "22.2.3",
+	ngImport: i0,
+	type: HyActivityBlock,
+	decorators: [{
+		type: Component,
+		args: [{
+			selector: "hy-activity-block",
+			changeDetection: ChangeDetectionStrategy.OnPush,
+			template: "<section>\n  <h2>{{ heading() }}</h2>\n  <ol>\n    @for (item of items(); track item.id) {\n      <li>\n        <div>\n          <strong>{{ item.heading }}</strong>\n          <p>{{ item.description }}</p>\n        </div>\n        <time [attr.datetime]=\"item.dateTime\">{{ item.time }}</time>\n      </li>\n    }\n  </ol>\n  <ng-content />\n</section>\n",
+			styles: [":host{display:block}ol{list-style:none;padding:0}li{display:flex;justify-content:space-between;gap:1rem;padding-block:1rem;border-block-end:1px solid var(--hy-line)}p,time{color:var(--hy-ink-2);font-size:.875rem}p{margin-block:.5rem 0}time{white-space:nowrap}\n"]
+		}]
+	}],
+	propDecorators: {
+		heading: [{
+			type: i0.Input,
+			args: [{
+				isSignal: true,
+				alias: "heading",
+				required: false
+			}]
+		}],
+		items: [{
+			type: i0.Input,
+			args: [{
+				isSignal: true,
+				alias: "items",
+				required: true
+			}]
+		}]
+	}
+});
+var HyFilterToolbarBlock = class HyFilterToolbarBlock {
+	fields = input.required(...ngDevMode ? [{ debugName: "fields" }] : /* istanbul ignore next */ []);
+	clauses = model([], ...ngDevMode ? [{ debugName: "clauses" }] : /* istanbul ignore next */ []);
+	label = input("Filter results", ...ngDevMode ? [{ debugName: "label" }] : /* istanbul ignore next */ []);
+	static ɵfac = i0.ɵɵngDeclareFactory({
+		minVersion: "12.0.0",
+		version: "22.2.3",
+		ngImport: i0,
+		type: HyFilterToolbarBlock,
+		deps: [],
+		target: i0.ɵɵFactoryTarget.Component
+	});
+	static ɵcmp = i0.ɵɵngDeclareComponent({
+		minVersion: "17.1.0",
+		version: "22.2.3",
+		type: HyFilterToolbarBlock,
+		isStandalone: true,
+		selector: "hy-filter-toolbar-block",
+		inputs: {
+			fields: {
+				classPropertyName: "fields",
+				publicName: "fields",
+				isSignal: true,
+				isRequired: true,
+				transformFunction: null
+			},
+			clauses: {
+				classPropertyName: "clauses",
+				publicName: "clauses",
+				isSignal: true,
+				isRequired: false,
+				transformFunction: null
+			},
+			label: {
+				classPropertyName: "label",
+				publicName: "label",
+				isSignal: true,
+				isRequired: false,
+				transformFunction: null
+			}
+		},
+		outputs: { clauses: "clausesChange" },
+		ngImport: i0,
+		template: "<hy-filter-bar\n  [fields]=\"fields()\"\n  [clauses]=\"clauses()\"\n  (clausesChange)=\"clauses.set($event)\"\n  [label]=\"label()\"\n  ><ng-content\n/></hy-filter-bar>\n",
+		dependencies: [{
+			kind: "component",
+			type: HyFilterBar,
+			selector: "hy-filter-bar",
+			inputs: [
+				"fields",
+				"clauses",
+				"label",
+				"clearLabel",
+				"removeLabel",
+				"anyLabel",
+				"activeLabel"
+			],
+			outputs: ["clausesChange"]
+		}],
+		changeDetection: i0.ChangeDetectionStrategy.OnPush
+	});
+};
+i0.ɵɵngDeclareClassMetadata({
+	minVersion: "12.0.0",
+	version: "22.2.3",
+	ngImport: i0,
+	type: HyFilterToolbarBlock,
+	decorators: [{
+		type: Component,
+		args: [{
+			selector: "hy-filter-toolbar-block",
+			imports: [HyFilterBar],
+			changeDetection: ChangeDetectionStrategy.OnPush,
+			template: "<hy-filter-bar\n  [fields]=\"fields()\"\n  [clauses]=\"clauses()\"\n  (clausesChange)=\"clauses.set($event)\"\n  [label]=\"label()\"\n  ><ng-content\n/></hy-filter-bar>\n"
+		}]
+	}],
+	propDecorators: {
+		fields: [{
+			type: i0.Input,
+			args: [{
+				isSignal: true,
+				alias: "fields",
+				required: true
+			}]
+		}],
+		clauses: [{
+			type: i0.Input,
+			args: [{
+				isSignal: true,
+				alias: "clauses",
+				required: false
+			}]
+		}, {
+			type: i0.Output,
+			args: ["clausesChange"]
+		}],
+		label: [{
+			type: i0.Input,
+			args: [{
+				isSignal: true,
+				alias: "label",
+				required: false
+			}]
+		}]
+	}
+});
+export { HyActivityBlock, HyDashboardBlock, HyFeatureBlock, HyFilterToolbarBlock, HyHeroBlock, HyKpiStripBlock, HyPricingBlock, HyProductBlock, HyTestimonialsBlock };
+
+//# sourceMappingURL=hyalo-angular-blocks.mjs.map