@globalpayments/vega 2.29.0 → 2.30.0

package/dist/esm/vega-chip.entry.js

@@ -8,9 +8,9 @@ import { g as getCurrentBreakpoint } from './breakpoints-36a3ed69.js';
 import { I as InjectVegaSlimmer } from './global-slimmer-registry-17c4efd4.js';
 import { V as VegaComponentUsageRuntimeMetricsSlimmer, I as InjectVegaGlobalSlimmer } from './component-usage-runtime-metrics-b3f6ac79.js';
 import { P as PageResizeObserverSlimmer } from './page-resize-observer-slimmer-994c1e1b.js';
-import { c as createEventEmitSlimmer } from './event-emit-slimmer-cb9d6f6c.js';
-import { a as VegaClick, c as VegaClose } from './vega-event-id-7465a011.js';
-import { C as ChildNodesEventPreventSlimmer } from './child-nodes-event-prevent-slimmer-4ecbc8aa.js';
+import { c as createEventEmitSlimmer } from './event-emit-slimmer-44cb4573.js';
+import { a as VegaClick, c as VegaClose } from './vega-event-id-b1655cbc.js';
+import { C as ChildNodesEventPreventSlimmer } from './child-nodes-event-prevent-slimmer-db288af1.js';
 import './type-guard-63caf78b.js';
 import './ui-8424715a.js';
 import './regex-dfe11abf.js';
@@ -22,9 +22,9 @@ import './dynamic-slimmer-90b8af32.js';
 import './change-manager-6a7eb88c.js';
 import './dom-node-subject-observer-factory-9461cd67.js';
 import './observer-3959f9dd.js';
-import './internal-vega-event-manager-1ebfd1eb.js';
+import './internal-vega-event-manager-8154661e.js';
 import './vega-env-manager-8f8dc473.js';
-import './feature-flag-controller-10780eeb.js';
+import './feature-flag-controller-297c4b9b.js';
 import './index-0863eec6.js';
 
 const VegaChipRuntimeMetricsPayloadDefinition = [

package/dist/esm/vega-color-picker.entry.js

@@ -2,14 +2,14 @@ import { r as registerInstance, c as createEvent, h, H as Host, g as getElement
 import { R as RequiredFieldRule } from './required-field-rule-5da360cc.js';
 import { c as createEnterKeyHandlerToTriggerClick } from './accessibility-e5fd0fab.js';
 import { s as sanitizeVegaComponent } from './component-cae24190.js';
-import { h as hexToRGB, b as getHexFromShorthand } from './ui-0132dbb5.js';
+import { a as arrayToClassString, h as hexToRGB, b as getHexFromShorthand } from './ui-0132dbb5.js';
 import { F as FormFieldControllerSlimmer } from './form-field-controller-slimmer-a64c679c.js';
 import { I as InjectVegaSlimmer } from './global-slimmer-registry-17c4efd4.js';
 import { V as VegaComponentUsageRuntimeMetricsSlimmer, I as InjectVegaGlobalSlimmer } from './component-usage-runtime-metrics-b3f6ac79.js';
 import { b as FORM_ELEMENT_VALUE_CHANGE } from './static-subject-title-500cf2a3.js';
-import { c as createEventEmitSlimmer } from './event-emit-slimmer-cb9d6f6c.js';
+import { c as createEventEmitSlimmer } from './event-emit-slimmer-44cb4573.js';
 import { C as ChangeManager } from './change-manager-6a7eb88c.js';
-import { e as VegaChange } from './vega-event-id-7465a011.js';
+import { e as VegaChange } from './vega-event-id-b1655cbc.js';
 import './string-be824360.js';
 import './observer-3959f9dd.js';
 import './create-public-api-runtime-metrics-slimmer-cc1164bb.js';
@@ -24,7 +24,7 @@ import './mutation-observer-slimmer-6cef9549.js';
 import './mutation-observer-filters-1035b064.js';
 import './array-b668466e.js';
 import './number-4398f2e1.js';
-import './internal-vega-event-manager-1ebfd1eb.js';
+import './internal-vega-event-manager-8154661e.js';
 
 const VegaColorPickerRuntimeMetricsPayloadDefinition = [
   {
@@ -53,7 +53,7 @@ const VegaColorPickerRuntimeMetricsPayloadDefinition = [
   },
 ];
 
-const vegaColorPickerCss = ":host{display:inline-block;text-align:left;line-height:normal}:host vega-field-label{margin-bottom:8px}:host(.disabled) .color-picker-container{background-color:rgba(var(--v-bg-secondary, 245, 247, 247, 1));border:1px solid rgba(var(--v-border-input-field-disabled, 222, 225, 227, 1))}.color-picker-container-items:hover{box-shadow:0 0 0 4px rgba(var(--v-ring-input-focus, 19, 98, 226, 0.25))}.color-picker-container-items:focus-within{box-shadow:0 0 0 4px rgba(var(--v-ring-input-focus, 19, 98, 226, 0.25))}:host(.disabled) .color-picker-container-items:hover{box-shadow:none}:host(.disabled) .color-picker-container-items:focus-within{box-shadow:none}:host .color-picker-container{border:1px solid rgba(var(--v-border-input-field, 171, 198, 216, 1));border-radius:8px;background-color:rgba(var(--v-bg-primary, 252, 252, 252, 1));padding:12px;max-width:max-content}:host .color-picker-container-items{display:flex;border:1px solid rgba(var(--v-border-chip, 205, 209, 211, 1));border-radius:4px;width:24px;height:24px;cursor:pointer;align-items:center;justify-content:center}:host .checkmark-black{color:rgba(var(--v-text-black, 32, 54, 69, 1))}:host .checkmark-white{color:rgba(var(--v-text-white, 252, 252, 252, 1))}:host vega-text{padding-left:8px;padding-right:8px;padding-top:4px;font-family:\"Inter\", sans-serif;font-size:14px;font-weight:400;line-height:18px;letter-spacing:0px;color:rgba(var(--v-text-secondary, 107, 116, 125, 1))}@media screen and (min-width: 768px) and (max-width: 1023px){:host vega-text{font-family:\"Inter\", sans-serif;font-size:14px;font-weight:400;line-height:18px;letter-spacing:0px}}@media screen and (min-width: 1024px) and (max-width: 1439px){:host vega-text{font-family:\"Inter\", sans-serif;font-size:14px;font-weight:400;line-height:18px;letter-spacing:0px}}@media screen and (min-width: 1440px) and (max-width: 9999px){:host vega-text{font-family:\"Inter\", sans-serif;font-size:14px;font-weight:400;line-height:18px;letter-spacing:0px}}:host .vega-error{display:inline-block;padding-left:8px;padding-right:8px;padding-top:8px;font-family:\"Inter\", sans-serif;font-size:14px;font-weight:400;line-height:18px;letter-spacing:0px;color:rgba(var(--v-text-error, 189, 41, 71, 1))}@media screen and (min-width: 768px) and (max-width: 1023px){:host .vega-error{font-family:\"Inter\", sans-serif;font-size:14px;font-weight:400;line-height:18px;letter-spacing:0px}}@media screen and (min-width: 1024px) and (max-width: 1439px){:host .vega-error{font-family:\"Inter\", sans-serif;font-size:14px;font-weight:400;line-height:18px;letter-spacing:0px}}@media screen and (min-width: 1440px) and (max-width: 9999px){:host .vega-error{font-family:\"Inter\", sans-serif;font-size:14px;font-weight:400;line-height:18px;letter-spacing:0px}}:host .color-picker-container.error{border:1px solid rgba(var(--v-border-input-field-danger, 230, 50, 87, 1))}:host .vega-hidden{display:none}:host vega-flex{flex-wrap:wrap;max-width:264px}";
+const vegaColorPickerCss = ":host{display:inline-block;text-align:left;line-height:normal}:host vega-field-label{margin-bottom:8px}:host(.disabled) .color-picker-inline{background-color:rgba(var(--v-bg-secondary, 245, 247, 247, 1));border:1px solid rgba(var(--v-border-input-field-disabled, 222, 225, 227, 1))}.color-picker-inline-items:hover{box-shadow:0 0 0 4px rgba(var(--v-ring-input-focus, 19, 98, 226, 0.25))}.color-picker-inline-items:focus-within{box-shadow:0 0 0 4px rgba(var(--v-ring-input-focus, 19, 98, 226, 0.25))}:host(.disabled) .color-picker-inline-items:hover{box-shadow:none}:host(.disabled) .color-picker-inline-items:focus-within{box-shadow:none}:host .color-picker-inline{border:1px solid rgba(var(--v-border-input-field, 171, 198, 216, 1));border-radius:8px;background-color:rgba(var(--v-bg-primary, 252, 252, 252, 1));padding:12px;max-width:max-content}:host .color-picker-inline-items{display:flex;border:1px solid rgba(var(--v-border-chip, 205, 209, 211, 1));border-radius:4px;width:24px;height:24px;cursor:pointer;align-items:center;justify-content:center}:host .checkmark-black{color:rgba(var(--v-text-black, 32, 54, 69, 1))}:host .checkmark-white{color:rgba(var(--v-text-white, 252, 252, 252, 1))}:host vega-text{padding-left:8px;padding-right:8px;padding-top:4px;font-family:\"Inter\", sans-serif;font-size:14px;font-weight:400;line-height:18px;letter-spacing:0px;color:rgba(var(--v-text-secondary, 107, 116, 125, 1))}@media screen and (min-width: 768px) and (max-width: 1023px){:host vega-text{font-family:\"Inter\", sans-serif;font-size:14px;font-weight:400;line-height:18px;letter-spacing:0px}}@media screen and (min-width: 1024px) and (max-width: 1439px){:host vega-text{font-family:\"Inter\", sans-serif;font-size:14px;font-weight:400;line-height:18px;letter-spacing:0px}}@media screen and (min-width: 1440px) and (max-width: 9999px){:host vega-text{font-family:\"Inter\", sans-serif;font-size:14px;font-weight:400;line-height:18px;letter-spacing:0px}}:host .vega-error{display:inline-block;padding-left:8px;padding-right:8px;padding-top:8px;font-family:\"Inter\", sans-serif;font-size:14px;font-weight:400;line-height:18px;letter-spacing:0px;color:rgba(var(--v-text-error, 189, 41, 71, 1))}@media screen and (min-width: 768px) and (max-width: 1023px){:host .vega-error{font-family:\"Inter\", sans-serif;font-size:14px;font-weight:400;line-height:18px;letter-spacing:0px}}@media screen and (min-width: 1024px) and (max-width: 1439px){:host .vega-error{font-family:\"Inter\", sans-serif;font-size:14px;font-weight:400;line-height:18px;letter-spacing:0px}}@media screen and (min-width: 1440px) and (max-width: 9999px){:host .vega-error{font-family:\"Inter\", sans-serif;font-size:14px;font-weight:400;line-height:18px;letter-spacing:0px}}:host .color-picker-inline.error{border:1px solid rgba(var(--v-border-input-field-danger, 230, 50, 87, 1))}:host .vega-hidden{display:none}:host vega-flex{flex-wrap:wrap;max-width:264px}";
 
 var __decorate = (undefined && undefined.__decorate) || function (decorators, target, key, desc) {
   var c = arguments.length, r = c < 3 ? target : desc === null ? desc = Object.getOwnPropertyDescriptor(target, key) : desc, d;
@@ -160,8 +160,14 @@ const VegaColorPicker = class {
       '#259F9F',
       '#563D82',
     ];
+    /**
+     * Specifies whether the color picker is inline with container styles, including a border, background color, and padding.
+     *
+     * @vegaVersion 2.30.0
+     */
+    this.isInline = false;
     this.renderColorPickerContainer = () => {
-      return (h("div", { class: "color-picker-container", ref: (e) => (this.colorPickerContainerRef = e) }, h("vega-flex", { direction: "row", gap: "size-8" }, this.colors.map((color) => (h("div", { id: color, class: "color-picker-container-items", ref: (e) => (this.colorPickerTouchableAreaRef = e), style: {
+      return (h("div", { class: arrayToClassString([!this.isInline ? 'color-picker-inline' : null]), ref: (e) => (this.colorPickerContainerRef = e) }, h("vega-flex", { direction: "row", gap: "size-8" }, this.colors.map((color) => (h("div", { id: color, class: "color-picker-inline-items", ref: (e) => (this.colorPickerTouchableAreaRef = e), style: {
           backgroundColor: color,
         }, onClick: this.updateValueProp, role: 'button', tabIndex: 0, "aria-label": "color", onKeyDown: createEnterKeyHandlerToTriggerClick() }, this.value === color ? (h("vega-icon", { icon: "checkmark", size: "size-16", class: {
           'v-text-black': this.isDarkColorCheckmark(this.value),