@haiilo/catalyst 13.0.3 → 13.2.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/{p-8206d34b.entry.js → p-1823cdaa.entry.js} +4 -4
- package/dist/catalyst/p-1823cdaa.entry.js.map +1 -0
- package/dist/cjs/cat-alert_30.cjs.entry.js +58 -53
- package/dist/cjs/cat-alert_30.cjs.entry.js.map +1 -1
- package/dist/cjs/catalyst.cjs.js +1 -1
- package/dist/cjs/loader.cjs.js +1 -1
- package/dist/collection/components/cat-alert/cat-alert.js +1 -1
- package/dist/collection/components/cat-badge/cat-badge.js +1 -1
- package/dist/collection/components/cat-button-group/cat-button-group.js +1 -1
- package/dist/collection/components/cat-card/cat-card.js +1 -1
- package/dist/collection/components/cat-checkbox/cat-checkbox.js +2 -2
- package/dist/collection/components/cat-date/cat-date.js +2 -2
- package/dist/collection/components/cat-date-inline/cat-date-inline.js +4 -4
- package/dist/collection/components/cat-datepicker/cat-datepicker.js +3 -3
- package/dist/collection/components/cat-datepicker-inline/cat-datepicker-inline.js +2 -2
- package/dist/collection/components/cat-dropdown/cat-dropdown.js +1 -1
- package/dist/collection/components/cat-form-group/cat-form-group.js +1 -1
- package/dist/collection/components/cat-icon/cat-icon.js +1 -1
- package/dist/collection/components/cat-input/cat-input.css +60 -0
- package/dist/collection/components/cat-input/cat-input.js +47 -4
- package/dist/collection/components/cat-input/cat-input.js.map +1 -1
- package/dist/collection/components/cat-pagination/cat-pagination.js +2 -2
- package/dist/collection/components/cat-radio/cat-radio.js +2 -2
- 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/cat-select.js +4 -4
- 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-tag/cat-tag.js +1 -1
- package/dist/collection/components/cat-textarea/cat-textarea.js +3 -3
- package/dist/collection/components/cat-time/cat-time.js +2 -2
- package/dist/collection/components/cat-toggle/cat-toggle.js +2 -2
- package/dist/collection/components/cat-tooltip/cat-tooltip.js +2 -2
- package/dist/components/cat-alert.js +1 -1
- package/dist/components/cat-badge.js +1 -1
- package/dist/components/cat-button-group.js +1 -1
- package/dist/components/cat-card.js +1 -1
- package/dist/components/cat-checkbox2.js +2 -2
- package/dist/components/cat-date-inline2.js +4 -4
- package/dist/components/cat-date.js +2 -2
- package/dist/components/cat-datepicker-inline.js +2 -2
- package/dist/components/cat-datepicker.js +3 -3
- package/dist/components/cat-dropdown2.js +1 -1
- package/dist/components/cat-form-group.js +1 -1
- package/dist/components/cat-icon2.js +1 -1
- package/dist/components/cat-input2.js +12 -5
- package/dist/components/cat-input2.js.map +1 -1
- package/dist/components/cat-pagination.js +2 -2
- package/dist/components/cat-radio-group.js +1 -1
- package/dist/components/cat-radio.js +2 -2
- package/dist/components/cat-scrollable2.js +3 -3
- package/dist/components/cat-select-demo.js +1 -1
- package/dist/components/cat-select2.js +4 -4
- 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-tag.js +1 -1
- package/dist/components/cat-textarea.js +3 -3
- package/dist/components/cat-time.js +2 -2
- package/dist/components/cat-toggle.js +2 -2
- package/dist/components/cat-tooltip.js +2 -2
- package/dist/esm/cat-alert_30.entry.js +58 -53
- package/dist/esm/cat-alert_30.entry.js.map +1 -1
- package/dist/esm/catalyst.js +1 -1
- package/dist/esm/loader.js +1 -1
- package/dist/types/components/cat-input/cat-input.d.ts +8 -0
- package/dist/types/components.d.ts +16 -0
- package/package.json +2 -2
- package/dist/catalyst/p-8206d34b.entry.js.map +0 -1
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"cat-input.js","sourceRoot":"","sources":["../../../src/components/cat-input/cat-input.tsx"],"names":[],"mappings":"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","sourcesContent":["import { AttachInternals, Component, Element, Event, EventEmitter, h, Method, Prop, State, Watch } from '@stencil/core';\nimport { coerceBoolean, coerceNumber } from '../../utils/coerce';\nimport { CatFormHint, ErrorMap } from '../cat-form-hint/cat-form-hint';\nimport { catI18nRegistry as i18n } from '../cat-i18n/cat-i18n-registry';\nimport { InputType } from './input-type';\nimport { formatDate, formatTime } from 'cleave-zen';\n\nlet nextUniqueId = 0;\n\ntype TimeUnit = 'h' | 'm' | 's';\ntype TimeFormatType = '12' | '24';\ntype DateUnit = 'Y' | 'y' | 'm' | 'd';\n\nexport interface FormatTimeMaskOptions {\n timePattern?: TimeUnit[];\n timeFormat?: TimeFormatType;\n}\n\nexport interface FormatDateMaskOptions {\n delimiter?: string;\n datePattern?: DateUnit[];\n dateMin?: string;\n dateMax?: string;\n}\n\n/**\n * Inputs are used to allow users to provide text input when the expected input\n * is short. As well as plain text, Input supports various types of text,\n * including passwords and numbers.\n *\n * @slot hint - Optional hint element to be displayed with the input.\n * @slot label - The slotted label. If both the label property and the label slot are present, only the label slot will be displayed.\n * @slot counter - Custom counter element to be displayed in the top right corner of the label.\n * @part label - The native label element.\n * @part input - The native input element.\n * @part prefix - The text prefix.\n * @part suffix - The text suffix.\n */\n@Component({\n tag: 'cat-input',\n styleUrl: 'cat-input.scss',\n formAssociated: true,\n shadow: {\n delegatesFocus: true\n }\n})\nexport class CatInput {\n private readonly _id = `cat-input-${nextUniqueId++}`;\n private get id() {\n return this.identifier || this._id;\n }\n\n private input!: HTMLInputElement;\n private errorMapSrc?: ErrorMap | true;\n\n @Element() hostElement!: HTMLElement;\n\n @State() hasSlottedLabel = false;\n\n @State() hasSlottedHint = false;\n\n @State() hasSlottedCounter = false;\n\n @State() isPasswordShown = false;\n\n @State() errorMap?: ErrorMap | true;\n\n @AttachInternals() internals!: ElementInternals;\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?: boolean;\n\n /**\n * If the horizontal value is not provided, this fallback value is used. Can be set by form-group.\n * @internal\n */\n @Prop() fallbackHorizontal?: boolean;\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 should show a password toggle button for password inputs.\n */\n @Prop() togglePassword = false;\n\n /**\n * Whether the input is disabled.\n */\n @Prop() disabled = false;\n\n /**\n * Displays the input in a loading state with a spinner.\n */\n @Prop() loading = 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 value for numeric values.\n */\n @Prop() max?: number | string;\n\n /**\n * A maximum length (number of characters) for textual values.\n */\n @Prop() maxLength?: number;\n\n /**\n * A minimum value for numeric values.\n */\n @Prop() min?: number | string;\n\n /**\n * A minimum length (number of characters) for textual values.\n */\n @Prop() minLength?: number;\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 * Use round input edges.\n */\n @Prop() round = false;\n\n /**\n * Type of form control.\n */\n @Prop() type: InputType = 'text';\n\n /**\n * The value of the control.\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 change with the given delay in milliseconds or immediately on blur.\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 * A unique identifier for the underlying native element that is used for\n * testing purposes. The attribute is added as `data-test` attribute and acts\n * as a shorthand for `nativeAttributes={ 'data-test': 'test-Id' }`.\n */\n @Prop() testId?: string;\n\n /**\n * Activates cleave-zen time mask on input\n */\n @Prop() timeMaskOptions?: FormatTimeMaskOptions;\n\n /**\n * Activates cleave-zen date mask on input\n */\n @Prop() dateMaskOptions?: FormatDateMaskOptions;\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(): void {\n this.onErrorsChanged(this.errors, undefined, false);\n }\n\n componentWillRender(): void {\n this.internals.setFormValue(this.value ?? null);\n this.hasSlottedLabel = !!this.hostElement.querySelector('[slot=\"label\"]');\n this.hasSlottedHint = !!this.hostElement.querySelector('[slot=\"hint\"]');\n this.hasSlottedCounter = !!this.hostElement.querySelector('[slot=\"counter\"]');\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 // hack to make datepicker inputs focusable. The datepicker hides the input\n // element and dynamically creates a sibling. We need to find the new input\n // element and focus it instead.\n const input = this.input.type === 'hidden' ? this.findSiblingInput(this.input.nextSibling) : this.input;\n input?.focus(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.blur();\n }\n\n /**\n * Clear the input.\n */\n @Method()\n async clear(): Promise<void> {\n this.value = '';\n this.catChange.emit(this.value);\n }\n\n @Watch('errors')\n onErrorsChanged(newValue?: boolean | string[] | ErrorMap, _oldValue?: unknown, update: boolean = true) {\n if (!coerceBoolean(this.errorUpdate)) {\n this.errorMap = undefined;\n } else {\n this.errorMapSrc = Array.isArray(newValue)\n ? (newValue as string[]).reduce((acc, err) => ({ ...acc, [err]: undefined }), {})\n : newValue || undefined;\n if (update) {\n this.showErrorsIfTimeout() || this.showErrorsIfNoFocus();\n }\n }\n }\n\n render() {\n this.hostElement.tabIndex = Number(this.hostElement.getAttribute('tabindex')) || 0;\n return (\n <div\n class={{\n 'input-field': true,\n 'input-horizontal': this.horizontal ?? this.fallbackHorizontal ?? false\n }}\n >\n <div class={{ 'label-container': true, hidden: this.labelHidden }}>\n {(this.hasSlottedLabel || this.label) && (\n <label htmlFor={this.id} part=\"label\">\n <span class=\"label-wrapper\">\n {(this.hasSlottedLabel && <slot name=\"label\"></slot>) || this.label}\n <div class=\"label-metadata\">\n {!this.required && (this.requiredMarker ?? 'optional').startsWith('optional') && (\n <span class=\"label-optional\" aria-hidden=\"true\">\n ({i18n.t('input.optional')})\n </span>\n )}\n {this.required && this.requiredMarker?.startsWith('required') && (\n <span class=\"label-optional\" aria-hidden=\"true\">\n ({i18n.t('input.required')})\n </span>\n )}\n {(this.maxLength || this.hasSlottedCounter) && (\n <div class=\"label-character-count\" aria-hidden=\"true\">\n {this.hasSlottedCounter ? (\n <slot name=\"counter\"></slot>\n ) : (\n `${this.value?.length ?? 0}/${this.maxLength}`\n )}\n </div>\n )}\n </div>\n </span>\n </label>\n )}\n </div>\n <div class=\"input-container\">\n <div class=\"input-outer-wrapper\">\n <div\n class={{\n 'input-wrapper': true,\n 'input-round': this.round,\n 'input-readonly': this.readonly,\n 'input-disabled': this.disabled,\n 'input-invalid': this.invalid\n }}\n onClick={() => this.input.focus()}\n >\n {this.textPrefix && (\n <span class=\"text-prefix\" part=\"prefix\">\n {this.textPrefix}\n </span>\n )}\n {this.icon && !this.iconRight && (\n <cat-icon icon={this.icon} class=\"icon-prefix\" size=\"l\" onClick={() => this.doFocus()}></cat-icon>\n )}\n <div class=\"input-inner-wrapper\">\n <input\n data-test={this.testId}\n {...this.nativeAttributes}\n part=\"input\"\n ref={el => (this.input = el as HTMLInputElement)}\n id={this.id}\n class={{\n 'has-clearable': this.clearable && !this.disabled && !this.readonly && !!this.value,\n 'has-toggle-password': this.togglePassword && !this.disabled && !this.readonly && !!this.value\n }}\n autocomplete={this.autoComplete}\n disabled={this.disabled}\n max={this.max}\n maxlength={this.maxLength}\n min={this.min}\n minlength={this.minLength}\n name={this.name}\n placeholder={this.placeholder}\n readonly={this.readonly}\n required={this.required}\n type={this.isPasswordShown ? 'text' : this.type}\n value={this.value}\n onInput={this.onInput.bind(this)}\n onFocus={this.onFocus.bind(this)}\n onBlur={this.onBlur.bind(this)}\n aria-invalid={this.invalid ? 'true' : undefined}\n aria-describedby={this.hasHint ? this.id + '-hint' : undefined}\n ></input>\n {this.clearable && !this.disabled && !this.readonly && this.value && (\n <cat-button\n class=\"clearable\"\n icon=\"$cat:input-close\"\n icon-only=\"true\"\n size=\"s\"\n variant=\"text\"\n a11y-label={i18n.t('input.clear')}\n onClick={this.clear.bind(this)}\n data-dropdown-no-close\n ></cat-button>\n )}\n {this.togglePassword && !this.disabled && !this.readonly && this.value && (\n <cat-button\n class=\"toggle-password\"\n icon={this.isPasswordShown ? '$cat:input-password-hide' : '$cat:input-password-show'}\n icon-only=\"true\"\n size=\"s\"\n variant=\"text\"\n a11y-label={i18n.t(this.isPasswordShown ? 'input.hidePassword' : 'input.showPassword')}\n onClick={this.doTogglePassword.bind(this)}\n ></cat-button>\n )}\n </div>\n {this.loading && <cat-spinner size=\"m\" class=\"icon-loading\"></cat-spinner>}\n {!this.invalid && this.icon && this.iconRight && (\n <cat-icon icon={this.icon} class=\"icon-suffix\" size=\"l\" onClick={() => this.doFocus()}></cat-icon>\n )}\n {this.invalid && (\n <cat-icon icon=\"$cat:input-error\" class=\"icon-suffix cat-text-danger\" size=\"l\"></cat-icon>\n )}\n {this.textSuffix && (\n <span class=\"text-suffix\" part=\"suffix\">\n {this.textSuffix}\n </span>\n )}\n </div>\n <slot name=\"addon\"></slot>\n </div>\n {this.hasHint && (\n <CatFormHint\n id={this.id}\n hint={this.hint}\n slottedHint={this.hasSlottedHint && <slot name=\"hint\"></slot>}\n errorMap={this.errorMap}\n />\n )}\n </div>\n </div>\n );\n }\n\n private get hasHint() {\n return !!this.hint || !!this.hasSlottedHint || this.invalid;\n }\n\n private get invalid() {\n return this.errorMap === true || !!Object.keys(this.errorMap || {}).length;\n }\n\n private onInput() {\n let formattedValue = this.input.value;\n if (this.timeMaskOptions) {\n formattedValue = formatTime(this.input.value, this.timeMaskOptions);\n this.input.value = formattedValue;\n }\n if (this.dateMaskOptions) {\n formattedValue = formatDate(this.input.value, this.dateMaskOptions);\n this.input.value = formattedValue;\n }\n this.value = formattedValue;\n this.internals.setFormValue(this.input.value);\n this.catChange.emit(this.value);\n this.showErrorsIfTimeout();\n }\n\n private onFocus(event: FocusEvent) {\n this.catFocus.emit(event);\n }\n\n private onBlur(event: FocusEvent) {\n this.catBlur.emit(event);\n if (coerceBoolean(this.errorUpdate)) {\n this.showErrors();\n }\n }\n\n private doTogglePassword() {\n this.isPasswordShown = !this.isPasswordShown;\n }\n\n private showErrors() {\n this.errorMap = this.errorMapSrc;\n }\n\n private errorUpdateTimeoutId?: number;\n private showErrorsIfTimeout() {\n const errorUpdate = coerceNumber(this.errorUpdate, null);\n if (errorUpdate !== null) {\n typeof this.errorUpdateTimeoutId === 'number' && window.clearTimeout(this.errorUpdateTimeoutId);\n this.errorUpdateTimeoutId = window.setTimeout(() => this.showErrors(), errorUpdate);\n return true;\n }\n return false;\n }\n\n private showErrorsIfNoFocus() {\n const hasFocus = document.activeElement === this.hostElement || document.activeElement === this.input;\n if (!hasFocus) {\n this.showErrors();\n }\n }\n\n private findSiblingInput(node: Node | null): HTMLInputElement | undefined {\n if (node instanceof HTMLInputElement) {\n return node;\n } else if (node?.nextSibling) {\n return this.findSiblingInput(node.nextSibling);\n }\n return undefined;\n }\n}\n"]}
|
|
1
|
+
{"version":3,"file":"cat-input.js","sourceRoot":"","sources":["../../../src/components/cat-input/cat-input.tsx"],"names":[],"mappings":"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","sourcesContent":["import { AttachInternals, Component, Element, Event, EventEmitter, h, Method, Prop, State, Watch } from '@stencil/core';\nimport { coerceBoolean, coerceNumber } from '../../utils/coerce';\nimport { CatFormHint, ErrorMap } from '../cat-form-hint/cat-form-hint';\nimport { catI18nRegistry as i18n } from '../cat-i18n/cat-i18n-registry';\nimport { InputType } from './input-type';\nimport { formatDate, formatTime } from 'cleave-zen';\n\nlet nextUniqueId = 0;\n\ntype TimeUnit = 'h' | 'm' | 's';\ntype TimeFormatType = '12' | '24';\ntype DateUnit = 'Y' | 'y' | 'm' | 'd';\n\nexport interface FormatTimeMaskOptions {\n timePattern?: TimeUnit[];\n timeFormat?: TimeFormatType;\n}\n\nexport interface FormatDateMaskOptions {\n delimiter?: string;\n datePattern?: DateUnit[];\n dateMin?: string;\n dateMax?: string;\n}\n\n/**\n * Inputs are used to allow users to provide text input when the expected input\n * is short. As well as plain text, Input supports various types of text,\n * including passwords and numbers.\n *\n * @slot hint - Optional hint element to be displayed with the input.\n * @slot label - The slotted label. If both the label property and the label slot are present, only the label slot will be displayed.\n * @slot counter - Custom counter element to be displayed in the top right corner of the label.\n * @part label - The native label element.\n * @part input - The native input element.\n * @part prefix - The text prefix.\n * @part suffix - The text suffix.\n */\n@Component({\n tag: 'cat-input',\n styleUrl: 'cat-input.scss',\n formAssociated: true,\n shadow: {\n delegatesFocus: true\n }\n})\nexport class CatInput {\n private readonly _id = `cat-input-${nextUniqueId++}`;\n\n private get id() {\n return this.identifier || this._id;\n }\n\n private input!: HTMLInputElement;\n private errorMapSrc?: ErrorMap | true;\n\n @Element() hostElement!: HTMLElement;\n\n @State() hasSlottedLabel = false;\n\n @State() hasSlottedHint = false;\n\n @State() hasSlottedCounter = false;\n\n @State() isPasswordShown = false;\n\n @State() errorMap?: ErrorMap | true;\n\n @AttachInternals() internals!: ElementInternals;\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?: boolean;\n\n /**\n * If the horizontal value is not provided, this fallback value is used. Can be set by form-group.\n * @internal\n */\n @Prop() fallbackHorizontal?: boolean;\n\n /**\n * Defines the file types the file input should accept.\n */\n @Prop() accept?: string;\n\n /**\n * Whether the input should allow multiple files to be selected.\n */\n @Prop() multiple?: boolean;\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 should show a password toggle button for password inputs.\n */\n @Prop() togglePassword = false;\n\n /**\n * Whether the input is disabled.\n */\n @Prop() disabled = false;\n\n /**\n * Displays the input in a loading state with a spinner.\n */\n @Prop() loading = 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 value for numeric values.\n */\n @Prop() max?: number | string;\n\n /**\n * A maximum length (number of characters) for textual values.\n */\n @Prop() maxLength?: number;\n\n /**\n * A minimum value for numeric values.\n */\n @Prop() min?: number | string;\n\n /**\n * A minimum length (number of characters) for textual values.\n */\n @Prop() minLength?: number;\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 * Use round input edges.\n */\n @Prop() round = false;\n\n /**\n * Type of form control.\n */\n @Prop() type: InputType = 'text';\n\n /**\n * The value of the control.\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 change with the given delay in milliseconds or immediately on blur.\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 * A unique identifier for the underlying native element that is used for\n * testing purposes. The attribute is added as `data-test` attribute and acts\n * as a shorthand for `nativeAttributes={ 'data-test': 'test-Id' }`.\n */\n @Prop() testId?: string;\n\n /**\n * Activates cleave-zen time mask on input\n */\n @Prop() timeMaskOptions?: FormatTimeMaskOptions;\n\n /**\n * Activates cleave-zen date mask on input\n */\n @Prop() dateMaskOptions?: FormatDateMaskOptions;\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(): void {\n this.onErrorsChanged(this.errors, undefined, false);\n }\n\n componentWillRender(): void {\n this.internals.setFormValue(this.value ?? null);\n this.hasSlottedLabel = !!this.hostElement.querySelector('[slot=\"label\"]');\n this.hasSlottedHint = !!this.hostElement.querySelector('[slot=\"hint\"]');\n this.hasSlottedCounter = !!this.hostElement.querySelector('[slot=\"counter\"]');\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 // hack to make datepicker inputs focusable. The datepicker hides the input\n // element and dynamically creates a sibling. We need to find the new input\n // element and focus it instead.\n const input = this.input.type === 'hidden' ? this.findSiblingInput(this.input.nextSibling) : this.input;\n input?.focus(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.blur();\n }\n\n /**\n * Clear the input.\n */\n @Method()\n async clear(): Promise<void> {\n this.value = '';\n this.catChange.emit(this.value);\n }\n\n @Watch('errors')\n onErrorsChanged(newValue?: boolean | string[] | ErrorMap, _oldValue?: unknown, update: boolean = true) {\n if (!coerceBoolean(this.errorUpdate)) {\n this.errorMap = undefined;\n } else {\n this.errorMapSrc = Array.isArray(newValue)\n ? (newValue as string[]).reduce((acc, err) => ({ ...acc, [err]: undefined }), {})\n : newValue || undefined;\n if (update) {\n this.showErrorsIfTimeout() || this.showErrorsIfNoFocus();\n }\n }\n }\n\n render() {\n this.hostElement.tabIndex = Number(this.hostElement.getAttribute('tabindex')) || 0;\n return (\n <div\n class={{\n 'input-field': true,\n 'input-horizontal': this.horizontal ?? this.fallbackHorizontal ?? false\n }}\n >\n <div class={{ 'label-container': true, hidden: this.labelHidden }}>\n {(this.hasSlottedLabel || this.label) && (\n <label htmlFor={this.id} part=\"label\">\n <span class=\"label-wrapper\">\n {(this.hasSlottedLabel && <slot name=\"label\"></slot>) || this.label}\n <div class=\"label-metadata\">\n {!this.required && (this.requiredMarker ?? 'optional').startsWith('optional') && (\n <span class=\"label-optional\" aria-hidden=\"true\">\n ({i18n.t('input.optional')})\n </span>\n )}\n {this.required && this.requiredMarker?.startsWith('required') && (\n <span class=\"label-optional\" aria-hidden=\"true\">\n ({i18n.t('input.required')})\n </span>\n )}\n {(this.maxLength || this.hasSlottedCounter) && (\n <div class=\"label-character-count\" aria-hidden=\"true\">\n {this.hasSlottedCounter ? (\n <slot name=\"counter\"></slot>\n ) : (\n `${this.value?.length ?? 0}/${this.maxLength}`\n )}\n </div>\n )}\n </div>\n </span>\n </label>\n )}\n </div>\n <div class={{ 'input-color': this.type === 'color', 'input-container': true }}>\n <div class=\"input-outer-wrapper\">\n <div\n class={{\n 'input-wrapper': true,\n 'input-round': this.round,\n 'input-readonly': this.readonly,\n 'input-disabled': this.disabled,\n 'input-invalid': this.invalid\n }}\n onClick={() => this.input.focus()}\n >\n {this.textPrefix && (\n <span class=\"text-prefix\" part=\"prefix\">\n {this.textPrefix}\n </span>\n )}\n {this.icon && !this.iconRight && (\n <cat-icon icon={this.icon} class=\"icon-prefix\" size=\"l\" onClick={() => this.doFocus()}></cat-icon>\n )}\n <div\n class={{\n 'has-clearable': this.clearable && !this.disabled && !this.readonly && !!this.value,\n 'has-toggle-password': this.togglePassword && !this.disabled && !this.readonly && !!this.value,\n 'input-inner-wrapper': true,\n 'type-color': this.type === 'color'\n }}\n >\n {this.type === 'color' && <span class=\"color-value\">{this.value ?? '#000000'}</span>}\n <input\n data-test={this.testId}\n {...this.nativeAttributes}\n part=\"input\"\n ref={el => (this.input = el as HTMLInputElement)}\n id={this.id}\n class={{\n 'has-clearable': this.clearable && !this.disabled && !this.readonly && !!this.value,\n 'has-toggle-password': this.togglePassword && !this.disabled && !this.readonly && !!this.value\n }}\n autocomplete={this.autoComplete}\n disabled={this.disabled}\n accept={this.type === 'file' ? this.accept : undefined}\n multiple={this.type === 'file' ? this.multiple : undefined}\n max={this.max}\n maxlength={this.maxLength}\n min={this.min}\n minlength={this.minLength}\n name={this.name}\n placeholder={this.placeholder}\n readonly={this.readonly}\n required={this.required}\n type={this.isPasswordShown ? 'text' : this.type}\n value={this.value}\n onInput={this.onInput.bind(this)}\n onFocus={this.onFocus.bind(this)}\n onBlur={this.onBlur.bind(this)}\n aria-invalid={this.invalid ? 'true' : undefined}\n aria-describedby={this.hasHint ? this.id + '-hint' : undefined}\n ></input>\n {this.clearable && !this.disabled && !this.readonly && this.value && (\n <cat-button\n class=\"clearable\"\n icon=\"$cat:input-close\"\n icon-only=\"true\"\n size=\"s\"\n variant=\"text\"\n a11y-label={i18n.t('input.clear')}\n onClick={this.clear.bind(this)}\n data-dropdown-no-close\n ></cat-button>\n )}\n {this.togglePassword && !this.disabled && !this.readonly && this.value && (\n <cat-button\n class=\"toggle-password\"\n icon={this.isPasswordShown ? '$cat:input-password-hide' : '$cat:input-password-show'}\n icon-only=\"true\"\n size=\"s\"\n variant=\"text\"\n a11y-label={i18n.t(this.isPasswordShown ? 'input.hidePassword' : 'input.showPassword')}\n onClick={this.doTogglePassword.bind(this)}\n ></cat-button>\n )}\n </div>\n {this.loading && <cat-spinner size=\"m\" class=\"icon-loading\"></cat-spinner>}\n {!this.invalid && this.icon && this.iconRight && (\n <cat-icon icon={this.icon} class=\"icon-suffix\" size=\"l\" onClick={() => this.doFocus()}></cat-icon>\n )}\n {this.invalid && (\n <cat-icon icon=\"$cat:input-error\" class=\"icon-suffix cat-text-danger\" size=\"l\"></cat-icon>\n )}\n {this.textSuffix && (\n <span class=\"text-suffix\" part=\"suffix\">\n {this.textSuffix}\n </span>\n )}\n </div>\n <slot name=\"addon\"></slot>\n </div>\n {this.hasHint && (\n <CatFormHint\n id={this.id}\n hint={this.hint}\n slottedHint={this.hasSlottedHint && <slot name=\"hint\"></slot>}\n errorMap={this.errorMap}\n />\n )}\n </div>\n </div>\n );\n }\n\n private get hasHint() {\n return !!this.hint || !!this.hasSlottedHint || this.invalid;\n }\n\n private get invalid() {\n return this.errorMap === true || !!Object.keys(this.errorMap || {}).length;\n }\n\n private onInput() {\n let formattedValue = this.input.value;\n if (this.timeMaskOptions) {\n formattedValue = formatTime(this.input.value, this.timeMaskOptions);\n this.input.value = formattedValue;\n }\n if (this.dateMaskOptions) {\n formattedValue = formatDate(this.input.value, this.dateMaskOptions);\n this.input.value = formattedValue;\n }\n this.value = formattedValue;\n this.internals.setFormValue(this.input.value);\n this.catChange.emit(this.value);\n this.showErrorsIfTimeout();\n }\n\n private onFocus(event: FocusEvent) {\n this.catFocus.emit(event);\n }\n\n private onBlur(event: FocusEvent) {\n this.catBlur.emit(event);\n if (coerceBoolean(this.errorUpdate)) {\n this.showErrors();\n }\n }\n\n private doTogglePassword() {\n this.isPasswordShown = !this.isPasswordShown;\n }\n\n private showErrors() {\n this.errorMap = this.errorMapSrc;\n }\n\n private errorUpdateTimeoutId?: number;\n private showErrorsIfTimeout() {\n const errorUpdate = coerceNumber(this.errorUpdate, null);\n if (errorUpdate !== null) {\n typeof this.errorUpdateTimeoutId === 'number' && window.clearTimeout(this.errorUpdateTimeoutId);\n this.errorUpdateTimeoutId = window.setTimeout(() => this.showErrors(), errorUpdate);\n return true;\n }\n return false;\n }\n\n private showErrorsIfNoFocus() {\n const hasFocus = document.activeElement === this.hostElement || document.activeElement === this.input;\n if (!hasFocus) {\n this.showErrors();\n }\n }\n\n private findSiblingInput(node: Node | null): HTMLInputElement | undefined {\n if (node instanceof HTMLInputElement) {\n return node;\n } else if (node?.nextSibling) {\n return this.findSiblingInput(node.nextSibling);\n }\n return undefined;\n }\n}\n"]}
|
|
@@ -52,9 +52,9 @@ export class CatPagination {
|
|
|
52
52
|
}
|
|
53
53
|
render() {
|
|
54
54
|
this.hostElement.tabIndex = Number(this.hostElement.getAttribute('tabindex')) || 0;
|
|
55
|
-
return (h("nav", { key: '
|
|
55
|
+
return (h("nav", { key: '92edf5d03bcf32e751e5a477280e4df4a48fe92d', role: "navigation" }, h("ol", { key: 'd3abfee45a341bd03c1f6d1e1f275f5714817539', class: {
|
|
56
56
|
[`cat-pagination-${this.size}`]: Boolean(this.size)
|
|
57
|
-
} }, h("li", { key: '
|
|
57
|
+
} }, h("li", { key: '7d9a267ca412d15e869321b331729810cc09253c' }, h("cat-button", { key: 'da1fb4fca4ce3e34eb269fbbd3003baad95fe5da', variant: this.variant, size: this.size, round: this.round, disabled: this.isFirst, a11yLabel: i18n.t('pagination.prev'), icon: this.iconPrev, iconOnly: true, onClick: () => this.setPage(this.page - 1) })), this.content, h("li", { key: '14237910fe38dbc5d829b804ee5fd9613a68c783' }, h("cat-button", { key: '9e7ad815b7708ec9c1200bd923fa61be5c6e9552', variant: this.variant, size: this.size, round: this.round, disabled: this.isLast, a11yLabel: i18n.t('pagination.next'), icon: this.iconNext, iconOnly: true, onClick: () => this.setPage(this.page + 1) })))));
|
|
58
58
|
}
|
|
59
59
|
get isFirst() {
|
|
60
60
|
return this.page === 0;
|
|
@@ -75,13 +75,13 @@ export class CatRadio {
|
|
|
75
75
|
}
|
|
76
76
|
render() {
|
|
77
77
|
this.hostElement.tabIndex = Number(this.hostElement.getAttribute('tabindex')) || 0;
|
|
78
|
-
return (h(Host, { key: '
|
|
78
|
+
return (h(Host, { key: 'd5bdfdba836cb7f6ea32ffd9befa8e21b3681f1d' }, h("label", { key: 'a4bc5f97bc1c9313fc42ed4e6ffa4f3dcdf0b5db', htmlFor: this.id, class: {
|
|
79
79
|
'is-hidden': this.labelHidden,
|
|
80
80
|
'is-disabled': this.disabled,
|
|
81
81
|
'label-left': this.labelLeft,
|
|
82
82
|
'align-center': this.alignment === 'center',
|
|
83
83
|
'align-end': this.alignment === 'bottom'
|
|
84
|
-
}, role: "radio", "aria-checked": this.checked ? 'true' : 'false' }, h("span", { key: '
|
|
84
|
+
}, role: "radio", "aria-checked": this.checked ? 'true' : 'false' }, h("span", { key: '26d8bda2a2d7eb9479762cde79ddcbf4ffa66c31', class: "radio" }, h("input", { key: '93aa9f8c9c6c80032806821d4a25d211351f5ae7', "data-test": this.testId, ...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: 'de64c16b1b208ee39173a479961c8a9c35398891', class: "circle" })), h("span", { key: '31aee49255f90b202fa24bd7e3454faef997403d', class: "label", part: "label" }, (this.hasSlottedLabel && h("slot", { key: '42fd54752399f0f598051e3b88df68111d6e5871', name: "label" })) || this.label)), this.hasHint && (h("div", { key: 'dd8ebf787f21f0b3ec2d4b3502f5ed55ffdc1828', class: { 'hint-wrapper': true, 'label-left': this.labelLeft } }, h("div", { key: '2107fc47f09c98351657658066642380848711c6', class: "circle-placeholder" }), h(CatFormHint, { key: 'ff77ec0e74627dab0b823150681c8be5a3ad9d98', id: this.id, hint: this.hint, slottedHint: this.hasSlottedHint && h("slot", { name: "hint" }) })))));
|
|
85
85
|
}
|
|
86
86
|
get hasHint() {
|
|
87
87
|
return !!this.hint || !!this.hasSlottedHint;
|
|
@@ -70,7 +70,7 @@ export class CatRadioGroup {
|
|
|
70
70
|
}
|
|
71
71
|
}
|
|
72
72
|
render() {
|
|
73
|
-
return (h("div", { key: '
|
|
73
|
+
return (h("div", { key: 'bddb6ec500cf6153286300ae20bad8925d4dcfd1', role: "radiogroup", "aria-label": this.a11yLabel }, h("slot", { key: '55c9ce43491b01ee35183b3ba880f62e49a58f0f' })));
|
|
74
74
|
}
|
|
75
75
|
init() {
|
|
76
76
|
this.catRadioGroup = Array.from(this.hostElement.querySelectorAll(`cat-radio`));
|
|
@@ -69,13 +69,13 @@ export class CatScrollable {
|
|
|
69
69
|
}
|
|
70
70
|
render() {
|
|
71
71
|
return [
|
|
72
|
-
h("div", { key: '
|
|
73
|
-
h("div", { key: '
|
|
72
|
+
h("div", { key: 'a74da54b345c5d35e790a767112256623298fb45', class: "scrollable-wrapper", ref: el => (this.scrollWrapperElement = el) }, !this.noShadowY && h("div", { key: 'c1210162912c663853d3693c1d390c11cc3fce15', class: "shadow-top" }), !this.noShadowX && h("div", { key: '7926685bbacaf7338667e507455ddb91e8fa716f', class: "shadow-left" }), !this.noShadowX && h("div", { key: '2b5c384ab9ea25f4cfc03e4fa96c494d29b220a3', class: "shadow-right" }), !this.noShadowY && h("div", { key: '9beefb53981be683f2fff1e3d199a5cc79f939b6', class: "shadow-bottom" })),
|
|
73
|
+
h("div", { key: '84440bc3d95ec0686ecc080b70ed763e5a140851', ref: el => (this.scrollElement = el), class: {
|
|
74
74
|
'scrollable-content': true,
|
|
75
75
|
'scroll-x': !this.noOverflowX,
|
|
76
76
|
'scroll-y': !this.noOverflowY,
|
|
77
77
|
'no-overscroll': this.noOverscroll
|
|
78
|
-
} }, h("slot", { key: '
|
|
78
|
+
} }, h("slot", { key: '4f001c11db1d3c8f7d23ac8187d356abe88ef190' }))
|
|
79
79
|
];
|
|
80
80
|
}
|
|
81
81
|
attachEmitter(from, emitter) {
|
|
@@ -349,18 +349,18 @@ export class CatSelect {
|
|
|
349
349
|
}
|
|
350
350
|
render() {
|
|
351
351
|
this.hostElement.tabIndex = Number(this.hostElement.getAttribute('tabindex')) || 0;
|
|
352
|
-
return (h(Host, { key: '
|
|
352
|
+
return (h(Host, { key: '93b8cc474d53cf5c950a5ee2ee9b51cf5956288e' }, h("div", { key: 'ce1bc0a70b577af3926a459aa1734bbc6200b2bd', class: {
|
|
353
353
|
'select-field': true,
|
|
354
354
|
'select-horizontal': this.horizontal ?? this.fallbackHorizontal ?? false,
|
|
355
355
|
'select-multiple': this.multiple
|
|
356
|
-
} }, h("div", { key: '
|
|
356
|
+
} }, h("div", { key: '49dd5bf7a639d1c44ccc5a35eb9efcbc362dfc71', class: { 'label-container': true, hidden: this.labelHidden } }, (this.hasSlottedLabel || this.label) && (h("label", { key: '9fdb7777067c530a46d920ce49eba63ec890bf57', htmlFor: `select-${this.id}-input`, part: "label" }, h("span", { key: 'ed19b3d78c7d9c0f610884a824cd90f4b4a7f1cb', class: "label-wrapper" }, (this.hasSlottedLabel && h("slot", { key: '39b9b19d3505885c873825b939b9f5334cadf351', name: "label" })) || this.label, h("div", { key: '8db9f030a2278e733e2186d8d386a3bc5e94702b', class: "label-metadata" }, !this.required && (this.requiredMarker ?? 'optional').startsWith('optional') && (h("span", { key: '5f3196c0a8c55b6dc55031e958cd30193858500f', class: "label-optional", "aria-hidden": "true" }, "(", i18n.t('input.optional'), ")")), this.required && this.requiredMarker?.startsWith('required') && (h("span", { key: '8434806d6d457a85ee342cecf75e3d8cd4453bb2', class: "label-optional", "aria-hidden": "true" }, "(", i18n.t('input.required'), ")"))))))), h("div", { key: '294b26a82988b0d35e98eb75e0d64227aa92bf7f', class: "select-container" }, h("div", { key: 'bc97d26c6da84a26e90897384895ede9b2091fc0', class: { 'select-wrapper': true, 'select-disabled': this.disabled, 'select-invalid': this.invalid }, ref: el => (this.trigger = el), id: this.id, role: "combobox", "aria-expanded": this.state.isOpen || this.isPillboxActive(), "aria-controls": this.isPillboxActive() ? `select-pillbox-${this.id}` : `select-listbox-${this.id}`, "aria-required": this.required ? 'true' : false, "aria-activedescendant": this.activeDescendant, onClick: e => this.onClick(e) }, h("div", { key: 'e6c2dd7b1e3053501ab9c84a7c651c87bc1367c0', class: "select-wrapper-inner" }, this.multiple && this.state.selection.length ? (h("div", { id: `select-pillbox-${this.id}`, role: "listbox", "aria-orientation": "horizontal", class: "select-pills" }, this.state.selection.map((item, i) => (h("span", { class: {
|
|
357
357
|
pill: true,
|
|
358
358
|
'select-no-open': true,
|
|
359
359
|
'select-option-active': this.state.activeSelectionIndex === i
|
|
360
|
-
}, role: "option", "aria-selected": "true", id: `select-${this.id}-selection-${i}` }, item.render.avatar ? (h("cat-avatar", { label: item.render.label, round: item.render.avatar.round, src: item.render.avatar.src, icon: item.render.avatar.icon, initials: item.render.avatar.initials ?? '' })) : null, h("span", null, item.render.label), !this.disabled && (h("cat-button", { size: "xs", variant: "text", icon: "$cat:select-clear", iconOnly: true, a11yLabel: i18n.t('select.deselect'), onClick: () => this.deselect(item.item.id), tabIndex: -1, "data-dropdown-no-close": true }))))))) : this.state.selection.length && this.state.selection[0].render.avatar ? (h("cat-avatar", { label: this.state.selection[0].render.label, round: this.state.selection[0].render.avatar.round, src: this.state.selection[0].render.avatar.src, icon: this.state.selection[0].render.avatar.icon, initials: this.state.selection[0].render.avatar.initials ?? '' })) : null, h("input", { key: '
|
|
360
|
+
}, role: "option", "aria-selected": "true", id: `select-${this.id}-selection-${i}` }, item.render.avatar ? (h("cat-avatar", { label: item.render.label, round: item.render.avatar.round, src: item.render.avatar.src, icon: item.render.avatar.icon, initials: item.render.avatar.initials ?? '' })) : null, h("span", null, item.render.label), !this.disabled && (h("cat-button", { size: "xs", variant: "text", icon: "$cat:select-clear", iconOnly: true, a11yLabel: i18n.t('select.deselect'), onClick: () => this.deselect(item.item.id), tabIndex: -1, "data-dropdown-no-close": true }))))))) : this.state.selection.length && this.state.selection[0].render.avatar ? (h("cat-avatar", { label: this.state.selection[0].render.label, round: this.state.selection[0].render.avatar.round, src: this.state.selection[0].render.avatar.src, icon: this.state.selection[0].render.avatar.icon, initials: this.state.selection[0].render.avatar.initials ?? '' })) : null, h("input", { key: '59735a765001238dddda82e9c12b9e76ba099684', "data-test": this.testId, ...this.nativeAttributes, part: "input", id: `select-${this.id}-input`, class: "select-input", role: "combobox", ref: el => (this.input = el), "aria-controls": this.isPillboxActive() ? `select-pillbox-${this.id}` : `select-listbox-${this.id}`, "aria-activedescendant": this.activeDescendant, "aria-invalid": this.invalid ? 'true' : undefined, "aria-describedby": this.hasHint ? this.id + '-hint' : undefined, "aria-autocomplete": "list", onInput: this.onInput.bind(this), value: !this.multiple ? this.state.term : undefined, placeholder: this.placeholder, disabled: this.disabled || this.state.isResolving })), this.state.isResolving && h("cat-spinner", { key: 'e43f723bd8149aea563ab01453bc47aefb2d4771' }), this.invalid && (h("cat-icon", { key: '602808e09ac23bf6b1f2690c50b538c47a376a6c', icon: "$cat:input-error", class: "icon-suffix cat-text-danger", size: "l" })), (this.state.selection.length || this.state.term.length) &&
|
|
361
361
|
!this.disabled &&
|
|
362
362
|
!this.state.isResolving &&
|
|
363
|
-
this.clearable ? (h("cat-button", { id: `select-clear-btn-${this.id}`, iconOnly: true, icon: "$cat:input-close", variant: "text", size: "s", a11yLabel: i18n.t('input.clear'), onCatClick: () => this.clearInput(), "data-dropdown-no-close": true })) : null, !this.state.isResolving && (h("cat-button", { key: '
|
|
363
|
+
this.clearable ? (h("cat-button", { id: `select-clear-btn-${this.id}`, iconOnly: true, icon: "$cat:input-close", variant: "text", size: "s", a11yLabel: i18n.t('input.clear'), onCatClick: () => this.clearInput(), "data-dropdown-no-close": true })) : null, !this.state.isResolving && (h("cat-button", { key: 'b84edc71dde76b9f65fa019d698cd91b97db2390', iconOnly: true, icon: "$cat:select-open", class: { 'select-btn': true, 'select-btn-open': this.state.isOpen }, variant: "text", size: "s", a11yLabel: this.state.isOpen ? i18n.t('select.close') : i18n.t('select.open'), "aria-controls": `select-listbox-${this.id}`, "aria-expanded": this.state.isOpen, tabIndex: -1, disabled: this.disabled || this.state.isResolving, "data-dropdown-no-close": true }))), this.hasHint && (h(CatFormHint, { key: 'a7d9d8e2a0a4333d9320d987c51792e9d8b13184', id: this.id, hint: this.hint, slottedHint: this.hasSlottedHint && h("slot", { name: "hint" }), errorMap: this.errorMap })))), h("div", { key: '6542000b357d4084d202af29010dd8a85dff5350', class: "select-dropdown", ref: el => (this.dropdown = el), style: { display: this.state.isOpen ? 'block' : undefined } }, this.state.isOpen && (h("cat-scrollable", { key: 'e449f1d397d1140e546b8e473b0649d9e8e2dbd7', class: "select-options-wrapper", scrolledBuffer: 56, noOverflowX: true, noOverscroll: true, noScrolledInit: true, onScrolledBottom: () => this.more$.next() }, h("ul", { key: 'c3c172ebe62fa6a08b1a4f7254b863efc83e8247', class: "select-options", role: "listbox", "aria-multiselectable": this.multiple, "aria-setsize": this.state.totalElements, id: `select-listbox-${this.id}` }, this.optionsList, this.state.isFirstLoading
|
|
364
364
|
? Array.from(Array(CatSelect.SKELETON_COUNT)).map(() => (h("li", { class: "select-option-loading" }, h("cat-skeleton", { variant: "body", lines: 1 }), h("cat-skeleton", { variant: "body", lines: 1 }))))
|
|
365
365
|
: !this.state.options.length &&
|
|
366
366
|
!this.tags && (h("li", { class: "select-option-empty" }, this.noItems ? this.noItems : i18n.t('select.empty')))))))));
|
|
@@ -139,7 +139,7 @@ export class CatSelectTest {
|
|
|
139
139
|
setTimeout(() => this.multipleSelect && (this.multipleSelect.value = []), 5000);
|
|
140
140
|
}
|
|
141
141
|
render() {
|
|
142
|
-
return (h(Host, { key: '
|
|
142
|
+
return (h(Host, { key: 'a67d8afd350d4dd87c98af1e1811adf9421e9758', style: { display: 'flex', flexDirection: 'column' }, class: "cat-form" }, h("cat-select", { key: '0f408fa2737fa2d8e0bae223f73cdf9c87e1b06e', 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: '8ed25b6300d1078327125799241713f2af05c65d', slot: "hint" }, "Searching for \"no\" -", '>', " no options are returned!")), h("cat-select", { key: 'a470242e781811524325e7f887b6389734d1bfec', label: "Multiple with img", ref: el => (this.multipleSelectAvatar = el), value: ['1'], placeholder: "Hello World", multiple: true, clearable: true, errorUpdate: false }), h("cat-select", { key: '6ea9ac8aed02b9f65571441a03de45c42f0a06e9', label: "Multiple with initials", ref: el => (this.multipleSelectAvatarInitials = el), value: ['1'], placeholder: "Hello World", multiple: true, clearable: true, errorUpdate: false }), h("cat-select", { key: 'a2bfa381f885bd2add969045ebf3b41155200a19', 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: '5ac14c9554ac770b5a22cf8d0fa323465a5cd748', 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: 'ce1dd654fb032a9e7a042627f49447621dcba078', 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: '931e2a75552354348e8a202bc4ff3ee302dfcdc0', label: "Single with initials", ref: el => (this.singleSelectAvatarInitials = el), placeholder: "Hello World", clearable: true, errorUpdate: false }), h("cat-dropdown", { key: '2a6e57f17442e18efc7cf31e29dbf108c2938467', overflow: true }, h("cat-button", { key: 'd7f34c6ee8493df2693191ad9e257a8c56731d59', slot: "trigger", style: { width: '50%' } }, "Open select"), h("div", { key: '9935750f4063e8baf6b3e0e645b52f8143234d05', slot: "content", style: { width: '400px' } }, h("cat-select", { key: '5472f568bb7826b44ed8e997b5ed1fc624d81fce', 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%' } })))));
|
|
143
143
|
}
|
|
144
144
|
get countryConnector() {
|
|
145
145
|
return {
|
|
@@ -19,7 +19,7 @@ export class CatSkeleton {
|
|
|
19
19
|
this.size = 'm';
|
|
20
20
|
}
|
|
21
21
|
render() {
|
|
22
|
-
return (h(Host, { key: '
|
|
22
|
+
return (h(Host, { key: '402c7d7bcd6e39164d2f7f22755bc0ebb20aed35' }, Array.from(Array(this.count)).map(() => (h("div", { style: this.style, class: {
|
|
23
23
|
skeleton: true,
|
|
24
24
|
[`skeleton-${this.effect}`]: Boolean(this.effect),
|
|
25
25
|
[`skeleton-${this.variant}`]: Boolean(this.variant),
|
|
@@ -14,9 +14,9 @@ export class CatSpinner {
|
|
|
14
14
|
this.value = 0;
|
|
15
15
|
}
|
|
16
16
|
render() {
|
|
17
|
-
return (h("span", { key: '
|
|
17
|
+
return (h("span", { key: 'b5994c1a40fef1a165d628e728b1cb8cdff866ea', role: "progressbar", tabindex: "-1", "aria-label": this.a11yLabel, "aria-hidden": this.a11yLabel ? null : 'true', "aria-valuenow": this.value, "aria-valuemin": "0", "aria-valuemax": "100", class: {
|
|
18
18
|
[`spinner-${this.size}`]: this.size !== 'inline'
|
|
19
|
-
} }, h("svg", { key: '
|
|
19
|
+
} }, h("svg", { key: '0cd336a98d08ac723d34c29895847010f49245fc', xmlns: "http://www.w3.org/2000/svg", viewBox: "0 0 48 48" }, h("circle", { key: 'c634cc4a518a6733fd5e68859e2154384ac6a1d1', cx: "24", cy: "24", r: "21.5" }))));
|
|
20
20
|
}
|
|
21
21
|
static get is() { return "cat-spinner"; }
|
|
22
22
|
static get encapsulation() { return "shadow"; }
|
|
@@ -50,7 +50,7 @@ export class CatTab {
|
|
|
50
50
|
this.catClick.emit(event);
|
|
51
51
|
}
|
|
52
52
|
render() {
|
|
53
|
-
return h(Host, { key: '
|
|
53
|
+
return h(Host, { key: '954bacd020d1405745d1118cf5b09b9e8ddc93b0' });
|
|
54
54
|
}
|
|
55
55
|
static get is() { return "cat-tab"; }
|
|
56
56
|
static get encapsulation() { return "shadow"; }
|
|
@@ -92,7 +92,7 @@ export class CatTabs {
|
|
|
92
92
|
}
|
|
93
93
|
render() {
|
|
94
94
|
this.hostElement.tabIndex = Number(this.hostElement.getAttribute('tabindex')) || 0;
|
|
95
|
-
return (h(Host, { key: '
|
|
95
|
+
return (h(Host, { key: 'df60c82a35f848e88f75062a56ec258ba79c1891' }, h("div", { key: 'd3d003bce6f44045168e6f32db9eea9a2c5a6c27', role: "tablist", class: "cat-tab-list" }, this.tabs.map((tab, index) => {
|
|
96
96
|
return (h("cat-button", { buttonId: tab.id, part: "tab", class: {
|
|
97
97
|
'cat-tab': true,
|
|
98
98
|
'cat-tab-active': tab.id === this.activeTab,
|
|
@@ -95,7 +95,7 @@ export class CatTag {
|
|
|
95
95
|
}
|
|
96
96
|
render() {
|
|
97
97
|
this.hostElement.tabIndex = Number(this.hostElement.getAttribute('tabindex')) || 0;
|
|
98
|
-
return (h(Host, { key: '
|
|
98
|
+
return (h(Host, { key: '334f8a2d604df123adb018f31b5528040d65180c' }, h("div", { key: '0140867da437b576a9b5593601abf65634badafe', class: { 'label-container': true, hidden: this.labelHidden } }, (this.hasSlottedLabel || this.label) && (h("label", { key: '9c2284a03aa281bd1c5060684909afffcc3be519', htmlFor: `tags-${this.id}-input`, part: "label" }, h("span", { key: '2e8bab18e8c5b776ab7a7af2805a48f25380ca14', class: "label-wrapper" }, (this.hasSlottedLabel && h("slot", { key: '285417cf1427d6bfab28f8e79d03d7ebb4a5581a', name: "label" })) || this.label, h("div", { key: '54284d1f7c2d39b3686471a77fe81cdff5a7ba6d', class: "label-metadata" }, !this.required && (this.requiredMarker ?? 'optional').startsWith('optional') && (h("span", { key: '2bbb1dd5fbf63c3a11e5072cedd0016fb52a8bbf', class: "label-optional", "aria-hidden": "true" }, "(", i18n.t('input.optional'), ")")), this.required && this.requiredMarker?.startsWith('required') && (h("span", { key: 'b800283d2560b788c5de2186bb0657612bf5902b', class: "label-optional", "aria-hidden": "true" }, "(", i18n.t('input.required'), ")"))))))), h("div", { key: '710a3d1df041fabfc099248a10fb581dc29867e8', class: { 'input-wrapper': true, 'input-disabled': this.disabled, 'input-invalid': this.invalid } }, this.value?.map(value => (h("div", { class: "tag-pill" }, h("span", null, value), !this.disabled && (h("cat-button", { size: "xs", variant: "text", icon: "$cat:select-clear", iconOnly: true, a11yLabel: i18n.t('select.deselect'), onClick: () => this.deselect(value), tabIndex: -1 }))))), h("div", { key: '8201854379fedd97152173c5383eeba5a93ff43e', class: "input-inner-wrapper" }, h("input", { key: '11ca4d750d8f36560e5ff1a2a336f83a481dd3be', "data-test": this.testId, ...this.nativeAttributes, part: "input", id: `tags-${this.id}-input`, class: "tags-input", role: "combobox", ref: el => (this.input = el), "aria-invalid": this.invalid ? 'true' : undefined, "aria-describedby": this.hasHint ? this.id + '-hint' : undefined, onInput: this.onInput.bind(this), onBlur: this.onBlur.bind(this), placeholder: this.placeholder, disabled: this.disabled }), this.clearable && !this.disabled && (this.value?.length ?? 0) > 0 && (h("cat-button", { key: 'af93bc6cdc41b7bfaacef19549093bf8dc85e000', class: "clearable", icon: "$cat:input-close", "icon-only": "true", size: "s", variant: "text", "a11y-label": i18n.t('input.clear'), onClick: this.clear.bind(this), "data-dropdown-no-close": true })), this.invalid && h("cat-icon", { key: '5df20d3094317ed268588a1cde317243e1390855', icon: "$cat:input-error", class: "icon-suffix cat-text-danger", size: "l" }))), this.hasHint && (h(CatFormHint, { key: 'c3fafb4299fc29ce029c92b34bc54df35a33ffb3', id: this.id, hint: this.hint, slottedHint: this.hasSlottedHint && h("slot", { name: "hint" }), errorMap: this.errorMap }))));
|
|
99
99
|
}
|
|
100
100
|
get hasHint() {
|
|
101
101
|
return !!this.hint || !!this.hasSlottedHint || this.invalid;
|
|
@@ -110,15 +110,15 @@ export class CatTextarea {
|
|
|
110
110
|
}
|
|
111
111
|
render() {
|
|
112
112
|
this.hostElement.tabIndex = Number(this.hostElement.getAttribute('tabindex')) || 0;
|
|
113
|
-
return (h(Host, { key: '
|
|
113
|
+
return (h(Host, { key: 'ba2d56e2d7fcb9d4af66a24d5476132e2ebefcf4' }, h("div", { key: 'e60bdc9b54fb1de1ae27f1e93caa6802180a7b4a', class: {
|
|
114
114
|
'textarea-field': true,
|
|
115
115
|
'textarea-horizontal': this.horizontal ?? this.fallbackHorizontal ?? false
|
|
116
|
-
} }, h("div", { key: '
|
|
116
|
+
} }, h("div", { key: '3611f3a9830ed34c86c3f165f01905f4d227b0be', class: { 'label-container': true, hidden: this.labelHidden } }, (this.hasSlottedLabel || this.label) && (h("label", { key: '77c4783b59f3d6965f0c01328db36d5c8518c0f6', htmlFor: this.id, part: "label" }, h("span", { key: 'd0df4164caa5f19838fdb5acfa5561fc95fdb1fe', class: "label-wrapper" }, (this.hasSlottedLabel && h("slot", { key: 'e958ec958b57ce4543f1178d8cfcb93b056a30d8', name: "label" })) || this.label, h("div", { key: '76f871899822b2bb400be7e88d4e08353c4edbe3', class: "label-metadata" }, !this.required && (this.requiredMarker ?? 'optional').startsWith('optional') && (h("span", { key: 'd14451a2e39a13a8918892cd11645208c4cdc680', class: "label-optional", "aria-hidden": "true" }, "(", i18n.t('input.optional'), ")")), this.required && this.requiredMarker?.startsWith('required') && (h("span", { key: 'b679e94fe20aeecc64f60bd3ecc2952b33639039', class: "label-optional", "aria-hidden": "true" }, "(", i18n.t('input.required'), ")")), (this.maxLength || this.hasSlottedCounter) && (h("div", { key: '3dce07d25a0aeddc7b91f8f8426cd21b7bd60c7e', class: "label-character-count", "aria-hidden": "true" }, this.hasSlottedCounter ? (h("slot", { name: "counter" })) : (`${this.value?.length ?? 0}/${this.maxLength}`)))))))), h("div", { key: '008b6ebfe6dca48aa581d249310c2dda8ba9dba1', class: "textarea-container" }, h("div", { key: 'ff921daa8769f7407e72b4519e31eb6570301b4d', class: {
|
|
117
117
|
'textarea-wrapper': true,
|
|
118
118
|
'textarea-readonly': this.readonly,
|
|
119
119
|
'textarea-disabled': this.disabled,
|
|
120
120
|
'textarea-invalid': this.invalid
|
|
121
|
-
} }, h("textarea", { key: '
|
|
121
|
+
} }, h("textarea", { key: '3ea5625a1f67ab98b4975b8f9095f33091d18455', "data-test": this.testId, ...this.nativeAttributes, part: "textarea", ref: el => (this.textarea = el), id: this.id, disabled: this.disabled, autocomplete: this.autoComplete, 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", { key: '351dc18bfa3aaaa0d0cc5cf585b48334d0cf8cc9', icon: "$cat:input-error", class: "icon-suffix cat-text-danger", size: "l", onClick: () => this.textarea.focus() }))), this.hasHint && (h(CatFormHint, { key: '6e469529e9551d19f523f0fe9f23abc92855e92c', id: this.id, hint: this.hint, slottedHint: this.hasSlottedHint && h("slot", { name: "hint" }), errorMap: this.errorMap }))))));
|
|
122
122
|
}
|
|
123
123
|
get hasHint() {
|
|
124
124
|
return !!this.hint || !!this.hasSlottedHint || this.invalid;
|
|
@@ -162,14 +162,14 @@ export class CatTime {
|
|
|
162
162
|
}
|
|
163
163
|
render() {
|
|
164
164
|
this.hostElement.tabIndex = Number(this.hostElement.getAttribute('tabindex')) || 0;
|
|
165
|
-
return (h(Host, { key: '
|
|
165
|
+
return (h(Host, { key: 'c900a10f9992512537bb54a55f380148c698bd2d' }, h("cat-input", { key: 'f6447d6a18225762b6adc85955584d4710a9ffa5', class: "cat-time-input", ref: el => (this.input = el), requiredMarker: this.requiredMarker, horizontal: this.horizontal ?? this.fallbackHorizontal, 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, testId: this.testId, nativeAttributes: this.nativeAttributes, timeMaskOptions: this.timeMaskOptions, onCatFocus: e => this.catFocus.emit(e.detail), onCatBlur: e => this.onInputBlur(e.detail) }, h("span", { key: '328134e94616b73309294b1dbd60d9978b1fe32b', slot: "label" }, this.hasSlottedLabel && h("slot", { key: 'c7e48d1a65631ac9f05b30e6e03706771617a9eb', name: "label" }), !this.hasSlottedLabel && this.label, h("span", { key: '59dd274d4039d8ce890b95dd6f9efdc4fc68b456', class: "label-aria" }, " (HH:mm)")), h("div", { key: '962771fb4390695dfa17eef88cde5299dff060df', slot: "addon", class: "cat-time-addon" }, this.locale.timeFormat === '12' && (h("cat-button", { key: 'a0fa293b5c430efb3ee873da2f8c6ee9f6e22935', class: "cat-time-format", disabled: this.disabled || this.readonly, onCatClick: () => this.toggleAm() }, this.isAm ? this.localizedDayPeriods.am : this.localizedDayPeriods.pm)), h("cat-dropdown", { key: '14d7f7b5063d5f74d6f1272742badce87ed150ac', slot: "addon", placement: this.placement }, h("cat-button", { key: '1ae784a0d45b0ec92f57a1845a2c7f04097e6d3b', 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: 'bfc501e88cd1941fffc3d10b8aed69d830c9bec6', slot: "content", class: "cat-nav" }, h("ul", { key: 'd65978850e0416d8de748293dcf12397b531fc54' }, this.timeArray().map(time => {
|
|
166
166
|
const isoTime = formatIso(time);
|
|
167
167
|
const disabled = isBefore(time, this.min ?? null) || isAfter(time, this.max ?? null);
|
|
168
168
|
return (h("li", null, h("cat-button", { class: {
|
|
169
169
|
'cat-nav-item': true,
|
|
170
170
|
'time-disabled': disabled
|
|
171
171
|
}, disabled: disabled, active: isoTime === this.value, color: isoTime === this.value ? 'primary' : 'secondary', variant: isoTime === this.value ? 'filled' : 'outlined', onCatClick: () => this.select(time), "data-time": isoTime }, this.format(time))));
|
|
172
|
-
}))))), this.hasSlottedHint && (h("span", { key: '
|
|
172
|
+
}))))), this.hasSlottedHint && (h("span", { key: 'b34b48f7db86956f9f9211a80ba7f0afb0dba10d', slot: "hint" }, h("slot", { key: 'd170ddd7ebe8a75af7b2410771d30bcc4c23bceb', name: "hint" }))))));
|
|
173
173
|
}
|
|
174
174
|
timeArray() {
|
|
175
175
|
const result = [];
|
|
@@ -79,13 +79,13 @@ export class CatToggle {
|
|
|
79
79
|
}
|
|
80
80
|
render() {
|
|
81
81
|
this.hostElement.tabIndex = Number(this.hostElement.getAttribute('tabindex')) || 0;
|
|
82
|
-
return (h(Host, { key: '
|
|
82
|
+
return (h(Host, { key: '7285035e8798acd7e31d9f244185f66dfd1e8ff2' }, h("label", { key: 'fcfa457a536a826b113493f2851e4fb92336f191', htmlFor: this.id, class: {
|
|
83
83
|
'is-hidden': this.labelHidden,
|
|
84
84
|
'is-disabled': this.disabled,
|
|
85
85
|
'label-left': this.labelLeft,
|
|
86
86
|
'align-center': this.alignment === 'center',
|
|
87
87
|
'align-end': this.alignment === 'bottom'
|
|
88
|
-
} }, h("input", { key: '
|
|
88
|
+
} }, h("input", { key: 'db247c0b593b85237fa9f0c369d706d6fa16d7ec', "data-test": this.testId, ...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: 'fa4934e1d6f40378b0d2b3aa3e08c1c1444579d3', class: "toggle" }), h("span", { key: 'e4c888660de8acf4ca9c0bf093eb9546bd67e994', class: "label", part: "label" }, (this.hasSlottedLabel && h("slot", { key: 'c2dbaa736eb123c5adcc9e0cda6cef89bf6fd4b8', name: "label" })) || this.label)), this.hasHint && (h("div", { key: '087543ee1d86ccc4739d8f33e5cf4de419818d43', class: { 'hint-wrapper': true, 'label-left': this.labelLeft } }, h("div", { key: '424513a88e130972ec5a6b64c7eb8639691258c2', class: "toggle-placeholder" }), h(CatFormHint, { key: 'a1c87e7ce6ed636f69760dbdbb4f54688b0fce4e', id: this.id, hint: this.hint, slottedHint: this.hasSlottedHint && h("slot", { name: "hint" }) })))));
|
|
89
89
|
}
|
|
90
90
|
get hasHint() {
|
|
91
91
|
return !!this.hint || !!this.hasSlottedHint;
|
|
@@ -73,12 +73,12 @@ export class CatTooltip {
|
|
|
73
73
|
this.hideTooltip();
|
|
74
74
|
}
|
|
75
75
|
render() {
|
|
76
|
-
return (h(Host, { key: '
|
|
76
|
+
return (h(Host, { key: '8f34e0ba58b9cf70b4764914d5f3edd36ed42c10' }, h("slot", { key: 'd053bf106d2884336c1cdeb55215bd62dbd6eae7' }), h("div", { key: '9f310741fd56f1e4441c45125010176621da0c59', ref: el => (this.tooltip = el), id: this.id, role: "tooltip", "aria-hidden": !this.open, "aria-live": this.open ? 'polite' : 'off', class: {
|
|
77
77
|
tooltip: true,
|
|
78
78
|
'tooltip-hidden': this.inactive,
|
|
79
79
|
'tooltip-round': this.round,
|
|
80
80
|
[`tooltip-${this.size}`]: Boolean(this.size)
|
|
81
|
-
} }, h("slot", { key: '
|
|
81
|
+
} }, h("slot", { key: 'c99bd5cee9a1961d39a20c2049ee43675efc4b67', name: "content" }, h("p", { key: '66051fb6e03a9292a7c829b53162d307af2a914e' }, this.content)))));
|
|
82
82
|
}
|
|
83
83
|
addListeners() {
|
|
84
84
|
this.trigger?.addEventListener('focusin', this.boundShowListener);
|
|
@@ -44,7 +44,7 @@ const CatAlert$1 = /*@__PURE__*/ proxyCustomElement(class CatAlert extends HTMLE
|
|
|
44
44
|
setAttributeDefault(this, 'role', this.mapRole.get(this.color));
|
|
45
45
|
}
|
|
46
46
|
render() {
|
|
47
|
-
return (h(Host, { key: '
|
|
47
|
+
return (h(Host, { key: 'd642ef0422878f85d53bdc1b287ce282f9459e30' }, !this.noIcon && h("cat-icon", { key: 'c42d730501e2704466f56f3a1b9f7b1e261af00c', size: "l", icon: this.icon || this.mapIcon.get(this.color) }), h("div", { key: '0e4cf734fb202e9da515753a057e95182c13c7a0', class: "content" }, h("slot", { key: 'a0161fefe3a228488be263421013882565f790e9' }))));
|
|
48
48
|
}
|
|
49
49
|
get hostElement() { return this; }
|
|
50
50
|
static get style() { return catAlertCss; }
|
|
@@ -82,7 +82,7 @@ const CatBadge$1 = /*@__PURE__*/ proxyCustomElement(class CatBadge extends HTMLE
|
|
|
82
82
|
}
|
|
83
83
|
}
|
|
84
84
|
render() {
|
|
85
|
-
return (h(Host, { key: '
|
|
85
|
+
return (h(Host, { key: 'd803d632d26891fbd4cc899a8776a54076cdf850', "data-icon-badge": this.isIconBadge ? this.size : null }, this.hasPrefixIcon ? h("cat-icon", { icon: this.icon, size: this.iconSize, part: "prefix" }) : null, this.isIconBadge ? (h("cat-icon", { icon: this.icon, size: this.iconSize, class: "icon-only" })) : (h("slot", null)), this.hasSuffixIcon ? h("cat-icon", { icon: this.icon, size: this.iconSize, part: "prefix" }) : null));
|
|
86
86
|
}
|
|
87
87
|
get hostElement() { return this; }
|
|
88
88
|
static get watchers() { return {
|
|
@@ -10,7 +10,7 @@ const CatButtonGroup$1 = /*@__PURE__*/ proxyCustomElement(class CatButtonGroup e
|
|
|
10
10
|
this.buttonElements = [];
|
|
11
11
|
}
|
|
12
12
|
render() {
|
|
13
|
-
return (h(Host, { key: '
|
|
13
|
+
return (h(Host, { key: 'a5635200630e28f57a1a88797324379320d0a49e', role: "group", "aria-label": this.a11yLabel }, h("slot", { key: '7aae9852ae371bbf407df59a3de1db1624b4e9d1', onSlotchange: this.onSlotChange.bind(this) })));
|
|
14
14
|
}
|
|
15
15
|
onSlotChange() {
|
|
16
16
|
this.buttonElements = Array.from(this.hostElement.querySelectorAll(':scope > cat-button, :scope > cat-tooltip > cat-button, :scope > cat-dropdown cat-button[slot="trigger"]'));
|
|
@@ -10,7 +10,7 @@ const CatCard$1 = /*@__PURE__*/ proxyCustomElement(class CatCard extends HTMLEle
|
|
|
10
10
|
this.catLoad = createEvent(this, "catLoad", 7);
|
|
11
11
|
}
|
|
12
12
|
render() {
|
|
13
|
-
return h("slot", { key: '
|
|
13
|
+
return h("slot", { key: '0dc3e0d280b58b480314bf10cea9ed7f954516be' });
|
|
14
14
|
}
|
|
15
15
|
componentDidLoad() {
|
|
16
16
|
this.catLoad.emit();
|
|
@@ -88,13 +88,13 @@ const CatCheckbox = /*@__PURE__*/ proxyCustomElement(class CatCheckbox extends H
|
|
|
88
88
|
this.input.blur();
|
|
89
89
|
}
|
|
90
90
|
render() {
|
|
91
|
-
return (h(Host, { key: '
|
|
91
|
+
return (h(Host, { key: '64f3d1f023c2e8ec2d3c0a23b1f1f0c19241f41f' }, h("label", { key: 'e54c1e60a1d3aa0ce78d218b036b87d04e1a1842', htmlFor: this.id, class: {
|
|
92
92
|
'is-hidden': this.labelHidden,
|
|
93
93
|
'is-disabled': this.disabled,
|
|
94
94
|
'label-left': this.labelLeft,
|
|
95
95
|
'align-center': this.alignment === 'center',
|
|
96
96
|
'align-end': this.alignment === 'bottom'
|
|
97
|
-
} }, h("input", { key: '
|
|
97
|
+
} }, h("input", { key: 'd28a1d799457139337ba0c782d913ade4e74fb07', "data-test": this.testId, ...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, indeterminate: this.indeterminate, 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: '96d80b03df081c19d36ca9d2d56b1542637855bd', class: "box", "aria-hidden": "true" }, h("svg", { key: '268e26a8db34695467583106349ceed890168e1c', class: "check", viewBox: "0 0 12 10" }, h("polyline", { key: 'ed1ba34e9839d1e80806ca52e94f4e7a3c6b720b', points: "1.5 6 4.5 9 10.5 1" })), h("svg", { key: '21eef5470b82b17868a4a591dacce708d04fb048', class: "dash", viewBox: "0 0 12 10" }, h("polyline", { key: '35d61e299c39c578069e05bb4f5982b33de8ac57', points: "1.5 5 10.5 5" }))), h("span", { key: 'b78cc985ede85e0174ab7d6fd851e9bc9348fdaf', class: { label: true, 'label-wrapper': !this.hasSlottedLabel }, part: "label" }, (this.hasSlottedLabel && h("slot", { key: 'bcdb0ed764451d3c7c11c00b68db3b48564bc73d', name: "label" })) || this.label, h("span", { key: '0ed579dadbdb3b4c92af29b670528ca253c49f37', class: "label-metadata" }, !this.required && (this.requiredMarker ?? 'optional').startsWith('optional') && (h("span", { key: '03e1b787954ba280b670b86c2cfeda5a3635bed7', class: "label-optional", "aria-hidden": "true" }, "(", catI18nRegistry.t('input.optional'), ")")), this.required && this.requiredMarker?.startsWith('required') && (h("span", { key: '6264f8d9517ca500c36dc75bbda936a407c5429c', class: "label-optional", "aria-hidden": "true" }, "(", catI18nRegistry.t('input.required'), ")"))))), this.hasHint && (h("div", { key: 'e149380c00369d71c02da2dabd78447c515c52d3', class: { 'hint-wrapper': true, 'label-left': this.labelLeft } }, h("div", { key: '86e662bf29c81eaf8db818500cb3aebc98fe939b', class: "box-placeholder" }), h(CatFormHint, { key: '3de67315be28edc3357bad66bcf0f1cdb64ee518', id: this.id, hint: this.hint, slottedHint: this.hasSlottedHint && h("slot", { name: "hint" }) })))));
|
|
98
98
|
}
|
|
99
99
|
get hasHint() {
|
|
100
100
|
return !!this.hint || !!this.hasSlottedHint;
|