@thl-ui/angular 0.1.0 → 0.1.1

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
@@ -4951,41 +4951,43 @@ class ThlPricingTableComponent {
4951
4951
  return this.cfg.bem('pricing-plan')({ featured: f });
4952
4952
  }
4953
4953
  static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.2.26", ngImport: i0, type: ThlPricingTableComponent, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
4954
- static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "21.2.26", type: ThlPricingTableComponent, isStandalone: true, selector: "thl-pricing-table", inputs: { plans: { classPropertyName: "plans", publicName: "plans", isSignal: true, isRequired: true, transformFunction: null } }, outputs: { selected: "selected" }, host: { properties: { "class": "cfg.prefix() + \"-pricing\"" } }, ngImport: i0, template: `@for (pl of plans(); track $index; let i = $index) {
4955
- <div [class]="planCls(pl.featured)">
4956
- @if (pl.tag) {
4957
- <div [class]="b('tag')">{{ pl.tag }}</div>
4958
- }
4959
- <div [class]="b('header')">
4960
- <h2>{{ pl.name }}</h2>
4961
- <div [class]="b('price')">
4962
- <sup>{{ pl.currency ?? '$' }}</sup
4963
- >{{ pl.price }}
4964
- </div>
4965
- <p [class]="b('period')">{{ pl.period ?? ('pages.pricing.perMonth' | thlT) }}</p>
4966
- </div>
4967
- <ul [class]="b('features')">
4968
- @for (f of pl.features; track $index) {
4969
- <li [class]="b('feature')">
4970
- @if (f.icon) {
4971
- <thl-icon [name]="f.icon" />
4972
- }
4973
- {{ f.text }}
4974
- </li>
4954
+ static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "21.2.26", type: ThlPricingTableComponent, isStandalone: true, selector: "thl-pricing-table", inputs: { plans: { classPropertyName: "plans", publicName: "plans", isSignal: true, isRequired: true, transformFunction: null } }, outputs: { selected: "selected" }, host: { properties: { "class": "cfg.prefix() + \"-pricing-wrap\"" } }, ngImport: i0, template: `<div [class]="cfg.prefix() + '-pricing'" [style.--_n]="plans().length">
4955
+ @for (pl of plans(); track $index; let i = $index) {
4956
+ <div [class]="planCls(pl.featured)">
4957
+ @if (pl.tag) {
4958
+ <div [class]="b('tag')">{{ pl.tag }}</div>
4975
4959
  }
4976
- </ul>
4977
- <div [class]="b('action')">
4978
- <button
4979
- thl-button
4980
- [variant]="pl.ctaVariant ?? (pl.featured ? 'danger' : 'success')"
4981
- [size]="pl.featured ? 'lg' : undefined"
4982
- (click)="selected.emit(pl)"
4983
- >
4984
- {{ pl.cta ?? ('pages.pricing.signUp' | thlT) }}
4985
- </button>
4960
+ <div [class]="b('header')">
4961
+ <h2>{{ pl.name }}</h2>
4962
+ <div [class]="b('price')">
4963
+ <sup>{{ pl.currency ?? '$' }}</sup
4964
+ >{{ pl.price }}
4965
+ </div>
4966
+ <p [class]="b('period')">{{ pl.period ?? ('pages.pricing.perMonth' | thlT) }}</p>
4967
+ </div>
4968
+ <ul [class]="b('features')">
4969
+ @for (f of pl.features; track $index) {
4970
+ <li [class]="b('feature')">
4971
+ @if (f.icon) {
4972
+ <thl-icon [name]="f.icon" />
4973
+ }
4974
+ {{ f.text }}
4975
+ </li>
4976
+ }
4977
+ </ul>
4978
+ <div [class]="b('action')">
4979
+ <button
4980
+ thl-button
4981
+ [variant]="pl.ctaVariant ?? (pl.featured ? 'danger' : 'success')"
4982
+ [size]="pl.featured ? 'lg' : undefined"
4983
+ (click)="selected.emit(pl)"
4984
+ >
4985
+ {{ pl.cta ?? ('pages.pricing.signUp' | thlT) }}
4986
+ </button>
4987
+ </div>
4986
4988
  </div>
4987
- </div>
4988
- }`, isInline: true, dependencies: [{ kind: "component", type: ThlIconComponent, selector: "thl-icon", inputs: ["name", "size", "label", "strokeWidth"] }, { kind: "component", type: ThlButtonComponent, selector: "button[thl-button], a[thl-button]", inputs: ["variant", "size", "outline", "rounded", "circle", "block", "loading", "disabled", "noRipple", "icon", "iconRight", "label"] }, { kind: "pipe", type: ThlTranslatePipe, name: "thlT" }] }); }
4989
+ }
4990
+ </div>`, isInline: true, dependencies: [{ kind: "component", type: ThlIconComponent, selector: "thl-icon", inputs: ["name", "size", "label", "strokeWidth"] }, { kind: "component", type: ThlButtonComponent, selector: "button[thl-button], a[thl-button]", inputs: ["variant", "size", "outline", "rounded", "circle", "block", "loading", "disabled", "noRipple", "icon", "iconRight", "label"] }, { kind: "pipe", type: ThlTranslatePipe, name: "thlT" }] }); }
4989
4991
  }
4990
4992
  i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.26", ngImport: i0, type: ThlPricingTableComponent, decorators: [{
4991
4993
  type: Component,
@@ -4993,42 +4995,44 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.26", ngImpo
4993
4995
  ...base$1,
4994
4996
  selector: 'thl-pricing-table',
4995
4997
  imports: [ThlIconComponent, ThlButtonComponent, ThlTranslatePipe],
4996
- host: { '[class]': 'cfg.prefix() + "-pricing"' },
4997
- template: `@for (pl of plans(); track $index; let i = $index) {
4998
- <div [class]="planCls(pl.featured)">
4999
- @if (pl.tag) {
5000
- <div [class]="b('tag')">{{ pl.tag }}</div>
5001
- }
5002
- <div [class]="b('header')">
5003
- <h2>{{ pl.name }}</h2>
5004
- <div [class]="b('price')">
5005
- <sup>{{ pl.currency ?? '$' }}</sup
5006
- >{{ pl.price }}
5007
- </div>
5008
- <p [class]="b('period')">{{ pl.period ?? ('pages.pricing.perMonth' | thlT) }}</p>
5009
- </div>
5010
- <ul [class]="b('features')">
5011
- @for (f of pl.features; track $index) {
5012
- <li [class]="b('feature')">
5013
- @if (f.icon) {
5014
- <thl-icon [name]="f.icon" />
5015
- }
5016
- {{ f.text }}
5017
- </li>
4998
+ host: { '[class]': 'cfg.prefix() + "-pricing-wrap"' },
4999
+ template: `<div [class]="cfg.prefix() + '-pricing'" [style.--_n]="plans().length">
5000
+ @for (pl of plans(); track $index; let i = $index) {
5001
+ <div [class]="planCls(pl.featured)">
5002
+ @if (pl.tag) {
5003
+ <div [class]="b('tag')">{{ pl.tag }}</div>
5018
5004
  }
5019
- </ul>
5020
- <div [class]="b('action')">
5021
- <button
5022
- thl-button
5023
- [variant]="pl.ctaVariant ?? (pl.featured ? 'danger' : 'success')"
5024
- [size]="pl.featured ? 'lg' : undefined"
5025
- (click)="selected.emit(pl)"
5026
- >
5027
- {{ pl.cta ?? ('pages.pricing.signUp' | thlT) }}
5028
- </button>
5005
+ <div [class]="b('header')">
5006
+ <h2>{{ pl.name }}</h2>
5007
+ <div [class]="b('price')">
5008
+ <sup>{{ pl.currency ?? '$' }}</sup
5009
+ >{{ pl.price }}
5010
+ </div>
5011
+ <p [class]="b('period')">{{ pl.period ?? ('pages.pricing.perMonth' | thlT) }}</p>
5012
+ </div>
5013
+ <ul [class]="b('features')">
5014
+ @for (f of pl.features; track $index) {
5015
+ <li [class]="b('feature')">
5016
+ @if (f.icon) {
5017
+ <thl-icon [name]="f.icon" />
5018
+ }
5019
+ {{ f.text }}
5020
+ </li>
5021
+ }
5022
+ </ul>
5023
+ <div [class]="b('action')">
5024
+ <button
5025
+ thl-button
5026
+ [variant]="pl.ctaVariant ?? (pl.featured ? 'danger' : 'success')"
5027
+ [size]="pl.featured ? 'lg' : undefined"
5028
+ (click)="selected.emit(pl)"
5029
+ >
5030
+ {{ pl.cta ?? ('pages.pricing.signUp' | thlT) }}
5031
+ </button>
5032
+ </div>
5029
5033
  </div>
5030
- </div>
5031
- }`,
5034
+ }
5035
+ </div>`,
5032
5036
  }]
5033
5037
  }], propDecorators: { plans: [{ type: i0.Input, args: [{ isSignal: true, alias: "plans", required: true }] }], selected: [{ type: i0.Output, args: ["selected"] }] } });
5034
5038
  class ThlUserCardComponent {