@dialpad/dialtone-vue 4.6.0 → 4.6.1
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
- package/dist/{RichTextEditor-DaOHmXD_.js → RichTextEditor-D8DfONFm.js} +7 -7
- package/dist/{RichTextEditor-DaOHmXD_.js.map → RichTextEditor-D8DfONFm.js.map} +1 -1
- package/dist/{RichTextEditor-7eY8gy9u.cjs → RichTextEditor-DMUDJKVn.cjs} +2 -2
- package/dist/{RichTextEditor-7eY8gy9u.cjs.map → RichTextEditor-DMUDJKVn.cjs.map} +1 -1
- package/dist/common/sr_only_close_button.vue.d.ts +4 -1
- package/dist/component-documentation.json +1 -1
- package/dist/components/Avatar/Avatar.vue.d.ts +12 -8
- package/dist/components/Avatar/Avatar.vue.d.ts.map +1 -1
- package/dist/components/Badge/Badge.vue.d.ts +1 -2
- package/dist/components/Banner/Banner.vue.d.ts +8 -2
- package/dist/components/Banner/Banner.vue.d.ts.map +1 -1
- package/dist/components/Button/Button.vue.d.ts +4 -1
- package/dist/components/Button/Button.vue.d.ts.map +1 -1
- package/dist/components/Chip/Chip.vue.d.ts +4 -1
- package/dist/components/Chip/Chip.vue.d.ts.map +1 -1
- package/dist/components/Collapsible/Collapsible.vue.d.ts +4 -1
- package/dist/components/Collapsible/Collapsible.vue.d.ts.map +1 -1
- package/dist/components/ComboboxWithPopover/ComboboxWithPopover.vue.d.ts +8 -2
- package/dist/components/ComboboxWithPopover/ComboboxWithPopover.vue.d.ts.map +1 -1
- package/dist/components/Dropdown/Dropdown.vue.d.ts +8 -2
- package/dist/components/Dropdown/Dropdown.vue.d.ts.map +1 -1
- package/dist/components/FilterPill/FilterPill.vue.d.ts +20 -5
- package/dist/components/FilterPill/FilterPill.vue.d.ts.map +1 -1
- package/dist/components/Hovercard/Hovercard.vue.d.ts +16 -4
- package/dist/components/Hovercard/Hovercard.vue.d.ts.map +1 -1
- package/dist/components/ImageViewer/ImageViewer.vue.d.ts +8 -2
- package/dist/components/ImageViewer/ImageViewer.vue.d.ts.map +1 -1
- package/dist/components/Loader/Loader.vue.d.ts +4 -1
- package/dist/components/Loader/Loader.vue.d.ts.map +1 -1
- package/dist/components/Modal/Modal.vue.d.ts +9 -3
- package/dist/components/Modal/Modal.vue.d.ts.map +1 -1
- package/dist/components/Notice/Notice.vue.d.ts +8 -2
- package/dist/components/Notice/Notice.vue.d.ts.map +1 -1
- package/dist/components/Notice/NoticeAction.vue.d.ts +8 -2
- package/dist/components/Notice/NoticeAction.vue.d.ts.map +1 -1
- package/dist/components/Pagination/Pagination.vue.d.ts +4 -1
- package/dist/components/Pagination/Pagination.vue.d.ts.map +1 -1
- package/dist/components/Popover/Popover.vue.d.ts +8 -2
- package/dist/components/Popover/Popover.vue.d.ts.map +1 -1
- package/dist/components/Popover/PopoverHeaderFooter.vue.d.ts +4 -1
- package/dist/components/Popover/PopoverHeaderFooter.vue.d.ts.map +1 -1
- package/dist/components/RichTextEditor/Extensions/Mentions/MentionSuggestion.vue.d.ts +12 -8
- package/dist/components/RichTextEditor/Extensions/Variable/VariableComponent.vue.d.ts +13 -5
- package/dist/components/RichTextEditor/Extensions/Variable/VariableComponent.vue.d.ts.map +1 -1
- package/dist/components/SegmentedControl/SegmentedControlItem.vue.d.ts.map +1 -1
- package/dist/components/SplitButton/SplitButton.vue.d.ts +16 -4
- package/dist/components/SplitButton/SplitButton.vue.d.ts.map +1 -1
- package/dist/components/SplitButton/SplitButtonEnd.vue.d.ts +4 -1
- package/dist/components/SplitButton/SplitButtonEnd.vue.d.ts.map +1 -1
- package/dist/components/SplitButton/SplitButtonStart.vue.d.ts +4 -1
- package/dist/components/Tab/Tab.vue.d.ts +4 -1
- package/dist/components/Toast/Layouts/ToastLayoutAlternate.vue.d.ts +8 -2
- package/dist/components/Toast/Layouts/ToastLayoutAlternate.vue.d.ts.map +1 -1
- package/dist/components/Toast/Layouts/ToastLayoutDefault.vue.d.ts +8 -2
- package/dist/components/Toast/Layouts/ToastLayoutDefault.vue.d.ts.map +1 -1
- package/dist/components/Toast/Toast.vue.d.ts +32 -8
- package/dist/components/Toast/Toast.vue.d.ts.map +1 -1
- package/dist/dialtone-vue.cjs +1 -1
- package/dist/dialtone-vue.js +7 -7
- package/dist/lib/avatar/avatar.cjs +1 -1
- package/dist/lib/avatar/avatar.cjs.map +1 -1
- package/dist/lib/avatar/avatar.js +50 -47
- package/dist/lib/avatar/avatar.js.map +1 -1
- package/dist/lib/badge/badge.cjs +1 -1
- package/dist/lib/badge/badge.cjs.map +1 -1
- package/dist/lib/badge/badge.js +12 -14
- package/dist/lib/badge/badge.js.map +1 -1
- package/dist/lib/button/button.cjs +1 -1
- package/dist/lib/button/button.js +21 -21
- package/dist/lib/dropdown/dropdown.cjs.map +1 -1
- package/dist/lib/dropdown/dropdown.js.map +1 -1
- package/dist/lib/filter-pill/filter-pill.cjs +1 -1
- package/dist/lib/filter-pill/filter-pill.js +5 -5
- package/dist/lib/loader/loader.cjs +3 -3
- package/dist/lib/loader/loader.cjs.map +1 -1
- package/dist/lib/loader/loader.js +28 -20
- package/dist/lib/loader/loader.js.map +1 -1
- package/dist/lib/modal/modal.cjs +1 -1
- package/dist/lib/modal/modal.cjs.map +1 -1
- package/dist/lib/modal/modal.js +6 -5
- package/dist/lib/modal/modal.js.map +1 -1
- package/dist/lib/rich-text-editor/index.cjs +1 -1
- package/dist/lib/rich-text-editor/index.js +1 -1
- package/dist/lib/rich-text-editor/rich-text-editor.cjs +1 -1
- package/dist/lib/rich-text-editor/rich-text-editor.js +1 -1
- package/dist/lib/segmented-control/segmented-control-item.cjs.map +1 -1
- package/dist/lib/segmented-control/segmented-control-item.js.map +1 -1
- package/dist/lib/text/text.cjs.map +1 -1
- package/dist/lib/text/text.js.map +1 -1
- package/dist/localization/index.cjs +1 -1
- package/dist/localization/index.cjs.map +1 -1
- package/dist/localization/index.js +50 -33
- package/dist/localization/index.js.map +1 -1
- package/package.json +4 -4
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"text.cjs","names":[],"sources":["../../../components/Text/Text.vue"],"sourcesContent":["<template>\n <component\n :is=\"as\"\n data-qa=\"dt-text\"\n :class=\"textClasses\"\n :style=\"textStyles\"\n >\n <!-- @slot Default slot for text content -->\n <slot />\n </component>\n</template>\n\n<script>\nimport {\n TEXT_KIND_MODIFIERS,\n TEXT_VARIANT_MODIFIERS,\n TEXT_SIZE_MODIFIERS,\n TEXT_SIZE_MAP,\n TEXT_HEADLINE_ONLY_SIZES,\n TEXT_FONT_SIZE_MODIFIERS,\n TEXT_FAMILY_MODIFIERS,\n TEXT_ITALIC_CLASS,\n TEXT_ALIGN_MODIFIERS,\n TEXT_TONE_MODIFIERS,\n TEXT_NUMERIC_CLASS,\n TEXT_TRUNCATE_CLASS,\n TEXT_LINE_CLAMP_CLASS,\n TEXT_WRAP_MODIFIERS,\n TEXT_BOX_TRIM_MODIFIERS,\n TEXT_STRENGTH_MODIFIERS,\n TEXT_DENSITY_MODIFIERS,\n} from './TextConstants';\n\nconst DEFAULT_SIZE = '300';\nconst SEMANTIC_HEADING_ELEMENTS = ['h1', 'h2', 'h3', 'h4', 'h5', 'h6'];\n\n// Module-level flag to emit info only once per session\nlet hasEmittedHeadlineSemanticInfo = false;\n\n// Exported for testing purposes only\nexport const resetHeadlineSemanticInfoFlag = () => {\n hasEmittedHeadlineSemanticInfo = false;\n};\n\n/**\n * Dialtone text primitive that applies typography tokens based on semantic props.\n * @see https://dialtone.dialpad.com/components/text.html\n */\nexport default {\n name: 'DtText',\n\n props: {\n /**\n * HTML tag or component used for rendering.\n * @values span, p, h1, h2, h3, h4, h5, h6, label, div, component\n */\n as: {\n type: String,\n default: 'span',\n },\n\n /**\n * Typography kind mapping to headline/body/label/code token sets.\n * @values headline, body, label, code\n * @deprecated Use variant instead\n */\n kind: {\n type: String,\n default: null,\n validator: (value) => {\n return (\n value === null ||\n Object.prototype.hasOwnProperty.call(TEXT_KIND_MODIFIERS, value)\n );\n },\n },\n\n /**\n * Typography variant mapping to a complete token-backed composition.\n * @values headline-3xl, headline-2xl, headline-xl, headline-lg, headline-md, headline-sm, headline-xs, body-lg, body-md, body-sm, body-xs, label-lg, label-md, label-sm, label-xs, code-lg, code-md, code-sm, code-xs\n */\n variant: {\n type: String,\n default: null,\n validator: (value) => {\n return (\n value === null ||\n Object.prototype.hasOwnProperty.call(TEXT_VARIANT_MODIFIERS, value)\n );\n },\n },\n\n /**\n * Raw font-size token. Must be paired with `variant` for overrides or legacy `kind` for composition size.\n * @values 50, 75, 100, 125, 150, 200, 250, 300, 350, 400, 450, 500, 550, 600, 650, 700, 750, 800\n */\n size: {\n type: [String, Number],\n default: null,\n },\n\n /**\n * Overrides font-family. By default, no font-family class is emitted and text inherits naturally.\n * @values inherit, custom, sans, mono, expressive\n */\n family: {\n type: String,\n default: null,\n validator: (value) => {\n return (\n value === null ||\n Object.prototype.hasOwnProperty.call(TEXT_FAMILY_MODIFIERS, value)\n );\n },\n },\n\n /**\n * Applies italic font style when true.\n */\n italic: {\n type: Boolean,\n default: false,\n },\n\n /**\n * Semantic foreground color.\n * @values primary, secondary, tertiary, muted, disabled, placeholder, critical, critical-strong, positive, positive-strong, warning, info, info-strong, neutral-black, neutral-white\n */\n tone: {\n type: String,\n default: null,\n validator: (value) => {\n return (\n value === null ||\n Object.prototype.hasOwnProperty.call(TEXT_TONE_MODIFIERS, value)\n );\n },\n },\n\n /**\n * Logical text alignment. Requires block/inline-block context.\n * @values start, center, end, justify\n */\n align: {\n type: String,\n default: null,\n validator: (value) => {\n return (\n value === null ||\n Object.prototype.hasOwnProperty.call(TEXT_ALIGN_MODIFIERS, value)\n );\n },\n },\n\n /**\n * Enables single-line truncation (i.e. ellipsis) when true; requires block/inline-block context.\n */\n truncate: {\n type: Boolean,\n default: false,\n },\n\n /**\n * Applies multi-line truncation (i.e. clamp) when greater than zero; requires block/inline-block context.\n */\n maxLines: {\n type: Number,\n default: null,\n validator: (value) => {\n return value === null || (Number.isInteger(value) && value > 0);\n },\n },\n\n /**\n * Renders numeric content with tabular figures.\n */\n numeric: {\n type: Boolean,\n default: false,\n },\n\n /**\n * Controls text wrapping behavior.\n * @values wrap, nowrap, balance, pretty\n */\n wrap: {\n type: String,\n default: null,\n validator: (value) => {\n return (\n value === null ||\n Object.prototype.hasOwnProperty.call(TEXT_WRAP_MODIFIERS, value)\n );\n },\n },\n\n /**\n * Controls text-box-trim (leading space above/below text). Useful for tight component layouts.\n * @values start, end, both\n */\n textBoxTrim: {\n type: String,\n default: null,\n validator: (value) => {\n return (\n value === null ||\n Object.prototype.hasOwnProperty.call(TEXT_BOX_TRIM_MODIFIERS, value)\n );\n },\n },\n\n /**\n * Overrides font-weight. Applies to any kind/size combination.\n * @values bold, semibold, medium, normal\n */\n strength: {\n type: String,\n default: null,\n validator: (value) => {\n return (\n value === null ||\n Object.prototype.hasOwnProperty.call(TEXT_STRENGTH_MODIFIERS, value)\n );\n },\n },\n\n /**\n * Overrides line-height. Applies to any kind/size combination.\n * @values 100, 200, 300, 400, 500, 600\n */\n density: {\n type: [String, Number],\n default: null,\n validator: (value) => {\n return (\n value === null ||\n Object.prototype.hasOwnProperty.call(TEXT_DENSITY_MODIFIERS, value)\n );\n },\n },\n },\n\n computed: {\n textClasses() {\n const classes = ['d-text'];\n const variantClass = this.getVariantClass();\n if (variantClass) {\n classes.push(variantClass);\n }\n\n const fontSizeClass = this.getFontSizeClass();\n if (fontSizeClass) {\n classes.push(fontSizeClass);\n }\n\n const familyClass = this.getFamilyClass();\n if (familyClass) {\n classes.push(familyClass);\n }\n\n if (this.italic) {\n classes.push(TEXT_ITALIC_CLASS);\n }\n\n const alignClass = this.getAlignClass();\n if (alignClass) {\n classes.push(alignClass);\n }\n\n const toneClass = this.getToneClass();\n if (toneClass) {\n classes.push(toneClass);\n }\n\n if (this.truncate) {\n classes.push(TEXT_TRUNCATE_CLASS);\n }\n\n if (this.numeric) {\n classes.push(TEXT_NUMERIC_CLASS);\n }\n\n if (this.maxLines) {\n classes.push(TEXT_LINE_CLAMP_CLASS);\n }\n\n const wrapClass = this.getWrapClass();\n if (wrapClass) {\n classes.push(wrapClass);\n }\n\n const textBoxTrimClass = this.getTextBoxTrimClass();\n if (textBoxTrimClass) {\n classes.push(textBoxTrimClass);\n }\n\n const strengthClass = this.getStrengthClass();\n if (strengthClass) {\n classes.push(strengthClass);\n }\n\n const densityClass = this.getDensityClass();\n if (densityClass) {\n classes.push(densityClass);\n }\n\n return classes;\n },\n\n textStyles() {\n if (!this.maxLines) {\n return undefined;\n }\n\n return {\n '--dt-text-line-clamp': this.maxLines,\n };\n },\n },\n\n mounted() {\n // Emit info once per session when headline is used without semantic heading element\n if (\n !hasEmittedHeadlineSemanticInfo &&\n this.usesHeadlineVisualStyle() &&\n !SEMANTIC_HEADING_ELEMENTS.includes(this.as)\n ) {\n console.info(\n '[DtText] A headline text style is used without a semantic heading element. ' +\n 'Consider using as=\"h1|h2|h3|h4|h5|h6\" for better accessibility.',\n );\n hasEmittedHeadlineSemanticInfo = true;\n }\n },\n\n methods: {\n usesHeadlineVisualStyle() {\n if (this.variant) {\n return this.variant.startsWith('headline-');\n }\n\n return this.kind === 'headline';\n },\n\n usesLegacyKindSize() {\n return Boolean(this.kind && !this.variant);\n },\n\n getVariantClass() {\n if (this.variant) {\n return this.getModifierClass(\n this.variant,\n TEXT_VARIANT_MODIFIERS,\n 'variant',\n );\n }\n\n if (!this.kind) {\n return null;\n }\n\n if (\n !Object.prototype.hasOwnProperty.call(TEXT_KIND_MODIFIERS, this.kind)\n ) {\n console.warn(`[DtText] Unsupported kind \"${this.kind}\".`);\n return null;\n }\n\n const allowedSizes = TEXT_SIZE_MODIFIERS[this.kind] || [];\n const rawSize = this.size != null ? String(this.size) : null;\n const requestedSize = rawSize || DEFAULT_SIZE;\n let resolvedSize = requestedSize;\n\n if (!allowedSizes.includes(requestedSize)) {\n // Headline-only sizes (3xl, 2xl, xl, 500, 600, 700) throw an error when used with incompatible kinds\n if (TEXT_HEADLINE_ONLY_SIZES.includes(requestedSize)) {\n throw new Error(\n `[DtText] size=\"${requestedSize}\" is only valid for kind=\"headline\". ` +\n `Cannot use with kind=\"${this.kind}\".`,\n );\n }\n\n // Universal sizes fall back gracefully with a warning\n const fallbackSize = allowedSizes.includes(DEFAULT_SIZE)\n ? DEFAULT_SIZE\n : allowedSizes[0];\n if (fallbackSize) {\n resolvedSize = fallbackSize;\n }\n console.warn(\n `[DtText] size=\"${requestedSize}\" is not valid for kind=\"${this.kind}\". Using \"${resolvedSize}\" instead.`,\n );\n }\n\n if (!resolvedSize) {\n return null;\n }\n\n // Map numeric sizes to t-shirt CSS class suffix\n const cssSuffix = TEXT_SIZE_MAP[resolvedSize] || resolvedSize;\n return `${TEXT_KIND_MODIFIERS[this.kind]}--${cssSuffix}`;\n },\n\n getFontSizeClass() {\n if (this.size === null || this.size === undefined) {\n return null;\n }\n\n if (!this.variant && !this.kind) {\n console.warn(\n '[DtText] size must be paired with variant or legacy kind. ' +\n 'Prefer variant for typography composition; use size only as a variant override.',\n );\n return null;\n }\n\n if (this.usesLegacyKindSize()) {\n return null;\n }\n\n const size = String(this.size);\n const className = TEXT_FONT_SIZE_MODIFIERS[size];\n if (className) {\n return className;\n }\n\n console.warn(\n `[DtText] Unsupported size \"${size}\". Use a numeric font-size token.`,\n );\n return null;\n },\n\n getModifierClass(value, modifiers, propName) {\n if (value === null || value === undefined) {\n return null;\n }\n\n const className = modifiers[value];\n if (!className) {\n console.warn(`[DtText] Unsupported ${propName} \"${value}\".`);\n return null;\n }\n\n return className;\n },\n\n getAlignClass() {\n return this.getModifierClass(this.align, TEXT_ALIGN_MODIFIERS, 'align');\n },\n\n getToneClass() {\n return this.getModifierClass(this.tone, TEXT_TONE_MODIFIERS, 'tone');\n },\n\n getWrapClass() {\n return this.getModifierClass(this.wrap, TEXT_WRAP_MODIFIERS, 'wrap');\n },\n\n getTextBoxTrimClass() {\n return this.getModifierClass(\n this.textBoxTrim,\n TEXT_BOX_TRIM_MODIFIERS,\n 'textBoxTrim',\n );\n },\n\n getStrengthClass() {\n return this.getModifierClass(\n this.strength,\n TEXT_STRENGTH_MODIFIERS,\n 'strength',\n );\n },\n\n getDensityClass() {\n return this.getModifierClass(\n this.density,\n TEXT_DENSITY_MODIFIERS,\n 'density',\n );\n },\n\n getFamilyClass() {\n return this.getModifierClass(\n this.family,\n TEXT_FAMILY_MODIFIERS,\n 'family',\n );\n },\n },\n};\n</script>\n"],"mappings":"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"}
|
|
1
|
+
{"version":3,"file":"text.cjs","names":[],"sources":["../../../components/Text/Text.vue"],"sourcesContent":["<template>\n <component\n :is=\"as\"\n data-qa=\"dt-text\"\n :class=\"textClasses\"\n :style=\"textStyles\"\n >\n <!-- @slot Default slot for text content -->\n <slot />\n </component>\n</template>\n\n<script>\nimport {\n TEXT_KIND_MODIFIERS,\n TEXT_VARIANT_MODIFIERS,\n TEXT_SIZE_MODIFIERS,\n TEXT_SIZE_MAP,\n TEXT_HEADLINE_ONLY_SIZES,\n TEXT_FONT_SIZE_MODIFIERS,\n TEXT_FAMILY_MODIFIERS,\n TEXT_ITALIC_CLASS,\n TEXT_ALIGN_MODIFIERS,\n TEXT_TONE_MODIFIERS,\n TEXT_NUMERIC_CLASS,\n TEXT_TRUNCATE_CLASS,\n TEXT_LINE_CLAMP_CLASS,\n TEXT_WRAP_MODIFIERS,\n TEXT_BOX_TRIM_MODIFIERS,\n TEXT_STRENGTH_MODIFIERS,\n TEXT_DENSITY_MODIFIERS,\n} from './TextConstants';\n\nconst DEFAULT_SIZE = '300';\nconst SEMANTIC_HEADING_ELEMENTS = ['h1', 'h2', 'h3', 'h4', 'h5', 'h6'];\n\n// Module-level flag to emit info only once per session\nlet hasEmittedHeadlineSemanticInfo = false;\n\n// Exported for testing purposes only\nexport const resetHeadlineSemanticInfoFlag = () => {\n hasEmittedHeadlineSemanticInfo = false;\n};\n\n/**\n * Dialtone text primitive that applies typography tokens based on semantic props.\n * @see https://dialtone.dialpad.com/components/text.html\n */\nexport default {\n name: 'DtText',\n\n props: {\n /**\n * HTML tag or component used for rendering.\n * @values span, p, strong, h1, h2, h3, h4, h5, h6, label, div, component\n */\n as: {\n type: String,\n default: 'span',\n },\n\n /**\n * Typography kind mapping to headline/body/label/code token sets.\n * @values headline, body, label, code\n * @deprecated Use variant instead\n */\n kind: {\n type: String,\n default: null,\n validator: (value) => {\n return (\n value === null ||\n Object.prototype.hasOwnProperty.call(TEXT_KIND_MODIFIERS, value)\n );\n },\n },\n\n /**\n * Typography variant mapping to a complete token-backed composition.\n * @values headline-3xl, headline-2xl, headline-xl, headline-lg, headline-md, headline-sm, headline-xs, body-lg, body-md, body-sm, body-xs, label-lg, label-md, label-sm, label-xs, code-lg, code-md, code-sm, code-xs\n */\n variant: {\n type: String,\n default: null,\n validator: (value) => {\n return (\n value === null ||\n Object.prototype.hasOwnProperty.call(TEXT_VARIANT_MODIFIERS, value)\n );\n },\n },\n\n /**\n * Raw font-size token. Must be paired with `variant` for overrides or legacy `kind` for composition size.\n * @values 50, 75, 100, 125, 150, 200, 250, 300, 350, 400, 450, 500, 550, 600, 650, 700, 750, 800\n */\n size: {\n type: [String, Number],\n default: null,\n },\n\n /**\n * Overrides font-family. By default, no font-family class is emitted and text inherits naturally.\n * @values inherit, custom, sans, mono, expressive\n */\n family: {\n type: String,\n default: null,\n validator: (value) => {\n return (\n value === null ||\n Object.prototype.hasOwnProperty.call(TEXT_FAMILY_MODIFIERS, value)\n );\n },\n },\n\n /**\n * Applies italic font style when true.\n */\n italic: {\n type: Boolean,\n default: false,\n },\n\n /**\n * Semantic foreground color.\n * @values primary, secondary, tertiary, muted, disabled, placeholder, critical, critical-strong, positive, positive-strong, warning, info, info-strong, neutral-black, neutral-white\n */\n tone: {\n type: String,\n default: null,\n validator: (value) => {\n return (\n value === null ||\n Object.prototype.hasOwnProperty.call(TEXT_TONE_MODIFIERS, value)\n );\n },\n },\n\n /**\n * Logical text alignment. Requires block/inline-block context.\n * @values start, center, end, justify\n */\n align: {\n type: String,\n default: null,\n validator: (value) => {\n return (\n value === null ||\n Object.prototype.hasOwnProperty.call(TEXT_ALIGN_MODIFIERS, value)\n );\n },\n },\n\n /**\n * Enables single-line truncation (i.e. ellipsis) when true; requires block/inline-block context.\n */\n truncate: {\n type: Boolean,\n default: false,\n },\n\n /**\n * Applies multi-line truncation (i.e. clamp) when greater than zero; requires block/inline-block context.\n */\n maxLines: {\n type: Number,\n default: null,\n validator: (value) => {\n return value === null || (Number.isInteger(value) && value > 0);\n },\n },\n\n /**\n * Renders numeric content with tabular figures.\n */\n numeric: {\n type: Boolean,\n default: false,\n },\n\n /**\n * Controls text wrapping behavior.\n * @values wrap, nowrap, balance, pretty\n */\n wrap: {\n type: String,\n default: null,\n validator: (value) => {\n return (\n value === null ||\n Object.prototype.hasOwnProperty.call(TEXT_WRAP_MODIFIERS, value)\n );\n },\n },\n\n /**\n * Controls text-box-trim (leading space above/below text). Useful for tight component layouts.\n * @values start, end, both\n */\n textBoxTrim: {\n type: String,\n default: null,\n validator: (value) => {\n return (\n value === null ||\n Object.prototype.hasOwnProperty.call(TEXT_BOX_TRIM_MODIFIERS, value)\n );\n },\n },\n\n /**\n * Overrides font-weight. Applies to any kind/size combination.\n * @values bold, semibold, medium, normal\n */\n strength: {\n type: String,\n default: null,\n validator: (value) => {\n return (\n value === null ||\n Object.prototype.hasOwnProperty.call(TEXT_STRENGTH_MODIFIERS, value)\n );\n },\n },\n\n /**\n * Overrides line-height. Applies to any kind/size combination.\n * @values 100, 200, 300, 400, 500, 600\n */\n density: {\n type: [String, Number],\n default: null,\n validator: (value) => {\n return (\n value === null ||\n Object.prototype.hasOwnProperty.call(TEXT_DENSITY_MODIFIERS, value)\n );\n },\n },\n },\n\n computed: {\n textClasses() {\n const classes = ['d-text'];\n const variantClass = this.getVariantClass();\n if (variantClass) {\n classes.push(variantClass);\n }\n\n const fontSizeClass = this.getFontSizeClass();\n if (fontSizeClass) {\n classes.push(fontSizeClass);\n }\n\n const familyClass = this.getFamilyClass();\n if (familyClass) {\n classes.push(familyClass);\n }\n\n if (this.italic) {\n classes.push(TEXT_ITALIC_CLASS);\n }\n\n const alignClass = this.getAlignClass();\n if (alignClass) {\n classes.push(alignClass);\n }\n\n const toneClass = this.getToneClass();\n if (toneClass) {\n classes.push(toneClass);\n }\n\n if (this.truncate) {\n classes.push(TEXT_TRUNCATE_CLASS);\n }\n\n if (this.numeric) {\n classes.push(TEXT_NUMERIC_CLASS);\n }\n\n if (this.maxLines) {\n classes.push(TEXT_LINE_CLAMP_CLASS);\n }\n\n const wrapClass = this.getWrapClass();\n if (wrapClass) {\n classes.push(wrapClass);\n }\n\n const textBoxTrimClass = this.getTextBoxTrimClass();\n if (textBoxTrimClass) {\n classes.push(textBoxTrimClass);\n }\n\n const strengthClass = this.getStrengthClass();\n if (strengthClass) {\n classes.push(strengthClass);\n }\n\n const densityClass = this.getDensityClass();\n if (densityClass) {\n classes.push(densityClass);\n }\n\n return classes;\n },\n\n textStyles() {\n if (!this.maxLines) {\n return undefined;\n }\n\n return {\n '--dt-text-line-clamp': this.maxLines,\n };\n },\n },\n\n mounted() {\n // Emit info once per session when headline is used without semantic heading element\n if (\n !hasEmittedHeadlineSemanticInfo &&\n this.usesHeadlineVisualStyle() &&\n !SEMANTIC_HEADING_ELEMENTS.includes(this.as)\n ) {\n console.info(\n '[DtText] A headline text style is used without a semantic heading element. ' +\n 'Consider using as=\"h1|h2|h3|h4|h5|h6\" for better accessibility.',\n );\n hasEmittedHeadlineSemanticInfo = true;\n }\n },\n\n methods: {\n usesHeadlineVisualStyle() {\n if (this.variant) {\n return this.variant.startsWith('headline-');\n }\n\n return this.kind === 'headline';\n },\n\n usesLegacyKindSize() {\n return Boolean(this.kind && !this.variant);\n },\n\n getVariantClass() {\n if (this.variant) {\n return this.getModifierClass(\n this.variant,\n TEXT_VARIANT_MODIFIERS,\n 'variant',\n );\n }\n\n if (!this.kind) {\n return null;\n }\n\n if (\n !Object.prototype.hasOwnProperty.call(TEXT_KIND_MODIFIERS, this.kind)\n ) {\n console.warn(`[DtText] Unsupported kind \"${this.kind}\".`);\n return null;\n }\n\n const allowedSizes = TEXT_SIZE_MODIFIERS[this.kind] || [];\n const rawSize = this.size != null ? String(this.size) : null;\n const requestedSize = rawSize || DEFAULT_SIZE;\n let resolvedSize = requestedSize;\n\n if (!allowedSizes.includes(requestedSize)) {\n // Headline-only sizes (3xl, 2xl, xl, 500, 600, 700) throw an error when used with incompatible kinds\n if (TEXT_HEADLINE_ONLY_SIZES.includes(requestedSize)) {\n throw new Error(\n `[DtText] size=\"${requestedSize}\" is only valid for kind=\"headline\". ` +\n `Cannot use with kind=\"${this.kind}\".`,\n );\n }\n\n // Universal sizes fall back gracefully with a warning\n const fallbackSize = allowedSizes.includes(DEFAULT_SIZE)\n ? DEFAULT_SIZE\n : allowedSizes[0];\n if (fallbackSize) {\n resolvedSize = fallbackSize;\n }\n console.warn(\n `[DtText] size=\"${requestedSize}\" is not valid for kind=\"${this.kind}\". Using \"${resolvedSize}\" instead.`,\n );\n }\n\n if (!resolvedSize) {\n return null;\n }\n\n // Map numeric sizes to t-shirt CSS class suffix\n const cssSuffix = TEXT_SIZE_MAP[resolvedSize] || resolvedSize;\n return `${TEXT_KIND_MODIFIERS[this.kind]}--${cssSuffix}`;\n },\n\n getFontSizeClass() {\n if (this.size === null || this.size === undefined) {\n return null;\n }\n\n if (!this.variant && !this.kind) {\n console.warn(\n '[DtText] size must be paired with variant or legacy kind. ' +\n 'Prefer variant for typography composition; use size only as a variant override.',\n );\n return null;\n }\n\n if (this.usesLegacyKindSize()) {\n return null;\n }\n\n const size = String(this.size);\n const className = TEXT_FONT_SIZE_MODIFIERS[size];\n if (className) {\n return className;\n }\n\n console.warn(\n `[DtText] Unsupported size \"${size}\". Use a numeric font-size token.`,\n );\n return null;\n },\n\n getModifierClass(value, modifiers, propName) {\n if (value === null || value === undefined) {\n return null;\n }\n\n const className = modifiers[value];\n if (!className) {\n console.warn(`[DtText] Unsupported ${propName} \"${value}\".`);\n return null;\n }\n\n return className;\n },\n\n getAlignClass() {\n return this.getModifierClass(this.align, TEXT_ALIGN_MODIFIERS, 'align');\n },\n\n getToneClass() {\n return this.getModifierClass(this.tone, TEXT_TONE_MODIFIERS, 'tone');\n },\n\n getWrapClass() {\n return this.getModifierClass(this.wrap, TEXT_WRAP_MODIFIERS, 'wrap');\n },\n\n getTextBoxTrimClass() {\n return this.getModifierClass(\n this.textBoxTrim,\n TEXT_BOX_TRIM_MODIFIERS,\n 'textBoxTrim',\n );\n },\n\n getStrengthClass() {\n return this.getModifierClass(\n this.strength,\n TEXT_STRENGTH_MODIFIERS,\n 'strength',\n );\n },\n\n getDensityClass() {\n return this.getModifierClass(\n this.density,\n TEXT_DENSITY_MODIFIERS,\n 'density',\n );\n },\n\n getFamilyClass() {\n return this.getModifierClass(\n this.family,\n TEXT_FAMILY_MODIFIERS,\n 'family',\n );\n },\n },\n};\n</script>\n"],"mappings":"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"}
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"text.js","names":[],"sources":["../../../components/Text/Text.vue"],"sourcesContent":["<template>\n <component\n :is=\"as\"\n data-qa=\"dt-text\"\n :class=\"textClasses\"\n :style=\"textStyles\"\n >\n <!-- @slot Default slot for text content -->\n <slot />\n </component>\n</template>\n\n<script>\nimport {\n TEXT_KIND_MODIFIERS,\n TEXT_VARIANT_MODIFIERS,\n TEXT_SIZE_MODIFIERS,\n TEXT_SIZE_MAP,\n TEXT_HEADLINE_ONLY_SIZES,\n TEXT_FONT_SIZE_MODIFIERS,\n TEXT_FAMILY_MODIFIERS,\n TEXT_ITALIC_CLASS,\n TEXT_ALIGN_MODIFIERS,\n TEXT_TONE_MODIFIERS,\n TEXT_NUMERIC_CLASS,\n TEXT_TRUNCATE_CLASS,\n TEXT_LINE_CLAMP_CLASS,\n TEXT_WRAP_MODIFIERS,\n TEXT_BOX_TRIM_MODIFIERS,\n TEXT_STRENGTH_MODIFIERS,\n TEXT_DENSITY_MODIFIERS,\n} from './TextConstants';\n\nconst DEFAULT_SIZE = '300';\nconst SEMANTIC_HEADING_ELEMENTS = ['h1', 'h2', 'h3', 'h4', 'h5', 'h6'];\n\n// Module-level flag to emit info only once per session\nlet hasEmittedHeadlineSemanticInfo = false;\n\n// Exported for testing purposes only\nexport const resetHeadlineSemanticInfoFlag = () => {\n hasEmittedHeadlineSemanticInfo = false;\n};\n\n/**\n * Dialtone text primitive that applies typography tokens based on semantic props.\n * @see https://dialtone.dialpad.com/components/text.html\n */\nexport default {\n name: 'DtText',\n\n props: {\n /**\n * HTML tag or component used for rendering.\n * @values span, p, h1, h2, h3, h4, h5, h6, label, div, component\n */\n as: {\n type: String,\n default: 'span',\n },\n\n /**\n * Typography kind mapping to headline/body/label/code token sets.\n * @values headline, body, label, code\n * @deprecated Use variant instead\n */\n kind: {\n type: String,\n default: null,\n validator: (value) => {\n return (\n value === null ||\n Object.prototype.hasOwnProperty.call(TEXT_KIND_MODIFIERS, value)\n );\n },\n },\n\n /**\n * Typography variant mapping to a complete token-backed composition.\n * @values headline-3xl, headline-2xl, headline-xl, headline-lg, headline-md, headline-sm, headline-xs, body-lg, body-md, body-sm, body-xs, label-lg, label-md, label-sm, label-xs, code-lg, code-md, code-sm, code-xs\n */\n variant: {\n type: String,\n default: null,\n validator: (value) => {\n return (\n value === null ||\n Object.prototype.hasOwnProperty.call(TEXT_VARIANT_MODIFIERS, value)\n );\n },\n },\n\n /**\n * Raw font-size token. Must be paired with `variant` for overrides or legacy `kind` for composition size.\n * @values 50, 75, 100, 125, 150, 200, 250, 300, 350, 400, 450, 500, 550, 600, 650, 700, 750, 800\n */\n size: {\n type: [String, Number],\n default: null,\n },\n\n /**\n * Overrides font-family. By default, no font-family class is emitted and text inherits naturally.\n * @values inherit, custom, sans, mono, expressive\n */\n family: {\n type: String,\n default: null,\n validator: (value) => {\n return (\n value === null ||\n Object.prototype.hasOwnProperty.call(TEXT_FAMILY_MODIFIERS, value)\n );\n },\n },\n\n /**\n * Applies italic font style when true.\n */\n italic: {\n type: Boolean,\n default: false,\n },\n\n /**\n * Semantic foreground color.\n * @values primary, secondary, tertiary, muted, disabled, placeholder, critical, critical-strong, positive, positive-strong, warning, info, info-strong, neutral-black, neutral-white\n */\n tone: {\n type: String,\n default: null,\n validator: (value) => {\n return (\n value === null ||\n Object.prototype.hasOwnProperty.call(TEXT_TONE_MODIFIERS, value)\n );\n },\n },\n\n /**\n * Logical text alignment. Requires block/inline-block context.\n * @values start, center, end, justify\n */\n align: {\n type: String,\n default: null,\n validator: (value) => {\n return (\n value === null ||\n Object.prototype.hasOwnProperty.call(TEXT_ALIGN_MODIFIERS, value)\n );\n },\n },\n\n /**\n * Enables single-line truncation (i.e. ellipsis) when true; requires block/inline-block context.\n */\n truncate: {\n type: Boolean,\n default: false,\n },\n\n /**\n * Applies multi-line truncation (i.e. clamp) when greater than zero; requires block/inline-block context.\n */\n maxLines: {\n type: Number,\n default: null,\n validator: (value) => {\n return value === null || (Number.isInteger(value) && value > 0);\n },\n },\n\n /**\n * Renders numeric content with tabular figures.\n */\n numeric: {\n type: Boolean,\n default: false,\n },\n\n /**\n * Controls text wrapping behavior.\n * @values wrap, nowrap, balance, pretty\n */\n wrap: {\n type: String,\n default: null,\n validator: (value) => {\n return (\n value === null ||\n Object.prototype.hasOwnProperty.call(TEXT_WRAP_MODIFIERS, value)\n );\n },\n },\n\n /**\n * Controls text-box-trim (leading space above/below text). Useful for tight component layouts.\n * @values start, end, both\n */\n textBoxTrim: {\n type: String,\n default: null,\n validator: (value) => {\n return (\n value === null ||\n Object.prototype.hasOwnProperty.call(TEXT_BOX_TRIM_MODIFIERS, value)\n );\n },\n },\n\n /**\n * Overrides font-weight. Applies to any kind/size combination.\n * @values bold, semibold, medium, normal\n */\n strength: {\n type: String,\n default: null,\n validator: (value) => {\n return (\n value === null ||\n Object.prototype.hasOwnProperty.call(TEXT_STRENGTH_MODIFIERS, value)\n );\n },\n },\n\n /**\n * Overrides line-height. Applies to any kind/size combination.\n * @values 100, 200, 300, 400, 500, 600\n */\n density: {\n type: [String, Number],\n default: null,\n validator: (value) => {\n return (\n value === null ||\n Object.prototype.hasOwnProperty.call(TEXT_DENSITY_MODIFIERS, value)\n );\n },\n },\n },\n\n computed: {\n textClasses() {\n const classes = ['d-text'];\n const variantClass = this.getVariantClass();\n if (variantClass) {\n classes.push(variantClass);\n }\n\n const fontSizeClass = this.getFontSizeClass();\n if (fontSizeClass) {\n classes.push(fontSizeClass);\n }\n\n const familyClass = this.getFamilyClass();\n if (familyClass) {\n classes.push(familyClass);\n }\n\n if (this.italic) {\n classes.push(TEXT_ITALIC_CLASS);\n }\n\n const alignClass = this.getAlignClass();\n if (alignClass) {\n classes.push(alignClass);\n }\n\n const toneClass = this.getToneClass();\n if (toneClass) {\n classes.push(toneClass);\n }\n\n if (this.truncate) {\n classes.push(TEXT_TRUNCATE_CLASS);\n }\n\n if (this.numeric) {\n classes.push(TEXT_NUMERIC_CLASS);\n }\n\n if (this.maxLines) {\n classes.push(TEXT_LINE_CLAMP_CLASS);\n }\n\n const wrapClass = this.getWrapClass();\n if (wrapClass) {\n classes.push(wrapClass);\n }\n\n const textBoxTrimClass = this.getTextBoxTrimClass();\n if (textBoxTrimClass) {\n classes.push(textBoxTrimClass);\n }\n\n const strengthClass = this.getStrengthClass();\n if (strengthClass) {\n classes.push(strengthClass);\n }\n\n const densityClass = this.getDensityClass();\n if (densityClass) {\n classes.push(densityClass);\n }\n\n return classes;\n },\n\n textStyles() {\n if (!this.maxLines) {\n return undefined;\n }\n\n return {\n '--dt-text-line-clamp': this.maxLines,\n };\n },\n },\n\n mounted() {\n // Emit info once per session when headline is used without semantic heading element\n if (\n !hasEmittedHeadlineSemanticInfo &&\n this.usesHeadlineVisualStyle() &&\n !SEMANTIC_HEADING_ELEMENTS.includes(this.as)\n ) {\n console.info(\n '[DtText] A headline text style is used without a semantic heading element. ' +\n 'Consider using as=\"h1|h2|h3|h4|h5|h6\" for better accessibility.',\n );\n hasEmittedHeadlineSemanticInfo = true;\n }\n },\n\n methods: {\n usesHeadlineVisualStyle() {\n if (this.variant) {\n return this.variant.startsWith('headline-');\n }\n\n return this.kind === 'headline';\n },\n\n usesLegacyKindSize() {\n return Boolean(this.kind && !this.variant);\n },\n\n getVariantClass() {\n if (this.variant) {\n return this.getModifierClass(\n this.variant,\n TEXT_VARIANT_MODIFIERS,\n 'variant',\n );\n }\n\n if (!this.kind) {\n return null;\n }\n\n if (\n !Object.prototype.hasOwnProperty.call(TEXT_KIND_MODIFIERS, this.kind)\n ) {\n console.warn(`[DtText] Unsupported kind \"${this.kind}\".`);\n return null;\n }\n\n const allowedSizes = TEXT_SIZE_MODIFIERS[this.kind] || [];\n const rawSize = this.size != null ? String(this.size) : null;\n const requestedSize = rawSize || DEFAULT_SIZE;\n let resolvedSize = requestedSize;\n\n if (!allowedSizes.includes(requestedSize)) {\n // Headline-only sizes (3xl, 2xl, xl, 500, 600, 700) throw an error when used with incompatible kinds\n if (TEXT_HEADLINE_ONLY_SIZES.includes(requestedSize)) {\n throw new Error(\n `[DtText] size=\"${requestedSize}\" is only valid for kind=\"headline\". ` +\n `Cannot use with kind=\"${this.kind}\".`,\n );\n }\n\n // Universal sizes fall back gracefully with a warning\n const fallbackSize = allowedSizes.includes(DEFAULT_SIZE)\n ? DEFAULT_SIZE\n : allowedSizes[0];\n if (fallbackSize) {\n resolvedSize = fallbackSize;\n }\n console.warn(\n `[DtText] size=\"${requestedSize}\" is not valid for kind=\"${this.kind}\". Using \"${resolvedSize}\" instead.`,\n );\n }\n\n if (!resolvedSize) {\n return null;\n }\n\n // Map numeric sizes to t-shirt CSS class suffix\n const cssSuffix = TEXT_SIZE_MAP[resolvedSize] || resolvedSize;\n return `${TEXT_KIND_MODIFIERS[this.kind]}--${cssSuffix}`;\n },\n\n getFontSizeClass() {\n if (this.size === null || this.size === undefined) {\n return null;\n }\n\n if (!this.variant && !this.kind) {\n console.warn(\n '[DtText] size must be paired with variant or legacy kind. ' +\n 'Prefer variant for typography composition; use size only as a variant override.',\n );\n return null;\n }\n\n if (this.usesLegacyKindSize()) {\n return null;\n }\n\n const size = String(this.size);\n const className = TEXT_FONT_SIZE_MODIFIERS[size];\n if (className) {\n return className;\n }\n\n console.warn(\n `[DtText] Unsupported size \"${size}\". Use a numeric font-size token.`,\n );\n return null;\n },\n\n getModifierClass(value, modifiers, propName) {\n if (value === null || value === undefined) {\n return null;\n }\n\n const className = modifiers[value];\n if (!className) {\n console.warn(`[DtText] Unsupported ${propName} \"${value}\".`);\n return null;\n }\n\n return className;\n },\n\n getAlignClass() {\n return this.getModifierClass(this.align, TEXT_ALIGN_MODIFIERS, 'align');\n },\n\n getToneClass() {\n return this.getModifierClass(this.tone, TEXT_TONE_MODIFIERS, 'tone');\n },\n\n getWrapClass() {\n return this.getModifierClass(this.wrap, TEXT_WRAP_MODIFIERS, 'wrap');\n },\n\n getTextBoxTrimClass() {\n return this.getModifierClass(\n this.textBoxTrim,\n TEXT_BOX_TRIM_MODIFIERS,\n 'textBoxTrim',\n );\n },\n\n getStrengthClass() {\n return this.getModifierClass(\n this.strength,\n TEXT_STRENGTH_MODIFIERS,\n 'strength',\n );\n },\n\n getDensityClass() {\n return this.getModifierClass(\n this.density,\n TEXT_DENSITY_MODIFIERS,\n 'density',\n );\n },\n\n getFamilyClass() {\n return this.getModifierClass(\n this.family,\n TEXT_FAMILY_MODIFIERS,\n 'family',\n );\n },\n },\n};\n</script>\n"],"mappings":"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"}
|
|
1
|
+
{"version":3,"file":"text.js","names":[],"sources":["../../../components/Text/Text.vue"],"sourcesContent":["<template>\n <component\n :is=\"as\"\n data-qa=\"dt-text\"\n :class=\"textClasses\"\n :style=\"textStyles\"\n >\n <!-- @slot Default slot for text content -->\n <slot />\n </component>\n</template>\n\n<script>\nimport {\n TEXT_KIND_MODIFIERS,\n TEXT_VARIANT_MODIFIERS,\n TEXT_SIZE_MODIFIERS,\n TEXT_SIZE_MAP,\n TEXT_HEADLINE_ONLY_SIZES,\n TEXT_FONT_SIZE_MODIFIERS,\n TEXT_FAMILY_MODIFIERS,\n TEXT_ITALIC_CLASS,\n TEXT_ALIGN_MODIFIERS,\n TEXT_TONE_MODIFIERS,\n TEXT_NUMERIC_CLASS,\n TEXT_TRUNCATE_CLASS,\n TEXT_LINE_CLAMP_CLASS,\n TEXT_WRAP_MODIFIERS,\n TEXT_BOX_TRIM_MODIFIERS,\n TEXT_STRENGTH_MODIFIERS,\n TEXT_DENSITY_MODIFIERS,\n} from './TextConstants';\n\nconst DEFAULT_SIZE = '300';\nconst SEMANTIC_HEADING_ELEMENTS = ['h1', 'h2', 'h3', 'h4', 'h5', 'h6'];\n\n// Module-level flag to emit info only once per session\nlet hasEmittedHeadlineSemanticInfo = false;\n\n// Exported for testing purposes only\nexport const resetHeadlineSemanticInfoFlag = () => {\n hasEmittedHeadlineSemanticInfo = false;\n};\n\n/**\n * Dialtone text primitive that applies typography tokens based on semantic props.\n * @see https://dialtone.dialpad.com/components/text.html\n */\nexport default {\n name: 'DtText',\n\n props: {\n /**\n * HTML tag or component used for rendering.\n * @values span, p, strong, h1, h2, h3, h4, h5, h6, label, div, component\n */\n as: {\n type: String,\n default: 'span',\n },\n\n /**\n * Typography kind mapping to headline/body/label/code token sets.\n * @values headline, body, label, code\n * @deprecated Use variant instead\n */\n kind: {\n type: String,\n default: null,\n validator: (value) => {\n return (\n value === null ||\n Object.prototype.hasOwnProperty.call(TEXT_KIND_MODIFIERS, value)\n );\n },\n },\n\n /**\n * Typography variant mapping to a complete token-backed composition.\n * @values headline-3xl, headline-2xl, headline-xl, headline-lg, headline-md, headline-sm, headline-xs, body-lg, body-md, body-sm, body-xs, label-lg, label-md, label-sm, label-xs, code-lg, code-md, code-sm, code-xs\n */\n variant: {\n type: String,\n default: null,\n validator: (value) => {\n return (\n value === null ||\n Object.prototype.hasOwnProperty.call(TEXT_VARIANT_MODIFIERS, value)\n );\n },\n },\n\n /**\n * Raw font-size token. Must be paired with `variant` for overrides or legacy `kind` for composition size.\n * @values 50, 75, 100, 125, 150, 200, 250, 300, 350, 400, 450, 500, 550, 600, 650, 700, 750, 800\n */\n size: {\n type: [String, Number],\n default: null,\n },\n\n /**\n * Overrides font-family. By default, no font-family class is emitted and text inherits naturally.\n * @values inherit, custom, sans, mono, expressive\n */\n family: {\n type: String,\n default: null,\n validator: (value) => {\n return (\n value === null ||\n Object.prototype.hasOwnProperty.call(TEXT_FAMILY_MODIFIERS, value)\n );\n },\n },\n\n /**\n * Applies italic font style when true.\n */\n italic: {\n type: Boolean,\n default: false,\n },\n\n /**\n * Semantic foreground color.\n * @values primary, secondary, tertiary, muted, disabled, placeholder, critical, critical-strong, positive, positive-strong, warning, info, info-strong, neutral-black, neutral-white\n */\n tone: {\n type: String,\n default: null,\n validator: (value) => {\n return (\n value === null ||\n Object.prototype.hasOwnProperty.call(TEXT_TONE_MODIFIERS, value)\n );\n },\n },\n\n /**\n * Logical text alignment. Requires block/inline-block context.\n * @values start, center, end, justify\n */\n align: {\n type: String,\n default: null,\n validator: (value) => {\n return (\n value === null ||\n Object.prototype.hasOwnProperty.call(TEXT_ALIGN_MODIFIERS, value)\n );\n },\n },\n\n /**\n * Enables single-line truncation (i.e. ellipsis) when true; requires block/inline-block context.\n */\n truncate: {\n type: Boolean,\n default: false,\n },\n\n /**\n * Applies multi-line truncation (i.e. clamp) when greater than zero; requires block/inline-block context.\n */\n maxLines: {\n type: Number,\n default: null,\n validator: (value) => {\n return value === null || (Number.isInteger(value) && value > 0);\n },\n },\n\n /**\n * Renders numeric content with tabular figures.\n */\n numeric: {\n type: Boolean,\n default: false,\n },\n\n /**\n * Controls text wrapping behavior.\n * @values wrap, nowrap, balance, pretty\n */\n wrap: {\n type: String,\n default: null,\n validator: (value) => {\n return (\n value === null ||\n Object.prototype.hasOwnProperty.call(TEXT_WRAP_MODIFIERS, value)\n );\n },\n },\n\n /**\n * Controls text-box-trim (leading space above/below text). Useful for tight component layouts.\n * @values start, end, both\n */\n textBoxTrim: {\n type: String,\n default: null,\n validator: (value) => {\n return (\n value === null ||\n Object.prototype.hasOwnProperty.call(TEXT_BOX_TRIM_MODIFIERS, value)\n );\n },\n },\n\n /**\n * Overrides font-weight. Applies to any kind/size combination.\n * @values bold, semibold, medium, normal\n */\n strength: {\n type: String,\n default: null,\n validator: (value) => {\n return (\n value === null ||\n Object.prototype.hasOwnProperty.call(TEXT_STRENGTH_MODIFIERS, value)\n );\n },\n },\n\n /**\n * Overrides line-height. Applies to any kind/size combination.\n * @values 100, 200, 300, 400, 500, 600\n */\n density: {\n type: [String, Number],\n default: null,\n validator: (value) => {\n return (\n value === null ||\n Object.prototype.hasOwnProperty.call(TEXT_DENSITY_MODIFIERS, value)\n );\n },\n },\n },\n\n computed: {\n textClasses() {\n const classes = ['d-text'];\n const variantClass = this.getVariantClass();\n if (variantClass) {\n classes.push(variantClass);\n }\n\n const fontSizeClass = this.getFontSizeClass();\n if (fontSizeClass) {\n classes.push(fontSizeClass);\n }\n\n const familyClass = this.getFamilyClass();\n if (familyClass) {\n classes.push(familyClass);\n }\n\n if (this.italic) {\n classes.push(TEXT_ITALIC_CLASS);\n }\n\n const alignClass = this.getAlignClass();\n if (alignClass) {\n classes.push(alignClass);\n }\n\n const toneClass = this.getToneClass();\n if (toneClass) {\n classes.push(toneClass);\n }\n\n if (this.truncate) {\n classes.push(TEXT_TRUNCATE_CLASS);\n }\n\n if (this.numeric) {\n classes.push(TEXT_NUMERIC_CLASS);\n }\n\n if (this.maxLines) {\n classes.push(TEXT_LINE_CLAMP_CLASS);\n }\n\n const wrapClass = this.getWrapClass();\n if (wrapClass) {\n classes.push(wrapClass);\n }\n\n const textBoxTrimClass = this.getTextBoxTrimClass();\n if (textBoxTrimClass) {\n classes.push(textBoxTrimClass);\n }\n\n const strengthClass = this.getStrengthClass();\n if (strengthClass) {\n classes.push(strengthClass);\n }\n\n const densityClass = this.getDensityClass();\n if (densityClass) {\n classes.push(densityClass);\n }\n\n return classes;\n },\n\n textStyles() {\n if (!this.maxLines) {\n return undefined;\n }\n\n return {\n '--dt-text-line-clamp': this.maxLines,\n };\n },\n },\n\n mounted() {\n // Emit info once per session when headline is used without semantic heading element\n if (\n !hasEmittedHeadlineSemanticInfo &&\n this.usesHeadlineVisualStyle() &&\n !SEMANTIC_HEADING_ELEMENTS.includes(this.as)\n ) {\n console.info(\n '[DtText] A headline text style is used without a semantic heading element. ' +\n 'Consider using as=\"h1|h2|h3|h4|h5|h6\" for better accessibility.',\n );\n hasEmittedHeadlineSemanticInfo = true;\n }\n },\n\n methods: {\n usesHeadlineVisualStyle() {\n if (this.variant) {\n return this.variant.startsWith('headline-');\n }\n\n return this.kind === 'headline';\n },\n\n usesLegacyKindSize() {\n return Boolean(this.kind && !this.variant);\n },\n\n getVariantClass() {\n if (this.variant) {\n return this.getModifierClass(\n this.variant,\n TEXT_VARIANT_MODIFIERS,\n 'variant',\n );\n }\n\n if (!this.kind) {\n return null;\n }\n\n if (\n !Object.prototype.hasOwnProperty.call(TEXT_KIND_MODIFIERS, this.kind)\n ) {\n console.warn(`[DtText] Unsupported kind \"${this.kind}\".`);\n return null;\n }\n\n const allowedSizes = TEXT_SIZE_MODIFIERS[this.kind] || [];\n const rawSize = this.size != null ? String(this.size) : null;\n const requestedSize = rawSize || DEFAULT_SIZE;\n let resolvedSize = requestedSize;\n\n if (!allowedSizes.includes(requestedSize)) {\n // Headline-only sizes (3xl, 2xl, xl, 500, 600, 700) throw an error when used with incompatible kinds\n if (TEXT_HEADLINE_ONLY_SIZES.includes(requestedSize)) {\n throw new Error(\n `[DtText] size=\"${requestedSize}\" is only valid for kind=\"headline\". ` +\n `Cannot use with kind=\"${this.kind}\".`,\n );\n }\n\n // Universal sizes fall back gracefully with a warning\n const fallbackSize = allowedSizes.includes(DEFAULT_SIZE)\n ? DEFAULT_SIZE\n : allowedSizes[0];\n if (fallbackSize) {\n resolvedSize = fallbackSize;\n }\n console.warn(\n `[DtText] size=\"${requestedSize}\" is not valid for kind=\"${this.kind}\". Using \"${resolvedSize}\" instead.`,\n );\n }\n\n if (!resolvedSize) {\n return null;\n }\n\n // Map numeric sizes to t-shirt CSS class suffix\n const cssSuffix = TEXT_SIZE_MAP[resolvedSize] || resolvedSize;\n return `${TEXT_KIND_MODIFIERS[this.kind]}--${cssSuffix}`;\n },\n\n getFontSizeClass() {\n if (this.size === null || this.size === undefined) {\n return null;\n }\n\n if (!this.variant && !this.kind) {\n console.warn(\n '[DtText] size must be paired with variant or legacy kind. ' +\n 'Prefer variant for typography composition; use size only as a variant override.',\n );\n return null;\n }\n\n if (this.usesLegacyKindSize()) {\n return null;\n }\n\n const size = String(this.size);\n const className = TEXT_FONT_SIZE_MODIFIERS[size];\n if (className) {\n return className;\n }\n\n console.warn(\n `[DtText] Unsupported size \"${size}\". Use a numeric font-size token.`,\n );\n return null;\n },\n\n getModifierClass(value, modifiers, propName) {\n if (value === null || value === undefined) {\n return null;\n }\n\n const className = modifiers[value];\n if (!className) {\n console.warn(`[DtText] Unsupported ${propName} \"${value}\".`);\n return null;\n }\n\n return className;\n },\n\n getAlignClass() {\n return this.getModifierClass(this.align, TEXT_ALIGN_MODIFIERS, 'align');\n },\n\n getToneClass() {\n return this.getModifierClass(this.tone, TEXT_TONE_MODIFIERS, 'tone');\n },\n\n getWrapClass() {\n return this.getModifierClass(this.wrap, TEXT_WRAP_MODIFIERS, 'wrap');\n },\n\n getTextBoxTrimClass() {\n return this.getModifierClass(\n this.textBoxTrim,\n TEXT_BOX_TRIM_MODIFIERS,\n 'textBoxTrim',\n );\n },\n\n getStrengthClass() {\n return this.getModifierClass(\n this.strength,\n TEXT_STRENGTH_MODIFIERS,\n 'strength',\n );\n },\n\n getDensityClass() {\n return this.getModifierClass(\n this.density,\n TEXT_DENSITY_MODIFIERS,\n 'density',\n );\n },\n\n getFamilyClass() {\n return this.getModifierClass(\n this.family,\n TEXT_FAMILY_MODIFIERS,\n 'family',\n );\n },\n },\n};\n</script>\n"],"mappings":"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"}
|
|
@@ -1,2 +1,2 @@
|
|
|
1
|
-
Object.defineProperty(exports,Symbol.toStringTag,{value:`Module`}),require(`../chunk-Bmb41Sf3.cjs`);const e=require(`./en-US.cjs`),t=require(`./zh-CN.cjs`),n=require(`./nl-NL.cjs`),r=require(`./fr-FR.cjs`),i=require(`./de-DE.cjs`),a=require(`./it-IT.cjs`),o=require(`./ja-JP.cjs`),s=require(`./ko-KR.cjs`),c=require(`./pt-BR.cjs`),l=require(`./ru-RU.cjs`),u=require(`./es-LA.cjs`),d=require(`./sv-SE.cjs`);let f=require(`@dialpad/i18n`);var p=`dialtone`,m={ENGLISH:`en-US`,CHINESE:`zh-CN`,DUTCH:`nl-NL`,FRENCH:`fr-FR`,GERMAN:`de-DE`,ITALIAN:`it-IT`,JAPANESE:`ja-JP`,KOREAN:`ko-KR`,PORTUGUESE:`pt-BR`,RUSSIAN:`ru-RU`,SPANISH:`es-LA`,SWEDISH:`sv-SE`},h=`en-US`,g=`user-locale`,_=class _{constructor(v=null){if(typeof _.instance==`object`)return _.instance;this._locale=v||_.getPreferredLocale();let y=
|
|
1
|
+
Object.defineProperty(exports,Symbol.toStringTag,{value:`Module`}),require(`../chunk-Bmb41Sf3.cjs`);const e=require(`./en-US.cjs`),t=require(`./zh-CN.cjs`),n=require(`./nl-NL.cjs`),r=require(`./fr-FR.cjs`),i=require(`./de-DE.cjs`),a=require(`./it-IT.cjs`),o=require(`./ja-JP.cjs`),s=require(`./ko-KR.cjs`),c=require(`./pt-BR.cjs`),l=require(`./ru-RU.cjs`),u=require(`./es-LA.cjs`),d=require(`./sv-SE.cjs`);let f=require(`@dialpad/i18n`);var p=`dialtone`,m={ENGLISH:`en-US`,CHINESE:`zh-CN`,DUTCH:`nl-NL`,FRENCH:`fr-FR`,GERMAN:`de-DE`,ITALIAN:`it-IT`,JAPANESE:`ja-JP`,KOREAN:`ko-KR`,PORTUGUESE:`pt-BR`,RUSSIAN:`ru-RU`,SPANISH:`es-LA`,SWEDISH:`sv-SE`},h=`en-US`,g=`user-locale`,_=class _{constructor(v=null){if(typeof _.instance==`object`)return _.instance;this._locale=v||_.getPreferredLocale();let y={bundleSource:new f.RawBundleSource({resources:f.RawBundleSource.builtResources([[`en-US`,p,e.default],[`zh-CN`,p,t.default],[`nl-NL`,p,n.default],[`fr-FR`,p,r.default],[`de-DE`,p,i.default],[`it-IT`,p,a.default],[`ja-JP`,p,o.default],[`ko-KR`,p,s.default],[`pt-BR`,p,c.default],[`ru-RU`,p,l.default],[`es-LA`,p,u.default],[`sv-SE`,p,d.default]])}),allowedLocales:Object.values(m),fallbackLocale:h,preferredLocale:this._locale,namespaces:[p]},b;try{b=new f.LocaleManager(y)}catch(e){if(e.name!==`SecurityError`)throw e;b=new f.LocaleManager({...y,storageWrapper:new f.MemoryStorageWrapper})}return _.instance=this,this.i18n=b.useI18N(p),typeof window<`u`&&window.addEventListener(`storage`,e=>{e.key===g&&(this.currentLocale=e.newValue)}),this}static getPreferredLocale(){if(typeof window>`u`)return h;let e;try{let t=window.localStorage;if(!t)return h;e=t.getItem(g)}catch{return h}let t=Object.values(m).includes(e)?e:null,n=Object.values(m).find(e=>e.startsWith(navigator.language.slice(0,2)));return t||n||h}static getAllowedLocales(){return m}$t(...e){return this.i18n.$t(...e)}$ta(...e){return this.i18n.$ta(...e)}get currentLocale(){return this._locale}set currentLocale(e){if(e!==this._locale){if(!Object.values(m).includes(e))throw Error(`Locale ${e} is not allowed, please use one of the following: ${Object.values(m).join(`, `)}`);this._locale=e,this.i18n.setI18N({preferredLocale:e},p)}}};exports.DialtoneLocalization=_;
|
|
2
2
|
//# sourceMappingURL=index.cjs.map
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"index.cjs","names":["
|
|
1
|
+
{"version":3,"file":"index.cjs","names":["RawBundleSource","enUS","zhCN","nlNL","frFR","deDE","itIT","jaJP","koKR","ptBR","ruRU","esLA","svSE","LocaleManager","MemoryStorageWrapper"],"sources":["../../localization/index.js"],"sourcesContent":["import { LocaleManager, RawBundleSource, MemoryStorageWrapper } from '@dialpad/i18n';\n\nimport enUS from './en-US.ftl?raw';\nimport zhCN from './zh-CN.ftl?raw';\nimport nlNL from './nl-NL.ftl?raw';\nimport frFR from './fr-FR.ftl?raw';\nimport deDE from './de-DE.ftl?raw';\nimport itIT from './it-IT.ftl?raw';\nimport jaJP from './ja-JP.ftl?raw';\nimport koKR from './ko-KR.ftl?raw';\nimport ptBR from './pt-BR.ftl?raw';\nimport ruRU from './ru-RU.ftl?raw';\nimport esLA from './es-LA.ftl?raw';\nimport svSE from './sv-SE.ftl?raw';\n\nconst dialtoneNamespace = 'dialtone';\nconst allowedLocales = {\n ENGLISH: 'en-US',\n CHINESE: 'zh-CN',\n DUTCH: 'nl-NL',\n FRENCH: 'fr-FR',\n GERMAN: 'de-DE',\n ITALIAN: 'it-IT',\n JAPANESE: 'ja-JP',\n KOREAN: 'ko-KR',\n PORTUGUESE: 'pt-BR',\n RUSSIAN: 'ru-RU',\n SPANISH: 'es-LA',\n SWEDISH: 'sv-SE',\n};\nconst fallbackLocale = 'en-US';\n/**\n * Default key name used by the LocaleManager to store the user's preferred locale in localStorage\n */\nconst localeManagerStorageKey = 'user-locale';\n\n/**\n * Dialtone localization class, follows the singleton pattern to make sure only one instance of the class is created.\n * Initializes the localeManager and looks for changes on the browser storage to update the current locale.\n * https://github.com/dialpad/goblin-client-tools/tree/main/packages/i18n#i18n-vue-3-compatible\n */\nexport class DialtoneLocalization {\n /**\n * @prop {import('@dialpad/i18n').UseI18N} i18n\n * @private\n */\n constructor (locale = null) {\n if (typeof DialtoneLocalization.instance === 'object') {\n return DialtoneLocalization.instance;\n }\n\n this._locale = locale || DialtoneLocalization.getPreferredLocale();\n\n const bundleSource = new RawBundleSource({\n resources: RawBundleSource.builtResources([\n ['en-US', dialtoneNamespace, enUS],\n ['zh-CN', dialtoneNamespace, zhCN],\n ['nl-NL', dialtoneNamespace, nlNL],\n ['fr-FR', dialtoneNamespace, frFR],\n ['de-DE', dialtoneNamespace, deDE],\n ['it-IT', dialtoneNamespace, itIT],\n ['ja-JP', dialtoneNamespace, jaJP],\n ['ko-KR', dialtoneNamespace, koKR],\n ['pt-BR', dialtoneNamespace, ptBR],\n ['ru-RU', dialtoneNamespace, ruRU],\n ['es-LA', dialtoneNamespace, esLA],\n ['sv-SE', dialtoneNamespace, svSE],\n ]),\n });\n\n const localeOptions = {\n bundleSource,\n allowedLocales: Object.values(allowedLocales),\n fallbackLocale,\n preferredLocale: this._locale,\n namespaces: [dialtoneNamespace],\n };\n let localeManager;\n try {\n localeManager = new LocaleManager(localeOptions);\n } catch (error) {\n if (error.name !== 'SecurityError') throw error;\n localeManager = new LocaleManager({ ...localeOptions, storageWrapper: new MemoryStorageWrapper() });\n }\n\n DialtoneLocalization.instance = this;\n this.i18n = localeManager.useI18N(dialtoneNamespace);\n\n if (typeof window !== 'undefined') {\n /**\n * @description\n * When the browser storage changes, update the current locale\n * @param event\n */\n window.addEventListener('storage', (event) => {\n if (event.key === localeManagerStorageKey) {\n this.currentLocale = event.newValue;\n }\n });\n }\n\n return this;\n }\n\n /**\n * Gets the preferred locale from user's locale stored in localStorage or the browser language\n * @returns { string }\n */\n static getPreferredLocale () {\n /**\n * Early return if we're not in the browser or if localStorage is not available\n */\n if (typeof window === 'undefined') {\n return fallbackLocale;\n }\n\n let storedLanguage;\n try {\n const storage = window.localStorage;\n if (!storage) return fallbackLocale;\n storedLanguage = storage.getItem(localeManagerStorageKey);\n } catch {\n return fallbackLocale;\n }\n\n // Only trust the stored locale if it's one Dialtone actually ships a bundle for.\n // Callers (e.g. UC/UV) may allow locales Dialtone doesn't support, which would\n // otherwise crash the LocaleManager during render.\n const localStorageLanguage = Object.values(allowedLocales).includes(storedLanguage)\n ? storedLanguage\n : null;\n\n // Get the first two letters of the navigator language and check if it's in the allowed locales\n const navigatorLanguage = Object.values(allowedLocales)\n .find(locale => locale.startsWith(navigator.language.slice(0, 2)));\n\n return localStorageLanguage || navigatorLanguage || fallbackLocale;\n }\n\n static getAllowedLocales () {\n return allowedLocales;\n }\n\n /**\n * Passthrough function to the i18n $t function including the dialtone namespace\n * Returns a translated string based on a key and optional variables.\n * It’s used for simple text translations.\n * https://github.com/dialpad/goblin-client-tools/tree/main/packages/i18n#t\n */\n $t (...args) {\n return this.i18n.$t(...args);\n }\n\n /**\n * Passthrough function to the i18n $ta function including the dialtone namespace\n * Returns an object containing translated attributes to pass directly as props to components, it can contain\n * aria-label, title, etc, rather than just a plain text. It’s useful for handling element attributes in the UI.\n * https://github.com/dialpad/goblin-client-tools/tree/main/packages/i18n#ta\n */\n $ta (...args) {\n return this.i18n.$ta(...args);\n }\n\n get currentLocale () {\n return this._locale;\n }\n\n set currentLocale (newLocale) {\n if (newLocale === this._locale) return;\n if (!Object.values(allowedLocales).includes(newLocale)) {\n throw new Error(`Locale ${newLocale} is not allowed, please use one of the following: ${Object.values(allowedLocales).join(', ')}`);\n }\n\n this._locale = newLocale;\n this.i18n.setI18N({ preferredLocale: newLocale }, dialtoneNamespace);\n }\n}\n"],"mappings":"qbAeA,IAAM,EAAoB,WACpB,EAAiB,CACrB,QAAS,QACT,QAAS,QACT,MAAO,QACP,OAAQ,QACR,OAAQ,QACR,QAAS,QACT,SAAU,QACV,OAAQ,QACR,WAAY,QACZ,QAAS,QACT,QAAS,QACT,QAAS,QACV,CACK,EAAiB,QAIjB,EAA0B,cAOnB,EAAb,MAAa,CAAqB,CAKhC,YAAa,EAAS,KAAM,CAC1B,GAAI,OAAO,EAAqB,UAAa,SAC3C,OAAO,EAAqB,SAG9B,KAAK,QAAU,GAAU,EAAqB,oBAAoB,CAmBlE,IAAM,EAAgB,CACpB,aAlBmB,IAAIA,EAAAA,gBAAgB,CACvC,UAAWA,EAAAA,gBAAgB,eAAe,CACxC,CAAC,QAAS,EAAmBC,EAAAA,QAAK,CAClC,CAAC,QAAS,EAAmBC,EAAAA,QAAK,CAClC,CAAC,QAAS,EAAmBC,EAAAA,QAAK,CAClC,CAAC,QAAS,EAAmBC,EAAAA,QAAK,CAClC,CAAC,QAAS,EAAmBC,EAAAA,QAAK,CAClC,CAAC,QAAS,EAAmBC,EAAAA,QAAK,CAClC,CAAC,QAAS,EAAmBC,EAAAA,QAAK,CAClC,CAAC,QAAS,EAAmBC,EAAAA,QAAK,CAClC,CAAC,QAAS,EAAmBC,EAAAA,QAAK,CAClC,CAAC,QAAS,EAAmBC,EAAAA,QAAK,CAClC,CAAC,QAAS,EAAmBC,EAAAA,QAAK,CAClC,CAAC,QAAS,EAAmBC,EAAAA,QAAK,CACnC,CAAC,CACH,CAAC,CAIA,eAAgB,OAAO,OAAO,EAAe,CAC7C,iBACA,gBAAiB,KAAK,QACtB,WAAY,CAAC,EAAkB,CAChC,CACG,EACJ,GAAI,CACF,EAAgB,IAAIC,EAAAA,cAAc,EAAc,OACzC,EAAO,CACd,GAAI,EAAM,OAAS,gBAAiB,MAAM,EAC1C,EAAgB,IAAIA,EAAAA,cAAc,CAAE,GAAG,EAAe,eAAgB,IAAIC,EAAAA,qBAAwB,CAAC,CAmBrG,MAhBA,GAAqB,SAAW,KAChC,KAAK,KAAO,EAAc,QAAQ,EAAkB,CAEhD,OAAO,OAAW,KAMpB,OAAO,iBAAiB,UAAY,GAAU,CACxC,EAAM,MAAQ,IAChB,KAAK,cAAgB,EAAM,WAE7B,CAGG,KAOT,OAAO,oBAAsB,CAI3B,GAAI,OAAO,OAAW,IACpB,OAAO,EAGT,IAAI,EACJ,GAAI,CACF,IAAM,EAAU,OAAO,aACvB,GAAI,CAAC,EAAS,OAAO,EACrB,EAAiB,EAAQ,QAAQ,EAAwB,MACnD,CACN,OAAO,EAMT,IAAM,EAAuB,OAAO,OAAO,EAAe,CAAC,SAAS,EAAe,CAC/E,EACA,KAGE,EAAoB,OAAO,OAAO,EAAe,CACpD,KAAK,GAAU,EAAO,WAAW,UAAU,SAAS,MAAM,EAAG,EAAE,CAAC,CAAC,CAEpE,OAAO,GAAwB,GAAqB,EAGtD,OAAO,mBAAqB,CAC1B,OAAO,EAST,GAAI,GAAG,EAAM,CACX,OAAO,KAAK,KAAK,GAAG,GAAG,EAAK,CAS9B,IAAK,GAAG,EAAM,CACZ,OAAO,KAAK,KAAK,IAAI,GAAG,EAAK,CAG/B,IAAI,eAAiB,CACnB,OAAO,KAAK,QAGd,IAAI,cAAe,EAAW,CACxB,OAAc,KAAK,QACvB,IAAI,CAAC,OAAO,OAAO,EAAe,CAAC,SAAS,EAAU,CACpD,MAAU,MAAM,UAAU,EAAU,oDAAoD,OAAO,OAAO,EAAe,CAAC,KAAK,KAAK,GAAG,CAGrI,KAAK,QAAU,EACf,KAAK,KAAK,QAAQ,CAAE,gBAAiB,EAAW,CAAE,EAAkB"}
|
|
@@ -10,9 +10,9 @@ import c from "./pt-BR.js";
|
|
|
10
10
|
import l from "./ru-RU.js";
|
|
11
11
|
import u from "./es-LA.js";
|
|
12
12
|
import d from "./sv-SE.js";
|
|
13
|
-
import { LocaleManager as f,
|
|
13
|
+
import { LocaleManager as f, MemoryStorageWrapper as p, RawBundleSource as m } from "@dialpad/i18n";
|
|
14
14
|
//#region localization/index.js
|
|
15
|
-
var
|
|
15
|
+
var h = "dialtone", g = {
|
|
16
16
|
ENGLISH: "en-US",
|
|
17
17
|
CHINESE: "zh-CN",
|
|
18
18
|
DUTCH: "nl-NL",
|
|
@@ -25,89 +25,106 @@ var m = "dialtone", h = {
|
|
|
25
25
|
RUSSIAN: "ru-RU",
|
|
26
26
|
SPANISH: "es-LA",
|
|
27
27
|
SWEDISH: "sv-SE"
|
|
28
|
-
},
|
|
29
|
-
constructor(
|
|
30
|
-
if (typeof
|
|
31
|
-
this._locale =
|
|
32
|
-
let
|
|
33
|
-
bundleSource: new
|
|
28
|
+
}, _ = "en-US", v = "user-locale", y = class y {
|
|
29
|
+
constructor(b = null) {
|
|
30
|
+
if (typeof y.instance == "object") return y.instance;
|
|
31
|
+
this._locale = b || y.getPreferredLocale();
|
|
32
|
+
let x = {
|
|
33
|
+
bundleSource: new m({ resources: m.builtResources([
|
|
34
34
|
[
|
|
35
35
|
"en-US",
|
|
36
|
-
|
|
36
|
+
h,
|
|
37
37
|
e
|
|
38
38
|
],
|
|
39
39
|
[
|
|
40
40
|
"zh-CN",
|
|
41
|
-
|
|
41
|
+
h,
|
|
42
42
|
t
|
|
43
43
|
],
|
|
44
44
|
[
|
|
45
45
|
"nl-NL",
|
|
46
|
-
|
|
46
|
+
h,
|
|
47
47
|
n
|
|
48
48
|
],
|
|
49
49
|
[
|
|
50
50
|
"fr-FR",
|
|
51
|
-
|
|
51
|
+
h,
|
|
52
52
|
r
|
|
53
53
|
],
|
|
54
54
|
[
|
|
55
55
|
"de-DE",
|
|
56
|
-
|
|
56
|
+
h,
|
|
57
57
|
i
|
|
58
58
|
],
|
|
59
59
|
[
|
|
60
60
|
"it-IT",
|
|
61
|
-
|
|
61
|
+
h,
|
|
62
62
|
a
|
|
63
63
|
],
|
|
64
64
|
[
|
|
65
65
|
"ja-JP",
|
|
66
|
-
|
|
66
|
+
h,
|
|
67
67
|
o
|
|
68
68
|
],
|
|
69
69
|
[
|
|
70
70
|
"ko-KR",
|
|
71
|
-
|
|
71
|
+
h,
|
|
72
72
|
s
|
|
73
73
|
],
|
|
74
74
|
[
|
|
75
75
|
"pt-BR",
|
|
76
|
-
|
|
76
|
+
h,
|
|
77
77
|
c
|
|
78
78
|
],
|
|
79
79
|
[
|
|
80
80
|
"ru-RU",
|
|
81
|
-
|
|
81
|
+
h,
|
|
82
82
|
l
|
|
83
83
|
],
|
|
84
84
|
[
|
|
85
85
|
"es-LA",
|
|
86
|
-
|
|
86
|
+
h,
|
|
87
87
|
u
|
|
88
88
|
],
|
|
89
89
|
[
|
|
90
90
|
"sv-SE",
|
|
91
|
-
|
|
91
|
+
h,
|
|
92
92
|
d
|
|
93
93
|
]
|
|
94
94
|
]) }),
|
|
95
|
-
allowedLocales: Object.values(
|
|
96
|
-
fallbackLocale:
|
|
95
|
+
allowedLocales: Object.values(g),
|
|
96
|
+
fallbackLocale: _,
|
|
97
97
|
preferredLocale: this._locale,
|
|
98
|
-
namespaces: [
|
|
99
|
-
}
|
|
100
|
-
|
|
101
|
-
|
|
98
|
+
namespaces: [h]
|
|
99
|
+
}, S;
|
|
100
|
+
try {
|
|
101
|
+
S = new f(x);
|
|
102
|
+
} catch (e) {
|
|
103
|
+
if (e.name !== "SecurityError") throw e;
|
|
104
|
+
S = new f({
|
|
105
|
+
...x,
|
|
106
|
+
storageWrapper: new p()
|
|
107
|
+
});
|
|
108
|
+
}
|
|
109
|
+
return y.instance = this, this.i18n = S.useI18N(h), typeof window < "u" && window.addEventListener("storage", (e) => {
|
|
110
|
+
e.key === v && (this.currentLocale = e.newValue);
|
|
102
111
|
}), this;
|
|
103
112
|
}
|
|
104
113
|
static getPreferredLocale() {
|
|
105
|
-
if (typeof window > "u"
|
|
106
|
-
let e
|
|
107
|
-
|
|
114
|
+
if (typeof window > "u") return _;
|
|
115
|
+
let e;
|
|
116
|
+
try {
|
|
117
|
+
let t = window.localStorage;
|
|
118
|
+
if (!t) return _;
|
|
119
|
+
e = t.getItem(v);
|
|
120
|
+
} catch {
|
|
121
|
+
return _;
|
|
122
|
+
}
|
|
123
|
+
let t = Object.values(g).includes(e) ? e : null, n = Object.values(g).find((e) => e.startsWith(navigator.language.slice(0, 2)));
|
|
124
|
+
return t || n || _;
|
|
108
125
|
}
|
|
109
126
|
static getAllowedLocales() {
|
|
110
|
-
return
|
|
127
|
+
return g;
|
|
111
128
|
}
|
|
112
129
|
$t(...e) {
|
|
113
130
|
return this.i18n.$t(...e);
|
|
@@ -120,12 +137,12 @@ var m = "dialtone", h = {
|
|
|
120
137
|
}
|
|
121
138
|
set currentLocale(e) {
|
|
122
139
|
if (e !== this._locale) {
|
|
123
|
-
if (!Object.values(
|
|
124
|
-
this._locale = e, this.i18n.setI18N({ preferredLocale: e },
|
|
140
|
+
if (!Object.values(g).includes(e)) throw Error(`Locale ${e} is not allowed, please use one of the following: ${Object.values(g).join(", ")}`);
|
|
141
|
+
this._locale = e, this.i18n.setI18N({ preferredLocale: e }, h);
|
|
125
142
|
}
|
|
126
143
|
}
|
|
127
144
|
};
|
|
128
145
|
//#endregion
|
|
129
|
-
export {
|
|
146
|
+
export { y as DialtoneLocalization };
|
|
130
147
|
|
|
131
148
|
//# sourceMappingURL=index.js.map
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"index.js","names":["enUS","zhCN","nlNL","frFR","deDE","itIT","jaJP","koKR","ptBR","ruRU","esLA","svSE"],"sources":["../../localization/index.js"],"sourcesContent":["import { LocaleManager, RawBundleSource } from '@dialpad/i18n';\n\nimport enUS from './en-US.ftl?raw';\nimport zhCN from './zh-CN.ftl?raw';\nimport nlNL from './nl-NL.ftl?raw';\nimport frFR from './fr-FR.ftl?raw';\nimport deDE from './de-DE.ftl?raw';\nimport itIT from './it-IT.ftl?raw';\nimport jaJP from './ja-JP.ftl?raw';\nimport koKR from './ko-KR.ftl?raw';\nimport ptBR from './pt-BR.ftl?raw';\nimport ruRU from './ru-RU.ftl?raw';\nimport esLA from './es-LA.ftl?raw';\nimport svSE from './sv-SE.ftl?raw';\n\nconst dialtoneNamespace = 'dialtone';\nconst allowedLocales = {\n ENGLISH: 'en-US',\n CHINESE: 'zh-CN',\n DUTCH: 'nl-NL',\n FRENCH: 'fr-FR',\n GERMAN: 'de-DE',\n ITALIAN: 'it-IT',\n JAPANESE: 'ja-JP',\n KOREAN: 'ko-KR',\n PORTUGUESE: 'pt-BR',\n RUSSIAN: 'ru-RU',\n SPANISH: 'es-LA',\n SWEDISH: 'sv-SE',\n};\nconst fallbackLocale = 'en-US';\n/**\n * Default key name used by the LocaleManager to store the user's preferred locale in localStorage\n */\nconst localeManagerStorageKey = 'user-locale';\n\n/**\n * Dialtone localization class, follows the singleton pattern to make sure only one instance of the class is created.\n * Initializes the localeManager and looks for changes on the browser storage to update the current locale.\n * https://github.com/dialpad/goblin-client-tools/tree/main/packages/i18n#i18n-vue-3-compatible\n */\nexport class DialtoneLocalization {\n /**\n * @prop {import('@dialpad/i18n').UseI18N} i18n\n * @private\n */\n constructor (locale = null) {\n if (typeof DialtoneLocalization.instance === 'object') {\n return DialtoneLocalization.instance;\n }\n\n this._locale = locale || DialtoneLocalization.getPreferredLocale();\n\n const bundleSource = new RawBundleSource({\n resources: RawBundleSource.builtResources([\n ['en-US', dialtoneNamespace, enUS],\n ['zh-CN', dialtoneNamespace, zhCN],\n ['nl-NL', dialtoneNamespace, nlNL],\n ['fr-FR', dialtoneNamespace, frFR],\n ['de-DE', dialtoneNamespace, deDE],\n ['it-IT', dialtoneNamespace, itIT],\n ['ja-JP', dialtoneNamespace, jaJP],\n ['ko-KR', dialtoneNamespace, koKR],\n ['pt-BR', dialtoneNamespace, ptBR],\n ['ru-RU', dialtoneNamespace, ruRU],\n ['es-LA', dialtoneNamespace, esLA],\n ['sv-SE', dialtoneNamespace, svSE],\n ]),\n });\n\n const
|
|
1
|
+
{"version":3,"file":"index.js","names":["enUS","zhCN","nlNL","frFR","deDE","itIT","jaJP","koKR","ptBR","ruRU","esLA","svSE"],"sources":["../../localization/index.js"],"sourcesContent":["import { LocaleManager, RawBundleSource, MemoryStorageWrapper } from '@dialpad/i18n';\n\nimport enUS from './en-US.ftl?raw';\nimport zhCN from './zh-CN.ftl?raw';\nimport nlNL from './nl-NL.ftl?raw';\nimport frFR from './fr-FR.ftl?raw';\nimport deDE from './de-DE.ftl?raw';\nimport itIT from './it-IT.ftl?raw';\nimport jaJP from './ja-JP.ftl?raw';\nimport koKR from './ko-KR.ftl?raw';\nimport ptBR from './pt-BR.ftl?raw';\nimport ruRU from './ru-RU.ftl?raw';\nimport esLA from './es-LA.ftl?raw';\nimport svSE from './sv-SE.ftl?raw';\n\nconst dialtoneNamespace = 'dialtone';\nconst allowedLocales = {\n ENGLISH: 'en-US',\n CHINESE: 'zh-CN',\n DUTCH: 'nl-NL',\n FRENCH: 'fr-FR',\n GERMAN: 'de-DE',\n ITALIAN: 'it-IT',\n JAPANESE: 'ja-JP',\n KOREAN: 'ko-KR',\n PORTUGUESE: 'pt-BR',\n RUSSIAN: 'ru-RU',\n SPANISH: 'es-LA',\n SWEDISH: 'sv-SE',\n};\nconst fallbackLocale = 'en-US';\n/**\n * Default key name used by the LocaleManager to store the user's preferred locale in localStorage\n */\nconst localeManagerStorageKey = 'user-locale';\n\n/**\n * Dialtone localization class, follows the singleton pattern to make sure only one instance of the class is created.\n * Initializes the localeManager and looks for changes on the browser storage to update the current locale.\n * https://github.com/dialpad/goblin-client-tools/tree/main/packages/i18n#i18n-vue-3-compatible\n */\nexport class DialtoneLocalization {\n /**\n * @prop {import('@dialpad/i18n').UseI18N} i18n\n * @private\n */\n constructor (locale = null) {\n if (typeof DialtoneLocalization.instance === 'object') {\n return DialtoneLocalization.instance;\n }\n\n this._locale = locale || DialtoneLocalization.getPreferredLocale();\n\n const bundleSource = new RawBundleSource({\n resources: RawBundleSource.builtResources([\n ['en-US', dialtoneNamespace, enUS],\n ['zh-CN', dialtoneNamespace, zhCN],\n ['nl-NL', dialtoneNamespace, nlNL],\n ['fr-FR', dialtoneNamespace, frFR],\n ['de-DE', dialtoneNamespace, deDE],\n ['it-IT', dialtoneNamespace, itIT],\n ['ja-JP', dialtoneNamespace, jaJP],\n ['ko-KR', dialtoneNamespace, koKR],\n ['pt-BR', dialtoneNamespace, ptBR],\n ['ru-RU', dialtoneNamespace, ruRU],\n ['es-LA', dialtoneNamespace, esLA],\n ['sv-SE', dialtoneNamespace, svSE],\n ]),\n });\n\n const localeOptions = {\n bundleSource,\n allowedLocales: Object.values(allowedLocales),\n fallbackLocale,\n preferredLocale: this._locale,\n namespaces: [dialtoneNamespace],\n };\n let localeManager;\n try {\n localeManager = new LocaleManager(localeOptions);\n } catch (error) {\n if (error.name !== 'SecurityError') throw error;\n localeManager = new LocaleManager({ ...localeOptions, storageWrapper: new MemoryStorageWrapper() });\n }\n\n DialtoneLocalization.instance = this;\n this.i18n = localeManager.useI18N(dialtoneNamespace);\n\n if (typeof window !== 'undefined') {\n /**\n * @description\n * When the browser storage changes, update the current locale\n * @param event\n */\n window.addEventListener('storage', (event) => {\n if (event.key === localeManagerStorageKey) {\n this.currentLocale = event.newValue;\n }\n });\n }\n\n return this;\n }\n\n /**\n * Gets the preferred locale from user's locale stored in localStorage or the browser language\n * @returns { string }\n */\n static getPreferredLocale () {\n /**\n * Early return if we're not in the browser or if localStorage is not available\n */\n if (typeof window === 'undefined') {\n return fallbackLocale;\n }\n\n let storedLanguage;\n try {\n const storage = window.localStorage;\n if (!storage) return fallbackLocale;\n storedLanguage = storage.getItem(localeManagerStorageKey);\n } catch {\n return fallbackLocale;\n }\n\n // Only trust the stored locale if it's one Dialtone actually ships a bundle for.\n // Callers (e.g. UC/UV) may allow locales Dialtone doesn't support, which would\n // otherwise crash the LocaleManager during render.\n const localStorageLanguage = Object.values(allowedLocales).includes(storedLanguage)\n ? storedLanguage\n : null;\n\n // Get the first two letters of the navigator language and check if it's in the allowed locales\n const navigatorLanguage = Object.values(allowedLocales)\n .find(locale => locale.startsWith(navigator.language.slice(0, 2)));\n\n return localStorageLanguage || navigatorLanguage || fallbackLocale;\n }\n\n static getAllowedLocales () {\n return allowedLocales;\n }\n\n /**\n * Passthrough function to the i18n $t function including the dialtone namespace\n * Returns a translated string based on a key and optional variables.\n * It’s used for simple text translations.\n * https://github.com/dialpad/goblin-client-tools/tree/main/packages/i18n#t\n */\n $t (...args) {\n return this.i18n.$t(...args);\n }\n\n /**\n * Passthrough function to the i18n $ta function including the dialtone namespace\n * Returns an object containing translated attributes to pass directly as props to components, it can contain\n * aria-label, title, etc, rather than just a plain text. It’s useful for handling element attributes in the UI.\n * https://github.com/dialpad/goblin-client-tools/tree/main/packages/i18n#ta\n */\n $ta (...args) {\n return this.i18n.$ta(...args);\n }\n\n get currentLocale () {\n return this._locale;\n }\n\n set currentLocale (newLocale) {\n if (newLocale === this._locale) return;\n if (!Object.values(allowedLocales).includes(newLocale)) {\n throw new Error(`Locale ${newLocale} is not allowed, please use one of the following: ${Object.values(allowedLocales).join(', ')}`);\n }\n\n this._locale = newLocale;\n this.i18n.setI18N({ preferredLocale: newLocale }, dialtoneNamespace);\n }\n}\n"],"mappings":";;;;;;;;;;;;;;AAeA,IAAM,IAAoB,YACpB,IAAiB;CACrB,SAAS;CACT,SAAS;CACT,OAAO;CACP,QAAQ;CACR,QAAQ;CACR,SAAS;CACT,UAAU;CACV,QAAQ;CACR,YAAY;CACZ,SAAS;CACT,SAAS;CACT,SAAS;CACV,EACK,IAAiB,SAIjB,IAA0B,eAOnB,IAAb,MAAa,EAAqB;CAKhC,YAAa,IAAS,MAAM;AAC1B,MAAI,OAAO,EAAqB,YAAa,SAC3C,QAAO,EAAqB;AAG9B,OAAK,UAAU,KAAU,EAAqB,oBAAoB;EAmBlE,IAAM,IAAgB;GACpB,cAlBmB,IAAI,EAAgB,EACvC,WAAW,EAAgB,eAAe;IACxC;KAAC;KAAS;KAAmBA;KAAK;IAClC;KAAC;KAAS;KAAmBC;KAAK;IAClC;KAAC;KAAS;KAAmBC;KAAK;IAClC;KAAC;KAAS;KAAmBC;KAAK;IAClC;KAAC;KAAS;KAAmBC;KAAK;IAClC;KAAC;KAAS;KAAmBC;KAAK;IAClC;KAAC;KAAS;KAAmBC;KAAK;IAClC;KAAC;KAAS;KAAmBC;KAAK;IAClC;KAAC;KAAS;KAAmBC;KAAK;IAClC;KAAC;KAAS;KAAmBC;KAAK;IAClC;KAAC;KAAS;KAAmBC;KAAK;IAClC;KAAC;KAAS;KAAmBC;KAAK;IACnC,CAAC,EACH,CAAC;GAIA,gBAAgB,OAAO,OAAO,EAAe;GAC7C;GACA,iBAAiB,KAAK;GACtB,YAAY,CAAC,EAAkB;GAChC,EACG;AACJ,MAAI;AACF,OAAgB,IAAI,EAAc,EAAc;WACzC,GAAO;AACd,OAAI,EAAM,SAAS,gBAAiB,OAAM;AAC1C,OAAgB,IAAI,EAAc;IAAE,GAAG;IAAe,gBAAgB,IAAI,GAAsB;IAAE,CAAC;;AAmBrG,SAhBA,EAAqB,WAAW,MAChC,KAAK,OAAO,EAAc,QAAQ,EAAkB,EAEhD,OAAO,SAAW,OAMpB,OAAO,iBAAiB,YAAY,MAAU;AAC5C,GAAI,EAAM,QAAQ,MAChB,KAAK,gBAAgB,EAAM;IAE7B,EAGG;;CAOT,OAAO,qBAAsB;AAI3B,MAAI,OAAO,SAAW,IACpB,QAAO;EAGT,IAAI;AACJ,MAAI;GACF,IAAM,IAAU,OAAO;AACvB,OAAI,CAAC,EAAS,QAAO;AACrB,OAAiB,EAAQ,QAAQ,EAAwB;UACnD;AACN,UAAO;;EAMT,IAAM,IAAuB,OAAO,OAAO,EAAe,CAAC,SAAS,EAAe,GAC/E,IACA,MAGE,IAAoB,OAAO,OAAO,EAAe,CACpD,MAAK,MAAU,EAAO,WAAW,UAAU,SAAS,MAAM,GAAG,EAAE,CAAC,CAAC;AAEpE,SAAO,KAAwB,KAAqB;;CAGtD,OAAO,oBAAqB;AAC1B,SAAO;;CAST,GAAI,GAAG,GAAM;AACX,SAAO,KAAK,KAAK,GAAG,GAAG,EAAK;;CAS9B,IAAK,GAAG,GAAM;AACZ,SAAO,KAAK,KAAK,IAAI,GAAG,EAAK;;CAG/B,IAAI,gBAAiB;AACnB,SAAO,KAAK;;CAGd,IAAI,cAAe,GAAW;AACxB,YAAc,KAAK,SACvB;OAAI,CAAC,OAAO,OAAO,EAAe,CAAC,SAAS,EAAU,CACpD,OAAU,MAAM,UAAU,EAAU,oDAAoD,OAAO,OAAO,EAAe,CAAC,KAAK,KAAK,GAAG;AAIrI,GADA,KAAK,UAAU,GACf,KAAK,KAAK,QAAQ,EAAE,iBAAiB,GAAW,EAAE,EAAkB"}
|
package/package.json
CHANGED
|
@@ -1,6 +1,6 @@
|
|
|
1
1
|
{
|
|
2
2
|
"name": "@dialpad/dialtone-vue",
|
|
3
|
-
"version": "4.6.
|
|
3
|
+
"version": "4.6.1",
|
|
4
4
|
"description": "Vue component library for Dialpad's design system Dialtone",
|
|
5
5
|
"files": [
|
|
6
6
|
"dist"
|
|
@@ -61,12 +61,12 @@
|
|
|
61
61
|
"react": "19.2.4",
|
|
62
62
|
"storybook": "10.3.0",
|
|
63
63
|
"vue": "^3.3.4",
|
|
64
|
-
"@dialpad/dialtone
|
|
65
|
-
"@dialpad/
|
|
64
|
+
"@dialpad/generator-dialtone": "0.1.0",
|
|
65
|
+
"@dialpad/dialtone-css": "9.4.0"
|
|
66
66
|
},
|
|
67
67
|
"peerDependencies": {
|
|
68
68
|
"vue": ">=3.2",
|
|
69
|
-
"@dialpad/dialtone-css": "^9.
|
|
69
|
+
"@dialpad/dialtone-css": "^9.4.0"
|
|
70
70
|
},
|
|
71
71
|
"bugs": {
|
|
72
72
|
"email": "dialtone@dialpad.com"
|