@rededor/cura 1.6.0-alpha.2 → 1.6.0-alpha.4
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/cjs/cura-accordion_18.cjs.entry.js +30 -21
- package/dist/cjs/cura-accordion_18.cjs.entry.js.map +1 -1
- package/dist/cjs/cura-display.cjs.entry.js +1 -1
- package/dist/cjs/cura-display.cjs.entry.js.map +1 -1
- package/dist/cjs/cura.cjs.js +1 -1
- package/dist/cjs/loader.cjs.js +1 -1
- package/dist/collection/components/cura-dropdown-search-new/cura-dropdown-search-new.js +2 -3
- package/dist/collection/components/cura-dropdown-search-new/cura-dropdown-search-new.js.map +1 -1
- package/dist/collection/components/forms/cura-input-text/cura-input-text.js +3 -2
- package/dist/collection/components/forms/cura-input-text/cura-input-text.js.map +1 -1
- package/dist/collection/components/forms/cura-label/cura-label.css +12 -3
- package/dist/collection/components/forms/cura-label/cura-label.js +26 -5
- package/dist/collection/components/forms/cura-label/cura-label.js.map +1 -1
- package/dist/collection/components/forms/cura-label/cura-label.stories.js +13 -1
- package/dist/collection/components/forms/cura-label/cura-label.stories.js.map +1 -1
- package/dist/collection/components/text/cura-display/cura-display.css +22 -22
- package/dist/collection/components/text/cura-heading/cura-heading.css +9 -0
- package/dist/collection/components/text/cura-heading/cura-heading.js +23 -2
- package/dist/collection/components/text/cura-heading/cura-heading.js.map +1 -1
- package/dist/collection/components/text/cura-heading/cura-heading.stories.js +13 -1
- package/dist/collection/components/text/cura-heading/cura-heading.stories.js.map +1 -1
- package/dist/collection/components/text/cura-paragraph/cura-paragraph.css +36 -28
- package/dist/collection/components/text/cura-paragraph/cura-paragraph.js +27 -6
- package/dist/collection/components/text/cura-paragraph/cura-paragraph.js.map +1 -1
- package/dist/collection/components/text/cura-paragraph/cura-paragraph.stories.js +13 -1
- package/dist/collection/components/text/cura-paragraph/cura-paragraph.stories.js.map +1 -1
- package/dist/components/cura-display.js +1 -1
- package/dist/components/cura-display.js.map +1 -1
- package/dist/components/cura-dropdown-search-new.js +2 -3
- package/dist/components/cura-dropdown-search-new.js.map +1 -1
- package/dist/components/cura-heading2.js +7 -3
- package/dist/components/cura-heading2.js.map +1 -1
- package/dist/components/cura-input-text2.js +3 -2
- package/dist/components/cura-input-text2.js.map +1 -1
- package/dist/components/cura-label2.js +10 -6
- package/dist/components/cura-label2.js.map +1 -1
- package/dist/components/cura-paragraph2.js +11 -7
- package/dist/components/cura-paragraph2.js.map +1 -1
- package/dist/cura/cura.esm.js +1 -1
- package/dist/cura/cura.esm.js.map +1 -1
- package/dist/cura/p-8fb3bede.entry.js +2 -0
- package/dist/cura/p-8fb3bede.entry.js.map +1 -0
- package/dist/cura/p-b3582389.entry.js +2 -0
- package/dist/cura/p-b3582389.entry.js.map +1 -0
- package/dist/esm/cura-accordion_18.entry.js +30 -21
- package/dist/esm/cura-accordion_18.entry.js.map +1 -1
- package/dist/esm/cura-display.entry.js +1 -1
- package/dist/esm/cura-display.entry.js.map +1 -1
- package/dist/esm/cura.js +1 -1
- package/dist/esm/loader.js +1 -1
- package/dist/types/components/forms/cura-label/cura-label.d.ts +8 -1
- package/dist/types/components/forms/cura-label/cura-label.stories.d.ts +15 -0
- package/dist/types/components/text/cura-heading/cura-heading.d.ts +8 -1
- package/dist/types/components/text/cura-heading/cura-heading.stories.d.ts +15 -0
- package/dist/types/components/text/cura-paragraph/cura-paragraph.d.ts +8 -1
- package/dist/types/components/text/cura-paragraph/cura-paragraph.stories.d.ts +15 -0
- package/dist/types/components.d.ts +24 -0
- package/package.json +2 -2
- package/dist/cura/p-823d0bb5.entry.js +0 -2
- package/dist/cura/p-823d0bb5.entry.js.map +0 -1
- package/dist/cura/p-9dd47ec6.entry.js +0 -2
- package/dist/cura/p-9dd47ec6.entry.js.map +0 -1
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"cura-input-text.js","sourceRoot":"","sources":["../../../../src/components/forms/cura-input-text/cura-input-text.tsx"],"names":[],"mappings":"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","sourcesContent":["import { Component, Host, h, Prop, State, Watch, Event, EventEmitter, AttachInternals, Method, Element } from '@stencil/core';\nimport IMask, { FactoryArg, InputMask } from 'imask';\nimport { maskOptions, MaskOptionsMap } from './mask-presets/input-mask-presets';\nimport { checkMobile, checkIOS, fakeInputIOSHack } from '../../../utils/utils';\nexport type MaskPreset = keyof MaskOptionsMap;\n@Component({\n tag: 'cura-input-text',\n styleUrl: 'cura-input-text.scss',\n shadow: true,\n formAssociated: true,\n})\nexport class CuraInputText {\n @Element() host: HTMLElement;\n /**\n * Mode of the input: 'default' or 'transparent' (default: 'default')\n */\n @Prop({ reflect: true, mutable: true }) mode: 'default' | 'transparent' | string = 'default';\n\n /**\n * Indicates input status(default: default)\n */\n\n @Prop({ reflect: true, mutable: true }) status: 'error' | 'success' | 'default' | string = 'default';\n\n /**\n * Size of the input mode default: 'small', 'medium', or 'large' (default: 'medium')\n */\n @Prop({ reflect: true, mutable: true }) size: 'small' | 'medium' | 'large' | string = 'medium';\n\n /**\n * Type of the input: 'text', 'number' (default: 'text')\n */\n @Prop({ reflect: true }) type: string = 'text';\n\n /**\n * Type of the input: 'text', 'number' (default: 'text')\n */\n @Prop({ reflect: true }) inputMode: string = 'text';\n\n /**\n * Label text for the input\n */\n @Prop({ reflect: true }) label?: string = '';\n\n /**\n * Name text for the input\n */\n @Prop({ reflect: true }) name?: string = '';\n\n /**\n * Placeholder text for the input\n */\n @Prop({ reflect: true }) placeholder?: string | null = null;\n\n /**\n * Value of the input field\n */\n @Prop({ reflect: true, mutable: true }) value: string | number = '';\n\n /**\n * Whether to display a cura icon (default: null)\n */\n @Prop({ reflect: true, mutable: true }) iconName?: string = '';\n\n /**\n * Helper text displayed below the input\n */\n @Prop({ reflect: true, mutable: true }) helperText?: string;\n\n /**\n * Whether the input is disabled (default: false)\n */\n @Prop({ reflect: true }) disabled?: boolean = false;\n\n /**\n * Whether the input is required (default: false)\n */\n @Prop({ reflect: true }) required?: boolean = false;\n\n /**\n * Mask preset for input formatting: 'cpf', 'cnpj', 'phone', 'date', etc. Uses IMask library.\n * @see: https://imask.js.org/\n */\n @Prop() maskPreset?: MaskPreset;\n\n /*\n * Controls whether the selection functionality is active\n */\n @Prop({ reflect: true, mutable: true }) enableSelectionMode: boolean = false;\n\n /**\n * Regular expression for custom input masking. Uses IMask library.\n * @see: https://imask.js.org/\n */\n @Prop({ reflect: true, mutable: true }) maskRegex?: string | null;\n\n /**\n * Advanced mask object to be used with IMask library\n * @see: https://imask.js.org/\n */\n @Prop({ reflect: true, mutable: true }) maskAdvanced?: any | string | null;\n\n /**\n * Maximum length of the input value (default: undefined)\n */\n @Prop({ reflect: true, mutable: true }) maxlength?: number | undefined;\n\n /**\n * Whether the input is read-only (default: false)\n */\n @Prop({ reflect: true }) readOnly?: boolean = false;\n\n /**\n * Whether the input is in loading state (default: false)\n */\n @Prop({ reflect: true, mutable: true }) isLoading?: boolean = false;\n\n /**\n * Internal state: Whether the input is hovered (default: false)\n */\n @State() isHovered: boolean = false;\n\n /**\n * Internal state: Whether the input is focused (default: false)\n */\n @State() isFocused: boolean = false;\n\n /**\n * Internal state: Styles object for dynamic styling\n */\n @State() styles: { [key: string]: string } = {};\n\n /**\n * Icon button name for the clear button (default: 'closeCircle')\n */\n @Prop({ reflect: true, mutable: true }) clearIcon?: boolean = true;\n\n /**\n * Removes the alertCircle icon when necessary(as used in CuraDropdownSearch)\n */\n @Prop() hideErrorIcon: boolean = false;\n\n /**\n * Defines whether the input should have autocomplete\n */\n @Prop({ reflect: true }) autocomplete?: string = 'on';\n\n /**\n * Emitted when the value of the input changes\n * @type {EventEmitter<string | number>}\n */\n @Event() valueChange: EventEmitter<string | number>;\n\n /**\n * Emitted when the clear button is clicked\n * @type {EventEmitter<string | number>}\n */\n @Event() inputClear: EventEmitter<string | number>;\n\n @AttachInternals() internals: ElementInternals;\n\n inputRef!: HTMLInputElement;\n\n @Method()\n async setFocus() {\n // IOS needs large timeout value to work\n const timeoutMs = checkMobile() && checkIOS() ? 1000 : 200;\n // IOS fake input hack\n let fakeInput = fakeInputIOSHack(this.host);\n setTimeout(() => {\n this.inputRef.focus();\n if (fakeInput) fakeInput.remove();\n }, timeoutMs);\n }\n\n /**\n * Instance of InputMask is returned when IMask constructor is called.\n */\n maskedInput: InputMask<FactoryArg>;\n weights: { [key: string]: string };\n breakpoints: any;\n\n /**\n * Callback to restore the switch state from the form.\n */\n formStateRestoreCallback(state: { value: string }) {\n this.value = state.value;\n this.applyValueToMask();\n this.internals.setFormValue(this.value);\n }\n\n /**\n * Callback for form association.\n */\n formAssociatedCallback(form: { ariaLabel: string }) {\n form.ariaLabel = this.label;\n }\n\n /**\n * Callback to reset the switch state when the form is reset.\n */\n formResetCallback() {\n this.handleClearInput();\n this.internals.setValidity({});\n this.internals.setFormValue('');\n }\n\n /**\n * Callback to update the switch's disabled state when the form's disabled state changes.\n */\n formDisabledCallback(disabled: boolean) {\n this.disabled = disabled;\n }\n\n @Watch('styles')\n connectedCallback() {\n this.styles['--primary-base'] = window.CuraAPI.theme.colors.getColor(`primary-base`);\n this.styles['--neutral-purewhite'] = window.CuraAPI.theme.colors.getColor(`neutral-purewhite`);\n this.styles['--neutral-white'] = window.CuraAPI.theme.colors.getColor(`neutral-white`);\n this.styles['--neutral-black'] = window.CuraAPI.theme.colors.getColor(`neutral-black`);\n this.styles['--neutral-medium'] = window.CuraAPI.theme.colors.getColor(`neutral-medium`);\n this.styles['--neutral-base'] = window.CuraAPI.theme.colors.getColor(`neutral-base`);\n this.styles['--neutral-dark'] = window.CuraAPI.theme.colors.getColor(`neutral-dark`);\n this.styles['--success-dark'] = window.CuraAPI.theme.colors.getColor(`success-dark`);\n this.styles['--success-darker'] = window.CuraAPI.theme.colors.getColor(`success-darker`);\n this.styles['--success-lighter'] = window.CuraAPI.theme.colors.getColor(`success-lighter`);\n this.styles['--error-lighter'] = window.CuraAPI.theme.colors.getColor(`error-lighter`);\n this.styles['--error-dark'] = window.CuraAPI.theme.colors.getColor(`error-dark`);\n this.styles['--error-darker'] = window.CuraAPI.theme.colors.getColor(`error-darker`);\n this.styles['--error-base'] = window.CuraAPI.theme.colors.getColor(`error-base`);\n this.styles['--info-base'] = window.CuraAPI.theme.colors.getColor(`info-base`);\n this.styles['--font-family'] = window.CuraAPI.theme.fonts.getFamily();\n this.styles['--font-size'] = window.CuraAPI.theme.fonts.getSize();\n this.styles['--font-color'] = window.CuraAPI.theme.fonts.getColor();\n this.weights = window.CuraAPI.theme.fonts.getWeights();\n this.breakpoints = window.CuraAPI.theme.breakpoints.get();\n this.styles['--font-weight-medium'] = this.weights.medium;\n this.styles['--font-weight-bold'] = this.weights.bold;\n this.styles['--font-weight-regular'] = this.weights.regular;\n }\n\n @Watch('size')\n getClasses() {\n return {\n [this.size.toLowerCase()]: this.mode === 'default',\n disabled: this.disabled,\n isLoading: this.isLoading,\n isFocused: this.isFocused && !this.disabled && !this.readOnly && !this.isLoading,\n isHovered: this.isHovered,\n [this.status]: true,\n transparent: this.mode === 'transparent',\n selection: this.enableSelectionMode,\n };\n }\n\n getLabelColor() {\n if (!!this.disabled) {\n return 'neutral-medium';\n } else if (this.isLoading && this.mode === 'transparent' && !this.isHovered) {\n return 'neutral-dark';\n } else if (((this.isFocused || this.isHovered || this.status === 'success' || this.status === 'error') && !this.readOnly) || this.isHovered) {\n return 'neutral-black';\n } else {\n return 'neutral-dark';\n }\n }\n\n @Watch('status')\n @Watch('mode')\n renderIcon() {\n if ((this.iconName === '' && this.status === 'default') || (this.mode === 'transparent' && this.isLoading) || (this.mode === 'transparent' && this.status === 'default')) {\n return;\n }\n // Used when input is rendered in cura-dropdown-search with error status\n if (this.status === 'error' && this.hideErrorIcon) {\n return;\n }\n\n const iconSizeDefaultMode = this.size === 'large' ? 20 : 16;\n const baseIconSize = this.mode === 'transparent' ? 20 : iconSizeDefaultMode;\n\n const iconMap: { [key: string]: { name: string; color: string } } = {\n loading: { name: this.iconName, color: 'primary-base' },\n success: { name: 'checkCircle', color: 'success-dark' },\n error: { name: 'alertCircle', color: 'error-dark' },\n default: { name: this.iconName, color: 'neutral-dark' },\n };\n\n const iconConfig = iconMap[this.isLoading ? 'loading' : this.status || 'default'];\n\n return (\n <div class=\"feedback-icon\" style={this.styles}>\n <cura-icon name={iconConfig.name} iconset=\"default\" size={baseIconSize} color={iconConfig.color} />\n </div>\n );\n }\n\n renderHelperText() {\n const isError = this.status === 'error';\n const isSuccess = this.status === 'success';\n const isDefault = this.status === 'default';\n const helperTextSize = this.size === 'large' ? 'small' : 'xsmall';\n const colorText = (() => {\n if (this.disabled) return 'neutral-medium';\n if (this.isLoading) return 'primary-base';\n if (this.isFocused || this.isHovered) return 'neutral-black';\n return 'neutral-dark';\n })();\n\n return (\n <div style={this.styles} class=\"helper-text\" part=\"cura-input-text-helper\">\n {isDefault && (\n <cura-label size={helperTextSize} lineHeight=\"xsmall\" color={colorText}>\n <slot></slot>\n </cura-label>\n )}\n {isError && this.mode === \"default\" && (\n <cura-label size={helperTextSize} lineHeight=\"xsmall\" color=\"error-dark\">\n <slot></slot>\n </cura-label>\n )}\n {isError && this.mode === \"transparent\" && (\n <cura-label size={helperTextSize} lineHeight=\"xsmall\" color=\"neutral-black\">\n <slot></slot>\n </cura-label>\n )}\n {isSuccess && (\n <cura-label size={helperTextSize} lineHeight=\"xsmall\" color=\"success-dark\">\n <slot></slot>\n </cura-label>\n )}\n </div>\n );\n }\n\n handleMouseEnter() {\n this.isHovered = true;\n }\n handleMouseLeave() {\n this.isHovered = false;\n }\n\n componentDidLoad() {\n this.initializeMask();\n }\n\n disconnectedCallback() {\n this.destroyMask();\n }\n\n handleMaskUpdate() {\n if (this.maskedInput) {\n this.maskedInput.updateValue();\n }\n }\n\n handleClearInput() {\n this.handleMaskUpdate();\n this.value = '';\n this.inputRef.value = '';\n this.valueChange.emit(this.value);\n this.inputClear.emit(this.value);\n this.handleMaskUpdate();\n this.setFocus();\n }\n\n handleInputFocus() {\n this.handleMaskUpdate();\n this.isFocused = true;\n }\n\n handleInputBlur() {\n this.handleMaskUpdate();\n setTimeout(() => {\n this.isFocused = false;\n }, 150);\n }\n\n shouldDisplayMask() {\n return this.maskPreset || this.maskRegex || this.maskAdvanced;\n }\n\n @Watch('maskPreset')\n @Watch('maskRegex')\n @Watch('maskAdvanced')\n initializeMask() {\n if (this.shouldDisplayMask()) {\n if (this.maskedInput) {\n this.destroyMask();\n }\n if (this.maskPreset) {\n this.initializePresetMask();\n } else if (this.maskRegex) {\n this.initializeRegexMask();\n } else if (this.maskAdvanced) {\n this.initializeAdvancedMask();\n }\n this.applyValueToMask();\n } else {\n this.clearMaskValue();\n }\n }\n\n initializeRegexMask() {\n const cleanedRegexString = this.maskRegex.replace(/^\\/|\\/[gimsuy]*$/g, '');\n const flags = (this.maskRegex.match(/\\/[gimsuy]*$/g) || [''])[0].slice(1);\n this.maskedInput = IMask(this.inputRef, { mask: new RegExp(cleanedRegexString, flags) });\n }\n\n initializePresetMask() {\n const options = maskOptions[this.maskPreset];\n\n if (options) {\n this.maskedInput = IMask(this.inputRef, options);\n } else {\n console.error(`Mask preset \"${this.maskPreset}\" not found.`);\n }\n }\n\n initializeAdvancedMask() {\n if (!this.inputRef) return;\n\n try {\n const config = typeof this.maskAdvanced === 'string' ? JSON.parse(this.maskAdvanced) : this.maskAdvanced;\n this.maskedInput = IMask(this.inputRef, config);\n } catch (error) {\n console.error('Error defining maskAdvanced:', error);\n }\n }\n\n applyValueToMask() {\n if (this.maskedInput) {\n if (this.maskedInput.mask === Date || this.maskedInput.mask === Number) {\n this.maskedInput.typedValue = this.value;\n } else {\n this.value = this.maskedInput.value;\n }\n this.handleMaskUpdate();\n }\n }\n\n clearMaskValue() {\n this.inputRef.value = this.value as string;\n }\n\n destroyMask() {\n if (this.maskedInput) {\n this.maskedInput.destroy();\n this.maskedInput = undefined;\n }\n }\n\n handleInputChange(event: any) {\n const inputValue = event.target.value;\n\n this.valueChange.emit(inputValue);\n\n if (this.type === 'number') {\n this.handleNumberInputChange(inputValue);\n } else {\n this.handleTextInputChange(inputValue);\n }\n this.internals.setFormValue(this.value as string);\n }\n\n handleNumberInputChange(inputValue: string) {\n const numericValue = parseFloat(inputValue);\n if (!isNaN(numericValue)) {\n this.value = numericValue;\n } else {\n console.error('Invalid numeric input:', inputValue);\n }\n }\n\n handleTextInputChange(inputValue: string) {\n if (this.maskedInput) {\n if (this.maskedInput.mask instanceof Date || this.maskedInput.mask === Number) {\n this.maskedInput.typedValue = inputValue;\n this.value = this.maskedInput.typedValue;\n }\n this.value = this.maskedInput.value;\n } else {\n this.value = inputValue;\n }\n }\n\n handleKeyDown(event: KeyboardEvent) {\n if (this.type === 'number') {\n this.handleBlockInvalidNumber(event);\n }\n }\n\n handleBlockInvalidNumber(e: KeyboardEvent) {\n if (['e', 'E', '+', '-'].includes(e.key)) e.preventDefault();\n }\n\n render() {\n return (\n <Host>\n <div\n style={this.styles}\n onMouseEnter={() => this.handleMouseEnter()}\n onMouseLeave={() => this.handleMouseLeave()}\n class={{\n 'cura-input-group': true,\n ...this.getClasses(),\n }}\n >\n <div class=\"input-wrapper\">\n {this.label && (\n <cura-label class=\"label\" weight=\"bold\" size={this.size === 'large' ? 'small' : 'xsmall'} color={this.getLabelColor()}>\n {this.label} {this.required && <span class=\"required\">* </span>}\n </cura-label>\n )}\n <div class=\"cura-input-field\" part=\"cura-input-field\" style={this.styles}>\n {this.renderIcon()}\n <input\n name={this.name ? this.name : ''}\n type={this.type}\n onKeyDown={event => this.handleKeyDown(event)}\n onBlur={this.handleInputBlur.bind(this)}\n onFocus={this.handleInputFocus.bind(this)}\n onInput={event => this.handleInputChange(event)}\n class={this.getClasses()}\n style={this.styles}\n placeholder={this.placeholder}\n disabled={this.disabled || this.isLoading}\n required={this.required}\n readonly={this.readOnly}\n maxlength={this.maxlength}\n value={this.value !== undefined && this.value !== null ? this.value : ''}\n inputmode={this.maskPreset ? 'tel' : this.inputMode}\n ref={ref => (this.inputRef = ref)}\n autocomplete={this.autocomplete}\n />\n {!!this.clearIcon && !this.readOnly && !this.isLoading && !this.disabled && this.value && this.isFocused && (\n <cura-icon\n size={this.size === 'large' || this.mode === 'transparent' ? 20 : 16}\n color=\"primary-base\"\n name=\"closeCircle\"\n iconset=\"default\"\n class=\"clear-button\"\n onClick={() => this.handleClearInput()}\n />\n )}\n {this.isLoading && <cura-loader-circle size={this.size === 'large' ? 'medium' : 'small'} color=\"primary-base\"></cura-loader-circle>}\n </div>\n {this.renderHelperText()}\n </div>\n </div>\n </Host>\n );\n }\n}\n"]}
|
|
1
|
+
{"version":3,"file":"cura-input-text.js","sourceRoot":"","sources":["../../../../src/components/forms/cura-input-text/cura-input-text.tsx"],"names":[],"mappings":"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","sourcesContent":["import { Component, Host, h, Prop, State, Watch, Event, EventEmitter, AttachInternals, Method, Element } from '@stencil/core';\nimport IMask, { FactoryArg, InputMask } from 'imask';\nimport { maskOptions, MaskOptionsMap } from './mask-presets/input-mask-presets';\nimport { checkMobile, checkIOS, fakeInputIOSHack } from '../../../utils/utils';\nexport type MaskPreset = keyof MaskOptionsMap;\n@Component({\n tag: 'cura-input-text',\n styleUrl: 'cura-input-text.scss',\n shadow: true,\n formAssociated: true,\n})\nexport class CuraInputText {\n @Element() host: HTMLElement;\n /**\n * Mode of the input: 'default' or 'transparent' (default: 'default')\n */\n @Prop({ reflect: true, mutable: true }) mode: 'default' | 'transparent' | string = 'default';\n\n /**\n * Indicates input status(default: default)\n */\n\n @Prop({ reflect: true, mutable: true }) status: 'error' | 'success' | 'default' | string = 'default';\n\n /**\n * Size of the input mode default: 'small', 'medium', or 'large' (default: 'medium')\n */\n @Prop({ reflect: true, mutable: true }) size: 'small' | 'medium' | 'large' | string = 'medium';\n\n /**\n * Type of the input: 'text', 'number' (default: 'text')\n */\n @Prop({ reflect: true }) type: string = 'text';\n\n /**\n * Type of the input: 'text', 'number' (default: 'text')\n */\n @Prop({ reflect: true }) inputMode: string = 'text';\n\n /**\n * Label text for the input\n */\n @Prop({ reflect: true }) label?: string = '';\n\n /**\n * Name text for the input\n */\n @Prop({ reflect: true }) name?: string = '';\n\n /**\n * Placeholder text for the input\n */\n @Prop({ reflect: true }) placeholder?: string | null = null;\n\n /**\n * Value of the input field\n */\n @Prop({ reflect: true, mutable: true }) value: string | number = '';\n\n /**\n * Whether to display a cura icon (default: null)\n */\n @Prop({ reflect: true, mutable: true }) iconName?: string = '';\n\n /**\n * Helper text displayed below the input\n */\n @Prop({ reflect: true, mutable: true }) helperText?: string;\n\n /**\n * Whether the input is disabled (default: false)\n */\n @Prop({ reflect: true }) disabled?: boolean = false;\n\n /**\n * Whether the input is required (default: false)\n */\n @Prop({ reflect: true }) required?: boolean = false;\n\n /**\n * Mask preset for input formatting: 'cpf', 'cnpj', 'phone', 'date', etc. Uses IMask library.\n * @see: https://imask.js.org/\n */\n @Prop() maskPreset?: MaskPreset;\n\n /*\n * Controls whether the selection functionality is active\n */\n @Prop({ reflect: true, mutable: true }) enableSelectionMode: boolean = false;\n\n /**\n * Regular expression for custom input masking. Uses IMask library.\n * @see: https://imask.js.org/\n */\n @Prop({ reflect: true, mutable: true }) maskRegex?: string | null;\n\n /**\n * Advanced mask object to be used with IMask library\n * @see: https://imask.js.org/\n */\n @Prop({ reflect: true, mutable: true }) maskAdvanced?: any | string | null;\n\n /**\n * Maximum length of the input value (default: undefined)\n */\n @Prop({ reflect: true, mutable: true }) maxlength?: number | undefined;\n\n /**\n * Whether the input is read-only (default: false)\n */\n @Prop({ reflect: true }) readOnly?: boolean = false;\n\n /**\n * Whether the input is in loading state (default: false)\n */\n @Prop({ reflect: true, mutable: true }) isLoading?: boolean = false;\n\n /**\n * Internal state: Whether the input is hovered (default: false)\n */\n @State() isHovered: boolean = false;\n\n /**\n * Internal state: Whether the input is focused (default: false)\n */\n @State() isFocused: boolean = false;\n\n /**\n * Internal state: Styles object for dynamic styling\n */\n @State() styles: { [key: string]: string } = {};\n\n /**\n * Icon button name for the clear button (default: 'closeCircle')\n */\n @Prop({ reflect: true, mutable: true }) clearIcon?: boolean = true;\n\n /**\n * Removes the alertCircle icon when necessary(as used in CuraDropdownSearch)\n */\n @Prop() hideErrorIcon: boolean = false;\n\n /**\n * Defines whether the input should have autocomplete\n */\n @Prop({ reflect: true }) autocomplete?: string = 'on';\n\n /**\n * Emitted when the value of the input changes\n * @type {EventEmitter<string | number>}\n */\n @Event() valueChange: EventEmitter<string | number>;\n\n /**\n * Emitted when the clear button is clicked\n * @type {EventEmitter<string | number>}\n */\n @Event() inputClear: EventEmitter<string | number>;\n\n @AttachInternals() internals: ElementInternals;\n\n inputRef!: HTMLInputElement;\n\n @Method()\n async setFocus() {\n // IOS needs large timeout value to work\n const timeoutMs = checkMobile() && checkIOS() ? 1000 : 200;\n // IOS fake input hack\n let fakeInput = fakeInputIOSHack(this.host);\n setTimeout(() => {\n this.inputRef.focus();\n if (fakeInput) fakeInput.remove();\n }, timeoutMs);\n }\n\n /**\n * Instance of InputMask is returned when IMask constructor is called.\n */\n maskedInput: InputMask<FactoryArg>;\n weights: { [key: string]: string };\n breakpoints: any;\n\n /**\n * Callback to restore the switch state from the form.\n */\n formStateRestoreCallback(state: { value: string }) {\n this.value = state.value;\n this.applyValueToMask();\n this.internals.setFormValue(this.value);\n }\n\n /**\n * Callback for form association.\n */\n formAssociatedCallback(form: { ariaLabel: string }) {\n form.ariaLabel = this.label;\n }\n\n /**\n * Callback to reset the switch state when the form is reset.\n */\n formResetCallback() {\n this.handleClearInput();\n this.internals.setValidity({});\n this.internals.setFormValue('');\n }\n\n /**\n * Callback to update the switch's disabled state when the form's disabled state changes.\n */\n formDisabledCallback(disabled: boolean) {\n this.disabled = disabled;\n }\n\n @Watch('styles')\n connectedCallback() {\n this.styles['--primary-base'] = window.CuraAPI.theme.colors.getColor(`primary-base`);\n this.styles['--neutral-purewhite'] = window.CuraAPI.theme.colors.getColor(`neutral-purewhite`);\n this.styles['--neutral-white'] = window.CuraAPI.theme.colors.getColor(`neutral-white`);\n this.styles['--neutral-black'] = window.CuraAPI.theme.colors.getColor(`neutral-black`);\n this.styles['--neutral-medium'] = window.CuraAPI.theme.colors.getColor(`neutral-medium`);\n this.styles['--neutral-base'] = window.CuraAPI.theme.colors.getColor(`neutral-base`);\n this.styles['--neutral-dark'] = window.CuraAPI.theme.colors.getColor(`neutral-dark`);\n this.styles['--success-dark'] = window.CuraAPI.theme.colors.getColor(`success-dark`);\n this.styles['--success-darker'] = window.CuraAPI.theme.colors.getColor(`success-darker`);\n this.styles['--success-lighter'] = window.CuraAPI.theme.colors.getColor(`success-lighter`);\n this.styles['--error-lighter'] = window.CuraAPI.theme.colors.getColor(`error-lighter`);\n this.styles['--error-dark'] = window.CuraAPI.theme.colors.getColor(`error-dark`);\n this.styles['--error-darker'] = window.CuraAPI.theme.colors.getColor(`error-darker`);\n this.styles['--error-base'] = window.CuraAPI.theme.colors.getColor(`error-base`);\n this.styles['--info-base'] = window.CuraAPI.theme.colors.getColor(`info-base`);\n this.styles['--font-family'] = window.CuraAPI.theme.fonts.getFamily();\n this.styles['--font-size'] = window.CuraAPI.theme.fonts.getSize();\n this.styles['--font-color'] = window.CuraAPI.theme.fonts.getColor();\n this.weights = window.CuraAPI.theme.fonts.getWeights();\n this.breakpoints = window.CuraAPI.theme.breakpoints.get();\n this.styles['--font-weight-medium'] = this.weights.medium;\n this.styles['--font-weight-bold'] = this.weights.bold;\n this.styles['--font-weight-regular'] = this.weights.regular;\n }\n\n @Watch('size')\n getClasses() {\n return {\n [this.size.toLowerCase()]: this.mode === 'default',\n disabled: this.disabled,\n isLoading: this.isLoading,\n isFocused: this.isFocused && !this.disabled && !this.readOnly && !this.isLoading,\n isHovered: this.isHovered,\n [this.status]: true,\n transparent: this.mode === 'transparent',\n selection: this.enableSelectionMode,\n };\n }\n\n getLabelColor() {\n if (!!this.disabled) {\n return 'neutral-medium';\n } else if (this.isLoading && this.mode === 'transparent' && !this.isHovered) {\n return 'neutral-dark';\n } else if (((this.isFocused || this.isHovered || this.status === 'success' || this.status === 'error') && !this.readOnly) || this.isHovered) {\n return 'neutral-black';\n } else {\n return 'neutral-dark';\n }\n }\n\n @Watch('status')\n @Watch('mode')\n renderIcon() {\n if ((this.iconName === '' && this.status === 'default') || (this.mode === 'transparent' && this.isLoading) || (this.mode === 'transparent' && this.status === 'default')) {\n return;\n }\n // Used when input is rendered in cura-dropdown-search with error status\n if (this.status === 'error' && this.hideErrorIcon) {\n return;\n }\n\n const iconSizeDefaultMode = this.size === 'large' ? 20 : 16;\n const baseIconSize = this.mode === 'transparent' ? 20 : iconSizeDefaultMode;\n\n const iconMap: { [key: string]: { name: string; color: string } } = {\n loading: { name: this.iconName, color: 'primary-base' },\n success: { name: 'checkCircle', color: 'success-dark' },\n error: { name: 'alertCircle', color: 'error-dark' },\n default: { name: this.iconName, color: 'neutral-dark' },\n disabled: { name: this.iconName, color: 'neutral-medium' },\n };\n\n const iconConfig = iconMap[this.isLoading ? 'loading' : this.disabled ? 'disabled' : this.status || 'default'];\n\n return (\n <div class=\"feedback-icon\" style={this.styles}>\n <cura-icon name={iconConfig.name} iconset=\"default\" size={baseIconSize} color={iconConfig.color} />\n </div>\n );\n }\n\n renderHelperText() {\n const isError = this.status === 'error';\n const isSuccess = this.status === 'success';\n const isDefault = this.status === 'default';\n const helperTextSize = this.size === 'large' ? 'small' : 'xsmall';\n const colorText = (() => {\n if (this.disabled) return 'neutral-medium';\n if (this.isLoading) return 'primary-base';\n if (this.isFocused || this.isHovered) return 'neutral-black';\n return 'neutral-dark';\n })();\n\n return (\n <div style={this.styles} class=\"helper-text\" part=\"cura-input-text-helper\">\n {isDefault && (\n <cura-label size={helperTextSize} lineHeight=\"xsmall\" color={colorText}>\n <slot></slot>\n </cura-label>\n )}\n {isError && this.mode === \"default\" && (\n <cura-label size={helperTextSize} lineHeight=\"xsmall\" color=\"error-dark\">\n <slot></slot>\n </cura-label>\n )}\n {isError && this.mode === \"transparent\" && (\n <cura-label size={helperTextSize} lineHeight=\"xsmall\" color=\"neutral-black\">\n <slot></slot>\n </cura-label>\n )}\n {isSuccess && (\n <cura-label size={helperTextSize} lineHeight=\"xsmall\" color=\"success-dark\">\n <slot></slot>\n </cura-label>\n )}\n </div>\n );\n }\n\n handleMouseEnter() {\n this.isHovered = true;\n }\n handleMouseLeave() {\n this.isHovered = false;\n }\n\n componentDidLoad() {\n this.initializeMask();\n }\n\n disconnectedCallback() {\n this.destroyMask();\n }\n\n handleMaskUpdate() {\n if (this.maskedInput) {\n this.maskedInput.updateValue();\n }\n }\n\n handleClearInput() {\n this.handleMaskUpdate();\n this.value = '';\n this.inputRef.value = '';\n this.valueChange.emit(this.value);\n this.inputClear.emit(this.value);\n this.handleMaskUpdate();\n this.setFocus();\n }\n\n handleInputFocus() {\n this.handleMaskUpdate();\n this.isFocused = true;\n }\n\n handleInputBlur() {\n this.handleMaskUpdate();\n setTimeout(() => {\n this.isFocused = false;\n }, 150);\n }\n\n shouldDisplayMask() {\n return this.maskPreset || this.maskRegex || this.maskAdvanced;\n }\n\n @Watch('maskPreset')\n @Watch('maskRegex')\n @Watch('maskAdvanced')\n initializeMask() {\n if (this.shouldDisplayMask()) {\n if (this.maskedInput) {\n this.destroyMask();\n }\n if (this.maskPreset) {\n this.initializePresetMask();\n } else if (this.maskRegex) {\n this.initializeRegexMask();\n } else if (this.maskAdvanced) {\n this.initializeAdvancedMask();\n }\n this.applyValueToMask();\n } else {\n this.clearMaskValue();\n }\n }\n\n initializeRegexMask() {\n const cleanedRegexString = this.maskRegex.replace(/^\\/|\\/[gimsuy]*$/g, '');\n const flags = (this.maskRegex.match(/\\/[gimsuy]*$/g) || [''])[0].slice(1);\n this.maskedInput = IMask(this.inputRef, { mask: new RegExp(cleanedRegexString, flags) });\n }\n\n initializePresetMask() {\n const options = maskOptions[this.maskPreset];\n\n if (options) {\n this.maskedInput = IMask(this.inputRef, options);\n } else {\n console.error(`Mask preset \"${this.maskPreset}\" not found.`);\n }\n }\n\n initializeAdvancedMask() {\n if (!this.inputRef) return;\n\n try {\n const config = typeof this.maskAdvanced === 'string' ? JSON.parse(this.maskAdvanced) : this.maskAdvanced;\n this.maskedInput = IMask(this.inputRef, config);\n } catch (error) {\n console.error('Error defining maskAdvanced:', error);\n }\n }\n\n applyValueToMask() {\n if (this.maskedInput) {\n if (this.maskedInput.mask === Date || this.maskedInput.mask === Number) {\n this.maskedInput.typedValue = this.value;\n } else {\n this.value = this.maskedInput.value;\n }\n this.handleMaskUpdate();\n }\n }\n\n clearMaskValue() {\n this.inputRef.value = this.value as string;\n }\n\n destroyMask() {\n if (this.maskedInput) {\n this.maskedInput.destroy();\n this.maskedInput = undefined;\n }\n }\n\n handleInputChange(event: any) {\n const inputValue = event.target.value;\n\n this.valueChange.emit(inputValue);\n\n if (this.type === 'number') {\n this.handleNumberInputChange(inputValue);\n } else {\n this.handleTextInputChange(inputValue);\n }\n this.internals.setFormValue(this.value as string);\n }\n\n handleNumberInputChange(inputValue: string) {\n const numericValue = parseFloat(inputValue);\n if (!isNaN(numericValue)) {\n this.value = numericValue;\n } else {\n console.error('Invalid numeric input:', inputValue);\n }\n }\n\n handleTextInputChange(inputValue: string) {\n if (this.maskedInput) {\n if (this.maskedInput.mask instanceof Date || this.maskedInput.mask === Number) {\n this.maskedInput.typedValue = inputValue;\n this.value = this.maskedInput.typedValue;\n }\n this.value = this.maskedInput.value;\n } else {\n this.value = inputValue;\n }\n }\n\n handleKeyDown(event: KeyboardEvent) {\n if (this.type === 'number') {\n this.handleBlockInvalidNumber(event);\n }\n }\n\n handleBlockInvalidNumber(e: KeyboardEvent) {\n if (['e', 'E', '+', '-'].includes(e.key)) e.preventDefault();\n }\n\n render() {\n return (\n <Host>\n <div\n style={this.styles}\n onMouseEnter={() => this.handleMouseEnter()}\n onMouseLeave={() => this.handleMouseLeave()}\n class={{\n 'cura-input-group': true,\n ...this.getClasses(),\n }}\n >\n <div class=\"input-wrapper\">\n {this.label && (\n <cura-label class=\"label\" weight=\"bold\" size={this.size === 'large' ? 'small' : 'xsmall'} color={this.getLabelColor()}>\n {this.label} {this.required && <span class=\"required\">* </span>}\n </cura-label>\n )}\n <div class=\"cura-input-field\" part=\"cura-input-field\" style={this.styles}>\n {this.renderIcon()}\n <input\n name={this.name ? this.name : ''}\n type={this.type}\n onKeyDown={event => this.handleKeyDown(event)}\n onBlur={this.handleInputBlur.bind(this)}\n onFocus={this.handleInputFocus.bind(this)}\n onInput={event => this.handleInputChange(event)}\n class={this.getClasses()}\n style={this.styles}\n placeholder={this.placeholder}\n disabled={this.disabled || this.isLoading}\n required={this.required}\n readonly={this.readOnly}\n maxlength={this.maxlength}\n value={this.value !== undefined && this.value !== null ? this.value : ''}\n inputmode={this.maskPreset ? 'tel' : this.inputMode}\n ref={ref => (this.inputRef = ref)}\n autocomplete={this.autocomplete}\n />\n {!!this.clearIcon && !this.readOnly && !this.isLoading && !this.disabled && this.value && this.isFocused && (\n <cura-icon\n size={this.size === 'large' || this.mode === 'transparent' ? 20 : 16}\n color=\"primary-base\"\n name=\"closeCircle\"\n iconset=\"default\"\n class=\"clear-button\"\n onClick={() => this.handleClearInput()}\n />\n )}\n {this.isLoading && <cura-loader-circle size={this.size === 'large' ? 'medium' : 'small'} color=\"primary-base\"></cura-loader-circle>}\n </div>\n {this.renderHelperText()}\n </div>\n </div>\n </Host>\n );\n }\n}\n"]}
|
|
@@ -23,6 +23,10 @@
|
|
|
23
23
|
* Responsive media for large and up.
|
|
24
24
|
* Use: @include large-up() { ... }
|
|
25
25
|
*/
|
|
26
|
+
/**
|
|
27
|
+
* Truncate text in single line
|
|
28
|
+
* Use: @include truncate-single() { ... }
|
|
29
|
+
*/
|
|
26
30
|
:host {
|
|
27
31
|
display: block;
|
|
28
32
|
font-size: var(--font-size-base);
|
|
@@ -54,15 +58,20 @@
|
|
|
54
58
|
line-height: calc(var(--line-height) - 17%);
|
|
55
59
|
letter-spacing: 0.72px;
|
|
56
60
|
}
|
|
57
|
-
:host
|
|
61
|
+
:host p.textoverflow-single {
|
|
62
|
+
text-overflow: ellipsis;
|
|
63
|
+
white-space: nowrap;
|
|
64
|
+
overflow: hidden;
|
|
65
|
+
}
|
|
66
|
+
:host p ::slotted(a) {
|
|
58
67
|
font-weight: var(--font-weight-bold);
|
|
59
68
|
color: var(--color-link);
|
|
60
69
|
text-underline-offset: 10%;
|
|
61
70
|
}
|
|
62
|
-
:host ::slotted(u) {
|
|
71
|
+
:host p ::slotted(u) {
|
|
63
72
|
text-underline-offset: 10%;
|
|
64
73
|
}
|
|
65
|
-
:host ::slotted(abbr) {
|
|
74
|
+
:host p ::slotted(abbr) {
|
|
66
75
|
color: var(--color-link);
|
|
67
76
|
text-decoration: underline dashed 1px var(--color-link);
|
|
68
77
|
text-underline-offset: 10%;
|
|
@@ -8,6 +8,7 @@ export class CuraLabel {
|
|
|
8
8
|
this.color = undefined;
|
|
9
9
|
this.marginBlock = '0';
|
|
10
10
|
this.lineHeight = '125%';
|
|
11
|
+
this.textOverflow = 'none';
|
|
11
12
|
this.styles = {};
|
|
12
13
|
}
|
|
13
14
|
handleChangeColor() {
|
|
@@ -18,10 +19,12 @@ export class CuraLabel {
|
|
|
18
19
|
this.setColors();
|
|
19
20
|
}
|
|
20
21
|
getClasses() {
|
|
21
|
-
const
|
|
22
|
-
|
|
23
|
-
|
|
24
|
-
|
|
22
|
+
const classes = {
|
|
23
|
+
'textoverflow-single': this.textOverflow === 'single',
|
|
24
|
+
};
|
|
25
|
+
classes[this.size.toLowerCase()] = true;
|
|
26
|
+
classes[`${this.weight.toLowerCase()}-weight`] = true;
|
|
27
|
+
return classes;
|
|
25
28
|
}
|
|
26
29
|
setFontProperties() {
|
|
27
30
|
this.weights = this.theme.fonts.getWeights();
|
|
@@ -47,7 +50,7 @@ export class CuraLabel {
|
|
|
47
50
|
};
|
|
48
51
|
}
|
|
49
52
|
render() {
|
|
50
|
-
return (h(Host, { key: '
|
|
53
|
+
return (h(Host, { key: '42bde16eab50dffb9b198cd9d68fb178031bcb24', style: this.hostCSSProperties() }, h("p", { key: 'ac8f20f5f28fd37a3229bc2c9b1c0a2f229f31ee', style: this.styles, class: this.getClasses() }, h("slot", { key: 'a9a8f4634b10384c3ee083da848a7e72f2a67876' }))));
|
|
51
54
|
}
|
|
52
55
|
static get is() { return "cura-label"; }
|
|
53
56
|
static get encapsulation() { return "shadow"; }
|
|
@@ -169,6 +172,24 @@ export class CuraLabel {
|
|
|
169
172
|
"attribute": "line-height",
|
|
170
173
|
"reflect": true,
|
|
171
174
|
"defaultValue": "'125%'"
|
|
175
|
+
},
|
|
176
|
+
"textOverflow": {
|
|
177
|
+
"type": "string",
|
|
178
|
+
"mutable": false,
|
|
179
|
+
"complexType": {
|
|
180
|
+
"original": "'none' | 'single' | string",
|
|
181
|
+
"resolved": "string",
|
|
182
|
+
"references": {}
|
|
183
|
+
},
|
|
184
|
+
"required": false,
|
|
185
|
+
"optional": false,
|
|
186
|
+
"docs": {
|
|
187
|
+
"tags": [],
|
|
188
|
+
"text": "Apply text-overflow ellipsis definitions.\nDefault to none"
|
|
189
|
+
},
|
|
190
|
+
"attribute": "text-overflow",
|
|
191
|
+
"reflect": true,
|
|
192
|
+
"defaultValue": "'none'"
|
|
172
193
|
}
|
|
173
194
|
};
|
|
174
195
|
}
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"cura-label.js","sourceRoot":"","sources":["../../../../src/components/forms/cura-label/cura-label.tsx"],"names":[],"mappings":"AAAA,OAAO,EAAE,SAAS,EAAE,IAAI,EAAE,IAAI,EAAE,CAAC,EAAE,OAAO,EAAE,KAAK,EAAE,KAAK,EAAE,MAAM,eAAe,CAAC;AAOhF,MAAM,OAAO,SAAS;;
|
|
1
|
+
{"version":3,"file":"cura-label.js","sourceRoot":"","sources":["../../../../src/components/forms/cura-label/cura-label.tsx"],"names":[],"mappings":"AAAA,OAAO,EAAE,SAAS,EAAE,IAAI,EAAE,IAAI,EAAE,CAAC,EAAE,OAAO,EAAE,KAAK,EAAE,KAAK,EAAE,MAAM,eAAe,CAAC;AAOhF,MAAM,OAAO,SAAS;;QA4DpB,UAAK,GAAG,MAAM,CAAC,OAAO,CAAC,KAAK,CAAC;oBAtDmD,QAAQ;sBAMpC,SAAS;yBAM1B,aAAa;;2BAiBX,GAAG;0BAMJ,MAAM;4BAMwB,MAAM;sBAYtD,EAAE;;IAhCpB,iBAAiB;QACf,IAAI,CAAC,SAAS,EAAE,CAAC;IACnB,CAAC;IAiCD,iBAAiB;QACf,IAAI,CAAC,iBAAiB,EAAE,CAAC;QACzB,IAAI,CAAC,SAAS,EAAE,CAAC;IACnB,CAAC;IAED,UAAU;QACR,MAAM,OAAO,GAAG;YACd,qBAAqB,EAAE,IAAI,CAAC,YAAY,KAAK,QAAQ;SACtD,CAAC;QACF,OAAO,CAAC,IAAI,CAAC,IAAI,CAAC,WAAW,EAAE,CAAC,GAAG,IAAI,CAAC;QACxC,OAAO,CAAC,GAAG,IAAI,CAAC,MAAM,CAAC,WAAW,EAAE,SAAS,CAAC,GAAG,IAAI,CAAC;QACtD,OAAO,OAAO,CAAC;IACjB,CAAC;IAED,iBAAiB;QACf,IAAI,CAAC,OAAO,GAAG,IAAI,CAAC,KAAK,CAAC,KAAK,CAAC,UAAU,EAAE,CAAC;QAC7C,IAAI,CAAC,YAAY,GAAG,IAAI,CAAC,KAAK,CAAC,KAAK,CAAC,OAAO,EAAE,CAAC;QAC/C,IAAI,CAAC,MAAM,GAAG;YACZ,eAAe,EAAE,IAAI,CAAC,KAAK,CAAC,KAAK,CAAC,SAAS,CAAC,MAAM,CAAC;YACnD,sBAAsB,EAAE,IAAI,CAAC,OAAO,CAAC,MAAM;YAC3C,oBAAoB,EAAE,IAAI,CAAC,OAAO,CAAC,IAAI;SACxC,CAAC;IACJ,CAAC;IAED,SAAS;QACP,IAAI,CAAC,MAAM,mCACN,IAAI,CAAC,MAAM,KACd,cAAc,EAAE,IAAI,CAAC,KAAK,CAAC,MAAM,CAAC,QAAQ,CAAC,GAAG,IAAI,CAAC,SAAS,EAAE,CAAC,GAChE,CAAC;IACJ,CAAC;IAED,iBAAiB;QACf,MAAM,SAAS,GAAG,IAAI,CAAC,KAAK;YAC1B,CAAC,CAAC,IAAI,CAAC,KAAK,CAAC,MAAM,CAAC,QAAQ,CAAC,IAAI,CAAC,KAAK,CAAC;YACxC,CAAC,CAAC,IAAI,CAAC,KAAK,CAAC,KAAK,CAAC,QAAQ,EAAE,CAAC;QAChC,OAAO;YACL,gBAAgB,EAAE,IAAI,CAAC,WAAW;YAClC,kBAAkB,EAAE,IAAI,CAAC,YAAY;YACrC,eAAe,EAAE,IAAI,CAAC,UAAU;YAChC,cAAc,EAAE,SAAS,IAAI,IAAI,CAAC,KAAK,CAAC,MAAM,CAAC,QAAQ,CAAC,gBAAgB,CAAC;SAC1E,CAAC;IACJ,CAAC;IAED,MAAM;QACJ,OAAO,CACL,EAAC,IAAI,qDAAC,KAAK,EAAE,IAAI,CAAC,iBAAiB,EAAE;YACnC,0DAAG,KAAK,EAAE,IAAI,CAAC,MAAM,EAAE,KAAK,EAAE,IAAI,CAAC,UAAU,EAAE;gBAC7C,8DAAa,CACX,CACC,CACR,CAAC;IACJ,CAAC;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;CAEF","sourcesContent":["import { Component, Host, Prop, h, Element, Watch, State } from '@stencil/core';\n\n@Component({\n tag: 'cura-label',\n styleUrl: 'cura-label.scss',\n shadow: true,\n})\nexport class CuraLabel {\n\n /**\n * Set size of body text.\n * Values: medium (default) | large | small | xsmall.\n */\n @Prop({reflect: true}) size: 'medium' | 'large' | 'small' | 'xsmall' | string = 'medium';\n\n /**\n * Label font weight. It is possible to use regular HTML tags like <b> or <strong> as well.\n * Values: regular (default) | bold.\n */\n @Prop({reflect: true}) weight: 'regular' | 'bold' = 'regular';\n\n /**\n * Apply design system color to interactive elements like <a> and <abbr> inside the text.\n * Values: Color from design system scheme. Default to 'accent-dark'.\n */\n @Prop({reflect: true}) spotColor = 'accent-dark';\n\n /**\n * Text color.\n * Values: Color from design system scheme. Default to the font color from the theme.\n */\n @Prop() color: string;\n @Watch('color')\n @Watch('spotColor')\n handleChangeColor() {\n this.setColors();\n }\n\n /**\n * CSS margin-block property values.\n * Default to 1.25em\n */\n @Prop({reflect: true}) marginBlock = '0';\n\n /**\n * CSS line-height property values.\n * Default to 140%\n */\n @Prop({reflect: true}) lineHeight = '125%';\n\n /**\n * Apply text-overflow ellipsis definitions.\n * Default to none\n */\n @Prop({reflect: true}) textOverflow: 'none' | 'single' | string = 'none';\n\n /**\n * Host element <cura-label>\n */\n @Element() host: HTMLElement;\n\n /**\n * Internal Props\n */\n weights: any;\n fontSizeBase: string;\n @State() styles = {};\n theme = window.CuraAPI.theme;\n\n connectedCallback() {\n this.setFontProperties();\n this.setColors();\n }\n\n getClasses() {\n const classes = {\n 'textoverflow-single': this.textOverflow === 'single',\n };\n classes[this.size.toLowerCase()] = true;\n classes[`${this.weight.toLowerCase()}-weight`] = true;\n return classes;\n }\n\n setFontProperties() {\n this.weights = this.theme.fonts.getWeights();\n this.fontSizeBase = this.theme.fonts.getSize();\n this.styles = {\n '--font-family': this.theme.fonts.getFamily('body'),\n '--font-weight-medium': this.weights.medium,\n '--font-weight-bold': this.weights.bold\n };\n }\n\n setColors() {\n this.styles = {\n ...this.styles,\n '--color-link': this.theme.colors.getColor(`${this.spotColor}`)\n };\n }\n\n hostCSSProperties() {\n const fontColor = this.color\n ? this.theme.colors.getColor(this.color)\n : this.theme.fonts.getColor();\n return {\n '--margin-block': this.marginBlock,\n '--font-size-base': this.fontSizeBase,\n '--line-height': this.lineHeight,\n '--color-body': fontColor || this.theme.colors.getColor('neutral-darker'),\n };\n }\n\n render() {\n return (\n <Host style={this.hostCSSProperties()}>\n <p style={this.styles} class={this.getClasses()}>\n <slot></slot>\n </p>\n </Host>\n );\n }\n\n}\n"]}
|
|
@@ -25,7 +25,8 @@ const renderCuraLabel = (label, args) => {
|
|
|
25
25
|
size="${args.size}"` : ``}${args.weight ? `
|
|
26
26
|
weight="${args.weight}"` : ''}${args.color ? `
|
|
27
27
|
color="${args.color}"` : ''}${args.spotColor ? `
|
|
28
|
-
spot-color="${args.spotColor}"` : ''}${args.
|
|
28
|
+
spot-color="${args.spotColor}"` : ''}${args.textOverflow && args.textOverflow !== 'none' ? `
|
|
29
|
+
text-overflow="${args.textOverflow}"` : ''}${args.marginBlock ? `
|
|
29
30
|
margin-block="${args.marginBlock}"` : ''}${args.lineHeight ? `
|
|
30
31
|
line-height="${args.lineHeight}"` : ''}>
|
|
31
32
|
${label}
|
|
@@ -83,6 +84,16 @@ export default {
|
|
|
83
84
|
defaultValue: { summary: 'accent-dark' }
|
|
84
85
|
}
|
|
85
86
|
},
|
|
87
|
+
textOverflow: {
|
|
88
|
+
control: { type: 'select' },
|
|
89
|
+
options: ['none', 'single'],
|
|
90
|
+
description: 'Aplica definições de corte de texto com `ellipsis`.',
|
|
91
|
+
name: 'text-overflow',
|
|
92
|
+
table: {
|
|
93
|
+
category: 'Properties',
|
|
94
|
+
defaultValue: { summary: 'none' }
|
|
95
|
+
}
|
|
96
|
+
},
|
|
86
97
|
marginBlock: {
|
|
87
98
|
control: 'text',
|
|
88
99
|
description: 'Define o tamanho do espaçamento superior e inferior do bloco. Valores válidos para a propriedade CSS `margin-block`.',
|
|
@@ -128,6 +139,7 @@ export const Label = {
|
|
|
128
139
|
weight: '',
|
|
129
140
|
color: '',
|
|
130
141
|
spotColor: '',
|
|
142
|
+
textOverflow: 'none',
|
|
131
143
|
marginBlock: '',
|
|
132
144
|
lineHeight: '',
|
|
133
145
|
cssMarginBlock: '',
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"cura-label.stories.js","sourceRoot":"","sources":["../../../../src/components/forms/cura-label/cura-label.stories.tsx"],"names":[],"mappings":";;;;;;;;;;;AAAA,OAAO,EAAE,mBAAmB,EAAE,MAAM,sBAAsB,CAAC;AAE3D,MAAM,MAAM,GAAG,mBAAmB,EAAE,CAAC;AAErC,MAAM,eAAe,GAAG,CAAC,KAAa,EAAE,IAAS,EAAE,EAAE;IACnD,MAAM,MAAM,GAAG,IAAI,CAAC,cAAc,IAAI,IAAI,CAAC,aAAa,CAAC,CAAC,CAAC;mBAC1C,IAAI,CAAC,cAAc,CAAC,CAAC,CAAC;sBACnB,IAAI,CAAC,cAAc,cAAc,CAAC,CAAC,CAAC,EAAE,GAAI,IAAI,CAAC,aAAa,CAAC,CAAC,CAAC;qBAChE,IAAI,CAAC,aAAa,cAAc,CAAC,CAAC,CAAC,EAAE;;;;CAIzD,CAAC,CAAC,CAAC,EAAE,CAAC;IACL,MAAM,KAAK,GAAG,cAAc,IAAI,CAAC,IAAI,IAAI,CAAC,IAAI,CAAC,IAAI,KAAK,QAAQ,IAAI,IAAI,CAAC,IAAI,KAAK,SAAS,CAAC,CAAC,CAAC,CAAC;UACvF,IAAI,CAAC,IAAI,GAAG,CAAC,CAAC,CAAC,EAAE,GAAG,IAAI,CAAC,MAAM,CAAC,CAAC,CAAC;YAChC,IAAI,CAAC,MAAM,GAAG,CAAC,CAAC,CAAC,EAAE,GAAG,IAAI,CAAC,KAAK,CAAC,CAAC,CAAC;WACpC,IAAI,CAAC,KAAK,GAAG,CAAC,CAAC,CAAC,EAAE,GAAG,IAAI,CAAC,SAAS,CAAC,CAAC,CAAC;gBACjC,IAAI,CAAC,SAAS,GAAG,CAAC,CAAC,CAAC,EAAE,GAAG,IAAI,CAAC,WAAW,CAAC,CAAC,CAAC;
|
|
1
|
+
{"version":3,"file":"cura-label.stories.js","sourceRoot":"","sources":["../../../../src/components/forms/cura-label/cura-label.stories.tsx"],"names":[],"mappings":"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","sourcesContent":["import { getColorsWithDepths } from \"../../../utils/utils\";\n\nconst colors = getColorsWithDepths();\n\nconst renderCuraLabel = (label: string, args: any) => {\n const styles = args.cssMarginBlock || args.cssLineHeight ? `<style>\n cura-heading { ${args.cssMarginBlock ? `\n --margin-block: ${args.cssMarginBlock} !important;` : ``}${ args.cssLineHeight ? `\n --line-height: ${args.cssLineHeight} !important;` : ``}\n }\n</style>\n\n` : '';\n const block = `<cura-label${args.size && (args.size !== 'medium' && args.size !== 'regular') ? `\n size=\"${args.size}\"` : ``}${args.weight ? `\n weight=\"${args.weight}\"` : ''}${args.color ? `\n color=\"${args.color}\"` : ''}${args.spotColor ? `\n spot-color=\"${args.spotColor}\"` : ''}${args.textOverflow && args.textOverflow !== 'none' ? `\n text-overflow=\"${args.textOverflow}\"` : ''}${args.marginBlock ? `\n margin-block=\"${args.marginBlock}\"` : ''}${args.lineHeight ? `\n line-height=\"${args.lineHeight}\"` : ''}>\n ${label}\n</cura-label>\n`;\n return `${styles}${block}${block}${block}`;\n}\n\nexport default {\n title: 'Componentes/Forms/Label',\n tags: ['autodocs'],\n render: ({ label, ...args }) => {\n return renderCuraLabel(label, args);\n },\n argTypes: {\n label: {\n control: 'text',\n description: 'Define o texto do componente diretamente. Aceita tags HTML <i>Phrasing Content</i>.',\n name: 'Content'\n },\n size: {\n control: { type: 'select' },\n options: ['xsmall', 'small', 'medium', 'large'],\n description: 'Define o tamanho do bloco de texto considerando `xsmall`, `small`, `medium` (default) e `large` como valores válidos.',\n table: {\n category: 'Properties',\n defaultValue: { summary: 'medium'}\n }\n },\n weight: {\n control: { type: 'inline-radio' },\n options: ['regular', 'bold'],\n description: 'Espessura de fonte `regular` (default) ou `bold` para todo o texto. É possível aplicar parcialmente utilizando as tags `<b>` e `<strong>`.',\n table: {\n category: 'Properties',\n defaultValue: { summary: 'regular'}\n }\n },\n color: {\n control: { type: 'select' },\n options: ['', ...colors],\n description: 'Define a cor de texto do bloco. Aceita qualquer valor do esquema de cores do design system.',\n table: {\n category: 'Properties',\n defaultValue: { summary: 'Cor de texto padrão do tema'}\n }\n },\n spotColor: {\n control: { type: 'select' },\n options: ['', ...colors],\n description: 'Define a cor dos itens de interação dentro do bloco de texto como as tags `<a>`. Aceita qualquer valor do esquema de cores do design system.',\n name: 'spot-color',\n table: {\n category: 'Properties',\n defaultValue: { summary: 'accent-dark'}\n }\n },\n textOverflow: {\n control: { type: 'select' },\n options: ['none', 'single'],\n description: 'Aplica definições de corte de texto com `ellipsis`.',\n name: 'text-overflow',\n table: {\n category: 'Properties',\n defaultValue: { summary: 'none'}\n }\n },\n marginBlock: {\n control: 'text',\n description: 'Define o tamanho do espaçamento superior e inferior do bloco. Valores válidos para a propriedade CSS `margin-block`.',\n name: 'margin-block',\n table: {\n category: 'Properties',\n defaultValue: { summary: '0'}\n }\n },\n lineHeight: {\n control: 'text',\n description: 'Define a altura de linha base a ser considerada pelo componente em sua responsividade. Valores válidos para a propriedade CSS `line-height`.',\n name: 'line-height',\n table: {\n category: 'Properties',\n defaultValue: { summary: '125%'}\n }\n },\n cssMarginBlock: {\n control: 'text',\n description: 'Permite a definição da propriedade `margin-block` por folhas de estilo. É necessário o uso do `!important` conforme o exemplo de código.',\n name: '--margin-block',\n table: {\n category: 'CSS Properties',\n defaultValue: { summary: '0'}\n }\n },\n cssLineHeight: {\n control: 'text',\n description: 'Permite a definição da propriedade `line-height` por folhas de estilo. É necessário o uso do `!important` conforme o exemplo de código.',\n name: '--line-height',\n table: {\n category: 'CSS Properties',\n defaultValue: { summary: '125%'}\n }\n },\n },\n};\n\nexport const Label = {\n args: {\n label: 'Dolor sit consectetur <a href=\"https://www.rededorsaoluiz.com.br\" target=\"_blank\">adipiscing</a> elit.',\n size: 'medium',\n weight: '',\n color: '',\n spotColor: '',\n textOverflow: 'none',\n marginBlock: '',\n lineHeight: '',\n cssMarginBlock: '',\n cssLineHeight: ''\n },\n};\n"]}
|
|
@@ -40,6 +40,28 @@
|
|
|
40
40
|
font-size: 2.2857142857em;
|
|
41
41
|
letter-spacing: -1.68px;
|
|
42
42
|
}
|
|
43
|
+
:host h1 ::slotted(b), :host h1 ::slotted(strong), :host h2 ::slotted(b), :host h2 ::slotted(strong), :host h3 ::slotted(b), :host h3 ::slotted(strong), :host h4 ::slotted(b), :host h4 ::slotted(strong), :host h5 ::slotted(b), :host h5 ::slotted(strong), :host h6 ::slotted(b), :host h6 ::slotted(strong) {
|
|
44
|
+
font-weight: var(--font-weight-bold);
|
|
45
|
+
}
|
|
46
|
+
:host h1 ::slotted(a), :host h2 ::slotted(a), :host h3 ::slotted(a), :host h4 ::slotted(a), :host h5 ::slotted(a), :host h6 ::slotted(a) {
|
|
47
|
+
font-weight: var(--font-weight-bold);
|
|
48
|
+
color: var(--color-link);
|
|
49
|
+
text-underline-offset: 10%;
|
|
50
|
+
cursor: pointer;
|
|
51
|
+
}
|
|
52
|
+
:host h1 ::slotted(u), :host h2 ::slotted(u), :host h3 ::slotted(u), :host h4 ::slotted(u), :host h5 ::slotted(u), :host h6 ::slotted(u) {
|
|
53
|
+
text-underline-offset: 10%;
|
|
54
|
+
}
|
|
55
|
+
:host h1 ::slotted(i), :host h1 ::slotted(em), :host h2 ::slotted(i), :host h2 ::slotted(em), :host h3 ::slotted(i), :host h3 ::slotted(em), :host h4 ::slotted(i), :host h4 ::slotted(em), :host h5 ::slotted(i), :host h5 ::slotted(em), :host h6 ::slotted(i), :host h6 ::slotted(em) {
|
|
56
|
+
font-style: italic;
|
|
57
|
+
font-weight: var(--font-weight-medium);
|
|
58
|
+
}
|
|
59
|
+
:host h1 ::slotted(abbr), :host h2 ::slotted(abbr), :host h3 ::slotted(abbr), :host h4 ::slotted(abbr), :host h5 ::slotted(abbr), :host h6 ::slotted(abbr) {
|
|
60
|
+
color: var(--color-link);
|
|
61
|
+
text-decoration: underline dashed 1px var(--color-link);
|
|
62
|
+
text-underline-offset: 10%;
|
|
63
|
+
cursor: default;
|
|
64
|
+
}
|
|
43
65
|
@media (min-width: 769px) and (max-width: 1920px) {
|
|
44
66
|
:host h1, :host h2, :host h3, :host h4, :host h5, :host h6 {
|
|
45
67
|
font-size: 3.429em;
|
|
@@ -58,26 +80,4 @@
|
|
|
58
80
|
font-size: 3.5714285714em;
|
|
59
81
|
letter-spacing: -1.2px;
|
|
60
82
|
}
|
|
61
|
-
}
|
|
62
|
-
:host ::slotted(b), :host ::slotted(strong) {
|
|
63
|
-
font-weight: var(--font-weight-bold);
|
|
64
|
-
}
|
|
65
|
-
:host ::slotted(a) {
|
|
66
|
-
font-weight: var(--font-weight-bold);
|
|
67
|
-
color: var(--color-link);
|
|
68
|
-
text-underline-offset: 10%;
|
|
69
|
-
cursor: pointer;
|
|
70
|
-
}
|
|
71
|
-
:host ::slotted(u) {
|
|
72
|
-
text-underline-offset: 10%;
|
|
73
|
-
}
|
|
74
|
-
:host ::slotted(i), :host ::slotted(em) {
|
|
75
|
-
font-style: italic;
|
|
76
|
-
font-weight: var(--font-weight-medium);
|
|
77
|
-
}
|
|
78
|
-
:host ::slotted(abbr) {
|
|
79
|
-
color: var(--color-link);
|
|
80
|
-
text-decoration: underline dashed 1px var(--color-link);
|
|
81
|
-
text-underline-offset: 10%;
|
|
82
|
-
cursor: default;
|
|
83
83
|
}
|
|
@@ -23,6 +23,10 @@
|
|
|
23
23
|
* Responsive media for large and up.
|
|
24
24
|
* Use: @include large-up() { ... }
|
|
25
25
|
*/
|
|
26
|
+
/**
|
|
27
|
+
* Truncate text in single line
|
|
28
|
+
* Use: @include truncate-single() { ... }
|
|
29
|
+
*/
|
|
26
30
|
:host {
|
|
27
31
|
display: block;
|
|
28
32
|
font-size: var(--font-size-base);
|
|
@@ -58,6 +62,11 @@
|
|
|
58
62
|
:host h1.xsmall.bold-weight, :host h1.xsmall ::slotted(b), :host h1.xsmall ::slotted(strong), :host h2.xsmall.bold-weight, :host h2.xsmall ::slotted(b), :host h2.xsmall ::slotted(strong), :host h3.xsmall.bold-weight, :host h3.xsmall ::slotted(b), :host h3.xsmall ::slotted(strong), :host h4.xsmall.bold-weight, :host h4.xsmall ::slotted(b), :host h4.xsmall ::slotted(strong), :host h5.xsmall.bold-weight, :host h5.xsmall ::slotted(b), :host h5.xsmall ::slotted(strong), :host h6.xsmall.bold-weight, :host h6.xsmall ::slotted(b), :host h6.xsmall ::slotted(strong) {
|
|
59
63
|
font-weight: var(--font-weight-bold);
|
|
60
64
|
}
|
|
65
|
+
:host h1.textoverflow-single, :host h2.textoverflow-single, :host h3.textoverflow-single, :host h4.textoverflow-single, :host h5.textoverflow-single, :host h6.textoverflow-single {
|
|
66
|
+
text-overflow: ellipsis;
|
|
67
|
+
white-space: nowrap;
|
|
68
|
+
overflow: hidden;
|
|
69
|
+
}
|
|
61
70
|
:host h1 ::slotted(b), :host h1 ::slotted(strong), :host h2 ::slotted(b), :host h2 ::slotted(strong), :host h3 ::slotted(b), :host h3 ::slotted(strong), :host h4 ::slotted(b), :host h4 ::slotted(strong), :host h5 ::slotted(b), :host h5 ::slotted(strong), :host h6 ::slotted(b), :host h6 ::slotted(strong) {
|
|
62
71
|
font-weight: var(--font-weight-medium);
|
|
63
72
|
}
|
|
@@ -9,13 +9,16 @@ export class CuraHeading {
|
|
|
9
9
|
this.color = undefined;
|
|
10
10
|
this.marginBlock = '1.25em';
|
|
11
11
|
this.lineHeight = '130%';
|
|
12
|
+
this.textOverflow = 'none';
|
|
12
13
|
this.styles = {};
|
|
13
14
|
}
|
|
14
15
|
connectedCallback() {
|
|
15
16
|
this.setFontProperties();
|
|
16
17
|
}
|
|
17
18
|
getClasses() {
|
|
18
|
-
const classes = {
|
|
19
|
+
const classes = {
|
|
20
|
+
'textoverflow-single': this.textOverflow === 'single'
|
|
21
|
+
};
|
|
19
22
|
classes[this.size.toLowerCase()] = true;
|
|
20
23
|
classes[`${this.weight.toLowerCase()}-weight`] = true;
|
|
21
24
|
return classes;
|
|
@@ -56,7 +59,7 @@ export class CuraHeading {
|
|
|
56
59
|
return tags[`${this.level}`] || tags['default'];
|
|
57
60
|
}
|
|
58
61
|
render() {
|
|
59
|
-
return (h(Host, { key: '
|
|
62
|
+
return (h(Host, { key: '16917fae239920b3a22f98cebe744b6195865980', style: this.hostCSSProperties() }, this.getHeadingTag()));
|
|
60
63
|
}
|
|
61
64
|
static get is() { return "cura-heading"; }
|
|
62
65
|
static get encapsulation() { return "shadow"; }
|
|
@@ -196,6 +199,24 @@ export class CuraHeading {
|
|
|
196
199
|
"attribute": "line-height",
|
|
197
200
|
"reflect": true,
|
|
198
201
|
"defaultValue": "'130%'"
|
|
202
|
+
},
|
|
203
|
+
"textOverflow": {
|
|
204
|
+
"type": "string",
|
|
205
|
+
"mutable": false,
|
|
206
|
+
"complexType": {
|
|
207
|
+
"original": "'none' | 'single' | string",
|
|
208
|
+
"resolved": "string",
|
|
209
|
+
"references": {}
|
|
210
|
+
},
|
|
211
|
+
"required": false,
|
|
212
|
+
"optional": false,
|
|
213
|
+
"docs": {
|
|
214
|
+
"tags": [],
|
|
215
|
+
"text": "Apply text-overflow ellipsis definitions.\nDefault to none"
|
|
216
|
+
},
|
|
217
|
+
"attribute": "text-overflow",
|
|
218
|
+
"reflect": true,
|
|
219
|
+
"defaultValue": "'none'"
|
|
199
220
|
}
|
|
200
221
|
};
|
|
201
222
|
}
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"cura-heading.js","sourceRoot":"","sources":["../../../../src/components/text/cura-heading/cura-heading.tsx"],"names":[],"mappings":"AAAA,OAAO,EAAE,SAAS,EAAE,IAAI,EAAE,CAAC,EAAE,IAAI,EAAE,OAAO,EAAE,KAAK,EAAE,MAAM,eAAe,CAAC;AAOzE,MAAM,OAAO,WAAW;;
|
|
1
|
+
{"version":3,"file":"cura-heading.js","sourceRoot":"","sources":["../../../../src/components/text/cura-heading/cura-heading.tsx"],"names":[],"mappings":"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","sourcesContent":["import { Component, Host, h, Prop, Element, State } from '@stencil/core';\n\n@Component({\n tag: 'cura-heading',\n styleUrl: 'cura-heading.scss',\n shadow: true,\n})\nexport class CuraHeading {\n\n /**\n * Heading level for semantics. Will render the related HTML tag <h1>, <h2>, ...\n * Values: 1(default) to 6.\n */\n @Prop({reflect: true}) level: 1 | 2 | 3 | 4 | 5 | 6 = 1;\n\n /**\n * Heading style size.\n * Values: regular (deprecated), medium (default) | large | small | caption (deprecated) | xsmall.\n */\n @Prop({reflect: true}) size: 'regular' | 'medium' | 'large' | 'small' | 'caption' | 'xsmall' = 'medium';\n\n /**\n * Heading font weight. It is possible to use regular HTML tags like <b> or <strong> as well.\n * Values: regular (default) | bold.\n */\n @Prop({reflect: true}) weight: 'regular' | 'bold' = 'regular';\n\n /**\n * Apply design system color to interactive elements like <a> and <abbr> inside the text.\n * Values: Color from design system scheme. Default to 'accent-dark'.\n */\n @Prop({reflect: true}) spotColor = 'accent-dark';\n\n /**\n * Text color.\n * Values: Color from design system scheme. Default to the font color from the theme.\n */\n @Prop({reflect: true}) color: string;\n\n /**\n * CSS margin-block property values.\n * Default to 1.25em\n */\n @Prop({reflect: true}) marginBlock = '1.25em';\n\n /**\n * CSS line-height property values.\n * Default to 130%\n */\n @Prop({reflect: true}) lineHeight = '130%';\n\n /**\n * Apply text-overflow ellipsis definitions.\n * Default to none\n */\n @Prop({reflect: true}) textOverflow: 'none' | 'single' | string = 'none';\n\n /**\n * Host element <cura-heading>\n */\n @Element() host: HTMLElement;\n\n /**\n * Internal Props\n */\n weights: any;\n fontSizeBase: string;\n @State() styles = {};\n theme = window.CuraAPI.theme;\n\n connectedCallback() {\n this.setFontProperties();\n }\n\n getClasses() {\n const classes = {\n 'textoverflow-single': this.textOverflow === 'single'\n };\n classes[this.size.toLowerCase()] = true;\n classes[`${this.weight.toLowerCase()}-weight`] = true;\n return classes;\n }\n\n setFontProperties() {\n this.weights = this.theme.fonts.getWeights();\n this.fontSizeBase = this.theme.fonts.getSize();\n this.styles = {\n '--font-family': window.CuraAPI.theme.fonts.getFamily('heading'),\n '--font-weight-regular': this.weights.regular,\n '--font-weight-medium': this.weights.medium,\n '--font-weight-bold': this.weights.bold,\n '--font-weight-black': this.weights.black\n }\n }\n\n hostCSSProperties() {\n const fontColor = this.color\n ? this.theme.colors.getColor(this.color)\n : this.theme.fonts.getColor();\n return {\n '--margin-block': this.marginBlock,\n '--font-size-base': this.fontSizeBase,\n '--line-height': this.lineHeight,\n '--color-body': fontColor || this.theme.colors.getColor('neutral-darker'),\n '--color-spot': this.theme.colors.getColor(`${this.spotColor}`)\n };\n }\n\n getHeadingTag() {\n const tags = {\n '1': <h1 style={this.styles} class={this.getClasses()}><slot></slot></h1>,\n '2': <h2 style={this.styles} class={this.getClasses()}><slot></slot></h2>,\n '3': <h3 style={this.styles} class={this.getClasses()}><slot></slot></h3>,\n '4': <h4 style={this.styles} class={this.getClasses()}><slot></slot></h4>,\n '5': <h5 style={this.styles} class={this.getClasses()}><slot></slot></h5>,\n '6': <h6 style={this.styles} class={this.getClasses()}><slot></slot></h6>,\n 'default': <h1 style={this.styles} class={this.getClasses()}><slot></slot></h1>\n };\n return tags[`${this.level}`] || tags['default'];\n }\n\n render() {\n return (\n <Host style={this.hostCSSProperties()}>\n { this.getHeadingTag() }\n </Host>\n );\n }\n\n}\n"]}
|
|
@@ -26,7 +26,8 @@ const renderCuraHeading = (label, args) => {
|
|
|
26
26
|
level="${args.level}"` : ''}${args.weight ? `
|
|
27
27
|
weight="${args.weight}"` : ''}${args.color ? `
|
|
28
28
|
color="${args.color}"` : ''}${args.spotColor ? `
|
|
29
|
-
spot-color="${args.spotColor}"` : ''}${args.
|
|
29
|
+
spot-color="${args.spotColor}"` : ''}${args.textOverflow && args.textOverflow !== 'none' ? `
|
|
30
|
+
text-overflow="${args.textOverflow}"` : ''}${args.marginBlock ? `
|
|
30
31
|
margin-block="${args.marginBlock}"` : ''}${args.lineHeight ? `
|
|
31
32
|
line-height="${args.lineHeight}"` : ''}>
|
|
32
33
|
${label}
|
|
@@ -92,6 +93,16 @@ export default {
|
|
|
92
93
|
defaultValue: { summary: 1 }
|
|
93
94
|
}
|
|
94
95
|
},
|
|
96
|
+
textOverflow: {
|
|
97
|
+
control: { type: 'select' },
|
|
98
|
+
options: ['none', 'single'],
|
|
99
|
+
description: 'Aplica definições de corte de texto com `ellipsis`.',
|
|
100
|
+
name: 'text-overflow',
|
|
101
|
+
table: {
|
|
102
|
+
category: 'Properties',
|
|
103
|
+
defaultValue: { summary: 'none' }
|
|
104
|
+
}
|
|
105
|
+
},
|
|
95
106
|
marginBlock: {
|
|
96
107
|
control: 'text',
|
|
97
108
|
description: 'Define o tamanho do espaçamento superior e inferior do bloco. Valores válidos para a propriedade CSS `margin-block`.',
|
|
@@ -138,6 +149,7 @@ export const Heading = {
|
|
|
138
149
|
level: '',
|
|
139
150
|
color: '',
|
|
140
151
|
spotColor: '',
|
|
152
|
+
textOverflow: 'none',
|
|
141
153
|
marginBlock: '',
|
|
142
154
|
lineHeight: '',
|
|
143
155
|
cssMarginBlock: '',
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"cura-heading.stories.js","sourceRoot":"","sources":["../../../../src/components/text/cura-heading/cura-heading.stories.tsx"],"names":[],"mappings":";;;;;;;;;;;AAAA,OAAO,EAAE,mBAAmB,EAAE,MAAM,sBAAsB,CAAC;AAE3D,MAAM,MAAM,GAAG,mBAAmB,EAAE,CAAC;AAErC,MAAM,iBAAiB,GAAG,CAAC,KAAa,EAAE,IAAS,EAAE,EAAE;IACrD,MAAM,MAAM,GAAG,IAAI,CAAC,cAAc,IAAI,IAAI,CAAC,aAAa,CAAC,CAAC,CAAC;mBAC1C,IAAI,CAAC,cAAc,CAAC,CAAC,CAAC;sBACnB,IAAI,CAAC,cAAc,cAAc,CAAC,CAAC,CAAC,EAAE,GAAI,IAAI,CAAC,aAAa,CAAC,CAAC,CAAC;qBAChE,IAAI,CAAC,aAAa,cAAc,CAAC,CAAC,CAAC,EAAE;;;;CAIzD,CAAC,CAAC,CAAC,EAAE,CAAC;IACL,MAAM,KAAK,GAAG,gBAAgB,IAAI,CAAC,IAAI,IAAI,CAAC,IAAI,CAAC,IAAI,KAAK,QAAQ,IAAI,IAAI,CAAC,IAAI,KAAK,SAAS,CAAC,CAAC,CAAC,CAAC;UACzF,IAAI,CAAC,IAAI,GAAG,CAAC,CAAC,CAAC,EAAE,GAAG,IAAI,CAAC,KAAK,CAAC,CAAC,CAAC;WAChC,IAAI,CAAC,KAAK,GAAG,CAAC,CAAC,CAAC,EAAE,GAAG,IAAI,CAAC,MAAM,CAAC,CAAC,CAAC;YAClC,IAAI,CAAC,MAAM,GAAG,CAAC,CAAC,CAAC,EAAE,GAAG,IAAI,CAAC,KAAK,CAAC,CAAC,CAAC;WACpC,IAAI,CAAC,KAAK,GAAG,CAAC,CAAC,CAAC,EAAE,GAAG,IAAI,CAAC,SAAS,CAAC,CAAC,CAAC;gBACjC,IAAI,CAAC,SAAS,GAAG,CAAC,CAAC,CAAC,EAAE,GAAG,IAAI,CAAC,WAAW,CAAC,CAAC,CAAC;
|
|
1
|
+
{"version":3,"file":"cura-heading.stories.js","sourceRoot":"","sources":["../../../../src/components/text/cura-heading/cura-heading.stories.tsx"],"names":[],"mappings":"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","sourcesContent":["import { getColorsWithDepths } from \"../../../utils/utils\";\n\nconst colors = getColorsWithDepths();\n\nconst renderCuraHeading = (label: string, args: any) => {\n const styles = args.cssMarginBlock || args.cssLineHeight ? `<style>\n cura-heading { ${args.cssMarginBlock ? `\n --margin-block: ${args.cssMarginBlock} !important;` : ``}${ args.cssLineHeight ? `\n --line-height: ${args.cssLineHeight} !important;` : ``}\n }\n</style>\n\n` : '';\n const block = `<cura-heading${args.size && (args.size !== 'medium' && args.size !== 'regular') ? `\n size=\"${args.size}\"` : ``}${args.level ? `\n level=\"${args.level}\"` : ''}${args.weight ? `\n weight=\"${args.weight}\"` : ''}${args.color ? `\n color=\"${args.color}\"` : ''}${args.spotColor ? `\n spot-color=\"${args.spotColor}\"` : ''}${args.textOverflow && args.textOverflow !== 'none' ? `\n text-overflow=\"${args.textOverflow}\"` : ''}${args.marginBlock ? `\n margin-block=\"${args.marginBlock}\"` : ''}${args.lineHeight ? `\n line-height=\"${args.lineHeight}\"` : ''}>\n ${label}\n</cura-heading>\n`;\n return `${styles}${block}${block}${block}`;\n}\n\nexport default {\n title: 'Componentes/Text/Heading',\n tags: ['autodocs'],\n render: ({ label, ...args }) => {\n return renderCuraHeading(label, args);\n },\n argTypes: {\n label: {\n control: 'text',\n description: 'Define o texto do componente diretamente. Aceita tags HTML <i>Phrasing Content</i>.',\n name: 'Content'\n },\n size: {\n control: { type: 'select' },\n options: ['xsmall', 'small', 'medium', 'large'],\n description: 'Define o tamanho do bloco de texto considerando `xsmall`, `small`, `medium` (default) e `large` como valores válidos.',\n table: {\n category: 'Properties',\n defaultValue: { summary: 'medium'}\n }\n },\n weight: {\n control: { type: 'inline-radio' },\n options: ['regular', 'bold'],\n description: 'Espessura de fonte `regular` (default) ou `bold` para todo o texto. É possível aplicar parcialmente utilizando as tags `<b>` e `<strong>`.',\n table: {\n category: 'Properties',\n defaultValue: { summary: 'regular'}\n }\n },\n color: {\n control: { type: 'select' },\n options: ['', ...colors],\n description: 'Define a cor de texto do bloco. Aceita qualquer valor do esquema de cores do design system.',\n table: {\n category: 'Properties',\n defaultValue: { summary: 'Cor de texto padrão do tema'}\n }\n },\n spotColor: {\n control: { type: 'select' },\n options: ['', ...colors],\n description: 'Define a cor dos itens de interação dentro do bloco de texto como as tags `<a>`. Aceita qualquer valor do esquema de cores do design system.',\n name: 'spot-color',\n table: {\n category: 'Properties',\n defaultValue: { summary: 'accent-dark'}\n }\n },\n level: {\n control: { type: 'number', min: 1, max: 6, step: 1 },\n description: 'Define a tag semântica do título. Ex. h1, h2, h3, etc. A semântica é independente do estilo aplicado.',\n table: {\n category: 'Properties',\n defaultValue: { summary: 1}\n }\n },\n textOverflow: {\n control: { type: 'select' },\n options: ['none', 'single'],\n description: 'Aplica definições de corte de texto com `ellipsis`.',\n name: 'text-overflow',\n table: {\n category: 'Properties',\n defaultValue: { summary: 'none'}\n }\n },\n marginBlock: {\n control: 'text',\n description: 'Define o tamanho do espaçamento superior e inferior do bloco. Valores válidos para a propriedade CSS `margin-block`.',\n name: 'margin-block',\n table: {\n category: 'Properties',\n defaultValue: { summary: '1.25em'}\n }\n },\n lineHeight: {\n control: 'text',\n description: 'Define a altura de linha base a ser considerada pelo componente em sua responsividade. Valores válidos para a propriedade CSS `line-height`.',\n name: 'line-height',\n table: {\n category: 'Properties',\n defaultValue: { summary: '130%'}\n }\n },\n cssMarginBlock: {\n control: 'text',\n description: 'Permite a definição da propriedade `margin-block` por folhas de estilo. É necessário o uso do `!important` conforme o exemplo de código.',\n name: '--margin-block',\n table: {\n category: 'CSS Properties',\n defaultValue: { summary: '1.25em'}\n }\n },\n cssLineHeight: {\n control: 'text',\n description: 'Permite a definição da propriedade `line-height` por folhas de estilo. É necessário o uso do `!important` conforme o exemplo de código.',\n name: '--line-height',\n table: {\n category: 'CSS Properties',\n defaultValue: { summary: '130%'}\n }\n },\n },\n};\n\nexport const Heading = {\n args: {\n label: 'Dolor sit <a href=\"https://www.rededorsaoluiz.com.br\" target=\"_blank\">amet</a>, consectetur <i>adipiscing</i> elit.',\n size: 'medium',\n weight: '',\n level: '',\n color: '',\n spotColor: '',\n textOverflow: 'none',\n marginBlock: '',\n lineHeight: '',\n cssMarginBlock: '',\n cssLineHeight: ''\n },\n};\n"]}
|