@globalpayments/vega 2.44.0 → 2.45.0

package/dist/collection/components/vega-nav/vega-left-nav-group/vega-left-nav-group.js

@@ -4,7 +4,7 @@ var __decorate = (this && this.__decorate) || function (decorators, target, key,
   else for (var i = decorators.length - 1; i >= 0; i--) if (d = decorators[i]) r = (c < 3 ? d(r) : c > 3 ? d(target, key, r) : d(target, key)) || r;
   return c > 3 && r && Object.defineProperty(target, key, r), r;
 };
-import { h, Component, Prop, Element, Event, State } from '@stencil/core';
+import { h, Component, Prop, Element, Event, State, Host } from '@stencil/core';
 import { sanitizeVegaComponent } from '../../../utils/component';
 import { InjectVegaGlobalSlimmer, InjectVegaSlimmer, slotPlaceholder, } from 'vega-slimmer/core';
 import { VegaLeftNavGroupRenderer } from './slimmers/renderers/vega-left-nav-group-renderer';
@@ -38,7 +38,7 @@ export class VegaLeftNavGroup {
   }
   render() {
     slotPlaceholder(h("slot", null));
-    return sanitizeVegaComponent(this.renderer.render(), this.host);
+    return (h(Host, { "data-key": this.itemKey }, sanitizeVegaComponent(this.renderer.render(), this.host)));
   }
   static get is() { return "vega-left-nav-group"; }
   static get encapsulation() { return "shadow"; }
@@ -110,6 +110,26 @@ export class VegaLeftNavGroup {
       "attribute": "open-by-default",
       "reflect": false,
       "defaultValue": "false"
+    },
+    "itemKey": {
+      "type": "string",
+      "mutable": false,
+      "complexType": {
+        "original": "string",
+        "resolved": "string",
+        "references": {}
+      },
+      "required": false,
+      "optional": false,
+      "docs": {
+        "tags": [{
+            "name": "vegaVersion",
+            "text": "2.45.0"
+          }],
+        "text": "Defines a unique key for the left nav group item."
+      },
+      "attribute": "item-key",
+      "reflect": false
     }
   }; }
   static get states() { return {

package/dist/collection/components/vega-nav/vega-left-nav-link/slimmers/renderers/vega-left-nav-link-renderer.js

@@ -30,7 +30,7 @@ export class VegaLeftNavLinkRenderer extends VegaSlimmer {
     var _a;
     const url = this.url || 'javascript:void(0);';
     const classList = this.selected === true ? 'selected' : '';
-    return (h(Host, { class: classList },
+    return (h(Host, { class: classList, "data-key": this.itemKey },
       h("a", { href: url, onClick: this.handleClick },
         this.icon && (h("div", { class: "vega-links-icon" },
           h("div", { class: "prefix-icon" },
@@ -76,3 +76,6 @@ __decorate([
 __decorate([
   MapToComponentField()
 ], VegaLeftNavLinkRenderer.prototype, "customSelectionEnabled", void 0);
+__decorate([
+  MapToComponentField()
+], VegaLeftNavLinkRenderer.prototype, "itemKey", void 0);

package/dist/collection/components/vega-nav/vega-left-nav-link/vega-left-nav-link.js

@@ -26,6 +26,7 @@ export class VegaLeftNavLink {
     this.vegaComponentUsageRuntimeMetricsSlimmer = new VegaComponentUsageRuntimeMetricsSlimmer();
     /**
      * A boolean that indicates whether the current link item is selected.
+     *
      * @VegaWarning Note: Ensure that the `custom-selection-enabled` property is set to `true` before modifying this value, as modifying it without this setting may lead to unexpected behavior.
      * @vegaVersion 1.31.0
      */
@@ -161,6 +162,26 @@ export class VegaLeftNavLink {
           }],
         "text": "config the counter badge for left nav link items"
       }
+    },
+    "itemKey": {
+      "type": "string",
+      "mutable": false,
+      "complexType": {
+        "original": "string",
+        "resolved": "string",
+        "references": {}
+      },
+      "required": false,
+      "optional": false,
+      "docs": {
+        "tags": [{
+            "name": "vegaVersion",
+            "text": "2.45.0"
+          }],
+        "text": "Defines a unique key for the left nav link item."
+      },
+      "attribute": "item-key",
+      "reflect": false
     }
   }; }
   static get events() { return [{

package/dist/collection/components/vega-nav/vega-left-nav-section/slimmers/renderers/vega-left-nav-section-renderer.js

@@ -10,7 +10,7 @@ import { DomNodeSubjectObserverFactory } from '../../../../../helpers/change-man
 import { VegaClick } from '../../../../../helpers/event-manager/event-id/vega-event-id';
 export class VegaLeftNavSectionRenderer extends VegaSlimmer {
   render() {
-    return (h(Host, null,
+    return (h(Host, { "data-key": this.itemKey },
       this.renderSectionHeader(),
       h("slot", null),
       this.renderListSeparator()));
@@ -38,3 +38,6 @@ __decorate([
 __decorate([
   MapToComponentField()
 ], VegaLeftNavSectionRenderer.prototype, "actionClickEventEmitter", void 0);
+__decorate([
+  MapToComponentField()
+], VegaLeftNavSectionRenderer.prototype, "itemKey", void 0);

package/dist/collection/components/vega-nav/vega-left-nav-section/vega-left-nav-section.js

@@ -56,6 +56,26 @@ export class VegaLeftNavSection {
           }],
         "text": "sectionHeader attached to the left nav section **"
       }
+    },
+    "itemKey": {
+      "type": "string",
+      "mutable": false,
+      "complexType": {
+        "original": "string",
+        "resolved": "string",
+        "references": {}
+      },
+      "required": false,
+      "optional": false,
+      "docs": {
+        "tags": [{
+            "name": "vegaVersion",
+            "text": "2.45.0"
+          }],
+        "text": "Defines a unique key for the left nav nav section item."
+      },
+      "attribute": "item-key",
+      "reflect": false
     }
   }; }
   static get events() { return [{

package/dist/collection/components/vega-pagination/vega-pagination.js

@@ -83,10 +83,11 @@ export class VegaPagination {
      * It refers to additional elements or components that can be added to
      *    enhance the functionality or appearance of each pagination item.
      *
-     * @VegaWarning Note: The default value is controlled by feature flag `VEGA_PAGINATION.ENABLE_EXTENSIONS_RESPONSIVE_DEFAULT_VALUE`, which is disabled by default. To enable the new responsive default value `{
-          default: [['pageSizeSelectorMobile_currentPageLabel'], ['pageSelectorMobile_goTo']],
-          M: [['pageSelector']],
-        }`, please enable the feature flag.
+     * @VegaWarning - Note: The default value is controlled by feature flag `VEGA_PAGINATION.ENABLE_EXTENSIONS_RESPONSIVE_DEFAULT_VALUE`, which is disabled by default.
+     *              - To enable the new responsive default value `{
+              default: [['pageSizeSelectorMobile_currentPageLabel'], ['pageSelectorMobile_goTo']],
+                M: [['pageSelector']],
+                    }`, please enable the feature flag.
      * @vegaVersion 1.25.0
      * @defaultValue [['pageSelector']]
      */
@@ -317,7 +318,7 @@ export class VegaPagination {
       "docs": {
         "tags": [{
             "name": "VegaWarning",
-            "text": "Note: The default value is controlled by feature flag `VEGA_PAGINATION.ENABLE_EXTENSIONS_RESPONSIVE_DEFAULT_VALUE`, which is disabled by default. To enable the new responsive default value `{\ndefault: [['pageSizeSelectorMobile_currentPageLabel'], ['pageSelectorMobile_goTo']],\nM: [['pageSelector']],\n}`, please enable the feature flag."
+            "text": "- Note: The default value is controlled by feature flag `VEGA_PAGINATION.ENABLE_EXTENSIONS_RESPONSIVE_DEFAULT_VALUE`, which is disabled by default. \n- To enable the new responsive default value `{\ndefault: [['pageSizeSelectorMobile_currentPageLabel'], ['pageSelectorMobile_goTo']],\nM: [['pageSelector']],\n}`, please enable the feature flag."
           }, {
             "name": "vegaVersion",
             "text": "1.25.0"

package/dist/collection/components/vega-popover/vega-popover.js

@@ -59,10 +59,8 @@ export class VegaPopover {
     /**
      * Determines whether the popover's position is calculated relative to the screen.
      *
-     * @VegaWarning When enabled (set to true), it overrides the positionRelativeTo property, making it ineffective.
-     *
-     * @VegaWarning Currently, when set to true, the position calculation may be inaccurate if the popover is placed inside a scrollable container within a shadowRoot (e.g., inside a vega-modal with scrollable content).
-     *
+     * @VegaWarning - It will overrides the positionRelativeTo and matchContainerHeight properties, rendering them ineffective.
+     *              - Currently, when set to true, the position calculation may be inaccurate if the popover is placed inside a scrollable container within a shadowRoot (e.g., inside a vega-modal with scrollable content).
      * @vegaVersion 2.39.0
      */
     this.isScreenPosition = false;
@@ -279,10 +277,7 @@ export class VegaPopover {
       "docs": {
         "tags": [{
             "name": "VegaWarning",
-            "text": "When enabled (set to true), it overrides the positionRelativeTo property, making it ineffective."
-          }, {
-            "name": "VegaWarning",
-            "text": "Currently, when set to true, the position calculation may be inaccurate if the popover is placed inside a scrollable container within a shadowRoot (e.g., inside a vega-modal with scrollable content)."
+            "text": "- It will overrides the positionRelativeTo and matchContainerHeight properties, rendering them ineffective.\n- Currently, when set to true, the position calculation may be inaccurate if the popover is placed inside a scrollable container within a shadowRoot (e.g., inside a vega-modal with scrollable content)."
           }, {
             "name": "vegaVersion",
             "text": "2.39.0"

package/dist/collection/components/vega-rich-text-editor/slimmers/renderers/tools/text-styles-toolbar-button-slimmer.js

@@ -59,7 +59,7 @@ export class TextStylesToolbarButtonSlimmer extends ToolbarButtonSlimmer {
       const boldAnnotation = new BoldAnnotation(item.bold);
       return (h("vega-dropdown-item", { key: item.key, itemKey: item.key },
         h("vega-box", { padding: { right: 'size-20' } },
-          h("div", { style: Object.assign(Object.assign({}, textStyleAnnotation.render()), boldAnnotation.render()) }, item.label))));
+          h("div", { style: Object.assign(Object.assign({}, textStyleAnnotation.render()), boldAnnotation.render()) }, this.translationSlimmer.t(item.label)))));
     })));
   }
   isSelected() {

package/dist/collection/components/vega-rich-text-editor/slimmers/renderers/tools/toolbar-button-slimmer.abstract.js

@@ -13,7 +13,7 @@ export class ToolbarButtonSlimmer extends VegaSlimmer {
     super();
     this.renderBtn = ({ showArrowIcon, iconColor } = {}) => {
       var _a;
-      return (h("vega-tooltip", { text: this.tooltip.text, placement: ['bottom', 'top'] },
+      return (h("vega-tooltip", { text: this.translationSlimmer.t(this.tooltip.text), placement: ['bottom', 'top'] },
         h("vega-rich-text-editor-toolbar-button", Object.assign({ showArrowIcon: showArrowIcon, icon: this.icon, iconColor: iconColor, ref: (ref) => {
             DomNodeSubjectObserverFactory.addUniqueObserverToNode(ref, VegaClick, () => {
               this.handleClick();
@@ -60,6 +60,9 @@ export class ToolbarButtonSlimmer extends VegaSlimmer {
     };
   }
 }
+__decorate([
+  MapToComponentField()
+], ToolbarButtonSlimmer.prototype, "translationSlimmer", void 0);
 __decorate([
   MapToComponentField()
 ], ToolbarButtonSlimmer.prototype, "selectionController", void 0);

package/dist/collection/components/vega-rich-text-editor/vega-rich-text-editor.js

@@ -42,12 +42,14 @@ import { FocusController } from './slimmers/controllers/focus-controller';
 import { TextNodeColorController } from './slimmers/controllers/text-node-color-controller';
 import { InsertCompositionTextController } from './slimmers/controllers/insert-composition-text-controller';
 import { DeleteSelectedNodesController } from './slimmers/controllers/delete-selected-nodes-controller';
+import { TranslationSlimmer } from '../../helpers/slimmers/translation';
 /**
  * @vegaVersion 2.34.0
  */
 export class VegaRichTextEditor {
   constructor() {
     this.globalSlimmers = {};
+    this.translationSlimmer = new TranslationSlimmer();
     this.vegaComponentUsageRuntimeMetricsSlimmer = new VegaComponentUsageRuntimeMetricsSlimmer();
     this.formFieldController = new FormFieldControllerSlimmer({
       propertyRules: [
@@ -585,6 +587,9 @@ export class VegaRichTextEditor {
 __decorate([
   InjectVegaGlobalSlimmer()
 ], VegaRichTextEditor.prototype, "globalSlimmers", void 0);
+__decorate([
+  InjectVegaSlimmer()
+], VegaRichTextEditor.prototype, "translationSlimmer", void 0);
 __decorate([
   InjectVegaSlimmer()
 ], VegaRichTextEditor.prototype, "vegaComponentUsageRuntimeMetricsSlimmer", void 0);

package/dist/collection/components/vega-rich-text-editor/vega-rich-text-image-editor/slimmers/renderers/vega-rich-text-image-editor-renderer.js

@@ -54,11 +54,13 @@ export class VegaRichTextImageEditorRenderer extends VegaSlimmer {
   renderImageEditor() {
     return (h("vega-box", { display: this.currentPage === 1 ? 'block' : 'none' },
       h("vega-flex", { gap: "size-12", alignItems: "center" },
-        h("vega-font", { variant: "font-field-label-sm", color: "text-primary" }, "Size:"),
+        h("vega-font", { variant: "font-field-label-sm", color: "text-primary" },
+          this.translationSlimmer.t('Size'),
+          ":"),
         h("vega-segment-control", { size: "small", segments: [
-            { key: 'sm', text: 'Sm' },
-            { key: 'md', text: 'Md' },
-            { key: 'lg', text: 'Lg' },
+            { key: 'sm', text: this.translationSlimmer.t('Sm') },
+            { key: 'md', text: this.translationSlimmer.t('Md') },
+            { key: 'lg', text: this.translationSlimmer.t('Lg') },
           ], selected: this.size, ref: (ref) => {
             DomNodeSubjectObserverFactory.addUniqueObserverToNode(ref, VegaChange, (e) => {
               const size = e.detail;
@@ -81,13 +83,13 @@ export class VegaRichTextImageEditorRenderer extends VegaSlimmer {
               }
             });
           } },
-          h("vega-button-group-item", { label: "Alt Text", itemKey: "Alt Text" }),
-          h("vega-button-group-item", { label: "Delete Image", icon: VegaInternalIconManager.getIconKey('trash-can'), iconOnly: true, itemKey: "trash-can" })))));
+          h("vega-button-group-item", { label: this.translationSlimmer.t('Alt Text'), itemKey: "Alt Text" }),
+          h("vega-button-group-item", { label: this.translationSlimmer.t('Delete Image'), icon: VegaInternalIconManager.getIconKey('trash-can'), iconOnly: true, itemKey: "trash-can" })))));
   }
   renderAltTextEditor() {
     return (h("vega-box", { display: this.currentPage === 2 ? 'block' : 'none' },
       h("vega-form", { ref: (ref) => (this.formRef = ref) },
-        h("vega-input", { "data-vega-form": "alt", style: { width: '315px' }, label: "Alt Text", ref: (ref) => {
+        h("vega-input", { "data-vega-form": "alt", style: { width: '315px' }, label: this.translationSlimmer.t('Alt Text'), ref: (ref) => {
             void ref.doFocus();
           }, onKeyDown: this.handleKeyDown }))));
   }
@@ -128,6 +130,9 @@ __decorate([
 __decorate([
   MapToComponentField()
 ], VegaRichTextImageEditorRenderer.prototype, "changeEventEmitter", void 0);
+__decorate([
+  MapToComponentField()
+], VegaRichTextImageEditorRenderer.prototype, "translationSlimmer", void 0);
 __decorate([
   MapToComponentMethod('componentDidLoad')
 ], VegaRichTextImageEditorRenderer.prototype, "findParentContainerRef", null);

package/dist/collection/components/vega-rich-text-editor/vega-rich-text-image-editor/vega-rich-text-image-editor.js

@@ -11,6 +11,7 @@ import { sanitizeVegaComponent } from '../../../utils/component';
 import { VegaRichTextImageEditorRenderer } from './slimmers/renderers/vega-rich-text-image-editor-renderer';
 import { createEventEmitSlimmer, } from '../../../helpers/event-manager/slimmers/event-emit-slimmer';
 import { VegaChange } from '../../../helpers/event-manager/event-id/vega-event-id';
+import { TranslationSlimmer } from '../../../helpers/slimmers/translation';
 /**
  * This is an internal used component and shouldn't be used by clients,
  *    it doesn't show up in storybook either.
@@ -20,6 +21,7 @@ import { VegaChange } from '../../../helpers/event-manager/event-id/vega-event-i
 export class VegaRichTextImageEditor {
   constructor() {
     this.globalSlimmers = {};
+    this.translationSlimmer = new TranslationSlimmer();
     this.vegaComponentUsageRuntimeMetricsSlimmer = new VegaComponentUsageRuntimeMetricsSlimmer();
     this.renderer = new VegaRichTextImageEditorRenderer();
     this.changeEventEmitter = createEventEmitSlimmer(VegaRichTextImageEditor, VegaChange);
@@ -154,6 +156,9 @@ export class VegaRichTextImageEditor {
 __decorate([
   InjectVegaGlobalSlimmer()
 ], VegaRichTextImageEditor.prototype, "globalSlimmers", void 0);
+__decorate([
+  InjectVegaSlimmer()
+], VegaRichTextImageEditor.prototype, "translationSlimmer", void 0);
 __decorate([
   InjectVegaSlimmer()
 ], VegaRichTextImageEditor.prototype, "vegaComponentUsageRuntimeMetricsSlimmer", void 0);

package/dist/collection/components/vega-rich-text-editor/vega-rich-text-link-editor/slimmers/renderers/vega-rich-text-link-editor-renderer.js

@@ -96,8 +96,8 @@ export class VegaRichTextLinkEditorRenderer extends VegaSlimmer {
             }
           });
         } },
-        h("vega-button-group-item", { label: "Edit", itemKey: "edit" }),
-        h("vega-button-group-item", { label: "Unlink", itemKey: "unlink" }))));
+        h("vega-button-group-item", { label: this.translationSlimmer.t('Edit'), itemKey: "edit" }),
+        h("vega-button-group-item", { label: this.translationSlimmer.t('Unlink'), itemKey: "unlink" }))));
   }
   renderLinkEditContent() {
     return (h("vega-box", { display: this.status === 'linkEdit' ? 'block' : 'none' },
@@ -105,8 +105,8 @@ export class VegaRichTextLinkEditorRenderer extends VegaSlimmer {
         h("vega-flex", { style: { width: '419px' }, direction: "col", gap: "size-16" },
           h("vega-input", { "data-vega-form": "url", ref: (ref) => {
               this.urlInputRef = ref;
-            }, size: "small", label: "URL", onKeyDown: this.handleKeyDown }),
-          h("vega-input", { size: "small", label: "Text", "data-vega-form": "text", onKeyDown: this.handleKeyDown })))));
+            }, size: "small", label: this.translationSlimmer.t('URL'), onKeyDown: this.handleKeyDown }),
+          h("vega-input", { size: "small", label: this.translationSlimmer.t('Text'), "data-vega-form": "text", onKeyDown: this.handleKeyDown })))));
   }
   updatePopoverTarget() {
     remoteInvocationRegistry.call(domNodeSubjectFactory.getSubject(this.popoverRef, VegaInternalPopoverUpdateTarget), this.target);
@@ -127,6 +127,9 @@ __decorate([
 __decorate([
   MapToComponentField()
 ], VegaRichTextLinkEditorRenderer.prototype, "resetStatusAfterHide", void 0);
+__decorate([
+  MapToComponentField()
+], VegaRichTextLinkEditorRenderer.prototype, "translationSlimmer", void 0);
 __decorate([
   MapToComponentField()
 ], VegaRichTextLinkEditorRenderer.prototype, "target", void 0);

package/dist/collection/components/vega-rich-text-editor/vega-rich-text-link-editor/vega-rich-text-link-editor.js

@@ -11,6 +11,7 @@ import { sanitizeVegaComponent } from '../../../utils/component';
 import { VegaRichTextLinkEditorRenderer } from './slimmers/renderers/vega-rich-text-link-editor-renderer';
 import { createEventEmitSlimmer, } from '../../../helpers/event-manager/slimmers/event-emit-slimmer';
 import { VegaChange } from '../../../helpers/event-manager/event-id/vega-event-id';
+import { TranslationSlimmer } from '../../../helpers/slimmers/translation';
 /**
  * This is an internal used component and shouldn't be used by clients,
  *    it doesn't show up in storybook either.
@@ -20,6 +21,7 @@ import { VegaChange } from '../../../helpers/event-manager/event-id/vega-event-i
 export class VegaRichTextLinkEditor {
   constructor() {
     this.globalSlimmers = {};
+    this.translationSlimmer = new TranslationSlimmer();
     this.vegaComponentUsageRuntimeMetricsSlimmer = new VegaComponentUsageRuntimeMetricsSlimmer();
     this.renderer = new VegaRichTextLinkEditorRenderer();
     this.changeEventEmitter = createEventEmitSlimmer(VegaRichTextLinkEditor, VegaChange);
@@ -236,6 +238,9 @@ export class VegaRichTextLinkEditor {
 __decorate([
   InjectVegaGlobalSlimmer()
 ], VegaRichTextLinkEditor.prototype, "globalSlimmers", void 0);
+__decorate([
+  InjectVegaSlimmer()
+], VegaRichTextLinkEditor.prototype, "translationSlimmer", void 0);
 __decorate([
   InjectVegaSlimmer()
 ], VegaRichTextLinkEditor.prototype, "vegaComponentUsageRuntimeMetricsSlimmer", void 0);

package/dist/collection/components/vega-skeleton/slimmers/renderers/vega-skeleton-image-renderer.js

@@ -22,7 +22,7 @@ export class VegaSkeletonImageRenderer extends VegaSkeletonRendererBase {
     };
   }
   renderChildren() {
-    return h("div", { class: "vega-skeleton-image" });
+    return h("vega-box", { class: "vega-skeleton-image", corners: this.corners });
   }
 }
 __decorate([
@@ -31,3 +31,6 @@ __decorate([
 __decorate([
   MapToComponentField()
 ], VegaSkeletonImageRenderer.prototype, "width", void 0);
+__decorate([
+  MapToComponentField()
+], VegaSkeletonImageRenderer.prototype, "corners", void 0);

package/dist/collection/components/vega-skeleton/vega-skeleton.css

@@ -48,7 +48,6 @@
 }
 
 .vega-skeleton-image {
-  border-radius: 12px;
   width: 100%;
   height: 100%;
 }

package/dist/collection/components/vega-skeleton/vega-skeleton.js

@@ -40,6 +40,15 @@ export class VegaSkeleton {
      * @vegaVersion 2.15.0
      */
     this.animated = false;
+    /**
+     * Defines the corner of the skeleton.
+     *    It accepts a string value representing a valid
+     *    border radius token.
+     * @VegaHint This property is only valid for image types.
+     *
+     * @vegaVersion 2.45.0
+     */
+    this.corners = 'rounded-12';
   }
   render() {
     return this.vegaSkeletonRendererManager.render();
@@ -149,6 +158,35 @@ export class VegaSkeleton {
       "attribute": "animated",
       "reflect": false,
       "defaultValue": "false"
+    },
+    "corners": {
+      "type": "string",
+      "mutable": false,
+      "complexType": {
+        "original": "CornersType",
+        "resolved": "\"rounded-12\" | \"rounded-16\" | \"rounded-2\" | \"rounded-24\" | \"rounded-32\" | \"rounded-4\" | \"rounded-48\" | \"rounded-8\" | \"rounded-full\" | \"rounded-none\" | { left?: \"rounded-none\" | \"rounded-full\" | \"rounded-2\" | \"rounded-4\" | \"rounded-8\" | \"rounded-12\" | \"rounded-16\" | \"rounded-24\" | \"rounded-32\" | \"rounded-48\"; right?: \"rounded-none\" | \"rounded-full\" | \"rounded-2\" | \"rounded-4\" | \"rounded-8\" | \"rounded-12\" | \"rounded-16\" | \"rounded-24\" | \"rounded-32\" | \"rounded-48\"; top?: \"rounded-none\" | \"rounded-full\" | \"rounded-2\" | \"rounded-4\" | \"rounded-8\" | \"rounded-12\" | \"rounded-16\" | \"rounded-24\" | \"rounded-32\" | \"rounded-48\"; bottom?: \"rounded-none\" | \"rounded-full\" | \"rounded-2\" | \"rounded-4\" | \"rounded-8\" | \"rounded-12\" | \"rounded-16\" | \"rounded-24\" | \"rounded-32\" | \"rounded-48\"; \"top-left\"?: \"rounded-none\" | \"rounded-full\" | \"rounded-2\" | \"rounded-4\" | \"rounded-8\" | \"rounded-12\" | \"rounded-16\" | \"rounded-24\" | \"rounded-32\" | \"rounded-48\"; \"top-right\"?: \"rounded-none\" | \"rounded-full\" | \"rounded-2\" | \"rounded-4\" | \"rounded-8\" | \"rounded-12\" | \"rounded-16\" | \"rounded-24\" | \"rounded-32\" | \"rounded-48\"; \"bottom-left\"?: \"rounded-none\" | \"rounded-full\" | \"rounded-2\" | \"rounded-4\" | \"rounded-8\" | \"rounded-12\" | \"rounded-16\" | \"rounded-24\" | \"rounded-32\" | \"rounded-48\"; \"bottom-right\"?: \"rounded-none\" | \"rounded-full\" | \"rounded-2\" | \"rounded-4\" | \"rounded-8\" | \"rounded-12\" | \"rounded-16\" | \"rounded-24\" | \"rounded-32\" | \"rounded-48\"; }",
+        "references": {
+          "CornersType": {
+            "location": "import",
+            "path": "../../types/ui.type"
+          }
+        }
+      },
+      "required": false,
+      "optional": false,
+      "docs": {
+        "tags": [{
+            "name": "VegaHint",
+            "text": "This property is only valid for image types."
+          }, {
+            "name": "vegaVersion",
+            "text": "2.45.0"
+          }],
+        "text": "Defines the corner of the skeleton.\n   It accepts a string value representing a valid\n   border radius token."
+      },
+      "attribute": "corners",
+      "reflect": false,
+      "defaultValue": "'rounded-12'"
     }
   }; }
   static get elementRef() { return "host"; }

package/dist/collection/components/vega-time-picker/slimmers/renderers/vega-time-picker-range-dropdown-renderer.js

@@ -15,12 +15,14 @@ export class VegaTimePickerRangeDropdownRenderer extends VegaSlimmer {
   constructor() {
     super(...arguments);
     this.isMobileDevice = getDeviceType() === DeviceType.MOBILE;
+    this.isTabletDevice = getDeviceType() === DeviceType.TABLET;
     /** The `renderStartDropdown` method is a private method of the `VegaTimePickerRangeDropdownRenderer` class. It is responsible for rendering the start dropdown element in the component's JSX. */
     this.renderStartDropdown = () => {
       return (h("vega-time-picker-dropdown", { class: {
           'vega-time-picker-dropdown start-dropdown': true,
           /* istanbul ignore next */
           'mobile': this.isMobileDevice,
+          'tablet': this.isTabletDevice,
         }, ref: (e) => (this.startDropdown = e) },
         h("div", { class: "vega-time-picker-dropdown-container", ref: (e) => (this.startDropdownContainer = e) },
           h("div", { class: "vega-time-picker-dropdown-panel" }, this.renderDropdownList('start')))));
@@ -31,6 +33,7 @@ export class VegaTimePickerRangeDropdownRenderer extends VegaSlimmer {
           'vega-time-picker-dropdown end-dropdown': true,
           /* istanbul ignore next */
           'mobile': this.isMobileDevice,
+          'tablet': this.isTabletDevice,
         }, ref: (e) => (this.endDropdown = e) },
         h("div", { class: "vega-time-picker-dropdown-container", ref: (e) => (this.endDropdownContainer = e) },
           h("div", { class: "vega-time-picker-dropdown-panel" }, this.renderDropdownList('end')))));

package/dist/collection/components/vega-time-picker/slimmers/renderers/vega-time-picker-single-dropdown-renderer.js

@@ -16,6 +16,7 @@ export class VegaTimePickerSingleDropdownRenderer extends VegaSlimmer {
   constructor() {
     super(...arguments);
     this.isMobileDevice = getDeviceType() === DeviceType.MOBILE;
+    this.isTabletDevice = getDeviceType() === DeviceType.TABLET;
     this.renderDropdownByTimeSource = () => {
       return (h(Fragment, null,
         this.renderDropdownColumn(this.dropdownSource.hours, 'hour'),
@@ -80,6 +81,7 @@ export class VegaTimePickerSingleDropdownRenderer extends VegaSlimmer {
         'vega-time-picker-dropdown': true,
         /* istanbul ignore next */
         'mobile': this.isMobileDevice,
+        'tablet': this.isTabletDevice,
       }, ref: (e) => (this.dropdown = e) },
       h("div", { class: "vega-time-picker-dropdown-container", ref: (e) => (this.dropdownContainer = e) },
         h("div", { class: "vega-time-picker-dropdown-panel" }, this.renderDropdownByTimeSource()),

package/dist/collection/components/vega-time-picker/vega-time-picker-dropdown/vega-time-picker-dropdown.css

@@ -43,7 +43,8 @@
   overflow-y: auto;
 }
 
-:host(.mobile) .vega-time-picker-dropdown-panel > ul {
+:host(.mobile) .vega-time-picker-dropdown-panel > ul,
+:host(.tablet) .vega-time-picker-dropdown-panel > ul {
   overflow-y: auto;
   overflow-x: hidden;
 }

package/dist/collection/components/vega-time-picker/vega-time-picker.js

@@ -90,6 +90,7 @@ export class VegaTimePicker {
     this.changeEventEmitter = createEventEmitSlimmer(VegaTimePicker, VegaChange);
     this.vegaComponentUsageRuntimeMetricsSlimmer = new VegaComponentUsageRuntimeMetricsSlimmer(VegaTimePickerRuntimeMetricsPayloadDefinition);
     this.isMobileDevice = getDeviceType() === DeviceType.MOBILE;
+    this.isTabletDevice = getDeviceType() === DeviceType.TABLET;
     /** dropdown source */
     this.dropdownSource = {
       hours: [],
@@ -220,13 +221,17 @@ export class VegaTimePicker {
         disabled: this.disabled,
       } },
       this.labelRenderer.render(),
-      h("div", { class: {
-          'vega-time-picker-input-container': true,
-          'range-mode': isRangeMode,
-          'mobile': isRangeMode && this.isMobileDevice,
-        }, ref: (node) => (this.inputContainerRef = node) }, isRangeMode ? this.rangeInputRenderer.render() : this.singleInputRenderer.render()),
+      h("div", { class: this.getTimePickerClass(isRangeMode), ref: (node) => (this.inputContainerRef = node) }, isRangeMode ? this.rangeInputRenderer.render() : this.singleInputRenderer.render()),
       isRangeMode ? this.rangeDropdownRenderer.render() : this.singleDropdownRenderer.render()), this.host);
   }
+  getTimePickerClass(isRangeMode) {
+    return {
+      'vega-time-picker-input-container': true,
+      'range-mode': isRangeMode,
+      'mobile': isRangeMode && this.isMobileDevice,
+      'tablet': isRangeMode && this.isTabletDevice,
+    };
+  }
   static get is() { return "vega-time-picker"; }
   static get encapsulation() { return "shadow"; }
   static get originalStyleUrls() { return {

package/dist/collection/helpers/translation/locales/en.js

@@ -73,5 +73,39 @@ export const staticTranslations = {
   'Start Time': 'Start Time',
   'End Time': 'End Time',
   'There is no data to display': 'There is no data to display',
+  'Text Styles': 'Text Styles',
+  'Bold': 'Bold',
+  'Italic': 'Italic',
+  'Underline': 'Underline',
+  'Strikethrough': 'Strikethrough',
+  'Code': 'Code',
+  'Text Color': 'Text Color',
+  'Left Align': 'Left Align',
+  'Center Align': 'Center Align',
+  'Right Align': 'Right Align',
+  'Justified': 'Justified',
+  'Bullets': 'Bullets',
+  'Numbers': 'Numbers',
+  'More Indent': 'More Indent',
+  'Less Indent': 'Less Indent',
+  'Link': 'Link',
+  'Image': 'Image',
+  'Clear Style': 'Clear Style',
+  'URL': 'URL',
+  'Text': 'Text',
+  'Edit': 'Edit',
+  'Unlink': 'Unlink',
+  'Size': 'Size',
+  'Alt Text': 'Alt Text',
+  'Delete Image': 'Delete Image',
+  'Sm': 'Sm',
+  'Md': 'Md',
+  'Lg': 'Lg',
+  'Title': 'Title',
+  'Subtitle': 'Subtitle',
+  'Heading 1': 'Heading 1',
+  'Heading 2': 'Heading 2',
+  'Heading 3': 'Heading 3',
+  'Paragraph': 'Paragraph',
 };
 export default staticTranslations;

package/dist/collection/helpers/translation/tests/internal-translation-controller.test.js

@@ -163,6 +163,40 @@ describe('VegaTranslationController', () => {
       'Start Time': 'Start Time',
       'End Time': 'End Time',
       'There is no data to display': 'There is no data to display',
+      'Text Styles': 'Text Styles',
+      'Bold': 'Bold',
+      'Italic': 'Italic',
+      'Underline': 'Underline',
+      'Strikethrough': 'Strikethrough',
+      'Code': 'Code',
+      'Text Color': 'Text Color',
+      'Left Align': 'Left Align',
+      'Center Align': 'Center Align',
+      'Right Align': 'Right Align',
+      'Justified': 'Justified',
+      'Bullets': 'Bullets',
+      'Numbers': 'Numbers',
+      'More Indent': 'More Indent',
+      'Less Indent': 'Less Indent',
+      'Link': 'Link',
+      'Image': 'Image',
+      'Clear Style': 'Clear Style',
+      'URL': 'URL',
+      'Text': 'Text',
+      'Edit': 'Edit',
+      'Unlink': 'Unlink',
+      'Size': 'Size',
+      'Alt Text': 'Alt Text',
+      'Delete Image': 'Delete Image',
+      'Sm': 'Sm',
+      'Md': 'Md',
+      'Lg': 'Lg',
+      'Title': 'Title',
+      'Subtitle': 'Subtitle',
+      'Heading 1': 'Heading 1',
+      'Heading 2': 'Heading 2',
+      'Heading 3': 'Heading 3',
+      'Paragraph': 'Paragraph',
     });
     /* eslint-enable @typescript-eslint/naming-convention,spellcheck/spell-checker */
   });

package/dist/esm/{app-globals-e6203355.js → app-globals-6a7d90a9.js}

@@ -6,7 +6,7 @@ import { v as vegaEnvManager } from './vega-env-manager-8f8dc473.js';
 import { V as VegaIconManager } from './icon-manager-638dd4d4.js';
 import './wait-for-vega-handler-b18eb955.js';
 import './ui-ed1283bb.js';
-import { V as VegaInternalTranslation, a as VegaTranslation, s as staticTranslations } from './translation-fd7a290a.js';
+import { V as VegaInternalTranslation, a as VegaTranslation, s as staticTranslations } from './translation-4bed3392.js';
 import { T as TypographyUrls } from './typography-396de03f.js';
 import { V as ValidCreditCardNumberRule } from './valid-credit-card-number-rule-cc497bec.js';
 import { w as waitForVega } from './index-707fec53.js';