@haiilo/catalyst 10.4.0 → 10.5.0
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/dist/catalyst/catalyst.esm.js +1 -1
- package/dist/catalyst/catalyst.esm.js.map +1 -1
- package/dist/catalyst/index.esm.js +1 -1
- package/dist/catalyst/index.esm.js.map +1 -1
- package/dist/catalyst/p-54544546.js +2 -0
- package/dist/catalyst/p-54544546.js.map +1 -0
- package/dist/catalyst/{p-8a1d505d.entry.js → p-66b41008.entry.js} +4 -4
- package/dist/catalyst/p-66b41008.entry.js.map +1 -0
- package/dist/cjs/{cat-alert_28.cjs.entry.js → cat-alert_29.cjs.entry.js} +269 -176
- package/dist/cjs/cat-alert_29.cjs.entry.js.map +1 -0
- package/dist/cjs/catalyst.cjs.js +1 -1
- package/dist/cjs/index.cjs.js +4 -1
- package/dist/cjs/index.cjs.js.map +1 -1
- package/dist/cjs/loader.cjs.js +1 -1
- package/dist/cjs/{of-45281229.js → of-8163b41f.js} +11 -3
- package/dist/cjs/of-8163b41f.js.map +1 -0
- package/dist/collection/collection-manifest.json +1 -0
- package/dist/collection/components/cat-button/cat-button.css +12 -2
- package/dist/collection/components/cat-date/cat-date.css +2 -96
- package/dist/collection/components/cat-date/cat-date.js +46 -254
- package/dist/collection/components/cat-date/cat-date.js.map +1 -1
- package/dist/collection/components/cat-date/cat-date.spec.js +2 -1
- package/dist/collection/components/cat-date/cat-date.spec.js.map +1 -1
- package/dist/collection/components/cat-date-inline/cat-date-inline.css +166 -0
- package/dist/collection/components/cat-date-inline/cat-date-inline.e2e.js +11 -0
- package/dist/collection/components/cat-date-inline/cat-date-inline.e2e.js.map +1 -0
- package/dist/collection/components/cat-date-inline/cat-date-inline.js +505 -0
- package/dist/collection/components/cat-date-inline/cat-date-inline.js.map +1 -0
- package/dist/collection/components/cat-date-inline/cat-date-inline.spec.js +16 -0
- package/dist/collection/components/cat-date-inline/cat-date-inline.spec.js.map +1 -0
- package/dist/collection/components/{cat-date → cat-date-inline}/cat-date-locale.js +22 -1
- package/dist/collection/components/cat-date-inline/cat-date-locale.js.map +1 -0
- package/dist/collection/components/cat-date-inline/cat-date-math.js.map +1 -0
- package/dist/collection/components/cat-datepicker/cat-datepicker.js +2 -2
- package/dist/collection/components/cat-datepicker-inline/cat-datepicker-inline.js +2 -2
- package/dist/collection/components/cat-dropdown/cat-dropdown.js +5 -1
- package/dist/collection/components/cat-dropdown/cat-dropdown.js.map +1 -1
- package/dist/collection/components/cat-form-group/cat-form-group.js +4 -1
- package/dist/collection/components/cat-form-group/cat-form-group.js.map +1 -1
- package/dist/collection/components/cat-i18n/cat-i18n-registry.js +6 -0
- package/dist/collection/components/cat-i18n/cat-i18n-registry.js.map +1 -1
- package/dist/collection/components/cat-icon/cat-icon-registry.js +4 -2
- package/dist/collection/components/cat-icon/cat-icon-registry.js.map +1 -1
- package/dist/collection/components/cat-icon/cat-icon.js +1 -1
- package/dist/collection/components/cat-input/cat-input.js +4 -4
- package/dist/collection/components/cat-notification/cat-notification.js +3 -0
- package/dist/collection/components/cat-notification/cat-notification.js.map +1 -1
- package/dist/collection/components/cat-pagination/cat-pagination.js +2 -2
- package/dist/collection/components/cat-radio/cat-radio.js +1 -1
- package/dist/collection/components/cat-radio-group/cat-radio-group.js +1 -1
- package/dist/collection/components/cat-scrollable/cat-scrollable.js +3 -3
- package/dist/collection/components/cat-select-demo/cat-select-demo.js +1 -1
- package/dist/collection/components/cat-skeleton/cat-skeleton.js +1 -1
- package/dist/collection/components/cat-spinner/cat-spinner.js +2 -2
- package/dist/collection/components/cat-tab/cat-tab.js +1 -1
- package/dist/collection/components/cat-tabs/cat-tabs.js +1 -1
- package/dist/collection/components/cat-textarea/cat-textarea.js +3 -3
- package/dist/collection/components/cat-time/cat-time.js +4 -1
- package/dist/collection/components/cat-time/cat-time.js.map +1 -1
- package/dist/collection/components/cat-toggle/cat-toggle.js +1 -1
- package/dist/collection/components/cat-tooltip/cat-tooltip.js +7 -2
- package/dist/collection/components/cat-tooltip/cat-tooltip.js.map +1 -1
- package/dist/components/cat-button2.js +1 -1
- package/dist/components/cat-button2.js.map +1 -1
- package/dist/components/cat-date-inline.d.ts +11 -0
- package/dist/components/cat-date-inline.js +8 -0
- package/dist/components/cat-date-inline.js.map +1 -0
- package/dist/components/cat-date-inline2.js +386 -0
- package/dist/components/cat-date-inline2.js.map +1 -0
- package/dist/components/cat-date.js +50 -288
- package/dist/components/cat-date.js.map +1 -1
- package/dist/components/cat-datepicker-inline.js +2 -2
- package/dist/components/cat-datepicker.js +2 -2
- package/dist/components/cat-dropdown2.js +1 -1
- package/dist/components/cat-dropdown2.js.map +1 -1
- package/dist/components/cat-form-group.js +1 -1
- package/dist/components/cat-form-group.js.map +1 -1
- package/dist/components/cat-i18n-registry.js +6 -0
- package/dist/components/cat-i18n-registry.js.map +1 -1
- package/dist/components/cat-icon-registry.js +4 -2
- package/dist/components/cat-icon-registry.js.map +1 -1
- package/dist/components/cat-icon2.js +1 -1
- package/dist/components/cat-input2.js +4 -4
- package/dist/components/cat-pagination.js +2 -2
- package/dist/components/cat-radio-group.js +1 -1
- package/dist/components/cat-radio.js +1 -1
- package/dist/components/cat-scrollable2.js +3 -3
- package/dist/components/cat-select-demo.js +1 -1
- package/dist/components/cat-skeleton2.js +1 -1
- package/dist/components/cat-spinner2.js +2 -2
- package/dist/components/cat-tab.js +1 -1
- package/dist/components/cat-tabs.js +1 -1
- package/dist/components/cat-textarea.js +3 -3
- package/dist/components/cat-time.js +1 -1
- package/dist/components/cat-time.js.map +1 -1
- package/dist/components/cat-toggle.js +1 -1
- package/dist/components/cat-tooltip.js +2 -2
- package/dist/components/cat-tooltip.js.map +1 -1
- package/dist/components/index.js +3 -0
- package/dist/components/index.js.map +1 -1
- package/dist/esm/{cat-alert_28.entry.js → cat-alert_29.entry.js} +269 -177
- package/dist/esm/cat-alert_29.entry.js.map +1 -0
- package/dist/esm/catalyst.js +1 -1
- package/dist/esm/index.js +5 -2
- package/dist/esm/index.js.map +1 -1
- package/dist/esm/loader.js +1 -1
- package/dist/esm/{of-19888f3b.js → of-f4b9a3ca.js} +11 -3
- package/dist/esm/of-f4b9a3ca.js.map +1 -0
- package/dist/types/components/cat-date/cat-date.d.ts +8 -31
- package/dist/types/components/cat-date-inline/cat-date-inline.d.ts +81 -0
- package/dist/types/components/{cat-date → cat-date-inline}/cat-date-locale.d.ts +5 -0
- package/dist/types/components/cat-dropdown/cat-dropdown.d.ts +4 -0
- package/dist/types/components/cat-form-group/cat-form-group.d.ts +3 -0
- package/dist/types/components/cat-i18n/cat-i18n-registry.d.ts +6 -0
- package/dist/types/components/cat-icon/cat-icon-registry.d.ts +1 -0
- package/dist/types/components/cat-notification/cat-notification.d.ts +3 -0
- package/dist/types/components/cat-time/cat-time.d.ts +3 -0
- package/dist/types/components/cat-tooltip/cat-tooltip.d.ts +5 -0
- package/dist/types/components.d.ts +201 -5
- package/package.json +2 -2
- package/dist/catalyst/p-81800b65.js +0 -2
- package/dist/catalyst/p-81800b65.js.map +0 -1
- package/dist/catalyst/p-8a1d505d.entry.js.map +0 -1
- package/dist/cjs/cat-alert_28.cjs.entry.js.map +0 -1
- package/dist/cjs/of-45281229.js.map +0 -1
- package/dist/collection/components/cat-date/cat-date-locale.js.map +0 -1
- package/dist/collection/components/cat-date/cat-date-math.js.map +0 -1
- package/dist/esm/cat-alert_28.entry.js.map +0 -1
- package/dist/esm/of-19888f3b.js.map +0 -1
- /package/dist/collection/components/{cat-date → cat-date-inline}/cat-date-math.js +0 -0
- /package/dist/types/components/{cat-date → cat-date-inline}/cat-date-math.d.ts +0 -0
|
@@ -23,7 +23,7 @@ const CatFormGroup$1 = /*@__PURE__*/ proxyCustomElement(class CatFormGroup exten
|
|
|
23
23
|
});
|
|
24
24
|
}
|
|
25
25
|
render() {
|
|
26
|
-
return (h(Host, { key: '
|
|
26
|
+
return (h(Host, { key: '6892a4f36f418d431b6006518c44bf2b58e70f70', style: { '--label-size': this.labelSize } }, h("slot", { key: '908b2720b504ce9dfb3a491aa3bbe092a3d2e0cf', onSlotchange: this.onSlotChange.bind(this) })));
|
|
27
27
|
}
|
|
28
28
|
onSlotChange() {
|
|
29
29
|
this.formElements = Array.from(this.hostElement.querySelectorAll('cat-input, cat-textarea, cat-select, cat-datepicker'));
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"file":"cat-form-group.js","mappings":";;AAAA,MAAM,eAAe,GAAG,sBAAsB,CAAC;AAC/C,2BAAe,eAAe;;
|
|
1
|
+
{"file":"cat-form-group.js","mappings":";;AAAA,MAAM,eAAe,GAAG,sBAAsB,CAAC;AAC/C,2BAAe,eAAe;;MCejBA,cAAY;;;;;QACf,iBAAY,GAA8B,EAAE,CAAC;8BAWe,MAAM;0BAKrD,KAAK;;;IAQ1B,uBAAuB,CAAC,iBAA4D;QAClF,MAAM,YAAY,GAAG,iBAAiB,KAAK,MAAM,GAAG,IAAI,CAAC,SAAS,CAAC,IAAI,CAAC,YAAY,CAAC,GAAG,iBAAiB,CAAC;QAC1G,IAAI,CAAC,YAAY,CAAC,OAAO,CACvB,OAAO,IAAI,CAAC,OAAO,CAAC,cAAc,EAAE,QAAQ,CAAC,GAAG,CAAC,KAAK,OAAO,CAAC,cAAc,GAAG,YAAY,CAAC,CAC7F,CAAC;KACH;IAGD,mBAAmB,CAAC,aAAsB;QACxC,IAAI,CAAC,YAAY,CAAC,OAAO,CAAC,OAAO;YAC/B,OAAO,CAAC,UAAU,GAAG,aAAa,CAAC;SACpC,CAAC,CAAC;KACJ;IAED,MAAM;QACJ,QACE,EAAC,IAAI,qDAAC,KAAK,EAAE,EAAE,cAAc,EAAE,IAAI,CAAC,SAAS,EAAE,IAC7C,6DAAM,YAAY,EAAE,IAAI,CAAC,YAAY,CAAC,IAAI,CAAC,IAAI,CAAC,GAAS,CACpD,EACP;KACH;IAEO,YAAY;QAClB,IAAI,CAAC,YAAY,GAAG,KAAK,CAAC,IAAI,CAC5B,IAAI,CAAC,WAAW,CAAC,gBAAgB,CAAC,qDAAqD,CAAC,CAC5D,CAAC;QAC/B,IAAI,CAAC,uBAAuB,CAAC,IAAI,CAAC,cAAc,CAAC,CAAC;QAClD,IAAI,CAAC,mBAAmB,CAAC,IAAI,CAAC,UAAU,CAAC,CAAC;KAC3C;IAEO,SAAS,CAAC,QAAmC;QACnD,MAAM,cAAc,GAAG,QAAQ,CAAC,MAAM,CAAC,KAAK,IAAI,CAAC,KAAK,CAAC,QAAQ,CAAC,CAAC,MAAM,CAAC;QACxE,MAAM,cAAc,GAAG,QAAQ,CAAC,MAAM,GAAG,cAAc,CAAC;QACxD,OAAO,cAAc,IAAI,cAAc,GAAG,UAAU,GAAG,UAAU,CAAC;KACnE;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;","names":["CatFormGroup"],"sources":["src/components/cat-form-group/cat-form-group.scss?tag=cat-form-group&encapsulation=shadow","src/components/cat-form-group/cat-form-group.tsx"],"sourcesContent":[":host {\n display: block;\n}\n","import { Component, Element, h, Host, Prop, Watch } from '@stencil/core';\n\ntype HTMLCatFormFieldElement =\n | HTMLCatInputElement\n | HTMLCatTextareaElement\n | HTMLCatSelectElement\n | HTMLCatDatepickerElement;\n\n/**\n * A form group component to group form fields and labels.\n */\n@Component({\n tag: 'cat-form-group',\n styleUrl: 'cat-form-group.scss',\n shadow: true\n})\nexport class CatFormGroup {\n private formElements: HTMLCatFormFieldElement[] = [];\n\n @Element() hostElement!: HTMLElement;\n\n /**\n * Whether the labels need a marker to shown if the forms fields are required or optional.<br /><br />\n * By default, it is set to auto, it will display the mark depending on the number of required and optional fields: <br />\n * - If there are more required, the optional will be marked.<br />\n * - If there are less required, it will mark the required.<br /><br />\n * If a form field had \"!\", the requiredMarked of the field would not change.\n */\n @Prop() requiredMarker: 'none' | 'required' | 'optional' | 'auto' = 'auto';\n\n /**\n * Whether the label is on top or left.\n */\n @Prop() horizontal = false;\n\n /**\n * The space allocated to the input label\n */\n @Prop() labelSize?: string;\n\n @Watch('requiredMarker')\n onRequiredMarkerChanged(newRequiredMarker: 'none' | 'required' | 'optional' | 'auto') {\n const updateMarker = newRequiredMarker === 'auto' ? this.calculate(this.formElements) : newRequiredMarker;\n this.formElements.forEach(\n element => !element.requiredMarker?.endsWith('!') && (element.requiredMarker = updateMarker)\n );\n }\n\n @Watch('horizontal')\n onHorizontalChanged(newHorizontal: boolean) {\n this.formElements.forEach(element => {\n element.horizontal = newHorizontal;\n });\n }\n\n render() {\n return (\n <Host style={{ '--label-size': this.labelSize }}>\n <slot onSlotchange={this.onSlotChange.bind(this)}></slot>\n </Host>\n );\n }\n\n private onSlotChange(): void {\n this.formElements = Array.from(\n this.hostElement.querySelectorAll('cat-input, cat-textarea, cat-select, cat-datepicker')\n ) as HTMLCatFormFieldElement[];\n this.onRequiredMarkerChanged(this.requiredMarker);\n this.onHorizontalChanged(this.horizontal);\n }\n\n private calculate(elements: HTMLCatFormFieldElement[]): 'optional' | 'required' {\n const optionalFields = elements.filter(value => !value.required).length;\n const requiredFields = elements.length - optionalFields;\n return requiredFields >= optionalFields ? 'optional' : 'required';\n }\n}\n"],"version":3}
|
|
@@ -1,5 +1,11 @@
|
|
|
1
1
|
import { l as log } from './loglevel.js';
|
|
2
2
|
|
|
3
|
+
/**
|
|
4
|
+
* A registry for lightweight internationalization (i18n) in applications using
|
|
5
|
+
* the Catalyst design system. The registry stores translations and provides
|
|
6
|
+
* methods for setting the locale, registering translations, and retrieving
|
|
7
|
+
* translated messages.
|
|
8
|
+
*/
|
|
3
9
|
class CatI18nRegistry {
|
|
4
10
|
constructor() {
|
|
5
11
|
// hide constructor
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"file":"cat-i18n-registry.js","mappings":";;
|
|
1
|
+
{"file":"cat-i18n-registry.js","mappings":"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","names":[],"sources":["src/components/cat-i18n/cat-i18n-registry.ts"],"sourcesContent":["import log from 'loglevel';\n\nexport type CatI18nTranslationFn = (key: string, params?: unknown) => string;\n\n/**\n * A registry for lightweight internationalization (i18n) in applications using\n * the Catalyst design system. The registry stores translations and provides\n * methods for setting the locale, registering translations, and retrieving\n * translated messages.\n */\nexport class CatI18nRegistry {\n private static instance: CatI18nRegistry;\n\n private readonly id = (Math.random() + 1).toString(36).substring(2);\n private readonly i18n: Map<string, string> = new Map();\n\n private _locale?: string;\n private _translator?: CatI18nTranslationFn;\n\n private constructor() {\n // hide constructor\n\n // In rare cases, the registry can be initialized twice. This can happen in\n // a micro frontend architecture where the registry is initialized in the\n // host application and in the micro frontend. To prevent the registry in\n // one application from overwriting the registry in the other, we listen for\n // events that are dispatched when messages are added or removed in other\n // applications and add or remove messages if the event was not dispatched\n // by this registry.\n window.addEventListener('cat-i18n-setLocale', event => {\n const { detail } = (event as CustomEvent) || {};\n if (detail && detail.id !== this.id) {\n this.setLocale(detail.locale, true);\n }\n });\n window.addEventListener('cat-i18n-set', event => {\n const { detail } = (event as CustomEvent) || {};\n if (detail && detail.id !== this.id) {\n this.set(detail.i18n, true);\n }\n });\n window.addEventListener('cat-i18n-clear', event => {\n const { detail } = (event as CustomEvent) || {};\n if (detail && detail.id !== this.id) {\n this.clear(true);\n }\n });\n }\n\n static getInstance(): CatI18nRegistry {\n if (!CatI18nRegistry.instance) {\n CatI18nRegistry.instance = new CatI18nRegistry();\n }\n return CatI18nRegistry.instance;\n }\n\n getLocale(): string {\n return this._locale ?? window?.navigator?.language ?? 'en';\n }\n\n setLocale(locale: string, silent = false): void {\n try {\n this._locale = Intl.getCanonicalLocales(locale)[0];\n log.info(`[CatI18nRegistry::${this.id}] Set locale: ${this._locale}`);\n !silent && window.dispatchEvent(this.buildEvent('cat-i18n-setLocale', { locale, id: this.id }));\n } catch (err) {\n log.error(`[CatI18nRegistry::${this.id}] Invalid locale: ${locale}`);\n }\n }\n\n set(i18n: { [key: string]: string } | CatI18nTranslationFn, silent = false): void {\n if (typeof i18n === 'function') {\n this._translator = i18n;\n log.info(`[CatI18nRegistry::${this.id}] Registered translator`);\n } else {\n const i18nEntries = Object.entries(i18n);\n i18nEntries.forEach(([key, message]) => this.i18n.set(key, message));\n log.info(`[CatI18nRegistry::${this.id}] Registered ${i18nEntries.length !== 1 ? 'messages' : 'message'}`);\n }\n !silent && window.dispatchEvent(this.buildEvent('cat-i18n-set', { i18n, id: this.id }));\n }\n\n clear(silent = false): void {\n this.i18n.clear();\n log.info(`[CatI18nRegistry::${this.id}] Cleared messages`);\n !silent && window.dispatchEvent(this.buildEvent('cat-i18n-clear'));\n }\n\n t(key: string, params?: { [key: string]: unknown }): string {\n const message =\n this._translator?.(key, params) ??\n this.i18n.get(key)?.replace(/{{\\s*([-a-zA-Z._]+)\\s*}}/g, (_match, key) => `${params?.[key] ?? ''}`);\n if (message === undefined) {\n log.error(`[CatI18nRegistry::${this.id}] Unknown message key: ${key}`);\n return key;\n }\n return message;\n }\n\n private buildEvent<T>(name: string, detail?: T) {\n return new CustomEvent(name, {\n bubbles: true,\n composed: true,\n detail\n });\n }\n}\n\nexport const catI18nRegistry = CatI18nRegistry.getInstance();\n"],"version":3}
|
|
@@ -47,6 +47,8 @@ class CatIconRegistry {
|
|
|
47
47
|
// hide constructor
|
|
48
48
|
this.id = (Math.random() + 1).toString(36).substring(2);
|
|
49
49
|
this.icons = new Map();
|
|
50
|
+
// ignore syncing in backwards compatible manner
|
|
51
|
+
this.syncIcons = true;
|
|
50
52
|
// register default icons that are used in the framework by other components
|
|
51
53
|
this.addIcons({
|
|
52
54
|
'alert-primary': starCircleFilled,
|
|
@@ -81,13 +83,13 @@ class CatIconRegistry {
|
|
|
81
83
|
// this registry.
|
|
82
84
|
window.addEventListener('cat-icons-added', event => {
|
|
83
85
|
const { detail } = event || {};
|
|
84
|
-
if (detail && detail.id !== this.id) {
|
|
86
|
+
if (this.syncIcons && detail && detail.id !== this.id) {
|
|
85
87
|
this.addIcons(detail.icons, detail.setName, true);
|
|
86
88
|
}
|
|
87
89
|
});
|
|
88
90
|
window.addEventListener('cat-icons-removed', event => {
|
|
89
91
|
const { detail } = event || {};
|
|
90
|
-
if (detail && detail.id !== this.id) {
|
|
92
|
+
if (this.syncIcons && detail && detail.id !== this.id) {
|
|
91
93
|
this.removeIcons(detail.names, detail.setName, true);
|
|
92
94
|
}
|
|
93
95
|
});
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"file":"cat-icon-registry.js","mappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;MAuBa,eAAe;
|
|
1
|
+
{"file":"cat-icon-registry.js","mappings":"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","names":[],"sources":["src/components/cat-icon/cat-icon-registry.ts"],"sourcesContent":["import chevronDoubleLeft16 from '@haiilo/catalyst-icons/src/16-chevron-double-left.svg';\nimport chevronDoubleRight16 from '@haiilo/catalyst-icons/src/16-chevron-double-right.svg';\nimport chevronLeft16 from '@haiilo/catalyst-icons/src/16-chevron-left.svg';\nimport chevronRight16 from '@haiilo/catalyst-icons/src/16-chevron-right.svg';\nimport cross16 from '@haiilo/catalyst-icons/src/16-cross.svg';\nimport alertCircleOutlined from '@haiilo/catalyst-icons/src/alert-circle-outlined.svg';\nimport calendarOutlined from '@haiilo/catalyst-icons/src/calendar-outlined.svg';\nimport checkCircleFilled from '@haiilo/catalyst-icons/src/check-circle-filled.svg';\nimport chevronDownOutlined from '@haiilo/catalyst-icons/src/chevron-down-outlined.svg';\nimport chevronLeftOutlined from '@haiilo/catalyst-icons/src/chevron-left-outlined.svg';\nimport chevronRightOutlined from '@haiilo/catalyst-icons/src/chevron-right-outlined.svg';\nimport clockFilled from '@haiilo/catalyst-icons/src/clock-filled.svg';\nimport clockOutlined from '@haiilo/catalyst-icons/src/clock-outlined.svg';\nimport crossCircleFilled from '@haiilo/catalyst-icons/src/cross-circle-filled.svg';\nimport crossCircleOutlined from '@haiilo/catalyst-icons/src/cross-circle-outlined.svg';\nimport crossOutlined from '@haiilo/catalyst-icons/src/cross-outlined.svg';\nimport dangerFilled from '@haiilo/catalyst-icons/src/danger-filled.svg';\nimport eyeClosedOutlined from '@haiilo/catalyst-icons/src/eye-closed-outlined.svg';\nimport eyeOpenOutlined from '@haiilo/catalyst-icons/src/eye-open-outlined.svg';\nimport infoCircleFilled from '@haiilo/catalyst-icons/src/info-circle-filled.svg';\nimport starCircleFilled from '@haiilo/catalyst-icons/src/star-circle-filled.svg';\nimport log from 'loglevel';\n\nexport class CatIconRegistry {\n private static instance: CatIconRegistry;\n\n private readonly id = (Math.random() + 1).toString(36).substring(2);\n private readonly icons: Map<string, string> = new Map();\n\n // ignore syncing in backwards compatible manner\n syncIcons: boolean = true;\n\n private constructor() {\n // hide constructor\n\n // register default icons that are used in the framework by other components\n this.addIcons(\n {\n 'alert-primary': starCircleFilled,\n 'alert-secondary': clockFilled,\n 'alert-info': infoCircleFilled,\n 'alert-success': checkCircleFilled,\n 'alert-warning': dangerFilled,\n 'alert-danger': crossCircleFilled,\n 'datepicker-month-prev': chevronLeft16,\n 'datepicker-month-next': chevronRight16,\n 'datepicker-year-prev': chevronDoubleLeft16,\n 'datepicker-year-next': chevronDoubleRight16,\n 'datepicker-calendar': calendarOutlined,\n 'timepicker-clock': clockOutlined,\n 'dialog-close': crossOutlined,\n 'input-close': crossCircleOutlined,\n 'input-error': alertCircleOutlined,\n 'input-password-show': eyeOpenOutlined,\n 'input-password-hide': eyeClosedOutlined,\n 'notification-close': crossCircleOutlined,\n 'pagination-left': chevronLeftOutlined,\n 'pagination-right': chevronRightOutlined,\n 'select-clear': cross16,\n 'select-open': chevronDownOutlined\n },\n '$cat',\n true\n );\n\n // In rare cases, the registry can be initialized twice. This can happen in\n // a micro frontend architecture where the registry is initialized in the\n // host application and in the micro frontend. To prevent the registry in\n // one application from overwriting the registry in the other, we listen for\n // events that are dispatched when icons are added or removed in other\n // applications and add or remove icons if the event was not dispatched by\n // this registry.\n window.addEventListener('cat-icons-added', event => {\n const { detail } = (event as CustomEvent) || {};\n if (this.syncIcons && detail && detail.id !== this.id) {\n this.addIcons(detail.icons, detail.setName, true);\n }\n });\n window.addEventListener('cat-icons-removed', event => {\n const { detail } = (event as CustomEvent) || {};\n if (this.syncIcons && detail && detail.id !== this.id) {\n this.removeIcons(detail.names, detail.setName, true);\n }\n });\n }\n\n static getInstance(): CatIconRegistry {\n if (!CatIconRegistry.instance) {\n CatIconRegistry.instance = new CatIconRegistry();\n }\n return CatIconRegistry.instance;\n }\n\n getIcon(name: string, setName?: string): string | undefined {\n const icon = this.icons.get(this.buildName(name, setName));\n if (!icon) {\n log.error(`[CatIconRegistry::${this.id}] Unknown icon${setName ? ` in set ${setName}` : ''}: ${name}`);\n }\n return icon;\n }\n\n addIcons(icons: { [name: string]: string }, setName?: string, silent = false): CatIconRegistry {\n const iconEntries = Object.entries(icons);\n const iconSize = iconEntries.length;\n iconEntries.forEach(([name, data]) => this.icons.set(this.buildName(name, setName), data));\n log.info(\n `[CatIconRegistry::${this.id}] Added ${iconSize !== 1 ? 'icons' : 'icon'}${setName ? ` to set ${setName}` : ''}`\n );\n !silent && window.dispatchEvent(this.buildEvent('cat-icons-added', { id: this.id, icons, setName }));\n return this;\n }\n\n removeIcons(names: string[], setName?: string, silent = false): CatIconRegistry {\n const iconSize = names.length;\n names.forEach(name => this.icons.delete(this.buildName(name, setName)));\n log.info(\n `[CatIconRegistry::${this.id}] Removed ${iconSize !== 1 ? 'icons' : 'icon'}${\n setName ? ` from set ${setName}` : ''\n }`\n );\n !silent && window.dispatchEvent(this.buildEvent('cat-icons-removed', { id: this.id, names, setName }));\n return this;\n }\n\n private buildName(name: string, setName?: string) {\n return setName ? `${setName}:${name}` : name;\n }\n\n private buildEvent<T>(name: string, detail?: T) {\n return new CustomEvent(name, {\n bubbles: true,\n composed: true,\n detail\n });\n }\n}\n\nexport const catIconRegistry = CatIconRegistry.getInstance();\n"],"version":3}
|
|
@@ -15,7 +15,7 @@ const CatIcon = /*@__PURE__*/ proxyCustomElement(class CatIcon extends HTMLEleme
|
|
|
15
15
|
this.a11yLabel = undefined;
|
|
16
16
|
}
|
|
17
17
|
render() {
|
|
18
|
-
return (h("span", { key: '
|
|
18
|
+
return (h("span", { key: '66938702e645f5bc12ca9a4592af24ac46b40c52', innerHTML: this.iconSrc || (this.icon ? catIconRegistry.getIcon(this.icon) : ''), "aria-label": this.a11yLabel, "aria-hidden": this.a11yLabel ? null : 'true', part: "icon", class: {
|
|
19
19
|
icon: true,
|
|
20
20
|
[`icon-${this.size}`]: this.size !== 'inline'
|
|
21
21
|
} }));
|
|
@@ -1671,19 +1671,19 @@ const CatInput = /*@__PURE__*/ proxyCustomElement(class CatInput extends HTMLEle
|
|
|
1671
1671
|
}
|
|
1672
1672
|
}
|
|
1673
1673
|
render() {
|
|
1674
|
-
return (h("div", { key: '
|
|
1674
|
+
return (h("div", { key: '34152d1627e62e4852531f9afdb2b0abc3894a78', class: {
|
|
1675
1675
|
'input-field': true,
|
|
1676
1676
|
'input-horizontal': this.horizontal
|
|
1677
|
-
} }, h("div", { key: '
|
|
1677
|
+
} }, h("div", { key: '89c3e91d9d041a68389e776f38647aa6360e5ea5', class: { 'label-container': true, hidden: this.labelHidden } }, (this.hasSlottedLabel || this.label) && (h("label", { htmlFor: this.id, part: "label" }, h("span", { class: "label-wrapper" }, (this.hasSlottedLabel && h("slot", { name: "label" })) || this.label, h("div", { class: "label-metadata" }, !this.required && (this.requiredMarker ?? 'optional').startsWith('optional') && (h("span", { class: "label-optional", "aria-hidden": "true" }, "(", catI18nRegistry.t('input.optional'), ")")), this.required && this.requiredMarker?.startsWith('required') && (h("span", { class: "label-optional", "aria-hidden": "true" }, "(", catI18nRegistry.t('input.required'), ")")), this.maxLength && (h("div", { class: "label-character-count", "aria-hidden": "true" }, this.value?.toString().length ?? 0, "/", this.maxLength))))))), h("div", { key: 'ceed5e06d5bfb6eaf425c562422a6cb470c3dea4', class: "input-container" }, h("div", { key: 'bbd90f6b705d2e9213a45f5f7839370fce830c89', class: "input-outer-wrapper" }, h("div", { key: '7fa315fbb8421e0466d7bceba57c9f158d08c476', class: {
|
|
1678
1678
|
'input-wrapper': true,
|
|
1679
1679
|
'input-round': this.round,
|
|
1680
1680
|
'input-readonly': this.readonly,
|
|
1681
1681
|
'input-disabled': this.disabled,
|
|
1682
1682
|
'input-invalid': this.invalid
|
|
1683
|
-
}, onClick: () => this.input.focus() }, this.textPrefix && (h("span", { class: "text-prefix", part: "prefix" }, this.textPrefix)), this.icon && !this.iconRight && (h("cat-icon", { icon: this.icon, class: "icon-prefix", size: "l", onClick: () => this.doFocus() })), h("div", { key: '
|
|
1683
|
+
}, onClick: () => this.input.focus() }, this.textPrefix && (h("span", { class: "text-prefix", part: "prefix" }, this.textPrefix)), this.icon && !this.iconRight && (h("cat-icon", { icon: this.icon, class: "icon-prefix", size: "l", onClick: () => this.doFocus() })), h("div", { key: 'd8db1f7ab01afe94166fc4f6a6d37a595941c0e5', class: "input-inner-wrapper" }, h("input", { key: 'af383fe0a04ca8a41e9d9595ee4f422cebb5d99d', ...this.nativeAttributes, part: "input", ref: el => (this.input = el), id: this.id, class: {
|
|
1684
1684
|
'has-clearable': this.clearable && !this.disabled && !this.readonly && !!this.value,
|
|
1685
1685
|
'has-toggle-password': this.togglePassword && !this.disabled && !this.readonly && !!this.value
|
|
1686
|
-
}, autocomplete: this.autoComplete, disabled: this.disabled, max: this.max, maxlength: this.maxLength, min: this.min, minlength: this.minLength, name: this.name, placeholder: this.placeholder, readonly: this.readonly, required: this.required, type: this.isPasswordShown ? 'text' : this.type, value: this.value, onInput: this.onInput.bind(this), onFocus: this.onFocus.bind(this), onBlur: this.onBlur.bind(this), "aria-invalid": this.invalid ? 'true' : undefined, "aria-describedby": this.hasHint ? this.id + '-hint' : undefined }), this.clearable && !this.disabled && !this.readonly && this.value && (h("cat-button", { class: "clearable", icon: "$cat:input-close", "icon-only": "true", size: "s", variant: "text", "a11y-label": catI18nRegistry.t('input.clear'), onClick: this.clear.bind(this), "data-dropdown-no-close": true })), this.togglePassword && !this.disabled && !this.readonly && this.value && (h("cat-button", { class: "toggle-password", icon: this.isPasswordShown ? '$cat:input-password-hide' : '$cat:input-password-show', "icon-only": "true", size: "s", variant: "text", "a11y-label": catI18nRegistry.t(this.isPasswordShown ? 'input.hidePassword' : 'input.showPassword'), onClick: this.doTogglePassword.bind(this) }))), !this.invalid && this.icon && this.iconRight && (h("cat-icon", { icon: this.icon, class: "icon-suffix", size: "l", onClick: () => this.doFocus() })), this.invalid && (h("cat-icon", { icon: "$cat:input-error", class: "icon-suffix cat-text-danger", size: "l" })), this.textSuffix && (h("span", { class: "text-suffix", part: "suffix" }, this.textSuffix))), h("slot", { key: '
|
|
1686
|
+
}, autocomplete: this.autoComplete, disabled: this.disabled, max: this.max, maxlength: this.maxLength, min: this.min, minlength: this.minLength, name: this.name, placeholder: this.placeholder, readonly: this.readonly, required: this.required, type: this.isPasswordShown ? 'text' : this.type, value: this.value, onInput: this.onInput.bind(this), onFocus: this.onFocus.bind(this), onBlur: this.onBlur.bind(this), "aria-invalid": this.invalid ? 'true' : undefined, "aria-describedby": this.hasHint ? this.id + '-hint' : undefined }), this.clearable && !this.disabled && !this.readonly && this.value && (h("cat-button", { class: "clearable", icon: "$cat:input-close", "icon-only": "true", size: "s", variant: "text", "a11y-label": catI18nRegistry.t('input.clear'), onClick: this.clear.bind(this), "data-dropdown-no-close": true })), this.togglePassword && !this.disabled && !this.readonly && this.value && (h("cat-button", { class: "toggle-password", icon: this.isPasswordShown ? '$cat:input-password-hide' : '$cat:input-password-show', "icon-only": "true", size: "s", variant: "text", "a11y-label": catI18nRegistry.t(this.isPasswordShown ? 'input.hidePassword' : 'input.showPassword'), onClick: this.doTogglePassword.bind(this) }))), !this.invalid && this.icon && this.iconRight && (h("cat-icon", { icon: this.icon, class: "icon-suffix", size: "l", onClick: () => this.doFocus() })), this.invalid && (h("cat-icon", { icon: "$cat:input-error", class: "icon-suffix cat-text-danger", size: "l" })), this.textSuffix && (h("span", { class: "text-suffix", part: "suffix" }, this.textSuffix))), h("slot", { key: '5d318f9d6eeeebcef42b5d7abb000f0e51375303', name: "addon" })), this.hasHint && (h(CatFormHint, { id: this.id, hint: this.hint, slottedHint: this.hasSlottedHint && h("slot", { name: "hint" }), errorMap: this.errorMap })))));
|
|
1687
1687
|
}
|
|
1688
1688
|
get hasHint() {
|
|
1689
1689
|
return !!this.hint || !!this.hasSlottedHint || this.invalid;
|
|
@@ -25,9 +25,9 @@ const CatPagination$1 = /*@__PURE__*/ proxyCustomElement(class CatPagination ext
|
|
|
25
25
|
this.iconNext = '$cat:pagination-right';
|
|
26
26
|
}
|
|
27
27
|
render() {
|
|
28
|
-
return (h("nav", { key: '
|
|
28
|
+
return (h("nav", { key: 'ede4b30a483fb729428b8d2bfdd4d67b1b5f1022', role: "navigation" }, h("ol", { key: '04fd80b91e33c55a23d010e5fa108b10a08e2bdb', class: {
|
|
29
29
|
[`cat-pagination-${this.size}`]: Boolean(this.size)
|
|
30
|
-
} }, h("li", { key: '
|
|
30
|
+
} }, h("li", { key: 'cd98373b4a9a69b25e9df8185b808561336c9a75' }, h("cat-button", { key: 'ec601998cd4ba8a2007e1f1dcecad86f36633095', variant: this.variant, size: this.size, round: this.round, disabled: this.isFirst, a11yLabel: catI18nRegistry.t('pagination.prev'), icon: this.iconPrev, iconOnly: true, onClick: () => this.setPage(this.page - 1) })), this.content, h("li", { key: '8ff7654e0087ece5cb4f81205083ea8f13af7112' }, h("cat-button", { key: '3ca4cf8fa48d650472e20efc09cbed49b55d33bf', variant: this.variant, size: this.size, round: this.round, disabled: this.isLast, a11yLabel: catI18nRegistry.t('pagination.next'), icon: this.iconNext, iconOnly: true, onClick: () => this.setPage(this.page + 1) })))));
|
|
31
31
|
}
|
|
32
32
|
get isFirst() {
|
|
33
33
|
return this.page === 0;
|
|
@@ -74,7 +74,7 @@ const CatRadioGroup$1 = /*@__PURE__*/ proxyCustomElement(class CatRadioGroup ext
|
|
|
74
74
|
}
|
|
75
75
|
}
|
|
76
76
|
render() {
|
|
77
|
-
return (h("div", { key: '
|
|
77
|
+
return (h("div", { key: '5608e54b1bb857a4068a6287b072bd71081d51d2', role: "radiogroup", "aria-label": this.a11yLabel }, h("slot", { key: '8e62283745589e94e99650f7fe85afeea39fa253' })));
|
|
78
78
|
}
|
|
79
79
|
init() {
|
|
80
80
|
this.catRadioGroup = Array.from(this.hostElement.querySelectorAll(`cat-radio`));
|
|
@@ -57,7 +57,7 @@ const CatRadio$1 = /*@__PURE__*/ proxyCustomElement(class CatRadio extends HTMLE
|
|
|
57
57
|
this.input.blur();
|
|
58
58
|
}
|
|
59
59
|
render() {
|
|
60
|
-
return (h(Host, { key: '
|
|
60
|
+
return (h(Host, { key: '1f5432c0800e82741e2786146b728403157eb874' }, h("label", { key: 'cac427f0f10635bd03a799d25ac0160b721cfcdb', htmlFor: this.id, class: { 'is-hidden': this.labelHidden, 'is-disabled': this.disabled, 'label-left': this.labelLeft }, role: "radio", "aria-checked": this.checked ? 'true' : 'false' }, h("span", { key: '6a8598e54d46eb976717faf125c58a675b79ad99', class: "radio" }, h("input", { key: '7b5dea2ce070d83a1a1f16375d3d782f8b3d1459', ...this.nativeAttributes, part: "input", ref: el => (this.input = el), id: this.identifier || this.id, type: "radio", name: this.name, value: this.value, checked: this.checked, required: this.required, disabled: this.disabled, onInput: this.onInput.bind(this), onFocus: this.onFocus.bind(this), onBlur: this.onBlur.bind(this), "aria-describedby": this.hasHint ? this.id + '-hint' : undefined }), h("span", { key: 'e6f1802e164c2b74f84f413fd351ea6a9f10c9a2', class: "circle" })), h("span", { key: '95e951a221d6b36d980a6619fa501a409555e981', class: "label", part: "label" }, (this.hasSlottedLabel && h("slot", { name: "label" })) || this.label)), this.hasHint && (h("div", { class: { 'hint-wrapper': true, 'label-left': this.labelLeft } }, h("div", { class: "circle-placeholder" }), h(CatFormHint, { id: this.id, hint: this.hint, slottedHint: this.hasSlottedHint && h("slot", { name: "hint" }) })))));
|
|
61
61
|
}
|
|
62
62
|
get hasHint() {
|
|
63
63
|
return !!this.hint || !!this.hasSlottedHint;
|
|
@@ -603,13 +603,13 @@ const CatScrollable = /*@__PURE__*/ proxyCustomElement(class CatScrollable exten
|
|
|
603
603
|
}
|
|
604
604
|
render() {
|
|
605
605
|
return [
|
|
606
|
-
h("div", { key: '
|
|
607
|
-
h("div", { key: '
|
|
606
|
+
h("div", { key: 'b8d4abf49b6747e516f23bc4e16bbc1b7b9e2efe', class: "scrollable-wrapper", ref: el => (this.scrollWrapperElement = el) }, !this.noShadowY && h("div", { class: "shadow-top" }), !this.noShadowX && h("div", { class: "shadow-left" }), !this.noShadowX && h("div", { class: "shadow-right" }), !this.noShadowY && h("div", { class: "shadow-bottom" })),
|
|
607
|
+
h("div", { key: '9552a4a4a86713effab40df3f95310dae5863f78', ref: el => (this.scrollElement = el), class: {
|
|
608
608
|
'scrollable-content': true,
|
|
609
609
|
'scroll-x': !this.noOverflowX,
|
|
610
610
|
'scroll-y': !this.noOverflowY,
|
|
611
611
|
'no-overscroll': this.noOverscroll
|
|
612
|
-
} }, h("slot", { key: '
|
|
612
|
+
} }, h("slot", { key: 'acc0afcb95539ad6db29c6a96b2673892f2d9153' }))
|
|
613
613
|
];
|
|
614
614
|
}
|
|
615
615
|
attachEmitter(from, emitter) {
|
|
@@ -176,7 +176,7 @@ const CatSelectTest = /*@__PURE__*/ proxyCustomElement(class CatSelectTest exten
|
|
|
176
176
|
setTimeout(() => this.multipleSelect && (this.multipleSelect.value = []), 5000);
|
|
177
177
|
}
|
|
178
178
|
render() {
|
|
179
|
-
return (h(Host, { key: '
|
|
179
|
+
return (h(Host, { key: 'fbbdfc05bd034597b84d235445b70c526ed17dd4', style: { display: 'flex', flexDirection: 'column' }, class: "cat-form" }, h("cat-select", { key: 'e88f94e3022868b3ec6ca75a704a45edac6dedc6', label: "Multiple Select", hint: "This is a hint!", ref: el => (this.multipleSelect = el), value: ['1'], placeholder: "Hello World", onCatChange: () => console.log('Multiple change', this.multipleSelect?.value), onCatBlur: e => console.log('Multiple blur', e), multiple: true, noItems: "No results", clearable: true, errorUpdate: false }, h("span", { key: 'a5e00768df01e4f91dfd2b4b3f62a998df32bf7d', slot: "hint" }, "Searching for \"no\" -", '>', " no options are returned!")), h("cat-select", { key: '935aacbe810131079d95d61d9e6fd2efbec03d01', label: "Multiple with img", ref: el => (this.multipleSelectAvatar = el), value: ['1'], placeholder: "Hello World", multiple: true, clearable: true, errorUpdate: false }), h("cat-select", { key: '0b8fbe7e2ec42acf7cbd01fd216d0909befd30a2', label: "Multiple with initials", ref: el => (this.multipleSelectAvatarInitials = el), value: ['1'], placeholder: "Hello World", multiple: true, clearable: true, errorUpdate: false }), h("cat-select", { key: '509741cf8a8f6438649f2a4debe0829fd3b905eb', label: "Multiple with tagging support", hint: "This is a hint!", ref: el => (this.multipleSelectTagging = el), value: { ids: ['1'], tags: ['Test', 'Albania', 'Algeria'] }, placeholder: "Select country", onCatChange: () => console.log('Multiple tagging change', this.multipleSelectTagging?.value), multiple: true, tags: true, clearable: true, errorUpdate: false }), h("cat-select", { key: 'a42ff7c4b8f1686fa0cdbd5a202b4bff59f7e599', label: "Single Select", hint: "This is a hint!", ref: el => (this.singleSelect = el), placeholder: "Search for a country or capital", onCatBlur: e => console.log('Single blur', e), clearable: true, errorUpdate: false }), h("cat-select", { key: 'e29353e92663b785844080bf6ef6937348c80379', label: "Single with img", ref: el => (this.singleSelectAvatar = el), value: '1', placeholder: "Search for a country or capital", clearable: true, errorUpdate: false }), h("cat-select", { key: 'a53e0848faed0a98be3d2bc6e81c1e21c82cbc9c', label: "Single with initials", ref: el => (this.singleSelectAvatarInitials = el), placeholder: "Hello World", clearable: true, errorUpdate: false }), h("cat-dropdown", { key: 'f6173b84ec5d84401dbc7190c6e09719c0412f26', overflow: true }, h("cat-button", { key: '4d45f4bd17867cb4d54078f503e8613441e04374', slot: "trigger", style: { width: '50%' } }, "Open select"), h("div", { key: '2736181440e085cf623c2c3c875edaab23f71a3e', slot: "content", style: { width: '400px' } }, h("cat-select", { key: '9fa27d270fc984bd22ef82de2e54e7ac952f71a2', label: "Single with tagging support", ref: el => (this.singleSelectTagging = el), value: { id: '', tag: 'Albania' }, placeholder: "Search for a country or capital", onCatChange: () => console.log('Single change', this.singleSelectTagging?.value), tagHint: "new country", tags: true, clearable: true, errorUpdate: false, style: { width: '90%' } })))));
|
|
180
180
|
}
|
|
181
181
|
get countryConnector() {
|
|
182
182
|
return {
|
|
@@ -14,7 +14,7 @@ const CatSkeleton = /*@__PURE__*/ proxyCustomElement(class CatSkeleton extends H
|
|
|
14
14
|
this.lines = undefined;
|
|
15
15
|
}
|
|
16
16
|
render() {
|
|
17
|
-
return (h(Host, { key: '
|
|
17
|
+
return (h(Host, { key: '8f1e4584c050cc8b6d1341efd3d8b04ca7223a73' }, Array.from(Array(this.count)).map(() => (h("div", { style: this.style, class: {
|
|
18
18
|
skeleton: true,
|
|
19
19
|
[`skeleton-${this.effect}`]: Boolean(this.effect),
|
|
20
20
|
[`skeleton-${this.variant}`]: Boolean(this.variant),
|
|
@@ -12,9 +12,9 @@ const CatSpinner = /*@__PURE__*/ proxyCustomElement(class CatSpinner extends HTM
|
|
|
12
12
|
this.a11yLabel = undefined;
|
|
13
13
|
}
|
|
14
14
|
render() {
|
|
15
|
-
return (h("span", { key: '
|
|
15
|
+
return (h("span", { key: 'cf1110c7ae2c653c87f44f2668aa3bcc757ed0c9', "aria-label": this.a11yLabel, "aria-hidden": this.a11yLabel ? null : 'true', class: {
|
|
16
16
|
[`spinner-${this.size}`]: this.size !== 'inline'
|
|
17
|
-
} }, h("svg", { key: '
|
|
17
|
+
} }, h("svg", { key: '22d1a1c15575274a75d4203ae9a1c945a199759d', xmlns: "http://www.w3.org/2000/svg", viewBox: "0 0 48 48" }, h("circle", { key: 'f067c870a5699603761b7d8d6e4a32354cef6f7e', cx: "24", cy: "24", r: "21.5" }))));
|
|
18
18
|
}
|
|
19
19
|
static get style() { return CatSpinnerStyle0; }
|
|
20
20
|
}, [1, "cat-spinner", {
|
|
@@ -29,7 +29,7 @@ const CatTab$1 = /*@__PURE__*/ proxyCustomElement(class CatTab extends HTMLEleme
|
|
|
29
29
|
this.catClick.emit(event);
|
|
30
30
|
}
|
|
31
31
|
render() {
|
|
32
|
-
return h(Host, { key: '
|
|
32
|
+
return h(Host, { key: 'e0b1e0562a35130f4b0de08530eb66c9df5ec145' });
|
|
33
33
|
}
|
|
34
34
|
get hostElement() { return this; }
|
|
35
35
|
static get style() { return CatTabStyle0; }
|
|
@@ -63,7 +63,7 @@ const CatTabs$1 = /*@__PURE__*/ proxyCustomElement(class CatTabs extends HTMLEle
|
|
|
63
63
|
this.activate(this.tabs[index]);
|
|
64
64
|
}
|
|
65
65
|
render() {
|
|
66
|
-
return (h(Host, { key: '
|
|
66
|
+
return (h(Host, { key: '05969fc6e983159aaad4a36ab07b6326c5c85589' }, this.tabs.map((tab) => {
|
|
67
67
|
return (h("cat-button", { buttonId: tab.id, role: "tab", part: "tab", class: {
|
|
68
68
|
'cat-tab': true,
|
|
69
69
|
'cat-tab-active': tab.id === this.activeTab,
|
|
@@ -94,15 +94,15 @@ const CatTextarea$1 = /*@__PURE__*/ proxyCustomElement(class CatTextarea extends
|
|
|
94
94
|
}
|
|
95
95
|
}
|
|
96
96
|
render() {
|
|
97
|
-
return (h(Host, { key: '
|
|
97
|
+
return (h(Host, { key: '2fac5152cbeeb9d4a9c4dc0f9539bb1a1503c9e8' }, h("div", { key: '88d992d98f72a0862b3736ad102a0124363e17b6', class: {
|
|
98
98
|
'textarea-field': true,
|
|
99
99
|
'textarea-horizontal': this.horizontal
|
|
100
|
-
} }, h("div", { key: '
|
|
100
|
+
} }, h("div", { key: 'ab23b2ebcc13b7511c4e951041817bb8b1952c0c', class: { 'label-container': true, hidden: this.labelHidden } }, (this.hasSlottedLabel || this.label) && (h("label", { htmlFor: this.id, part: "label" }, h("span", { class: "label-wrapper" }, (this.hasSlottedLabel && h("slot", { name: "label" })) || this.label, h("div", { class: "label-metadata" }, !this.required && (this.requiredMarker ?? 'optional').startsWith('optional') && (h("span", { class: "label-optional", "aria-hidden": "true" }, "(", catI18nRegistry.t('input.optional'), ")")), this.required && this.requiredMarker?.startsWith('required') && (h("span", { class: "label-optional", "aria-hidden": "true" }, "(", catI18nRegistry.t('input.required'), ")")), this.maxLength && (h("div", { class: "label-character-count", "aria-hidden": "true" }, this.value?.length ?? 0, "/", this.maxLength))))))), h("div", { key: '30a02b82d605c5e416a63b8eef5205d41139ce6d', class: "textarea-container" }, h("div", { key: '32aad8e1e15134dad90e991cc3e471b06dcbc9fd', class: {
|
|
101
101
|
'textarea-wrapper': true,
|
|
102
102
|
'textarea-readonly': this.readonly,
|
|
103
103
|
'textarea-disabled': this.disabled,
|
|
104
104
|
'textarea-invalid': this.invalid
|
|
105
|
-
} }, h("textarea", { key: '
|
|
105
|
+
} }, h("textarea", { key: '96d5a02bfdb1c7feb85ce02380a59ff63a7d1760', ...this.nativeAttributes, part: "textarea", ref: el => (this.textarea = el), id: this.id, disabled: this.disabled, maxlength: this.maxLength, minlength: this.minLength, name: this.name, placeholder: this.placeholder, readonly: this.readonly, required: this.required, rows: this.rows, value: this.value, onInput: this.onInput.bind(this), onFocus: this.onFocus.bind(this), onBlur: this.onBlur.bind(this), "aria-invalid": this.invalid ? 'true' : undefined, "aria-describedby": this.hasHint ? this.id + '-hint' : undefined }), this.invalid && (h("cat-icon", { icon: "$cat:input-error", class: "icon-suffix cat-text-danger", size: "l", onClick: () => this.textarea.focus() }))), this.hasHint && (h(CatFormHint, { id: this.id, hint: this.hint, slottedHint: this.hasSlottedHint && h("slot", { name: "hint" }), errorMap: this.errorMap }))))));
|
|
106
106
|
}
|
|
107
107
|
get hasHint() {
|
|
108
108
|
return !!this.hint || !!this.hasSlottedHint || this.invalid;
|
|
@@ -166,7 +166,7 @@ const CatTime$1 = /*@__PURE__*/ proxyCustomElement(class CatTime extends HTMLEle
|
|
|
166
166
|
this.input?.clear();
|
|
167
167
|
}
|
|
168
168
|
render() {
|
|
169
|
-
return (h(Host, { key: '
|
|
169
|
+
return (h(Host, { key: '899fb8f5f263ba560bacb99d111792e9219e057a' }, h("cat-input", { key: 'e2b84c644e265cdc166c7ec50cb873d79ddeb12e', class: "cat-time-input", ref: el => (this.input = el), requiredMarker: this.requiredMarker, horizontal: this.horizontal, autoComplete: this.autoComplete, clearable: this.clearable, disabled: this.disabled, hint: this.hint, icon: this.icon, iconRight: this.iconRight, identifier: this.identifier, label: this.label, labelHidden: this.labelHidden, name: this.name, placeholder: this.placeholder, textPrefix: this.textPrefix, textSuffix: this.textSuffix, readonly: this.readonly, required: this.required, value: this.format(this.selectionTime, false), errors: this.errors, errorUpdate: this.errorUpdate, nativeAttributes: this.nativeAttributes, onCatFocus: e => this.catFocus.emit(e.detail), onCatBlur: e => this.onInputBlur(e.detail) }, h("span", { key: '097ee8e93a2d05d35051ddc1aa105b1e9ebf0528', slot: "label" }, this.hasSlottedLabel && h("slot", { name: "label" }), !this.hasSlottedLabel && this.label, h("span", { key: '5d526fe661331f8eb1a887ddc0eabc3f3338747a', class: "label-aria" }, " (HH:mm)")), h("div", { key: '28fcd51b6e297d552e121a01813c92c564cccbda', slot: "addon", class: "cat-time-addon" }, this.locale.timeFormat === '12' && (h("cat-button", { class: "cat-time-format", disabled: this.disabled || this.readonly, onCatClick: () => this.toggleAm() }, this.isAm ? 'AM' : 'PM')), h("cat-dropdown", { key: 'f93687883da3f3c32027edcd89d6989caad8e504', slot: "addon", placement: this.placement }, h("cat-button", { key: 'eae27c8538ff6564d6b5a735b30e8c2aac07751d', slot: "trigger", class: "cat-time-toggle", disabled: this.disabled || this.readonly, icon: "$cat:timepicker-clock", iconOnly: true, a11yLabel: this.selectionTime ? `${this.locale.change}, ${this.format(this.selectionTime)}` : this.locale.choose }), h("nav", { key: 'a334804d935c713bb95e3bb88fce40fa7f05724c', slot: "content", class: "cat-nav" }, h("ul", { key: '713181fc8597cf4b9486f2fb7aa63fb412180054' }, this.timeArray().map(time => {
|
|
170
170
|
const isoTime = this.formatIso(time);
|
|
171
171
|
const disabled = isBefore(time, this.min ?? null) || isAfter(time, this.max ?? null);
|
|
172
172
|
return (h("li", null, h("cat-button", { class: {
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"file":"cat-time.js","mappings":"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","names":["i18n","CatTime"],"sources":["src/components/cat-time/cat-time-locale.ts","src/components/cat-time/cat-time-math.ts","src/components/cat-time/cat-time.scss?tag=cat-time&encapsulation=shadow","src/components/cat-time/cat-time.tsx"],"sourcesContent":["import { catI18nRegistry as i18n } from '../cat-i18n/cat-i18n-registry';\n\nexport function getHour12(language: string): boolean {\n const dateStr = new Intl.DateTimeFormat(language, { hour: '2-digit', minute: '2-digit' })\n .format(new Date())\n .toLowerCase();\n return dateStr.includes('am') || dateStr.includes('pm');\n}\n\nexport function getLocale(language: string) {\n return {\n change: i18n.t('timepicker.change'),\n choose: i18n.t('timepicker.choose'),\n timeFormat: getHour12(language) ? '12' : '24'\n };\n}\n","export function clampTime(min: string | null, date: Date, max: string | null): Date {\n const [, hhMin, mmMin] = min?.match(/(\\d{2}):(\\d{2})/)?.map(Number) ?? [];\n const [, hhMax, mmMax] = max?.match(/(\\d{2}):(\\d{2})/)?.map(Number) ?? [];\n let minTime = -Infinity;\n let maxTime = Infinity;\n if (hhMin !== undefined && mmMin !== undefined) {\n minTime = new Date(date.getFullYear(), date.getMonth(), date.getDate(), hhMin, mmMin).getTime();\n }\n if (hhMax !== undefined && mmMax !== undefined) {\n maxTime = new Date(date.getFullYear(), date.getMonth(), date.getDate(), hhMax, mmMax).getTime();\n }\n return new Date(Math.min(Math.max(date.getTime(), minTime), maxTime));\n}\n\nexport function isBefore(date: Date, time: string | null): boolean {\n const [, hh, mm] = time?.match(/(\\d{2}):(\\d{2})/)?.map(Number) ?? [];\n if (hh === undefined || mm === undefined) {\n return false;\n }\n return date.getHours() < hh || (date.getHours() === hh && date.getMinutes() < mm);\n}\n\nexport function isAfter(date: Date, time: string | null): boolean {\n const [, hh, mm] = time?.match(/(\\d{2}):(\\d{2})/)?.map(Number) ?? [];\n if (hh === undefined || mm === undefined) {\n return false;\n }\n return date.getHours() > hh || (date.getHours() === hh && date.getMinutes() > mm);\n}\n","@use 'variables' as *;\n@use 'mixins' as *;\n\n:host {\n display: block;\n}\n\n:host([hidden]) {\n display: none;\n}\n\n.label-aria {\n @include cat-visually-hidden;\n}\n\n.cat-time-addon {\n margin-left: -1px;\n}\n\nnav {\n max-height: 16rem;\n\n ul {\n list-style: none;\n margin: 0;\n padding: 0;\n }\n}\n\n.time-disabled {\n opacity: 0.25;\n}\n","import { Placement } from '@floating-ui/dom';\nimport { Component, Element, Event, EventEmitter, Host, Listen, Method, Prop, State, h } from '@stencil/core';\nimport { ErrorMap } from '../cat-form-hint/cat-form-hint';\nimport { catI18nRegistry as i18n } from '../cat-i18n/cat-i18n-registry';\nimport { getLocale } from './cat-time-locale';\nimport { clampTime, isAfter, isBefore } from './cat-time-math';\n\n@Component({\n tag: 'cat-time',\n styleUrl: 'cat-time.scss',\n shadow: true\n})\nexport class CatTime {\n private readonly language = i18n.getLocale();\n private readonly locale = getLocale(this.language);\n private input?: HTMLCatInputElement;\n\n @Element() hostElement!: HTMLElement;\n\n @State() hasSlottedLabel = false;\n\n @State() hasSlottedHint = false;\n\n @State() selectionTime: Date | null = null;\n\n @State() isAm = true;\n\n /**\n * Whether the label need a marker to shown if the input is required or optional.\n */\n @Prop() requiredMarker?: 'none' | 'required' | 'optional' | 'none!' | 'optional!' | 'required!' = 'optional';\n\n /**\n * Whether the label is on top or left.\n */\n @Prop() horizontal = false;\n\n /**\n * Hint for form autofill feature.\n */\n @Prop() autoComplete?: string;\n\n /**\n * Whether the input should show a clear button.\n */\n @Prop() clearable = false;\n\n /**\n * Whether the input is disabled.\n */\n @Prop() disabled = false;\n\n /**\n * Optional hint text(s) to be displayed with the input.\n */\n @Prop() hint?: string | string[];\n\n /**\n * The name of an icon to be displayed in the input.\n */\n @Prop() icon?: string;\n\n /**\n * Display the icon on the right.\n */\n @Prop() iconRight = false;\n\n /**\n * A unique identifier for the input.\n */\n @Prop() identifier?: string;\n\n /**\n * The label for the input.\n */\n @Prop() label = '';\n\n /**\n * Visually hide the label, but still show it to assistive technologies like screen readers.\n */\n @Prop() labelHidden = false;\n\n /**\n * A maximum time value given in HH:mm format.\n */\n @Prop() max?: string;\n\n /**\n * A minimum value given in HH:mm format.\n */\n @Prop() min?: string;\n\n /**\n * The name of the form control. Submitted with the form as part of a name/value pair.\n */\n @Prop() name?: string;\n\n /**\n * The placeholder text to display within the input.\n */\n @Prop() placeholder?: string;\n\n /**\n * A textual prefix to be displayed in the input.\n */\n @Prop() textPrefix?: string;\n\n /**\n * A textual suffix to be displayed in the input.\n */\n @Prop() textSuffix?: string;\n\n /**\n * The value is not editable.\n */\n @Prop() readonly = false;\n\n /**\n * A value is required or must be check for the form to be submittable.\n */\n @Prop() required = false;\n\n /**\n * The value of the control given in HH:mm format\n */\n @Prop({ mutable: true }) value?: string;\n\n /**\n * The validation errors for this input. Will render a hint under the input\n * with the translated error message(s) `error.${key}`. If an object is\n * passed, the keys will be used as error keys and the values translation\n * parameters.\n * If the value is `true`, the input will be marked as invalid without any\n * hints under the input.\n */\n @Prop() errors?: boolean | string[] | ErrorMap;\n\n /**\n * Fine-grained control over when the errors are shown. Can be `false` to\n * never show errors, `true` to show errors on blur, or a number to show\n * errors on change with the given delay in milliseconds.\n */\n @Prop() errorUpdate: boolean | number = 0;\n\n /**\n * Attributes that will be added to the native HTML input element.\n */\n @Prop() nativeAttributes?: { [key: string]: string };\n\n /**\n * The placement of the dropdown.\n */\n @Prop() placement: Placement = 'bottom-end';\n\n /**\n * The step size for times in minutes.\n */\n @Prop() step = 30;\n\n /**\n * Emitted when the value is changed.\n */\n @Event() catChange!: EventEmitter<string>;\n\n /**\n * Emitted when the input received focus.\n */\n @Event() catFocus!: EventEmitter<FocusEvent>;\n\n /**\n * Emitted when the input loses focus.\n */\n @Event() catBlur!: EventEmitter<FocusEvent>;\n\n componentWillLoad() {\n this.syncValue(this.value ?? '');\n }\n\n componentWillRender(): void {\n this.hasSlottedLabel = !!this.hostElement.querySelector('[slot=\"label\"]');\n this.hasSlottedHint = !!this.hostElement.querySelector('[slot=\"hint\"]');\n }\n\n componentDidLoad() {\n this.input?.mask({\n time: true,\n timeFormat: this.locale.timeFormat,\n timePattern: ['h', 'm']\n });\n }\n\n @Listen('catOpen')\n onOpen() {\n const query = (selector: string) => this.hostElement.shadowRoot?.querySelector<HTMLCatButtonElement>(selector);\n const time = clampTime(this.min ?? null, this.selectionTime ?? new Date(2000, 5, 1, 8), this.max ?? null);\n const elem1 = query(`[data-time=\"${this.formatIso(time)}\"]`);\n time.setMinutes(Math.floor(time.getMinutes() / this.step) * this.step);\n const elem2 = query(`[data-time=\"${this.formatIso(time)}\"]`);\n setTimeout(() => {\n (elem2 ?? elem1)?.doFocus();\n (elem2 ?? elem1)?.scrollIntoView(this.selectionTime ? { block: 'center' } : undefined);\n }); // not entirely sure why this is necessary\n }\n\n /**\n * Select a time in the picker.\n *\n * @param date The time to select.\n */\n @Method()\n async select(date: Date | null): Promise<void> {\n const oldValue = this.value;\n if (!date) {\n this.selectionTime = null;\n this.value = undefined;\n } else {\n const time = clampTime(this.min ?? null, date, this.max ?? null);\n this.isAm = this.format(time).toLowerCase().includes('am');\n this.selectionTime = time;\n this.value = this.formatIso(time);\n }\n // we need to set the input explicitly to sync the input even without a\n // rerender (if the value is not changed)\n if (this.input) {\n this.input.value = this.format(this.selectionTime, false);\n }\n if (oldValue !== this.value) {\n this.catChange.emit(this.value);\n }\n }\n\n /**\n * Programmatically move focus to the input. Use this method instead of\n * `input.focus()`.\n *\n * @param options An optional object providing options to control aspects of\n * the focusing process.\n */\n @Method()\n async doFocus(options?: FocusOptions): Promise<void> {\n this.input?.doFocus(options);\n }\n\n /**\n * Programmatically remove focus from the input. Use this method instead of\n * `input.blur()`.\n */\n @Method()\n async doBlur(): Promise<void> {\n this.input?.doBlur();\n }\n\n /**\n * Clear the input.\n */\n @Method()\n async clear(): Promise<void> {\n this.input?.clear();\n }\n\n render() {\n return (\n <Host>\n <cat-input\n class=\"cat-time-input\"\n ref={el => (this.input = el as HTMLCatInputElement)}\n requiredMarker={this.requiredMarker}\n horizontal={this.horizontal}\n autoComplete={this.autoComplete}\n clearable={this.clearable}\n disabled={this.disabled}\n hint={this.hint}\n icon={this.icon}\n iconRight={this.iconRight}\n identifier={this.identifier}\n label={this.label}\n labelHidden={this.labelHidden}\n name={this.name}\n placeholder={this.placeholder}\n textPrefix={this.textPrefix}\n textSuffix={this.textSuffix}\n readonly={this.readonly}\n required={this.required}\n value={this.format(this.selectionTime, false)}\n errors={this.errors}\n errorUpdate={this.errorUpdate}\n nativeAttributes={this.nativeAttributes}\n onCatFocus={e => this.catFocus.emit(e.detail)}\n onCatBlur={e => this.onInputBlur(e.detail)}\n >\n <span slot=\"label\">\n {this.hasSlottedLabel && <slot name=\"label\"></slot>}\n {!this.hasSlottedLabel && this.label}\n <span class=\"label-aria\"> (HH:mm)</span>\n </span>\n <div slot=\"addon\" class=\"cat-time-addon\">\n {this.locale.timeFormat === '12' && (\n <cat-button\n class=\"cat-time-format\"\n disabled={this.disabled || this.readonly}\n onCatClick={() => this.toggleAm()}\n >\n {this.isAm ? 'AM' : 'PM'}\n </cat-button>\n )}\n <cat-dropdown slot=\"addon\" placement={this.placement}>\n <cat-button\n slot=\"trigger\"\n class=\"cat-time-toggle\"\n disabled={this.disabled || this.readonly}\n icon=\"$cat:timepicker-clock\"\n iconOnly\n a11yLabel={\n this.selectionTime ? `${this.locale.change}, ${this.format(this.selectionTime)}` : this.locale.choose\n }\n ></cat-button>\n <nav slot=\"content\" class=\"cat-nav\">\n <ul>\n {this.timeArray().map(time => {\n const isoTime = this.formatIso(time);\n const disabled = isBefore(time, this.min ?? null) || isAfter(time, this.max ?? null);\n return (\n <li>\n <cat-button\n class={{\n 'cat-nav-item': true,\n 'time-disabled': disabled\n }}\n disabled={disabled}\n active={isoTime === this.value}\n color={isoTime === this.value ? 'primary' : 'secondary'}\n variant={isoTime === this.value ? 'filled' : 'outlined'}\n onCatClick={() => this.select(time)}\n data-time={isoTime}\n >\n {this.format(time)}\n </cat-button>\n </li>\n );\n })}\n </ul>\n </nav>\n </cat-dropdown>\n </div>\n {this.hasSlottedHint && (\n <span slot=\"hint\">\n <slot name=\"hint\"></slot>\n </span>\n )}\n </cat-input>\n </Host>\n );\n }\n\n private timeArray() {\n const result = [];\n const start = new Date(2000, 5, 1, 0, 0, 0);\n let time = new Date(start.getTime());\n while (time.getDate() === start.getDate()) {\n result.push(time);\n time = new Date(time.getTime() + this.step * 60000);\n }\n return result;\n }\n\n private syncValue(value: string) {\n const [, hh, mm] = value.match(/(\\d{2}):(\\d{2})/)?.map(Number) ?? [];\n if (hh === undefined || mm === undefined) {\n this.select(null);\n return;\n }\n this.select(\n this.locale.timeFormat === '24'\n ? new Date(2000, 5, 1, hh, mm, 0)\n : new Date(2000, 5, 1, (hh % 12) + (this.isAm ? 0 : 12), mm, 0)\n );\n }\n\n private toggleAm() {\n if (this.selectionTime) {\n this.select(new Date(this.selectionTime.getTime() + (this.isAm ? 12 : -12) * 3600000));\n } else {\n this.isAm = !this.isAm;\n }\n }\n\n private onInputBlur(e: FocusEvent) {\n this.syncValue(this.input?.value ?? '');\n this.catBlur.emit(e);\n }\n\n private format(date: Date | null, includeAmPm = true) {\n const str = date\n ? new Intl.DateTimeFormat(this.language, {\n hour: '2-digit',\n minute: '2-digit'\n }).format(date)\n : '';\n return includeAmPm ? str : str.replace(/\\s?(am|pm)/i, '');\n }\n\n private formatIso(date: Date) {\n return `${date.getHours().toString().padStart(2, '0')}:${date.getMinutes().toString().padStart(2, '0')}`;\n }\n}\n"],"version":3}
|
|
1
|
+
{"file":"cat-time.js","mappings":"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","names":["i18n","CatTime"],"sources":["src/components/cat-time/cat-time-locale.ts","src/components/cat-time/cat-time-math.ts","src/components/cat-time/cat-time.scss?tag=cat-time&encapsulation=shadow","src/components/cat-time/cat-time.tsx"],"sourcesContent":["import { catI18nRegistry as i18n } from '../cat-i18n/cat-i18n-registry';\n\nexport function getHour12(language: string): boolean {\n const dateStr = new Intl.DateTimeFormat(language, { hour: '2-digit', minute: '2-digit' })\n .format(new Date())\n .toLowerCase();\n return dateStr.includes('am') || dateStr.includes('pm');\n}\n\nexport function getLocale(language: string) {\n return {\n change: i18n.t('timepicker.change'),\n choose: i18n.t('timepicker.choose'),\n timeFormat: getHour12(language) ? '12' : '24'\n };\n}\n","export function clampTime(min: string | null, date: Date, max: string | null): Date {\n const [, hhMin, mmMin] = min?.match(/(\\d{2}):(\\d{2})/)?.map(Number) ?? [];\n const [, hhMax, mmMax] = max?.match(/(\\d{2}):(\\d{2})/)?.map(Number) ?? [];\n let minTime = -Infinity;\n let maxTime = Infinity;\n if (hhMin !== undefined && mmMin !== undefined) {\n minTime = new Date(date.getFullYear(), date.getMonth(), date.getDate(), hhMin, mmMin).getTime();\n }\n if (hhMax !== undefined && mmMax !== undefined) {\n maxTime = new Date(date.getFullYear(), date.getMonth(), date.getDate(), hhMax, mmMax).getTime();\n }\n return new Date(Math.min(Math.max(date.getTime(), minTime), maxTime));\n}\n\nexport function isBefore(date: Date, time: string | null): boolean {\n const [, hh, mm] = time?.match(/(\\d{2}):(\\d{2})/)?.map(Number) ?? [];\n if (hh === undefined || mm === undefined) {\n return false;\n }\n return date.getHours() < hh || (date.getHours() === hh && date.getMinutes() < mm);\n}\n\nexport function isAfter(date: Date, time: string | null): boolean {\n const [, hh, mm] = time?.match(/(\\d{2}):(\\d{2})/)?.map(Number) ?? [];\n if (hh === undefined || mm === undefined) {\n return false;\n }\n return date.getHours() > hh || (date.getHours() === hh && date.getMinutes() > mm);\n}\n","@use 'variables' as *;\n@use 'mixins' as *;\n\n:host {\n display: block;\n}\n\n:host([hidden]) {\n display: none;\n}\n\n.label-aria {\n @include cat-visually-hidden;\n}\n\n.cat-time-addon {\n margin-left: -1px;\n}\n\nnav {\n max-height: 16rem;\n\n ul {\n list-style: none;\n margin: 0;\n padding: 0;\n }\n}\n\n.time-disabled {\n opacity: 0.25;\n}\n","import { Placement } from '@floating-ui/dom';\nimport { Component, Element, Event, EventEmitter, Host, Listen, Method, Prop, State, h } from '@stencil/core';\nimport { ErrorMap } from '../cat-form-hint/cat-form-hint';\nimport { catI18nRegistry as i18n } from '../cat-i18n/cat-i18n-registry';\nimport { getLocale } from './cat-time-locale';\nimport { clampTime, isAfter, isBefore } from './cat-time-math';\n\n/**\n * A time input component to select a time in a dropdown.\n */\n@Component({\n tag: 'cat-time',\n styleUrl: 'cat-time.scss',\n shadow: true\n})\nexport class CatTime {\n private readonly language = i18n.getLocale();\n private readonly locale = getLocale(this.language);\n private input?: HTMLCatInputElement;\n\n @Element() hostElement!: HTMLElement;\n\n @State() hasSlottedLabel = false;\n\n @State() hasSlottedHint = false;\n\n @State() selectionTime: Date | null = null;\n\n @State() isAm = true;\n\n /**\n * Whether the label need a marker to shown if the input is required or optional.\n */\n @Prop() requiredMarker?: 'none' | 'required' | 'optional' | 'none!' | 'optional!' | 'required!' = 'optional';\n\n /**\n * Whether the label is on top or left.\n */\n @Prop() horizontal = false;\n\n /**\n * Hint for form autofill feature.\n */\n @Prop() autoComplete?: string;\n\n /**\n * Whether the input should show a clear button.\n */\n @Prop() clearable = false;\n\n /**\n * Whether the input is disabled.\n */\n @Prop() disabled = false;\n\n /**\n * Optional hint text(s) to be displayed with the input.\n */\n @Prop() hint?: string | string[];\n\n /**\n * The name of an icon to be displayed in the input.\n */\n @Prop() icon?: string;\n\n /**\n * Display the icon on the right.\n */\n @Prop() iconRight = false;\n\n /**\n * A unique identifier for the input.\n */\n @Prop() identifier?: string;\n\n /**\n * The label for the input.\n */\n @Prop() label = '';\n\n /**\n * Visually hide the label, but still show it to assistive technologies like screen readers.\n */\n @Prop() labelHidden = false;\n\n /**\n * A maximum time value given in HH:mm format.\n */\n @Prop() max?: string;\n\n /**\n * A minimum value given in HH:mm format.\n */\n @Prop() min?: string;\n\n /**\n * The name of the form control. Submitted with the form as part of a name/value pair.\n */\n @Prop() name?: string;\n\n /**\n * The placeholder text to display within the input.\n */\n @Prop() placeholder?: string;\n\n /**\n * A textual prefix to be displayed in the input.\n */\n @Prop() textPrefix?: string;\n\n /**\n * A textual suffix to be displayed in the input.\n */\n @Prop() textSuffix?: string;\n\n /**\n * The value is not editable.\n */\n @Prop() readonly = false;\n\n /**\n * A value is required or must be check for the form to be submittable.\n */\n @Prop() required = false;\n\n /**\n * The value of the control given in HH:mm format\n */\n @Prop({ mutable: true }) value?: string;\n\n /**\n * The validation errors for this input. Will render a hint under the input\n * with the translated error message(s) `error.${key}`. If an object is\n * passed, the keys will be used as error keys and the values translation\n * parameters.\n * If the value is `true`, the input will be marked as invalid without any\n * hints under the input.\n */\n @Prop() errors?: boolean | string[] | ErrorMap;\n\n /**\n * Fine-grained control over when the errors are shown. Can be `false` to\n * never show errors, `true` to show errors on blur, or a number to show\n * errors on change with the given delay in milliseconds.\n */\n @Prop() errorUpdate: boolean | number = 0;\n\n /**\n * Attributes that will be added to the native HTML input element.\n */\n @Prop() nativeAttributes?: { [key: string]: string };\n\n /**\n * The placement of the dropdown.\n */\n @Prop() placement: Placement = 'bottom-end';\n\n /**\n * The step size for times in minutes.\n */\n @Prop() step = 30;\n\n /**\n * Emitted when the value is changed.\n */\n @Event() catChange!: EventEmitter<string>;\n\n /**\n * Emitted when the input received focus.\n */\n @Event() catFocus!: EventEmitter<FocusEvent>;\n\n /**\n * Emitted when the input loses focus.\n */\n @Event() catBlur!: EventEmitter<FocusEvent>;\n\n componentWillLoad() {\n this.syncValue(this.value ?? '');\n }\n\n componentWillRender(): void {\n this.hasSlottedLabel = !!this.hostElement.querySelector('[slot=\"label\"]');\n this.hasSlottedHint = !!this.hostElement.querySelector('[slot=\"hint\"]');\n }\n\n componentDidLoad() {\n this.input?.mask({\n time: true,\n timeFormat: this.locale.timeFormat,\n timePattern: ['h', 'm']\n });\n }\n\n @Listen('catOpen')\n onOpen() {\n const query = (selector: string) => this.hostElement.shadowRoot?.querySelector<HTMLCatButtonElement>(selector);\n const time = clampTime(this.min ?? null, this.selectionTime ?? new Date(2000, 5, 1, 8), this.max ?? null);\n const elem1 = query(`[data-time=\"${this.formatIso(time)}\"]`);\n time.setMinutes(Math.floor(time.getMinutes() / this.step) * this.step);\n const elem2 = query(`[data-time=\"${this.formatIso(time)}\"]`);\n setTimeout(() => {\n (elem2 ?? elem1)?.doFocus();\n (elem2 ?? elem1)?.scrollIntoView(this.selectionTime ? { block: 'center' } : undefined);\n }); // not entirely sure why this is necessary\n }\n\n /**\n * Select a time in the picker.\n *\n * @param date The time to select.\n */\n @Method()\n async select(date: Date | null): Promise<void> {\n const oldValue = this.value;\n if (!date) {\n this.selectionTime = null;\n this.value = undefined;\n } else {\n const time = clampTime(this.min ?? null, date, this.max ?? null);\n this.isAm = this.format(time).toLowerCase().includes('am');\n this.selectionTime = time;\n this.value = this.formatIso(time);\n }\n // we need to set the input explicitly to sync the input even without a\n // rerender (if the value is not changed)\n if (this.input) {\n this.input.value = this.format(this.selectionTime, false);\n }\n if (oldValue !== this.value) {\n this.catChange.emit(this.value);\n }\n }\n\n /**\n * Programmatically move focus to the input. Use this method instead of\n * `input.focus()`.\n *\n * @param options An optional object providing options to control aspects of\n * the focusing process.\n */\n @Method()\n async doFocus(options?: FocusOptions): Promise<void> {\n this.input?.doFocus(options);\n }\n\n /**\n * Programmatically remove focus from the input. Use this method instead of\n * `input.blur()`.\n */\n @Method()\n async doBlur(): Promise<void> {\n this.input?.doBlur();\n }\n\n /**\n * Clear the input.\n */\n @Method()\n async clear(): Promise<void> {\n this.input?.clear();\n }\n\n render() {\n return (\n <Host>\n <cat-input\n class=\"cat-time-input\"\n ref={el => (this.input = el as HTMLCatInputElement)}\n requiredMarker={this.requiredMarker}\n horizontal={this.horizontal}\n autoComplete={this.autoComplete}\n clearable={this.clearable}\n disabled={this.disabled}\n hint={this.hint}\n icon={this.icon}\n iconRight={this.iconRight}\n identifier={this.identifier}\n label={this.label}\n labelHidden={this.labelHidden}\n name={this.name}\n placeholder={this.placeholder}\n textPrefix={this.textPrefix}\n textSuffix={this.textSuffix}\n readonly={this.readonly}\n required={this.required}\n value={this.format(this.selectionTime, false)}\n errors={this.errors}\n errorUpdate={this.errorUpdate}\n nativeAttributes={this.nativeAttributes}\n onCatFocus={e => this.catFocus.emit(e.detail)}\n onCatBlur={e => this.onInputBlur(e.detail)}\n >\n <span slot=\"label\">\n {this.hasSlottedLabel && <slot name=\"label\"></slot>}\n {!this.hasSlottedLabel && this.label}\n <span class=\"label-aria\"> (HH:mm)</span>\n </span>\n <div slot=\"addon\" class=\"cat-time-addon\">\n {this.locale.timeFormat === '12' && (\n <cat-button\n class=\"cat-time-format\"\n disabled={this.disabled || this.readonly}\n onCatClick={() => this.toggleAm()}\n >\n {this.isAm ? 'AM' : 'PM'}\n </cat-button>\n )}\n <cat-dropdown slot=\"addon\" placement={this.placement}>\n <cat-button\n slot=\"trigger\"\n class=\"cat-time-toggle\"\n disabled={this.disabled || this.readonly}\n icon=\"$cat:timepicker-clock\"\n iconOnly\n a11yLabel={\n this.selectionTime ? `${this.locale.change}, ${this.format(this.selectionTime)}` : this.locale.choose\n }\n ></cat-button>\n <nav slot=\"content\" class=\"cat-nav\">\n <ul>\n {this.timeArray().map(time => {\n const isoTime = this.formatIso(time);\n const disabled = isBefore(time, this.min ?? null) || isAfter(time, this.max ?? null);\n return (\n <li>\n <cat-button\n class={{\n 'cat-nav-item': true,\n 'time-disabled': disabled\n }}\n disabled={disabled}\n active={isoTime === this.value}\n color={isoTime === this.value ? 'primary' : 'secondary'}\n variant={isoTime === this.value ? 'filled' : 'outlined'}\n onCatClick={() => this.select(time)}\n data-time={isoTime}\n >\n {this.format(time)}\n </cat-button>\n </li>\n );\n })}\n </ul>\n </nav>\n </cat-dropdown>\n </div>\n {this.hasSlottedHint && (\n <span slot=\"hint\">\n <slot name=\"hint\"></slot>\n </span>\n )}\n </cat-input>\n </Host>\n );\n }\n\n private timeArray() {\n const result = [];\n const start = new Date(2000, 5, 1, 0, 0, 0);\n let time = new Date(start.getTime());\n while (time.getDate() === start.getDate()) {\n result.push(time);\n time = new Date(time.getTime() + this.step * 60000);\n }\n return result;\n }\n\n private syncValue(value: string) {\n const [, hh, mm] = value.match(/(\\d{2}):(\\d{2})/)?.map(Number) ?? [];\n if (hh === undefined || mm === undefined) {\n this.select(null);\n return;\n }\n this.select(\n this.locale.timeFormat === '24'\n ? new Date(2000, 5, 1, hh, mm, 0)\n : new Date(2000, 5, 1, (hh % 12) + (this.isAm ? 0 : 12), mm, 0)\n );\n }\n\n private toggleAm() {\n if (this.selectionTime) {\n this.select(new Date(this.selectionTime.getTime() + (this.isAm ? 12 : -12) * 3600000));\n } else {\n this.isAm = !this.isAm;\n }\n }\n\n private onInputBlur(e: FocusEvent) {\n this.syncValue(this.input?.value ?? '');\n this.catBlur.emit(e);\n }\n\n private format(date: Date | null, includeAmPm = true) {\n const str = date\n ? new Intl.DateTimeFormat(this.language, {\n hour: '2-digit',\n minute: '2-digit'\n }).format(date)\n : '';\n return includeAmPm ? str : str.replace(/\\s?(am|pm)/i, '');\n }\n\n private formatIso(date: Date) {\n return `${date.getHours().toString().padStart(2, '0')}:${date.getMinutes().toString().padStart(2, '0')}`;\n }\n}\n"],"version":3}
|
|
@@ -62,7 +62,7 @@ const CatToggle$1 = /*@__PURE__*/ proxyCustomElement(class CatToggle extends HTM
|
|
|
62
62
|
this.input.blur();
|
|
63
63
|
}
|
|
64
64
|
render() {
|
|
65
|
-
return (h(Host, { key: '
|
|
65
|
+
return (h(Host, { key: '08337e6aece1d072c3c4540e4c5e97562a0c1f4c' }, h("label", { key: '79b0b9d2d136125ba7f15be32a3a34da73488a2f', htmlFor: this.id, class: { 'is-hidden': this.labelHidden, 'is-disabled': this.disabled, 'label-left': this.labelLeft } }, h("input", { key: '0c22754e817b0d6eab349583287c8d30f25f84ad', ...this.nativeAttributes, part: "input", ref: el => (this.input = el), id: this.id, type: "checkbox", name: this.name, value: this.value, checked: this.checked, required: this.required, disabled: this.disabled, class: "form-check-input", role: "switch", onInput: this.onInput.bind(this), onFocus: this.onFocus.bind(this), onBlur: this.onBlur.bind(this), "aria-describedby": this.hasHint ? this.id + '-hint' : undefined }), h("span", { key: '7a08a4ec1fc79d18c16065697f672bf7f4e35908', class: "toggle" }), h("span", { key: 'b78eacbcb262452ba33972f2647dc69b01c1bd20', class: "label", part: "label" }, (this.hasSlottedLabel && h("slot", { name: "label" })) || this.label)), this.hasHint && (h("div", { class: { 'hint-wrapper': true, 'label-left': this.labelLeft } }, h("div", { class: "toggle-placeholder" }), h(CatFormHint, { id: this.id, hint: this.hint, slottedHint: this.hasSlottedHint && h("slot", { name: "hint" }) })))));
|
|
66
66
|
}
|
|
67
67
|
get hasHint() {
|
|
68
68
|
return !!this.hint || !!this.hasSlottedHint;
|
|
@@ -67,12 +67,12 @@ const CatTooltip$1 = /*@__PURE__*/ proxyCustomElement(class CatTooltip extends H
|
|
|
67
67
|
}
|
|
68
68
|
}
|
|
69
69
|
render() {
|
|
70
|
-
return (h(Host, { key: '
|
|
70
|
+
return (h(Host, { key: '742d0c7f6203b8e685886f1c272562176b348fa9' }, h("slot", { key: '0e7bf66c6aadcf0b87fbbadf2d3e357ebb9b98c0' }), h("div", { key: '14eaa638d2f3170be57188d32841e22c98f1319b', ref: el => (this.tooltip = el), id: this.id, role: "tooltip", "aria-hidden": !this.open, "aria-live": this.open ? 'polite' : 'off', class: {
|
|
71
71
|
tooltip: true,
|
|
72
72
|
'tooltip-hidden': this.inactive,
|
|
73
73
|
'tooltip-round': this.round,
|
|
74
74
|
[`tooltip-${this.size}`]: Boolean(this.size)
|
|
75
|
-
} }, h("slot", { key: '
|
|
75
|
+
} }, h("slot", { key: '724fac6b27719c0cb9d243aab8ab4485fa72fc43', name: "content" }, h("p", { key: '2d6c325c46035725ac8c81330038888eefeb0c89' }, this.content)))));
|
|
76
76
|
}
|
|
77
77
|
async update() {
|
|
78
78
|
if (this.trigger && this.tooltip) {
|