@i-cell/ids-angular 0.1.5 → 0.1.6
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.
- package/fesm2022/i-cell-ids-angular-icon.mjs +1 -1
- package/fesm2022/i-cell-ids-angular-icon.mjs.map +1 -1
- package/fesm2022/i-cell-ids-angular-spinner.mjs +67 -0
- package/fesm2022/i-cell-ids-angular-spinner.mjs.map +1 -0
- package/icon/icon-defaults.d.ts +1 -1
- package/package.json +45 -41
- package/spinner/index.d.ts +5 -0
- package/spinner/public-api.d.ts +3 -0
- package/spinner/spinner-defaults.d.ts +11 -0
- package/spinner/spinner.component.d.ts +17 -0
- package/spinner/types/spinner-variant.type.d.ts +11 -0
|
@@ -65,7 +65,7 @@ class IdsIconComponent extends ComponentBaseWithDefaults {
|
|
|
65
65
|
return iconName;
|
|
66
66
|
}
|
|
67
67
|
const fontNameMappings = this._defaultConfig.fontNameMappings;
|
|
68
|
-
const mappedIconName = fontNameMappings[iconName];
|
|
68
|
+
const mappedIconName = fontNameMappings?.[iconName];
|
|
69
69
|
return mappedIconName ?? iconName;
|
|
70
70
|
});
|
|
71
71
|
this._iconSourceType = computed(() => (this.fontIcon() ? IdsIconSource.FONT : IdsIconSource.SVG));
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"i-cell-ids-angular-icon.mjs","sources":["../../../projects/widgets/icon/tokens/icon-parent.ts","../../../projects/widgets/icon/types/icon-source.type.ts","../../../projects/widgets/icon/types/icon-variant.type.ts","../../../projects/widgets/icon/icon-defaults.ts","../../../projects/widgets/icon/icon.component.ts","../../../projects/widgets/icon/i-cell-ids-angular-icon.ts"],"sourcesContent":["import { IdsIconVariantType } from '../types/icon-variant.type';\n\nimport { InjectionToken, Signal } from '@angular/core';\n\nexport abstract class IdsIconParent {\n public readonly embeddedIconVariant!: Signal<IdsIconVariantType>;\n};\n\nexport const IDS_ICON_PARENT = new InjectionToken<IdsIconParent>(\n 'IDS_ICON_PARENT',\n);\n","export const IdsIconSource = {\n SVG: 'svg',\n FONT: 'font',\n} as const;\n\nexport type IdsIconSourceType = (typeof IdsIconSource)[keyof typeof IdsIconSource];\n","export const IdsIconVariant = {\n PRIMARY: 'primary',\n SECONDARY: 'secondary',\n SURFACE: 'surface',\n BRAND: 'brand',\n LIGHT: 'light',\n DARK: 'dark',\n SUCCESS: 'success',\n WARNING: 'warning',\n ERROR: 'error',\n} as const;\n\nexport type IdsIconVariantType = (typeof IdsIconVariant)[keyof typeof IdsIconVariant];\n","import { IdsIconVariant, IdsIconVariantType } from './types/icon-variant.type';\n\nimport { InjectionToken } from '@angular/core';\nimport { IdsSize, IdsSizeCollection, IdsSizeCollectionType, IdsSizeType } from '@i-cell/ids-angular/core';\n\nexport interface IdsIconDefaultConfig {\n size?: IdsSizeType\n sizeCollection?: IdsSizeCollectionType\n variant?: IdsIconVariantType\n iconAssetsPath: string\n fontNameMappings: Record<string, string>\n}\n\nexport const IDS_ICON_DEFAULT_CONFIG = new InjectionToken<IdsIconDefaultConfig>(\n 'IDS_ICON_DEFAULT_CONFIG',\n {\n providedIn: 'root',\n factory: IDS_ICON_DEFAULT_CONFIG_FACTORY,\n },\n);\n\nexport function IDS_ICON_DEFAULT_CONFIG_FACTORY(): Required<IdsIconDefaultConfig> {\n return {\n size: IdsSize.COMPACT,\n sizeCollection: IdsSizeCollection.SMALL,\n variant: IdsIconVariant.SURFACE,\n iconAssetsPath: '',\n fontNameMappings: {},\n };\n}\n","import { IDS_ICON_DEFAULT_CONFIG, IDS_ICON_DEFAULT_CONFIG_FACTORY, IdsIconDefaultConfig } from './icon-defaults';\nimport { IDS_ICON_PARENT } from './tokens/icon-parent';\nimport { IdsIconSource } from './types/icon-source.type';\nimport { IdsIconVariantType } from './types/icon-variant.type';\n\nimport { DOCUMENT } from '@angular/common';\nimport { HttpClient } from '@angular/common/http';\nimport { ChangeDetectionStrategy, Component, computed, effect, ElementRef, inject, input, OnInit, SecurityContext, ViewEncapsulation } from '@angular/core';\nimport { takeUntilDestroyed } from '@angular/core/rxjs-interop';\nimport { DomSanitizer, SafeHtml } from '@angular/platform-browser';\nimport { coerceBooleanAttribute, coerceStringAttribute, ComponentBaseWithDefaults, IdsSizeCollectionType, IdsSizeType } from '@i-cell/ids-angular/core';\n\nconst defaultConfig = IDS_ICON_DEFAULT_CONFIG_FACTORY();\n\n@Component({\n selector: 'ids-icon',\n standalone: true,\n template: '',\n changeDetection: ChangeDetectionStrategy.OnPush,\n encapsulation: ViewEncapsulation.None,\n host: {\n '[attr.aria-hidden]': 'ariaHidden().toString()',\n '[attr.fontIcon]': 'this._safeFontIcon()',\n 'role': 'img',\n },\n})\nexport class IdsIconComponent extends ComponentBaseWithDefaults<IdsIconDefaultConfig> implements OnInit {\n protected override get _hostName(): string {\n return 'icon';\n }\n\n private readonly _parent = inject(IDS_ICON_PARENT, { optional: true });\n protected readonly _defaultConfig = this._getDefaultConfig(defaultConfig, IDS_ICON_DEFAULT_CONFIG);\n\n private readonly _elementRef = inject(ElementRef<HTMLElement>);\n private readonly _document = inject(DOCUMENT);\n private readonly _httpClient = inject(HttpClient);\n private readonly _sanitizer = inject(DomSanitizer);\n\n public size = input<IdsSizeType>(this._defaultConfig.size);\n public sizeCollection = input<IdsSizeCollectionType>(this._defaultConfig.sizeCollection);\n public variant = input<IdsIconVariantType>(this._defaultConfig.variant);\n public fontIcon = input<string | null, string>(null, { transform: coerceStringAttribute });\n public svgIconName = input<string | null, string>(null, { alias: 'svgIcon', transform: coerceStringAttribute });\n public ariaHidden = input<boolean, unknown>(true, { alias: 'aria-hidden', transform: coerceBooleanAttribute });\n\n protected _svgIcon: SVGElement | null = null;\n\n protected _safeFontIcon = computed(() => {\n const iconName = this.fontIcon();\n if (!iconName) {\n return iconName;\n }\n const fontNameMappings = this._defaultConfig.fontNameMappings;\n const mappedIconName = fontNameMappings[iconName];\n return mappedIconName ?? iconName;\n });\n\n protected _iconSourceType = computed(() => (this.fontIcon() ? IdsIconSource.FONT : IdsIconSource.SVG));\n\n private _parentOrSelfVariant = computed(() => this._parent?.embeddedIconVariant() ?? this.variant());\n protected _hostClasses = computed(() => this._getHostClasses([\n [\n `${this.sizeCollection()}collection`,\n this.size(),\n ],\n this._parentOrSelfVariant(),\n this._iconSourceType(),\n ]));\n\n private _sanitizeSvgIconEffect = effect(() => {\n const svgIconName = this.svgIconName();\n if (!svgIconName) {\n this._svgIcon = null;\n return;\n }\n\n const svgIconSafeUrl = this._sanitizer.sanitize(\n SecurityContext.RESOURCE_URL,\n this._sanitizer.bypassSecurityTrustResourceUrl(`${this._defaultConfig.iconAssetsPath}/${svgIconName}.svg`),\n );\n\n if (!svgIconSafeUrl) {\n this._svgIcon = null;\n return;\n }\n\n this._getSvgElementSource(svgIconSafeUrl);\n });\n\n public ngOnInit(): void {\n if (this.fontIcon() && this.svgIconName()) {\n throw this._createHostError('Font icon and svg icon can not be used together!');\n }\n }\n\n private _getSvgElementSource(url: string): void {\n this._httpClient\n .get(url, { responseType: 'text' })\n .pipe(\n takeUntilDestroyed(this._destroyRef),\n )\n .subscribe((svg) => {\n this._svgIcon = this._getSvgElement(this._sanitizer.bypassSecurityTrustHtml(svg));\n this._setSvgElement(this._svgIcon);\n });\n }\n\n private _setSvgElement(svg: SVGElement): void {\n this._clearSvgElement();\n\n this._elementRef.nativeElement.appendChild(svg);\n }\n\n private _clearSvgElement(): void {\n const layoutElement: HTMLElement = this._elementRef.nativeElement;\n let childCount = layoutElement.childNodes.length;\n\n while (childCount--) {\n const child = layoutElement.childNodes[childCount];\n\n if (child.nodeType !== 1 || child.nodeName.toLowerCase() === 'svg') {\n child.remove();\n }\n }\n }\n\n private _getSvgElement(safeHtml: SafeHtml): SVGElement {\n const div = this._document.createElement('div');\n div.innerHTML = safeHtml as unknown as string;\n const svg = div.querySelector('svg');\n\n if (!svg) {\n throw this._createHostError('Svg element creation failed!');\n }\n\n return svg;\n }\n}\n","/**\n * Generated bundle index. Do not edit.\n */\n\nexport * from './public-api';\n"],"names":[],"mappings":";;;;;;;;MAIsB,aAAa,CAAA;AAElC;AAAA;MAEY,eAAe,GAAG,IAAI,cAAc,CAC/C,iBAAiB;;ACTN,MAAA,aAAa,GAAG;AAC3B,IAAA,GAAG,EAAE,KAAK;AACV,IAAA,IAAI,EAAE,MAAM;;;ACFD,MAAA,cAAc,GAAG;AAC5B,IAAA,OAAO,EAAE,SAAS;AAClB,IAAA,SAAS,EAAE,WAAW;AACtB,IAAA,OAAO,EAAE,SAAS;AAClB,IAAA,KAAK,EAAE,OAAO;AACd,IAAA,KAAK,EAAE,OAAO;AACd,IAAA,IAAI,EAAE,MAAM;AACZ,IAAA,OAAO,EAAE,SAAS;AAClB,IAAA,OAAO,EAAE,SAAS;AAClB,IAAA,KAAK,EAAE,OAAO;;;MCIH,uBAAuB,GAAG,IAAI,cAAc,CACvD,yBAAyB,EACzB;AACE,IAAA,UAAU,EAAE,MAAM;AAClB,IAAA,OAAO,EAAE,+BAA+B;AACzC,CAAA;SAGa,+BAA+B,GAAA;IAC7C,OAAO;QACL,IAAI,EAAE,OAAO,CAAC,OAAO;QACrB,cAAc,EAAE,iBAAiB,CAAC,KAAK;QACvC,OAAO,EAAE,cAAc,CAAC,OAAO;AAC/B,QAAA,cAAc,EAAE,EAAE;AAClB,QAAA,gBAAgB,EAAE,EAAE;KACrB;AACH;;ACjBA,MAAM,aAAa,GAAG,+BAA+B,EAAE;AAcjD,MAAO,gBAAiB,SAAQ,yBAA+C,CAAA;AAZrF,IAAA,WAAA,GAAA;;QAiBmB,IAAO,CAAA,OAAA,GAAG,MAAM,CAAC,eAAe,EAAE,EAAE,QAAQ,EAAE,IAAI,EAAE,CAAC;QACnD,IAAc,CAAA,cAAA,GAAG,IAAI,CAAC,iBAAiB,CAAC,aAAa,EAAE,uBAAuB,CAAC;AAEjF,QAAA,IAAA,CAAA,WAAW,GAAG,MAAM,EAAC,UAAuB,EAAC;AAC7C,QAAA,IAAA,CAAA,SAAS,GAAG,MAAM,CAAC,QAAQ,CAAC;AAC5B,QAAA,IAAA,CAAA,WAAW,GAAG,MAAM,CAAC,UAAU,CAAC;AAChC,QAAA,IAAA,CAAA,UAAU,GAAG,MAAM,CAAC,YAAY,CAAC;QAE3C,IAAI,CAAA,IAAA,GAAG,KAAK,CAAc,IAAI,CAAC,cAAc,CAAC,IAAI,CAAC;QACnD,IAAc,CAAA,cAAA,GAAG,KAAK,CAAwB,IAAI,CAAC,cAAc,CAAC,cAAc,CAAC;QACjF,IAAO,CAAA,OAAA,GAAG,KAAK,CAAqB,IAAI,CAAC,cAAc,CAAC,OAAO,CAAC;QAChE,IAAQ,CAAA,QAAA,GAAG,KAAK,CAAwB,IAAI,EAAE,EAAE,SAAS,EAAE,qBAAqB,EAAE,CAAC;AACnF,QAAA,IAAA,CAAA,WAAW,GAAG,KAAK,CAAwB,IAAI,EAAE,EAAE,KAAK,EAAE,SAAS,EAAE,SAAS,EAAE,qBAAqB,EAAE,CAAC;AACxG,QAAA,IAAA,CAAA,UAAU,GAAG,KAAK,CAAmB,IAAI,EAAE,EAAE,KAAK,EAAE,aAAa,EAAE,SAAS,EAAE,sBAAsB,EAAE,CAAC;QAEpG,IAAQ,CAAA,QAAA,GAAsB,IAAI;AAElC,QAAA,IAAA,CAAA,aAAa,GAAG,QAAQ,CAAC,MAAK;AACtC,YAAA,MAAM,QAAQ,GAAG,IAAI,CAAC,QAAQ,EAAE;YAChC,IAAI,CAAC,QAAQ,EAAE;AACb,gBAAA,OAAO,QAAQ;;AAEjB,YAAA,MAAM,gBAAgB,GAAG,IAAI,CAAC,cAAc,CAAC,gBAAgB;AAC7D,YAAA,MAAM,cAAc,GAAG,gBAAgB,CAAC,QAAQ,CAAC;YACjD,OAAO,cAAc,IAAI,QAAQ;AACnC,SAAC,CAAC;QAEQ,IAAe,CAAA,eAAA,GAAG,QAAQ,CAAC,OAAO,IAAI,CAAC,QAAQ,EAAE,GAAG,aAAa,CAAC,IAAI,GAAG,aAAa,CAAC,GAAG,CAAC,CAAC;AAE9F,QAAA,IAAA,CAAA,oBAAoB,GAAG,QAAQ,CAAC,MAAM,IAAI,CAAC,OAAO,EAAE,mBAAmB,EAAE,IAAI,IAAI,CAAC,OAAO,EAAE,CAAC;QAC1F,IAAY,CAAA,YAAA,GAAG,QAAQ,CAAC,MAAM,IAAI,CAAC,eAAe,CAAC;AAC3D,YAAA;AACE,gBAAA,CAAA,EAAG,IAAI,CAAC,cAAc,EAAE,CAAY,UAAA,CAAA;gBACpC,IAAI,CAAC,IAAI,EAAE;AACZ,aAAA;YACD,IAAI,CAAC,oBAAoB,EAAE;YAC3B,IAAI,CAAC,eAAe,EAAE;AACvB,SAAA,CAAC,CAAC;AAEK,QAAA,IAAA,CAAA,sBAAsB,GAAG,MAAM,CAAC,MAAK;AAC3C,YAAA,MAAM,WAAW,GAAG,IAAI,CAAC,WAAW,EAAE;YACtC,IAAI,CAAC,WAAW,EAAE;AAChB,gBAAA,IAAI,CAAC,QAAQ,GAAG,IAAI;gBACpB;;AAGF,YAAA,MAAM,cAAc,GAAG,IAAI,CAAC,UAAU,CAAC,QAAQ,CAC7C,eAAe,CAAC,YAAY,EAC5B,IAAI,CAAC,UAAU,CAAC,8BAA8B,CAAC,CAAG,EAAA,IAAI,CAAC,cAAc,CAAC,cAAc,CAAI,CAAA,EAAA,WAAW,CAAM,IAAA,CAAA,CAAC,CAC3G;YAED,IAAI,CAAC,cAAc,EAAE;AACnB,gBAAA,IAAI,CAAC,QAAQ,GAAG,IAAI;gBACpB;;AAGF,YAAA,IAAI,CAAC,oBAAoB,CAAC,cAAc,CAAC;AAC3C,SAAC,CAAC;AAkDH;AA/GC,IAAA,IAAuB,SAAS,GAAA;AAC9B,QAAA,OAAO,MAAM;;IA8DR,QAAQ,GAAA;QACb,IAAI,IAAI,CAAC,QAAQ,EAAE,IAAI,IAAI,CAAC,WAAW,EAAE,EAAE;AACzC,YAAA,MAAM,IAAI,CAAC,gBAAgB,CAAC,kDAAkD,CAAC;;;AAI3E,IAAA,oBAAoB,CAAC,GAAW,EAAA;AACtC,QAAA,IAAI,CAAC;aACF,GAAG,CAAC,GAAG,EAAE,EAAE,YAAY,EAAE,MAAM,EAAE;AACjC,aAAA,IAAI,CACH,kBAAkB,CAAC,IAAI,CAAC,WAAW,CAAC;AAErC,aAAA,SAAS,CAAC,CAAC,GAAG,KAAI;AACjB,YAAA,IAAI,CAAC,QAAQ,GAAG,IAAI,CAAC,cAAc,CAAC,IAAI,CAAC,UAAU,CAAC,uBAAuB,CAAC,GAAG,CAAC,CAAC;AACjF,YAAA,IAAI,CAAC,cAAc,CAAC,IAAI,CAAC,QAAQ,CAAC;AACpC,SAAC,CAAC;;AAGE,IAAA,cAAc,CAAC,GAAe,EAAA;QACpC,IAAI,CAAC,gBAAgB,EAAE;QAEvB,IAAI,CAAC,WAAW,CAAC,aAAa,CAAC,WAAW,CAAC,GAAG,CAAC;;IAGzC,gBAAgB,GAAA;AACtB,QAAA,MAAM,aAAa,GAAgB,IAAI,CAAC,WAAW,CAAC,aAAa;AACjE,QAAA,IAAI,UAAU,GAAG,aAAa,CAAC,UAAU,CAAC,MAAM;QAEhD,OAAO,UAAU,EAAE,EAAE;YACnB,MAAM,KAAK,GAAG,aAAa,CAAC,UAAU,CAAC,UAAU,CAAC;AAElD,YAAA,IAAI,KAAK,CAAC,QAAQ,KAAK,CAAC,IAAI,KAAK,CAAC,QAAQ,CAAC,WAAW,EAAE,KAAK,KAAK,EAAE;gBAClE,KAAK,CAAC,MAAM,EAAE;;;;AAKZ,IAAA,cAAc,CAAC,QAAkB,EAAA;QACvC,MAAM,GAAG,GAAG,IAAI,CAAC,SAAS,CAAC,aAAa,CAAC,KAAK,CAAC;AAC/C,QAAA,GAAG,CAAC,SAAS,GAAG,QAA6B;QAC7C,MAAM,GAAG,GAAG,GAAG,CAAC,aAAa,CAAC,KAAK,CAAC;QAEpC,IAAI,CAAC,GAAG,EAAE;AACR,YAAA,MAAM,IAAI,CAAC,gBAAgB,CAAC,8BAA8B,CAAC;;AAG7D,QAAA,OAAO,GAAG;;8GA9GD,gBAAgB,EAAA,IAAA,EAAA,IAAA,EAAA,MAAA,EAAA,EAAA,CAAA,eAAA,CAAA,SAAA,EAAA,CAAA,CAAA;AAAhB,IAAA,SAAA,IAAA,CAAA,IAAA,GAAA,EAAA,CAAA,oBAAA,CAAA,EAAA,UAAA,EAAA,QAAA,EAAA,OAAA,EAAA,QAAA,EAAA,IAAA,EAAA,gBAAgB,6gCATjB,EAAE,EAAA,QAAA,EAAA,IAAA,EAAA,eAAA,EAAA,EAAA,CAAA,uBAAA,CAAA,MAAA,EAAA,aAAA,EAAA,EAAA,CAAA,iBAAA,CAAA,IAAA,EAAA,CAAA,CAAA;;2FASD,gBAAgB,EAAA,UAAA,EAAA,CAAA;kBAZ5B,SAAS;AAAC,YAAA,IAAA,EAAA,CAAA;AACT,oBAAA,QAAQ,EAAE,UAAU;AACpB,oBAAA,UAAU,EAAE,IAAI;AAChB,oBAAA,QAAQ,EAAE,EAAE;oBACZ,eAAe,EAAE,uBAAuB,CAAC,MAAM;oBAC/C,aAAa,EAAE,iBAAiB,CAAC,IAAI;AACrC,oBAAA,IAAI,EAAE;AACJ,wBAAA,oBAAoB,EAAE,yBAAyB;AAC/C,wBAAA,iBAAiB,EAAE,sBAAsB;AACzC,wBAAA,MAAM,EAAE,KAAK;AACd,qBAAA;AACF,iBAAA;;;ACzBD;;AAEG;;;;"}
|
|
1
|
+
{"version":3,"file":"i-cell-ids-angular-icon.mjs","sources":["../../../projects/widgets/icon/tokens/icon-parent.ts","../../../projects/widgets/icon/types/icon-source.type.ts","../../../projects/widgets/icon/types/icon-variant.type.ts","../../../projects/widgets/icon/icon-defaults.ts","../../../projects/widgets/icon/icon.component.ts","../../../projects/widgets/icon/i-cell-ids-angular-icon.ts"],"sourcesContent":["import { IdsIconVariantType } from '../types/icon-variant.type';\n\nimport { InjectionToken, Signal } from '@angular/core';\n\nexport abstract class IdsIconParent {\n public readonly embeddedIconVariant!: Signal<IdsIconVariantType>;\n};\n\nexport const IDS_ICON_PARENT = new InjectionToken<IdsIconParent>(\n 'IDS_ICON_PARENT',\n);\n","export const IdsIconSource = {\n SVG: 'svg',\n FONT: 'font',\n} as const;\n\nexport type IdsIconSourceType = (typeof IdsIconSource)[keyof typeof IdsIconSource];\n","export const IdsIconVariant = {\n PRIMARY: 'primary',\n SECONDARY: 'secondary',\n SURFACE: 'surface',\n BRAND: 'brand',\n LIGHT: 'light',\n DARK: 'dark',\n SUCCESS: 'success',\n WARNING: 'warning',\n ERROR: 'error',\n} as const;\n\nexport type IdsIconVariantType = (typeof IdsIconVariant)[keyof typeof IdsIconVariant];\n","import { IdsIconVariant, IdsIconVariantType } from './types/icon-variant.type';\n\nimport { InjectionToken } from '@angular/core';\nimport { IdsSize, IdsSizeCollection, IdsSizeCollectionType, IdsSizeType } from '@i-cell/ids-angular/core';\n\nexport interface IdsIconDefaultConfig {\n size?: IdsSizeType\n sizeCollection?: IdsSizeCollectionType\n variant?: IdsIconVariantType\n iconAssetsPath: string\n fontNameMappings?: Record<string, string>\n}\n\nexport const IDS_ICON_DEFAULT_CONFIG = new InjectionToken<IdsIconDefaultConfig>(\n 'IDS_ICON_DEFAULT_CONFIG',\n {\n providedIn: 'root',\n factory: IDS_ICON_DEFAULT_CONFIG_FACTORY,\n },\n);\n\nexport function IDS_ICON_DEFAULT_CONFIG_FACTORY(): Required<IdsIconDefaultConfig> {\n return {\n size: IdsSize.COMPACT,\n sizeCollection: IdsSizeCollection.SMALL,\n variant: IdsIconVariant.SURFACE,\n iconAssetsPath: '',\n fontNameMappings: {},\n };\n}\n","import { IDS_ICON_DEFAULT_CONFIG, IDS_ICON_DEFAULT_CONFIG_FACTORY, IdsIconDefaultConfig } from './icon-defaults';\nimport { IDS_ICON_PARENT } from './tokens/icon-parent';\nimport { IdsIconSource } from './types/icon-source.type';\nimport { IdsIconVariantType } from './types/icon-variant.type';\n\nimport { DOCUMENT } from '@angular/common';\nimport { HttpClient } from '@angular/common/http';\nimport { ChangeDetectionStrategy, Component, computed, effect, ElementRef, inject, input, OnInit, SecurityContext, ViewEncapsulation } from '@angular/core';\nimport { takeUntilDestroyed } from '@angular/core/rxjs-interop';\nimport { DomSanitizer, SafeHtml } from '@angular/platform-browser';\nimport { coerceBooleanAttribute, coerceStringAttribute, ComponentBaseWithDefaults, IdsSizeCollectionType, IdsSizeType } from '@i-cell/ids-angular/core';\n\nconst defaultConfig = IDS_ICON_DEFAULT_CONFIG_FACTORY();\n\n@Component({\n selector: 'ids-icon',\n standalone: true,\n template: '',\n changeDetection: ChangeDetectionStrategy.OnPush,\n encapsulation: ViewEncapsulation.None,\n host: {\n '[attr.aria-hidden]': 'ariaHidden().toString()',\n '[attr.fontIcon]': 'this._safeFontIcon()',\n 'role': 'img',\n },\n})\nexport class IdsIconComponent extends ComponentBaseWithDefaults<IdsIconDefaultConfig> implements OnInit {\n protected override get _hostName(): string {\n return 'icon';\n }\n\n private readonly _parent = inject(IDS_ICON_PARENT, { optional: true });\n protected readonly _defaultConfig = this._getDefaultConfig(defaultConfig, IDS_ICON_DEFAULT_CONFIG);\n\n private readonly _elementRef = inject(ElementRef<HTMLElement>);\n private readonly _document = inject(DOCUMENT);\n private readonly _httpClient = inject(HttpClient);\n private readonly _sanitizer = inject(DomSanitizer);\n\n public size = input<IdsSizeType>(this._defaultConfig.size);\n public sizeCollection = input<IdsSizeCollectionType>(this._defaultConfig.sizeCollection);\n public variant = input<IdsIconVariantType>(this._defaultConfig.variant);\n public fontIcon = input<string | null, string>(null, { transform: coerceStringAttribute });\n public svgIconName = input<string | null, string>(null, { alias: 'svgIcon', transform: coerceStringAttribute });\n public ariaHidden = input<boolean, unknown>(true, { alias: 'aria-hidden', transform: coerceBooleanAttribute });\n\n protected _svgIcon: SVGElement | null = null;\n\n protected _safeFontIcon = computed(() => {\n const iconName = this.fontIcon();\n if (!iconName) {\n return iconName;\n }\n const fontNameMappings = this._defaultConfig.fontNameMappings;\n const mappedIconName = fontNameMappings?.[iconName];\n return mappedIconName ?? iconName;\n });\n\n protected _iconSourceType = computed(() => (this.fontIcon() ? IdsIconSource.FONT : IdsIconSource.SVG));\n\n private _parentOrSelfVariant = computed(() => this._parent?.embeddedIconVariant() ?? this.variant());\n protected _hostClasses = computed(() => this._getHostClasses([\n [\n `${this.sizeCollection()}collection`,\n this.size(),\n ],\n this._parentOrSelfVariant(),\n this._iconSourceType(),\n ]));\n\n private _sanitizeSvgIconEffect = effect(() => {\n const svgIconName = this.svgIconName();\n if (!svgIconName) {\n this._svgIcon = null;\n return;\n }\n\n const svgIconSafeUrl = this._sanitizer.sanitize(\n SecurityContext.RESOURCE_URL,\n this._sanitizer.bypassSecurityTrustResourceUrl(`${this._defaultConfig.iconAssetsPath}/${svgIconName}.svg`),\n );\n\n if (!svgIconSafeUrl) {\n this._svgIcon = null;\n return;\n }\n\n this._getSvgElementSource(svgIconSafeUrl);\n });\n\n public ngOnInit(): void {\n if (this.fontIcon() && this.svgIconName()) {\n throw this._createHostError('Font icon and svg icon can not be used together!');\n }\n }\n\n private _getSvgElementSource(url: string): void {\n this._httpClient\n .get(url, { responseType: 'text' })\n .pipe(\n takeUntilDestroyed(this._destroyRef),\n )\n .subscribe((svg) => {\n this._svgIcon = this._getSvgElement(this._sanitizer.bypassSecurityTrustHtml(svg));\n this._setSvgElement(this._svgIcon);\n });\n }\n\n private _setSvgElement(svg: SVGElement): void {\n this._clearSvgElement();\n\n this._elementRef.nativeElement.appendChild(svg);\n }\n\n private _clearSvgElement(): void {\n const layoutElement: HTMLElement = this._elementRef.nativeElement;\n let childCount = layoutElement.childNodes.length;\n\n while (childCount--) {\n const child = layoutElement.childNodes[childCount];\n\n if (child.nodeType !== 1 || child.nodeName.toLowerCase() === 'svg') {\n child.remove();\n }\n }\n }\n\n private _getSvgElement(safeHtml: SafeHtml): SVGElement {\n const div = this._document.createElement('div');\n div.innerHTML = safeHtml as unknown as string;\n const svg = div.querySelector('svg');\n\n if (!svg) {\n throw this._createHostError('Svg element creation failed!');\n }\n\n return svg;\n }\n}\n","/**\n * Generated bundle index. Do not edit.\n */\n\nexport * from './public-api';\n"],"names":[],"mappings":"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"}
|
|
@@ -0,0 +1,67 @@
|
|
|
1
|
+
import * as i0 from '@angular/core';
|
|
2
|
+
import { InjectionToken, input, computed, Component } from '@angular/core';
|
|
3
|
+
import { IdsSize, IdsSizeCollection, ComponentBaseWithDefaults } from '@i-cell/ids-angular/core';
|
|
4
|
+
|
|
5
|
+
const IdsSpinnerVariant = {
|
|
6
|
+
SURFACE: 'surface',
|
|
7
|
+
PRIMARY: 'primary',
|
|
8
|
+
SECONDARY: 'secondary',
|
|
9
|
+
BRAND: 'brand',
|
|
10
|
+
LIGHT: 'light',
|
|
11
|
+
ERROR: 'error',
|
|
12
|
+
SUCCESS: 'success',
|
|
13
|
+
WARNING: 'warning',
|
|
14
|
+
};
|
|
15
|
+
|
|
16
|
+
const IDS_SPINNER_DEFAULT_CONFIG = new InjectionToken('IDS_ICON_DEFAULT_CONFIG', {
|
|
17
|
+
providedIn: 'root',
|
|
18
|
+
factory: IDS_SPINNER_DEFAULT_CONFIG_FACTORY,
|
|
19
|
+
});
|
|
20
|
+
function IDS_SPINNER_DEFAULT_CONFIG_FACTORY() {
|
|
21
|
+
return {
|
|
22
|
+
size: IdsSize.COMPACT,
|
|
23
|
+
sizeCollection: IdsSizeCollection.SMALL,
|
|
24
|
+
variant: IdsSpinnerVariant.SURFACE,
|
|
25
|
+
isTrack: true,
|
|
26
|
+
};
|
|
27
|
+
}
|
|
28
|
+
|
|
29
|
+
const defaultConfig = IDS_SPINNER_DEFAULT_CONFIG_FACTORY();
|
|
30
|
+
class IdsSpinnerComponent extends ComponentBaseWithDefaults {
|
|
31
|
+
get _hostName() {
|
|
32
|
+
return 'spinner';
|
|
33
|
+
}
|
|
34
|
+
constructor() {
|
|
35
|
+
super();
|
|
36
|
+
this._defaultConfig = this._getDefaultConfig(defaultConfig, IDS_SPINNER_DEFAULT_CONFIG);
|
|
37
|
+
this.size = input(this._defaultConfig.size);
|
|
38
|
+
this.sizeCollection = input(this._defaultConfig.sizeCollection);
|
|
39
|
+
this.variant = input(this._defaultConfig.variant);
|
|
40
|
+
this.isTrack = input(this._defaultConfig.isTrack);
|
|
41
|
+
this.ariaLabel = input('', { alias: 'aria-label' });
|
|
42
|
+
this._hostClasses = computed(() => this._getHostClasses([
|
|
43
|
+
this.variant(),
|
|
44
|
+
[
|
|
45
|
+
`${this.sizeCollection()}collection`,
|
|
46
|
+
this.size(),
|
|
47
|
+
],
|
|
48
|
+
]));
|
|
49
|
+
}
|
|
50
|
+
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "19.1.2", ngImport: i0, type: IdsSpinnerComponent, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
|
|
51
|
+
static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "19.1.2", type: IdsSpinnerComponent, isStandalone: true, selector: "ids-spinner", inputs: { size: { classPropertyName: "size", publicName: "size", isSignal: true, isRequired: false, transformFunction: null }, sizeCollection: { classPropertyName: "sizeCollection", publicName: "sizeCollection", isSignal: true, isRequired: false, transformFunction: null }, variant: { classPropertyName: "variant", publicName: "variant", isSignal: true, isRequired: false, transformFunction: null }, isTrack: { classPropertyName: "isTrack", publicName: "isTrack", isSignal: true, isRequired: false, transformFunction: null }, ariaLabel: { classPropertyName: "ariaLabel", publicName: "aria-label", isSignal: true, isRequired: false, transformFunction: null } }, host: { properties: { "attr.aria-busy": "true", "attr.aria-live": "'polite'", "attr.aria-label": "this.ariaLabel()" } }, usesInheritance: true, ngImport: i0, template: "<svg class=\"rotate-center ids-spinner__body\" xmlns=\"http://www.w3.org/2000/svg\" viewBox=\"0 0 48 48\" fill=\"none\">\n @if (isTrack()) {\n <path class=\"ids-spinner__track\" d=\"M48 23.9941C48 37.249 37.2548 47.9941 24 47.9941C10.7452 47.9941 0 37.249 0 23.9941C0 10.7393 10.7452 -0.00585938 24 -0.00585938C37.2548 -0.00585938 48 10.7393 48 23.9941ZM4.8 23.9941C4.8 34.598 13.3961 43.1941 24 43.1941C34.6039 43.1941 43.2 34.598 43.2 23.9941C43.2 13.3903 34.6039 4.79414 24 4.79414C13.3961 4.79414 4.8 13.3903 4.8 23.9941Z\" fill=\"#E2E8F0\"/>\n }\n <path class=\"ids-spinner__active-indicator\" d=\"M24 2.4C24 1.07452 25.0772 -0.0124557 26.3961 0.119833C31.8813 0.670028 37.038 3.0969 40.9706 7.02943C44.9031 10.962 47.33 16.1187 47.8802 21.6039C48.0125 22.9228 46.9255 24 45.6 24C44.2745 24 43.2155 22.9213 43.0503 21.6062C42.5214 17.3966 40.6082 13.4553 37.5765 10.4235C34.5447 7.39176 30.6034 5.47861 26.3938 4.94974C25.0787 4.78451 24 3.72548 24 2.4Z\" fill=\"#64748B\"/>\n</svg>\n" }); }
|
|
52
|
+
}
|
|
53
|
+
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.1.2", ngImport: i0, type: IdsSpinnerComponent, decorators: [{
|
|
54
|
+
type: Component,
|
|
55
|
+
args: [{ selector: 'ids-spinner', host: {
|
|
56
|
+
'[attr.aria-busy]': 'true',
|
|
57
|
+
'[attr.aria-live]': '\'polite\'',
|
|
58
|
+
'[attr.aria-label]': 'this.ariaLabel()',
|
|
59
|
+
}, template: "<svg class=\"rotate-center ids-spinner__body\" xmlns=\"http://www.w3.org/2000/svg\" viewBox=\"0 0 48 48\" fill=\"none\">\n @if (isTrack()) {\n <path class=\"ids-spinner__track\" d=\"M48 23.9941C48 37.249 37.2548 47.9941 24 47.9941C10.7452 47.9941 0 37.249 0 23.9941C0 10.7393 10.7452 -0.00585938 24 -0.00585938C37.2548 -0.00585938 48 10.7393 48 23.9941ZM4.8 23.9941C4.8 34.598 13.3961 43.1941 24 43.1941C34.6039 43.1941 43.2 34.598 43.2 23.9941C43.2 13.3903 34.6039 4.79414 24 4.79414C13.3961 4.79414 4.8 13.3903 4.8 23.9941Z\" fill=\"#E2E8F0\"/>\n }\n <path class=\"ids-spinner__active-indicator\" d=\"M24 2.4C24 1.07452 25.0772 -0.0124557 26.3961 0.119833C31.8813 0.670028 37.038 3.0969 40.9706 7.02943C44.9031 10.962 47.33 16.1187 47.8802 21.6039C48.0125 22.9228 46.9255 24 45.6 24C44.2745 24 43.2155 22.9213 43.0503 21.6062C42.5214 17.3966 40.6082 13.4553 37.5765 10.4235C34.5447 7.39176 30.6034 5.47861 26.3938 4.94974C25.0787 4.78451 24 3.72548 24 2.4Z\" fill=\"#64748B\"/>\n</svg>\n" }]
|
|
60
|
+
}], ctorParameters: () => [] });
|
|
61
|
+
|
|
62
|
+
/**
|
|
63
|
+
* Generated bundle index. Do not edit.
|
|
64
|
+
*/
|
|
65
|
+
|
|
66
|
+
export { IDS_SPINNER_DEFAULT_CONFIG, IDS_SPINNER_DEFAULT_CONFIG_FACTORY, IdsSpinnerComponent, IdsSpinnerVariant };
|
|
67
|
+
//# sourceMappingURL=i-cell-ids-angular-spinner.mjs.map
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"file":"i-cell-ids-angular-spinner.mjs","sources":["../../../projects/widgets/spinner/types/spinner-variant.type.ts","../../../projects/widgets/spinner/spinner-defaults.ts","../../../projects/widgets/spinner/spinner.component.ts","../../../projects/widgets/spinner/spinner.component.html","../../../projects/widgets/spinner/i-cell-ids-angular-spinner.ts"],"sourcesContent":["export const IdsSpinnerVariant = {\n SURFACE: 'surface',\n PRIMARY: 'primary',\n SECONDARY: 'secondary',\n BRAND: 'brand',\n LIGHT: 'light',\n ERROR: 'error',\n SUCCESS: 'success',\n WARNING: 'warning',\n} as const;\n\nexport type IdsSpinnerVariantType = (typeof IdsSpinnerVariant)[keyof typeof IdsSpinnerVariant];\n","import { IdsSpinnerVariant, IdsSpinnerVariantType } from './types/spinner-variant.type';\n\nimport { InjectionToken } from '@angular/core';\nimport { IdsSize, IdsSizeCollection, IdsSizeCollectionType, IdsSizeType } from '@i-cell/ids-angular/core';\n\nexport interface IdsSpinnerDefaultConfig {\n size?: IdsSizeType\n sizeCollection?: IdsSizeCollectionType\n variant?: IdsSpinnerVariantType\n isTrack: boolean\n}\n\nexport const IDS_SPINNER_DEFAULT_CONFIG = new InjectionToken<IdsSpinnerDefaultConfig>(\n 'IDS_ICON_DEFAULT_CONFIG',\n {\n providedIn: 'root',\n factory: IDS_SPINNER_DEFAULT_CONFIG_FACTORY,\n },\n);\n\nexport function IDS_SPINNER_DEFAULT_CONFIG_FACTORY(): Required<IdsSpinnerDefaultConfig> {\n return {\n size: IdsSize.COMPACT,\n sizeCollection: IdsSizeCollection.SMALL,\n variant: IdsSpinnerVariant.SURFACE,\n isTrack: true,\n };\n}\n","import {\n IDS_SPINNER_DEFAULT_CONFIG,\n IDS_SPINNER_DEFAULT_CONFIG_FACTORY,\n IdsSpinnerDefaultConfig,\n} from './spinner-defaults';\nimport { IdsSpinnerVariantType } from './types/spinner-variant.type';\n\nimport { Component, computed, input } from '@angular/core';\nimport { ComponentBaseWithDefaults } from '@i-cell/ids-angular/core';\n\nconst defaultConfig = IDS_SPINNER_DEFAULT_CONFIG_FACTORY();\n\n@Component({\n selector: 'ids-spinner',\n templateUrl: './spinner.component.html',\n host: {\n '[attr.aria-busy]': 'true',\n '[attr.aria-live]': '\\'polite\\'',\n '[attr.aria-label]': 'this.ariaLabel()',\n },\n})\nexport class IdsSpinnerComponent extends ComponentBaseWithDefaults<IdsSpinnerDefaultConfig> {\n protected override get _hostName(): string {\n return 'spinner';\n }\n\n protected readonly _defaultConfig = this._getDefaultConfig(defaultConfig, IDS_SPINNER_DEFAULT_CONFIG);\n\n public size = input<string>(this._defaultConfig.size);\n public sizeCollection = input<string>(this._defaultConfig.sizeCollection);\n public variant = input<IdsSpinnerVariantType>(this._defaultConfig.variant);\n public isTrack = input<boolean>(this._defaultConfig.isTrack);\n public ariaLabel = input<string>('', { alias: 'aria-label' });\n\n constructor() {\n super();\n }\n\n protected _hostClasses = computed(() => this._getHostClasses([\n this.variant(),\n [\n `${this.sizeCollection()}collection`,\n this.size(),\n ],\n ]));\n\n}\n","<svg class=\"rotate-center ids-spinner__body\" xmlns=\"http://www.w3.org/2000/svg\" viewBox=\"0 0 48 48\" fill=\"none\">\n @if (isTrack()) {\n <path class=\"ids-spinner__track\" d=\"M48 23.9941C48 37.249 37.2548 47.9941 24 47.9941C10.7452 47.9941 0 37.249 0 23.9941C0 10.7393 10.7452 -0.00585938 24 -0.00585938C37.2548 -0.00585938 48 10.7393 48 23.9941ZM4.8 23.9941C4.8 34.598 13.3961 43.1941 24 43.1941C34.6039 43.1941 43.2 34.598 43.2 23.9941C43.2 13.3903 34.6039 4.79414 24 4.79414C13.3961 4.79414 4.8 13.3903 4.8 23.9941Z\" fill=\"#E2E8F0\"/>\n }\n <path class=\"ids-spinner__active-indicator\" d=\"M24 2.4C24 1.07452 25.0772 -0.0124557 26.3961 0.119833C31.8813 0.670028 37.038 3.0969 40.9706 7.02943C44.9031 10.962 47.33 16.1187 47.8802 21.6039C48.0125 22.9228 46.9255 24 45.6 24C44.2745 24 43.2155 22.9213 43.0503 21.6062C42.5214 17.3966 40.6082 13.4553 37.5765 10.4235C34.5447 7.39176 30.6034 5.47861 26.3938 4.94974C25.0787 4.78451 24 3.72548 24 2.4Z\" fill=\"#64748B\"/>\n</svg>\n","/**\n * Generated bundle index. Do not edit.\n */\n\nexport * from './public-api';\n"],"names":[],"mappings":";;;;AAAa,MAAA,iBAAiB,GAAG;AAC/B,IAAA,OAAO,EAAE,SAAS;AAClB,IAAA,OAAO,EAAE,SAAS;AAClB,IAAA,SAAS,EAAE,WAAW;AACtB,IAAA,KAAK,EAAE,OAAO;AACd,IAAA,KAAK,EAAE,OAAO;AACd,IAAA,KAAK,EAAE,OAAO;AACd,IAAA,OAAO,EAAE,SAAS;AAClB,IAAA,OAAO,EAAE,SAAS;;;MCIP,0BAA0B,GAAG,IAAI,cAAc,CAC1D,yBAAyB,EACzB;AACE,IAAA,UAAU,EAAE,MAAM;AAClB,IAAA,OAAO,EAAE,kCAAkC;AAC5C,CAAA;SAGa,kCAAkC,GAAA;IAChD,OAAO;QACL,IAAI,EAAE,OAAO,CAAC,OAAO;QACrB,cAAc,EAAE,iBAAiB,CAAC,KAAK;QACvC,OAAO,EAAE,iBAAiB,CAAC,OAAO;AAClC,QAAA,OAAO,EAAE,IAAI;KACd;AACH;;ACjBA,MAAM,aAAa,GAAG,kCAAkC,EAAE;AAWpD,MAAO,mBAAoB,SAAQ,yBAAkD,CAAA;AACzF,IAAA,IAAuB,SAAS,GAAA;AAC9B,QAAA,OAAO,SAAS;;AAWlB,IAAA,WAAA,GAAA;AACE,QAAA,KAAK,EAAE;QATU,IAAc,CAAA,cAAA,GAAG,IAAI,CAAC,iBAAiB,CAAC,aAAa,EAAE,0BAA0B,CAAC;QAE9F,IAAI,CAAA,IAAA,GAAG,KAAK,CAAS,IAAI,CAAC,cAAc,CAAC,IAAI,CAAC;QAC9C,IAAc,CAAA,cAAA,GAAG,KAAK,CAAS,IAAI,CAAC,cAAc,CAAC,cAAc,CAAC;QAClE,IAAO,CAAA,OAAA,GAAG,KAAK,CAAwB,IAAI,CAAC,cAAc,CAAC,OAAO,CAAC;QACnE,IAAO,CAAA,OAAA,GAAG,KAAK,CAAU,IAAI,CAAC,cAAc,CAAC,OAAO,CAAC;QACrD,IAAS,CAAA,SAAA,GAAG,KAAK,CAAS,EAAE,EAAE,EAAE,KAAK,EAAE,YAAY,EAAE,CAAC;QAMnD,IAAY,CAAA,YAAA,GAAG,QAAQ,CAAC,MAAM,IAAI,CAAC,eAAe,CAAC;YAC3D,IAAI,CAAC,OAAO,EAAE;AACd,YAAA;AACE,gBAAA,CAAA,EAAG,IAAI,CAAC,cAAc,EAAE,CAAY,UAAA,CAAA;gBACpC,IAAI,CAAC,IAAI,EAAE;AACZ,aAAA;AACF,SAAA,CAAC,CAAC;;8GAvBQ,mBAAmB,EAAA,IAAA,EAAA,EAAA,EAAA,MAAA,EAAA,EAAA,CAAA,eAAA,CAAA,SAAA,EAAA,CAAA,CAAA;AAAnB,IAAA,SAAA,IAAA,CAAA,IAAA,GAAA,EAAA,CAAA,oBAAA,CAAA,EAAA,UAAA,EAAA,QAAA,EAAA,OAAA,EAAA,QAAA,EAAA,IAAA,EAAA,mBAAmB,42BCrBhC,q+BAMA,EAAA,CAAA,CAAA;;2FDea,mBAAmB,EAAA,UAAA,EAAA,CAAA;kBAT/B,SAAS;AACE,YAAA,IAAA,EAAA,CAAA,EAAA,QAAA,EAAA,aAAa,EAEjB,IAAA,EAAA;AACJ,wBAAA,kBAAkB,EAAE,MAAM;AAC1B,wBAAA,kBAAkB,EAAE,YAAY;AAChC,wBAAA,mBAAmB,EAAE,kBAAkB;AACxC,qBAAA,EAAA,QAAA,EAAA,q+BAAA,EAAA;;;AEnBH;;AAEG;;;;"}
|
package/icon/icon-defaults.d.ts
CHANGED
|
@@ -6,7 +6,7 @@ export interface IdsIconDefaultConfig {
|
|
|
6
6
|
sizeCollection?: IdsSizeCollectionType;
|
|
7
7
|
variant?: IdsIconVariantType;
|
|
8
8
|
iconAssetsPath: string;
|
|
9
|
-
fontNameMappings
|
|
9
|
+
fontNameMappings?: Record<string, string>;
|
|
10
10
|
}
|
|
11
11
|
export declare const IDS_ICON_DEFAULT_CONFIG: InjectionToken<IdsIconDefaultConfig>;
|
|
12
12
|
export declare function IDS_ICON_DEFAULT_CONFIG_FACTORY(): Required<IdsIconDefaultConfig>;
|
package/package.json
CHANGED
|
@@ -1,6 +1,6 @@
|
|
|
1
1
|
{
|
|
2
2
|
"name": "@i-cell/ids-angular",
|
|
3
|
-
"version": "0.1.
|
|
3
|
+
"version": "0.1.6",
|
|
4
4
|
"private": false,
|
|
5
5
|
"description": "i-Cell Design System UI Kit components for Angular",
|
|
6
6
|
"publishConfig": {
|
|
@@ -47,34 +47,26 @@
|
|
|
47
47
|
"types": "./index.d.ts",
|
|
48
48
|
"default": "./fesm2022/i-cell-ids-angular.mjs"
|
|
49
49
|
},
|
|
50
|
-
"./card": {
|
|
51
|
-
"types": "./card/index.d.ts",
|
|
52
|
-
"default": "./fesm2022/i-cell-ids-angular-card.mjs"
|
|
53
|
-
},
|
|
54
50
|
"./accordion": {
|
|
55
51
|
"types": "./accordion/index.d.ts",
|
|
56
52
|
"default": "./fesm2022/i-cell-ids-angular-accordion.mjs"
|
|
57
53
|
},
|
|
58
|
-
"./button": {
|
|
59
|
-
"types": "./button/index.d.ts",
|
|
60
|
-
"default": "./fesm2022/i-cell-ids-angular-button.mjs"
|
|
61
|
-
},
|
|
62
54
|
"./avatar": {
|
|
63
55
|
"types": "./avatar/index.d.ts",
|
|
64
56
|
"default": "./fesm2022/i-cell-ids-angular-avatar.mjs"
|
|
65
57
|
},
|
|
58
|
+
"./card": {
|
|
59
|
+
"types": "./card/index.d.ts",
|
|
60
|
+
"default": "./fesm2022/i-cell-ids-angular-card.mjs"
|
|
61
|
+
},
|
|
62
|
+
"./button": {
|
|
63
|
+
"types": "./button/index.d.ts",
|
|
64
|
+
"default": "./fesm2022/i-cell-ids-angular-button.mjs"
|
|
65
|
+
},
|
|
66
66
|
"./core": {
|
|
67
67
|
"types": "./core/index.d.ts",
|
|
68
68
|
"default": "./fesm2022/i-cell-ids-angular-core.mjs"
|
|
69
69
|
},
|
|
70
|
-
"./dialog": {
|
|
71
|
-
"types": "./dialog/index.d.ts",
|
|
72
|
-
"default": "./fesm2022/i-cell-ids-angular-dialog.mjs"
|
|
73
|
-
},
|
|
74
|
-
"./divider": {
|
|
75
|
-
"types": "./divider/index.d.ts",
|
|
76
|
-
"default": "./fesm2022/i-cell-ids-angular-divider.mjs"
|
|
77
|
-
},
|
|
78
70
|
"./chip": {
|
|
79
71
|
"types": "./chip/index.d.ts",
|
|
80
72
|
"default": "./fesm2022/i-cell-ids-angular-chip.mjs"
|
|
@@ -83,6 +75,14 @@
|
|
|
83
75
|
"types": "./checkbox/index.d.ts",
|
|
84
76
|
"default": "./fesm2022/i-cell-ids-angular-checkbox.mjs"
|
|
85
77
|
},
|
|
78
|
+
"./dialog": {
|
|
79
|
+
"types": "./dialog/index.d.ts",
|
|
80
|
+
"default": "./fesm2022/i-cell-ids-angular-dialog.mjs"
|
|
81
|
+
},
|
|
82
|
+
"./divider": {
|
|
83
|
+
"types": "./divider/index.d.ts",
|
|
84
|
+
"default": "./fesm2022/i-cell-ids-angular-divider.mjs"
|
|
85
|
+
},
|
|
86
86
|
"./forms": {
|
|
87
87
|
"types": "./forms/index.d.ts",
|
|
88
88
|
"default": "./fesm2022/i-cell-ids-angular-forms.mjs"
|
|
@@ -95,61 +95,65 @@
|
|
|
95
95
|
"types": "./icon-button/index.d.ts",
|
|
96
96
|
"default": "./fesm2022/i-cell-ids-angular-icon-button.mjs"
|
|
97
97
|
},
|
|
98
|
+
"./menu": {
|
|
99
|
+
"types": "./menu/index.d.ts",
|
|
100
|
+
"default": "./fesm2022/i-cell-ids-angular-menu.mjs"
|
|
101
|
+
},
|
|
98
102
|
"./notification": {
|
|
99
103
|
"types": "./notification/index.d.ts",
|
|
100
104
|
"default": "./fesm2022/i-cell-ids-angular-notification.mjs"
|
|
101
105
|
},
|
|
102
|
-
"./
|
|
103
|
-
"types": "./
|
|
104
|
-
"default": "./fesm2022/i-cell-ids-angular-
|
|
106
|
+
"./overlay-panel": {
|
|
107
|
+
"types": "./overlay-panel/index.d.ts",
|
|
108
|
+
"default": "./fesm2022/i-cell-ids-angular-overlay-panel.mjs"
|
|
105
109
|
},
|
|
106
110
|
"./paginator": {
|
|
107
111
|
"types": "./paginator/index.d.ts",
|
|
108
112
|
"default": "./fesm2022/i-cell-ids-angular-paginator.mjs"
|
|
109
113
|
},
|
|
110
|
-
"./segmented-control": {
|
|
111
|
-
"types": "./segmented-control/index.d.ts",
|
|
112
|
-
"default": "./fesm2022/i-cell-ids-angular-segmented-control.mjs"
|
|
113
|
-
},
|
|
114
114
|
"./radio": {
|
|
115
115
|
"types": "./radio/index.d.ts",
|
|
116
116
|
"default": "./fesm2022/i-cell-ids-angular-radio.mjs"
|
|
117
117
|
},
|
|
118
|
-
"./
|
|
119
|
-
"types": "./
|
|
120
|
-
"default": "./fesm2022/i-cell-ids-angular-
|
|
121
|
-
},
|
|
122
|
-
"./select": {
|
|
123
|
-
"types": "./select/index.d.ts",
|
|
124
|
-
"default": "./fesm2022/i-cell-ids-angular-select.mjs"
|
|
118
|
+
"./segmented-control": {
|
|
119
|
+
"types": "./segmented-control/index.d.ts",
|
|
120
|
+
"default": "./fesm2022/i-cell-ids-angular-segmented-control.mjs"
|
|
125
121
|
},
|
|
126
122
|
"./segmented-control-toggle": {
|
|
127
123
|
"types": "./segmented-control-toggle/index.d.ts",
|
|
128
124
|
"default": "./fesm2022/i-cell-ids-angular-segmented-control-toggle.mjs"
|
|
129
125
|
},
|
|
130
|
-
"./
|
|
131
|
-
"types": "./
|
|
132
|
-
"default": "./fesm2022/i-cell-ids-angular-
|
|
126
|
+
"./select": {
|
|
127
|
+
"types": "./select/index.d.ts",
|
|
128
|
+
"default": "./fesm2022/i-cell-ids-angular-select.mjs"
|
|
133
129
|
},
|
|
134
130
|
"./snackbar": {
|
|
135
131
|
"types": "./snackbar/index.d.ts",
|
|
136
132
|
"default": "./fesm2022/i-cell-ids-angular-snackbar.mjs"
|
|
137
133
|
},
|
|
134
|
+
"./spinner": {
|
|
135
|
+
"types": "./spinner/index.d.ts",
|
|
136
|
+
"default": "./fesm2022/i-cell-ids-angular-spinner.mjs"
|
|
137
|
+
},
|
|
138
|
+
"./switch": {
|
|
139
|
+
"types": "./switch/index.d.ts",
|
|
140
|
+
"default": "./fesm2022/i-cell-ids-angular-switch.mjs"
|
|
141
|
+
},
|
|
142
|
+
"./tab": {
|
|
143
|
+
"types": "./tab/index.d.ts",
|
|
144
|
+
"default": "./fesm2022/i-cell-ids-angular-tab.mjs"
|
|
145
|
+
},
|
|
138
146
|
"./table": {
|
|
139
147
|
"types": "./table/index.d.ts",
|
|
140
148
|
"default": "./fesm2022/i-cell-ids-angular-table.mjs"
|
|
141
149
|
},
|
|
142
|
-
"./tooltip": {
|
|
143
|
-
"types": "./tooltip/index.d.ts",
|
|
144
|
-
"default": "./fesm2022/i-cell-ids-angular-tooltip.mjs"
|
|
145
|
-
},
|
|
146
150
|
"./tag": {
|
|
147
151
|
"types": "./tag/index.d.ts",
|
|
148
152
|
"default": "./fesm2022/i-cell-ids-angular-tag.mjs"
|
|
149
153
|
},
|
|
150
|
-
"./
|
|
151
|
-
"types": "./
|
|
152
|
-
"default": "./fesm2022/i-cell-ids-angular-
|
|
154
|
+
"./tooltip": {
|
|
155
|
+
"types": "./tooltip/index.d.ts",
|
|
156
|
+
"default": "./fesm2022/i-cell-ids-angular-tooltip.mjs"
|
|
153
157
|
}
|
|
154
158
|
}
|
|
155
159
|
}
|
|
@@ -0,0 +1,11 @@
|
|
|
1
|
+
import { IdsSpinnerVariantType } from './types/spinner-variant.type';
|
|
2
|
+
import { InjectionToken } from '@angular/core';
|
|
3
|
+
import { IdsSizeCollectionType, IdsSizeType } from '@i-cell/ids-angular/core';
|
|
4
|
+
export interface IdsSpinnerDefaultConfig {
|
|
5
|
+
size?: IdsSizeType;
|
|
6
|
+
sizeCollection?: IdsSizeCollectionType;
|
|
7
|
+
variant?: IdsSpinnerVariantType;
|
|
8
|
+
isTrack: boolean;
|
|
9
|
+
}
|
|
10
|
+
export declare const IDS_SPINNER_DEFAULT_CONFIG: InjectionToken<IdsSpinnerDefaultConfig>;
|
|
11
|
+
export declare function IDS_SPINNER_DEFAULT_CONFIG_FACTORY(): Required<IdsSpinnerDefaultConfig>;
|
|
@@ -0,0 +1,17 @@
|
|
|
1
|
+
import { IdsSpinnerDefaultConfig } from './spinner-defaults';
|
|
2
|
+
import { IdsSpinnerVariantType } from './types/spinner-variant.type';
|
|
3
|
+
import { ComponentBaseWithDefaults } from '@i-cell/ids-angular/core';
|
|
4
|
+
import * as i0 from "@angular/core";
|
|
5
|
+
export declare class IdsSpinnerComponent extends ComponentBaseWithDefaults<IdsSpinnerDefaultConfig> {
|
|
6
|
+
protected get _hostName(): string;
|
|
7
|
+
protected readonly _defaultConfig: Required<IdsSpinnerDefaultConfig>;
|
|
8
|
+
size: import("@angular/core").InputSignal<string>;
|
|
9
|
+
sizeCollection: import("@angular/core").InputSignal<string>;
|
|
10
|
+
variant: import("@angular/core").InputSignal<IdsSpinnerVariantType>;
|
|
11
|
+
isTrack: import("@angular/core").InputSignal<boolean>;
|
|
12
|
+
ariaLabel: import("@angular/core").InputSignal<string>;
|
|
13
|
+
constructor();
|
|
14
|
+
protected _hostClasses: import("@angular/core").Signal<string>;
|
|
15
|
+
static ɵfac: i0.ɵɵFactoryDeclaration<IdsSpinnerComponent, never>;
|
|
16
|
+
static ɵcmp: i0.ɵɵComponentDeclaration<IdsSpinnerComponent, "ids-spinner", never, { "size": { "alias": "size"; "required": false; "isSignal": true; }; "sizeCollection": { "alias": "sizeCollection"; "required": false; "isSignal": true; }; "variant": { "alias": "variant"; "required": false; "isSignal": true; }; "isTrack": { "alias": "isTrack"; "required": false; "isSignal": true; }; "ariaLabel": { "alias": "aria-label"; "required": false; "isSignal": true; }; }, {}, never, never, true, never>;
|
|
17
|
+
}
|
|
@@ -0,0 +1,11 @@
|
|
|
1
|
+
export declare const IdsSpinnerVariant: {
|
|
2
|
+
readonly SURFACE: "surface";
|
|
3
|
+
readonly PRIMARY: "primary";
|
|
4
|
+
readonly SECONDARY: "secondary";
|
|
5
|
+
readonly BRAND: "brand";
|
|
6
|
+
readonly LIGHT: "light";
|
|
7
|
+
readonly ERROR: "error";
|
|
8
|
+
readonly SUCCESS: "success";
|
|
9
|
+
readonly WARNING: "warning";
|
|
10
|
+
};
|
|
11
|
+
export type IdsSpinnerVariantType = (typeof IdsSpinnerVariant)[keyof typeof IdsSpinnerVariant];
|