@vonage/vivid 5.2.0 → 5.3.0

package/custom-elements.json

@@ -7285,6 +7285,806 @@
         }
       ]
     },
+    {
+      "kind": "javascript-module",
+      "path": "src/lib/color-picker/color-picker.ts",
+      "declarations": [
+        {
+          "kind": "variable",
+          "name": "VC_HEX_PICKER_TAG",
+          "type": {
+            "text": "string"
+          },
+          "default": "'vvd-hex-picker'"
+        },
+        {
+          "kind": "variable",
+          "name": "VC_HEX_INPUT_TAG",
+          "type": {
+            "text": "string"
+          },
+          "default": "'vvd-hex-input'"
+        },
+        {
+          "kind": "class",
+          "description": "",
+          "name": "VvdHexPicker",
+          "members": [
+            {
+              "kind": "field",
+              "name": "displayName",
+              "type": {
+                "text": "string"
+              },
+              "static": true,
+              "default": "'VvdHexPicker'",
+              "readonly": true
+            }
+          ],
+          "superclass": {
+            "name": "HexColorPicker",
+            "package": "vanilla-colorful/hex-color-picker.js"
+          },
+          "tagName": "VC_HEX_PICKER_TAG",
+          "customElement": true
+        },
+        {
+          "kind": "class",
+          "description": "",
+          "name": "VvdHexInput",
+          "members": [
+            {
+              "kind": "field",
+              "name": "displayName",
+              "type": {
+                "text": "string"
+              },
+              "static": true,
+              "default": "'VvdHexInput'",
+              "readonly": true
+            }
+          ],
+          "superclass": {
+            "name": "HexInput",
+            "package": "vanilla-colorful/hex-input.js"
+          },
+          "tagName": "VC_HEX_INPUT_TAG",
+          "customElement": true
+        },
+        {
+          "kind": "variable",
+          "name": "vcPickerTag",
+          "default": "VC_HEX_PICKER_TAG"
+        },
+        {
+          "kind": "variable",
+          "name": "vcInputTag",
+          "default": "VC_HEX_INPUT_TAG"
+        },
+        {
+          "kind": "class",
+          "description": "",
+          "name": "ColorPicker",
+          "slots": [
+            {
+              "description": "Describes how to use the text-field. Alternative to the `helper-text` attribute.",
+              "name": "helper-text"
+            },
+            {
+              "description": "Overrides the default \"Color Picker\" title of the Popup window.",
+              "name": "popup-text"
+            },
+            {
+              "description": " Overrides the default \"Saved colors:\" text above color swatches.",
+              "name": "swatches-text"
+            }
+          ],
+          "members": [
+            {
+              "kind": "field",
+              "name": "placeholder",
+              "type": {
+                "text": "string"
+              },
+              "description": "Sets the placeholder value of the element, generally used to provide a hint to the user.",
+              "privacy": "public"
+            },
+            {
+              "kind": "field",
+              "name": "savedColorsKey",
+              "type": {
+                "text": "string | undefined"
+              },
+              "description": "Sets the localStorage saved colors key explicitly.",
+              "privacy": "public"
+            },
+            {
+              "kind": "field",
+              "name": "disableSavedColors",
+              "type": {
+                "text": "boolean"
+              },
+              "default": "false",
+              "description": "Disables the saving colors functionality",
+              "privacy": "public"
+            },
+            {
+              "kind": "field",
+              "name": "maxSwatches",
+              "type": {
+                "text": "number"
+              },
+              "default": "6",
+              "description": "Limits number of swatches that can be saved.",
+              "privacy": "public"
+            },
+            {
+              "kind": "field",
+              "name": "#iconResetTimer",
+              "privacy": "private",
+              "type": {
+                "text": "ReturnType<typeof setTimeout> | null"
+              },
+              "default": "null"
+            },
+            {
+              "kind": "field",
+              "name": "helperText",
+              "type": {
+                "text": "string | undefined"
+              },
+              "description": "Provides additional information to help the user enter the correct information.\nTo add HTML to the helper text, use the helper-text slot instead.",
+              "privacy": "public",
+              "inheritedFrom": {
+                "name": "WithFeedback",
+                "module": "src/shared/feedback/mixins.ts"
+              }
+            },
+            {
+              "kind": "field",
+              "name": "errorText",
+              "type": {
+                "text": "string | undefined"
+              },
+              "description": "Provides a custom error message. Any current error state will be overridden.",
+              "privacy": "public",
+              "inheritedFrom": {
+                "name": "WithErrorText",
+                "module": "src/shared/patterns/form-elements/with-error-text.ts"
+              }
+            },
+            {
+              "kind": "field",
+              "name": "#blockValidateCalls",
+              "privacy": "private",
+              "type": {
+                "text": "boolean"
+              },
+              "default": "false",
+              "inheritedFrom": {
+                "name": "WithErrorText",
+                "module": "src/shared/patterns/form-elements/with-error-text.ts"
+              }
+            },
+            {
+              "kind": "field",
+              "name": "#originalValidateFn",
+              "privacy": "private",
+              "type": {
+                "text": "() => void"
+              },
+              "inheritedFrom": {
+                "name": "WithErrorText",
+                "module": "src/shared/patterns/form-elements/with-error-text.ts"
+              }
+            },
+            {
+              "kind": "method",
+              "name": "#forceCustomError",
+              "parameters": [
+                {
+                  "name": "errorMessage",
+                  "type": {
+                    "text": "string"
+                  }
+                }
+              ],
+              "inheritedFrom": {
+                "name": "WithErrorText",
+                "module": "src/shared/patterns/form-elements/with-error-text.ts"
+              }
+            },
+            {
+              "kind": "method",
+              "name": "#clearCustomErrorAndRevalidate",
+              "inheritedFrom": {
+                "name": "WithErrorText",
+                "module": "src/shared/patterns/form-elements/with-error-text.ts"
+              }
+            },
+            {
+              "kind": "field",
+              "name": "validate",
+              "inheritedFrom": {
+                "name": "WithErrorText",
+                "module": "src/shared/patterns/form-elements/with-error-text.ts"
+              }
+            },
+            {
+              "kind": "field",
+              "name": "successText",
+              "type": {
+                "text": "string | undefined"
+              },
+              "description": "Provides a custom success message. Any current error state will be overridden.",
+              "privacy": "public",
+              "inheritedFrom": {
+                "name": "WithSuccessText",
+                "module": "src/shared/patterns/form-elements/with-success-text.ts"
+              }
+            },
+            {
+              "kind": "field",
+              "name": "_vividAriaBehaviour",
+              "default": "'delegate'",
+              "type": {
+                "text": "'delegate'"
+              },
+              "inheritedFrom": {
+                "name": "DelegatesAria",
+                "module": "src/shared/aria/delegates-aria.ts"
+              }
+            },
+            {
+              "kind": "field",
+              "name": "open",
+              "type": {
+                "text": "boolean"
+              },
+              "default": "false",
+              "description": "Indicates whether the popup is open",
+              "privacy": "public",
+              "inheritedFrom": {
+                "name": "BaseColorPicker",
+                "module": "src/shared/color-picker/base-color-picker.ts"
+              }
+            },
+            {
+              "kind": "field",
+              "name": "swatches",
+              "type": {
+                "text": "ColorSwatch[]"
+              },
+              "default": "[]",
+              "description": "List of color swatches, has to be an array of objects\n\n### Examples",
+              "privacy": "public",
+              "inheritedFrom": {
+                "name": "BaseColorPicker",
+                "module": "src/shared/color-picker/base-color-picker.ts"
+              }
+            },
+            {
+              "kind": "field",
+              "name": "label",
+              "type": {
+                "text": "string | undefined"
+              },
+              "description": "The label for the form element.",
+              "inheritedFrom": {
+                "name": "FormElement",
+                "module": "src/shared/patterns/form-elements/form-element.ts"
+              }
+            },
+            {
+              "kind": "field",
+              "name": "#handleInvalidEvent",
+              "privacy": "private",
+              "inheritedFrom": {
+                "name": "FormElement",
+                "module": "src/shared/patterns/form-elements/form-element.ts"
+              }
+            },
+            {
+              "kind": "field",
+              "name": "validity",
+              "type": {
+                "text": "ValidityState"
+              },
+              "description": "Returns the validity state of the element",
+              "readonly": true,
+              "inheritedFrom": {
+                "name": "FormAssociated",
+                "module": "src/shared/foundation/form-associated/form-associated.ts"
+              }
+            },
+            {
+              "kind": "field",
+              "name": "form",
+              "type": {
+                "text": "HTMLFormElement | null"
+              },
+              "description": "Retrieve a reference to the associated form.\nReturns null if not associated to any form.",
+              "readonly": true,
+              "inheritedFrom": {
+                "name": "FormAssociated",
+                "module": "src/shared/foundation/form-associated/form-associated.ts"
+              }
+            },
+            {
+              "kind": "field",
+              "name": "validationMessage",
+              "type": {
+                "text": "string"
+              },
+              "description": "Retrieve the localized validation message,\nor custom validation message if set.",
+              "readonly": true,
+              "inheritedFrom": {
+                "name": "FormAssociated",
+                "module": "src/shared/foundation/form-associated/form-associated.ts"
+              }
+            },
+            {
+              "kind": "field",
+              "name": "willValidate",
+              "type": {
+                "text": "boolean"
+              },
+              "description": "Whether the element will be validated when the\nform is submitted",
+              "readonly": true,
+              "inheritedFrom": {
+                "name": "FormAssociated",
+                "module": "src/shared/foundation/form-associated/form-associated.ts"
+              }
+            },
+            {
+              "kind": "field",
+              "name": "labels",
+              "type": {
+                "text": "ReadonlyArray<Node>"
+              },
+              "description": "A reference to all associated label elements",
+              "readonly": true,
+              "inheritedFrom": {
+                "name": "FormAssociated",
+                "module": "src/shared/foundation/form-associated/form-associated.ts"
+              }
+            },
+            {
+              "kind": "field",
+              "name": "value",
+              "type": {
+                "text": "string"
+              },
+              "description": "The current value of the element.",
+              "inheritedFrom": {
+                "name": "FormAssociated",
+                "module": "src/shared/foundation/form-associated/form-associated.ts"
+              }
+            },
+            {
+              "kind": "field",
+              "name": "currentValue",
+              "inheritedFrom": {
+                "name": "FormAssociated",
+                "module": "src/shared/foundation/form-associated/form-associated.ts"
+              }
+            },
+            {
+              "kind": "field",
+              "name": "initialValue",
+              "type": {
+                "text": "string"
+              },
+              "description": "The default value of the element. This value sets the `value` property\nonly when the `value` property has not been explicitly set.",
+              "inheritedFrom": {
+                "name": "FormAssociated",
+                "module": "src/shared/foundation/form-associated/form-associated.ts"
+              }
+            },
+            {
+              "kind": "field",
+              "name": "disabled",
+              "type": {
+                "text": "boolean"
+              },
+              "default": "false",
+              "description": "Sets the element's disabled state. A disabled element will not be included during form submission.",
+              "inheritedFrom": {
+                "name": "FormAssociated",
+                "module": "src/shared/foundation/form-associated/form-associated.ts"
+              }
+            },
+            {
+              "kind": "field",
+              "name": "name",
+              "type": {
+                "text": "string"
+              },
+              "description": "The name of the element. This element's value will be surfaced during form submission under the provided name.",
+              "inheritedFrom": {
+                "name": "FormAssociated",
+                "module": "src/shared/foundation/form-associated/form-associated.ts"
+              }
+            },
+            {
+              "kind": "field",
+              "name": "required",
+              "type": {
+                "text": "boolean"
+              },
+              "description": "Require the field to be completed prior to form submission.",
+              "default": "false",
+              "inheritedFrom": {
+                "name": "FormAssociated",
+                "module": "src/shared/foundation/form-associated/form-associated.ts"
+              }
+            },
+            {
+              "kind": "method",
+              "name": "checkValidity",
+              "return": {
+                "type": {
+                  "text": "boolean"
+                }
+              },
+              "description": "Return the current validity of the element.",
+              "inheritedFrom": {
+                "name": "FormAssociated",
+                "module": "src/shared/foundation/form-associated/form-associated.ts"
+              }
+            },
+            {
+              "kind": "method",
+              "name": "reportValidity",
+              "return": {
+                "type": {
+                  "text": "boolean"
+                }
+              },
+              "description": "Return the current validity of the element.\nIf false, fires an invalid event at the element.",
+              "inheritedFrom": {
+                "name": "FormAssociated",
+                "module": "src/shared/foundation/form-associated/form-associated.ts"
+              }
+            },
+            {
+              "kind": "field",
+              "name": "VIVID_VERSION",
+              "static": true,
+              "default": "__PACKAGE_VERSION__",
+              "description": "The current version of the Vivid library, which is useful for debugging.\nIt can be accessed from any Vivid element via `<el>.constructor.VIVID_VERSION`.",
+              "type": {
+                "text": "string"
+              },
+              "inheritedFrom": {
+                "name": "VividElement",
+                "module": "src/shared/foundation/vivid-element/vivid-element.ts"
+              }
+            },
+            {
+              "kind": "field",
+              "name": "componentName",
+              "type": {
+                "text": "string"
+              },
+              "static": true,
+              "description": "Core component name, without prefix",
+              "inheritedFrom": {
+                "name": "VividElement",
+                "module": "src/shared/foundation/vivid-element/vivid-element.ts"
+              }
+            }
+          ],
+          "events": [
+            {
+              "type": {
+                "text": "CustomEvent<undefined>"
+              },
+              "description": "Fires when the value changes",
+              "name": "change"
+            }
+          ],
+          "attributes": [
+            {
+              "name": "placeholder",
+              "type": {
+                "text": "string"
+              },
+              "description": "Sets the placeholder value of the element, generally used to provide a hint to the user.",
+              "fieldName": "placeholder"
+            },
+            {
+              "name": "saved-colors-key",
+              "type": {
+                "text": "string | undefined"
+              },
+              "description": "Sets the localStorage saved colors key explicitly.",
+              "fieldName": "savedColorsKey"
+            },
+            {
+              "name": "disable-saved-colors",
+              "type": {
+                "text": "boolean"
+              },
+              "default": "false",
+              "description": "Disables the saving colors functionality",
+              "fieldName": "disableSavedColors"
+            },
+            {
+              "name": "max-swatches",
+              "type": {
+                "text": "number"
+              },
+              "default": "6",
+              "description": "Limits number of swatches that can be saved.",
+              "fieldName": "maxSwatches"
+            },
+            {
+              "name": "helper-text",
+              "type": {
+                "text": "string | undefined"
+              },
+              "description": "Provides additional information to help the user enter the correct information.\nTo add HTML to the helper text, use the helper-text slot instead.",
+              "fieldName": "helperText",
+              "inheritedFrom": {
+                "name": "WithFeedback",
+                "module": "src/shared/feedback/mixins.ts"
+              }
+            },
+            {
+              "name": "error-text",
+              "type": {
+                "text": "string | undefined"
+              },
+              "description": "Provides a custom error message. Any current error state will be overridden.",
+              "fieldName": "errorText",
+              "inheritedFrom": {
+                "name": "WithErrorText",
+                "module": "src/shared/patterns/form-elements/with-error-text.ts"
+              }
+            },
+            {
+              "name": "success-text",
+              "type": {
+                "text": "string | undefined"
+              },
+              "description": "Provides a custom success message. Any current error state will be overridden.",
+              "fieldName": "successText",
+              "inheritedFrom": {
+                "name": "WithSuccessText",
+                "module": "src/shared/patterns/form-elements/with-success-text.ts"
+              }
+            },
+            {
+              "name": "open",
+              "type": {
+                "text": "boolean"
+              },
+              "default": "false",
+              "description": "Indicates whether the popup is open",
+              "fieldName": "open",
+              "inheritedFrom": {
+                "name": "BaseColorPicker",
+                "module": "src/shared/color-picker/base-color-picker.ts"
+              }
+            },
+            {
+              "name": "label",
+              "type": {
+                "text": "string | undefined"
+              },
+              "description": "The label for the form element.",
+              "fieldName": "label",
+              "inheritedFrom": {
+                "name": "FormElement",
+                "module": "src/shared/patterns/form-elements/form-element.ts"
+              }
+            },
+            {
+              "name": "current-value",
+              "type": {
+                "text": "string"
+              },
+              "description": "The current value of the element.",
+              "fieldName": "value",
+              "inheritedFrom": {
+                "name": "FormAssociated",
+                "module": "src/shared/foundation/form-associated/form-associated.ts"
+              }
+            },
+            {
+              "name": "value",
+              "type": {
+                "text": "string"
+              },
+              "description": "The default value of the element. This value sets the `value` property\nonly when the `value` property has not been explicitly set.",
+              "fieldName": "initialValue",
+              "inheritedFrom": {
+                "name": "FormAssociated",
+                "module": "src/shared/foundation/form-associated/form-associated.ts"
+              }
+            },
+            {
+              "name": "disabled",
+              "type": {
+                "text": "boolean"
+              },
+              "default": "false",
+              "description": "Sets the element's disabled state. A disabled element will not be included during form submission.",
+              "fieldName": "disabled",
+              "inheritedFrom": {
+                "name": "FormAssociated",
+                "module": "src/shared/foundation/form-associated/form-associated.ts"
+              }
+            },
+            {
+              "name": "name",
+              "type": {
+                "text": "string"
+              },
+              "description": "The name of the element. This element's value will be surfaced during form submission under the provided name.",
+              "fieldName": "name",
+              "inheritedFrom": {
+                "name": "FormAssociated",
+                "module": "src/shared/foundation/form-associated/form-associated.ts"
+              }
+            },
+            {
+              "name": "required",
+              "type": {
+                "text": "boolean"
+              },
+              "description": "Require the field to be completed prior to form submission.",
+              "default": "false",
+              "fieldName": "required",
+              "inheritedFrom": {
+                "name": "FormAssociated",
+                "module": "src/shared/foundation/form-associated/form-associated.ts"
+              }
+            }
+          ],
+          "mixins": [
+            {
+              "name": "WithContextualHelp",
+              "module": "/src/shared/patterns"
+            },
+            {
+              "name": "WithFeedback",
+              "module": "/src/shared/feedback/mixins"
+            },
+            {
+              "name": "WithErrorText",
+              "module": "/src/shared/patterns"
+            },
+            {
+              "name": "WithSuccessText",
+              "module": "/src/shared/patterns"
+            },
+            {
+              "name": "DelegatesAria",
+              "module": "/src/shared/aria/delegates-aria"
+            },
+            {
+              "name": "BaseColorPicker",
+              "module": "/src/shared/color-picker"
+            }
+          ],
+          "superclass": {
+            "name": "VividElement",
+            "module": "/src/shared/foundation/vivid-element/vivid-element"
+          },
+          "vividComponent": {
+            "public": true,
+            "name": "color-picker",
+            "vueModels": [
+              {
+                "name": "modelValue",
+                "propName": "value",
+                "eventNames": [
+                  "input"
+                ],
+                "valueMapping": "event.currentTarget.value"
+              }
+            ]
+          }
+        }
+      ],
+      "exports": [
+        {
+          "kind": "custom-element-definition",
+          "name": "VC_HEX_PICKER_TAG",
+          "declaration": {
+            "name": "VvdHexPicker",
+            "module": "src/lib/color-picker/color-picker.ts"
+          }
+        },
+        {
+          "kind": "custom-element-definition",
+          "name": "VC_HEX_INPUT_TAG",
+          "declaration": {
+            "name": "VvdHexInput",
+            "module": "src/lib/color-picker/color-picker.ts"
+          }
+        },
+        {
+          "kind": "js",
+          "name": "vcPickerTag",
+          "declaration": {
+            "name": "vcPickerTag",
+            "module": "src/lib/color-picker/color-picker.ts"
+          }
+        },
+        {
+          "kind": "js",
+          "name": "vcInputTag",
+          "declaration": {
+            "name": "vcInputTag",
+            "module": "src/lib/color-picker/color-picker.ts"
+          }
+        },
+        {
+          "kind": "js",
+          "name": "ColorPicker",
+          "declaration": {
+            "name": "ColorPicker",
+            "module": "src/lib/color-picker/color-picker.ts"
+          }
+        }
+      ]
+    },
+    {
+      "kind": "javascript-module",
+      "path": "src/lib/color-picker/definition.ts",
+      "declarations": [
+        {
+          "kind": "variable",
+          "name": "colorPickerDefinition"
+        },
+        {
+          "kind": "variable",
+          "name": "registerColorPicker",
+          "description": "Registers the color-picker element with the design system.",
+          "parameters": [
+            {
+              "description": "the prefix to use for the component name",
+              "name": "prefix"
+            }
+          ]
+        }
+      ],
+      "exports": [
+        {
+          "kind": "js",
+          "name": "colorPickerDefinition",
+          "declaration": {
+            "name": "colorPickerDefinition",
+            "module": "src/lib/color-picker/definition.ts"
+          }
+        },
+        {
+          "kind": "js",
+          "name": "registerColorPicker",
+          "declaration": {
+            "name": "registerColorPicker",
+            "module": "src/lib/color-picker/definition.ts"
+          }
+        },
+        {
+          "kind": "js",
+          "name": "VwcColorPickerElement",
+          "declaration": {
+            "name": "ColorPicker",
+            "module": "src/lib/color-picker/definition.ts"
+          }
+        }
+      ]
+    },
+    {
+      "kind": "javascript-module",
+      "path": "src/lib/color-picker/locale.ts",
+      "declarations": [],
+      "exports": []
+    },
     {
       "kind": "javascript-module",
       "path": "src/lib/combobox/combobox.options.ts",
@@ -8934,18 +9734,9 @@
             },
             {
               "kind": "field",
-              "name": "cellsRepeatBehavior",
-              "type": {
-                "text": "RepeatBehavior | null"
-              },
-              "privacy": "private",
-              "default": "null"
-            },
-            {
-              "kind": "field",
-              "name": "cellsPlaceholder",
+              "name": "behaviorOrchestrator",
               "type": {
-                "text": "Node | null"
+                "text": "ViewBehaviorOrchestrator | null"
               },
               "privacy": "private",
               "default": "null"
@@ -9423,18 +10214,9 @@
             },
             {
               "kind": "field",
-              "name": "rowsRepeatBehavior",
-              "type": {
-                "text": "RepeatBehavior | null"
-              },
-              "privacy": "private",
-              "default": "null"
-            },
-            {
-              "kind": "field",
-              "name": "rowsPlaceholder",
+              "name": "behaviorOrchestrator",
               "type": {
-                "text": "Node | null"
+                "text": "ViewBehaviorOrchestrator | null"
               },
               "privacy": "private",
               "default": "null"
@@ -9952,7 +10734,7 @@
               "name": "#localeChangeObserver",
               "privacy": "private",
               "type": {
-                "text": "BindingObserver"
+                "text": "ExpressionNotifier"
               },
               "inheritedFrom": {
                 "name": "PickerField",
@@ -10755,7 +11537,7 @@
               "name": "#localeChangeObserver",
               "privacy": "private",
               "type": {
-                "text": "BindingObserver"
+                "text": "ExpressionNotifier"
               },
               "inheritedFrom": {
                 "name": "PickerField",
@@ -11555,7 +12337,7 @@
               "name": "#clockChangeObserver",
               "privacy": "private",
               "type": {
-                "text": "BindingObserver"
+                "text": "ExpressionNotifier"
               },
               "inheritedFrom": {
                 "name": "TimeSelectionPicker",
@@ -11673,7 +12455,7 @@
               "name": "#localeChangeObserver",
               "privacy": "private",
               "type": {
-                "text": "BindingObserver"
+                "text": "ExpressionNotifier"
               },
               "inheritedFrom": {
                 "name": "PickerField",
@@ -12522,6 +13304,16 @@
               "privacy": "public",
               "description": ""
             },
+            {
+              "kind": "field",
+              "name": "deleteAriaLabel",
+              "type": {
+                "text": "string | null"
+              },
+              "default": "null",
+              "description": "The aria-label for the delete button",
+              "privacy": "public"
+            },
             {
               "kind": "field",
               "name": "autofocus",
@@ -12720,6 +13512,15 @@
               "default": "null",
               "fieldName": "callButtonLabel"
             },
+            {
+              "name": "delete-aria-label",
+              "type": {
+                "text": "string | null"
+              },
+              "default": "null",
+              "description": "The aria-label for the delete button",
+              "fieldName": "deleteAriaLabel"
+            },
             {
               "name": "autofocus",
               "type": {
@@ -15081,14 +15882,14 @@
               "type": {
                 "text": "object"
               },
-              "default": "{\n\t\thandleChange: () => {\n\t\t\tthis._customValidationError =\n\t\t\t\tthis.#customValidationChangeObserver.observe(\n\t\t\t\t\tthis,\n\t\t\t\t\tdefaultExecutionContext\n\t\t\t\t);\n\t\t},\n\t}"
+              "default": "{\n\t\thandleChange: () => {\n\t\t\tthis._customValidationError =\n\t\t\t\tthis.#customValidationChangeObserver.observe(\n\t\t\t\t\tthis,\n\t\t\t\t\tExecutionContext.default\n\t\t\t\t);\n\t\t},\n\t}"
             },
             {
               "kind": "field",
               "name": "#customValidationChangeObserver",
               "privacy": "private",
               "type": {
-                "text": "BindingObserver"
+                "text": "ExpressionNotifier"
               }
             },
             {
@@ -27071,16 +27872,6 @@
             }
           ],
           "members": [
-            {
-              "kind": "field",
-              "name": "open",
-              "type": {
-                "text": "boolean"
-              },
-              "default": "false",
-              "description": "Indicates whether the popup is open",
-              "privacy": "public"
-            },
             {
               "kind": "field",
               "name": "placement",
@@ -27091,16 +27882,6 @@
               "description": "Placement of the popup with color swatches",
               "privacy": "public"
             },
-            {
-              "kind": "field",
-              "name": "swatches",
-              "type": {
-                "text": "ColorSwatch[]"
-              },
-              "default": "[]",
-              "description": "List of color swatches, has to be an array of objects\n\n### Examples",
-              "privacy": "public"
-            },
             {
               "kind": "field",
               "name": "swatchesPerRow",
@@ -27163,6 +27944,34 @@
                 "module": "src/shared/patterns/anchored.ts"
               }
             },
+            {
+              "kind": "field",
+              "name": "open",
+              "type": {
+                "text": "boolean"
+              },
+              "default": "false",
+              "description": "Indicates whether the popup is open",
+              "privacy": "public",
+              "inheritedFrom": {
+                "name": "BaseColorPicker",
+                "module": "src/shared/color-picker/base-color-picker.ts"
+              }
+            },
+            {
+              "kind": "field",
+              "name": "swatches",
+              "type": {
+                "text": "ColorSwatch[]"
+              },
+              "default": "[]",
+              "description": "List of color swatches, has to be an array of objects\n\n### Examples",
+              "privacy": "public",
+              "inheritedFrom": {
+                "name": "BaseColorPicker",
+                "module": "src/shared/color-picker/base-color-picker.ts"
+              }
+            },
             {
               "kind": "field",
               "name": "label",
@@ -27385,15 +28194,6 @@
             }
           ],
           "attributes": [
-            {
-              "name": "open",
-              "type": {
-                "text": "boolean"
-              },
-              "default": "false",
-              "description": "Indicates whether the popup is open",
-              "fieldName": "open"
-            },
             {
               "name": "placement",
               "type": {
@@ -27424,6 +28224,19 @@
                 "module": "src/shared/patterns/anchored.ts"
               }
             },
+            {
+              "name": "open",
+              "type": {
+                "text": "boolean"
+              },
+              "default": "false",
+              "description": "Indicates whether the popup is open",
+              "fieldName": "open",
+              "inheritedFrom": {
+                "name": "BaseColorPicker",
+                "module": "src/shared/color-picker/base-color-picker.ts"
+              }
+            },
             {
               "name": "label",
               "type": {
@@ -27500,21 +28313,13 @@
             }
           ],
           "mixins": [
-            {
-              "name": "Localized",
-              "module": "/src/shared/patterns"
-            },
             {
               "name": "Anchored",
               "module": "/src/shared/patterns/anchored"
             },
             {
-              "name": "FormElement",
-              "module": "/src/shared/patterns"
-            },
-            {
-              "name": "FormAssociated",
-              "module": "/src/shared/foundation/form-associated/form-associated"
+              "name": "BaseColorPicker",
+              "module": "/src/shared/color-picker"
             }
           ],
           "superclass": {
@@ -33470,7 +34275,7 @@
               "name": "#clockChangeObserver",
               "privacy": "private",
               "type": {
-                "text": "BindingObserver"
+                "text": "ExpressionNotifier"
               },
               "inheritedFrom": {
                 "name": "TimeSelectionPicker",
@@ -33543,7 +34348,7 @@
               "name": "#localeChangeObserver",
               "privacy": "private",
               "type": {
-                "text": "BindingObserver"
+                "text": "ExpressionNotifier"
               },
               "inheritedFrom": {
                 "name": "PickerField",
@@ -39340,24 +40145,6 @@
             }
           ]
         },
-        {
-          "kind": "function",
-          "name": "unsubscribeFromAriaPropertyChanges",
-          "parameters": [
-            {
-              "name": "source",
-              "type": {
-                "text": "AriaMixinElement"
-              }
-            },
-            {
-              "name": "listener",
-              "type": {
-                "text": "AriaChangeSubscriber"
-              }
-            }
-          ]
-        },
         {
           "kind": "function",
           "name": "publishAriaPropertyChange",
@@ -39386,14 +40173,6 @@
             "module": "src/shared/aria/aria-change-subscription.ts"
           }
         },
-        {
-          "kind": "js",
-          "name": "unsubscribeFromAriaPropertyChanges",
-          "declaration": {
-            "name": "unsubscribeFromAriaPropertyChanges",
-            "module": "src/shared/aria/aria-change-subscription.ts"
-          }
-        },
         {
           "kind": "js",
           "name": "publishAriaPropertyChange",
@@ -39568,29 +40347,25 @@
             },
             {
               "kind": "field",
-              "name": "source",
+              "name": "target",
               "type": {
-                "text": "DelegatesAriaElement | null"
+                "text": "HTMLElement | null"
               },
               "privacy": "private",
-              "default": "null"
+              "default": "target"
             },
             {
               "kind": "method",
               "name": "bind",
               "parameters": [
                 {
-                  "name": "source",
+                  "name": "controller",
                   "type": {
-                    "text": "DelegatesAriaElement"
+                    "text": "ViewController"
                   }
                 }
               ]
             },
-            {
-              "kind": "method",
-              "name": "unbind"
-            },
             {
               "kind": "field",
               "name": "bindingBehaviours",
@@ -39625,19 +40400,6 @@
                 }
               ]
             },
-            {
-              "kind": "method",
-              "name": "releasePropertyBindings",
-              "privacy": "private",
-              "parameters": [
-                {
-                  "name": "source",
-                  "type": {
-                    "text": "DelegatesAriaElement"
-                  }
-                }
-              ]
-            },
             {
               "kind": "method",
               "name": "startForwardingPropertiesToTarget",
@@ -39663,19 +40425,6 @@
                 }
               ]
             },
-            {
-              "kind": "method",
-              "name": "stopForwardingPropertiesToTarget",
-              "privacy": "private",
-              "parameters": [
-                {
-                  "name": "source",
-                  "type": {
-                    "text": "DelegatesAriaElement"
-                  }
-                }
-              ]
-            },
             {
               "kind": "field",
               "name": "onSourceAriaPropertyChanged",
@@ -39729,7 +40478,7 @@
           "name": "delegateAria",
           "return": {
             "type": {
-              "text": "CaptureType<T>"
+              "text": "CaptureType<T, any>"
             }
           },
           "parameters": [
@@ -39812,25 +40561,22 @@
               "readonly": true
             },
             {
-              "kind": "method",
-              "name": "bind",
-              "parameters": [
-                {
-                  "name": "source",
-                  "type": {
-                    "text": "HostSemanticsElement"
-                  }
-                }
-              ]
+              "kind": "field",
+              "name": "target",
+              "type": {
+                "text": "HTMLElement | null"
+              },
+              "privacy": "private",
+              "default": "target"
             },
             {
               "kind": "method",
-              "name": "unbind",
+              "name": "bind",
               "parameters": [
                 {
-                  "name": "source",
+                  "name": "controller",
                   "type": {
-                    "text": "HostSemanticsElement"
+                    "text": "ViewController"
                   }
                 }
               ]
@@ -39839,7 +40585,7 @@
               "kind": "field",
               "name": "bindingBehaviours",
               "type": {
-                "text": "Behavior[]"
+                "text": "ViewBehavior[]"
               },
               "privacy": "private",
               "default": "[]"
@@ -39868,19 +40614,6 @@
                   }
                 }
               ]
-            },
-            {
-              "kind": "method",
-              "name": "releasePropertyBindings",
-              "privacy": "private",
-              "parameters": [
-                {
-                  "name": "source",
-                  "type": {
-                    "text": "HostSemanticsElement"
-                  }
-                }
-              ]
             }
           ]
         }
@@ -39905,7 +40638,7 @@
           "name": "applyHostSemantics",
           "return": {
             "type": {
-              "text": "CaptureType<T>"
+              "text": "CaptureType<T, any>"
             }
           },
           "parameters": [
@@ -40240,7 +40973,7 @@
               "name": "#localeChangeObserver",
               "privacy": "private",
               "type": {
-                "text": "BindingObserver"
+                "text": "ExpressionNotifier"
               }
             },
             {
@@ -41041,7 +41774,7 @@
               "name": "#clockChangeObserver",
               "privacy": "private",
               "type": {
-                "text": "BindingObserver"
+                "text": "ExpressionNotifier"
               }
             },
             {
@@ -41740,6 +42473,477 @@
           }
         }
       ]
+    },
+    {
+      "kind": "javascript-module",
+      "path": "src/shared/color-picker/base-color-picker.ts",
+      "declarations": [
+        {
+          "kind": "mixin",
+          "description": "Base mixin for Color Picker components",
+          "name": "BaseColorPicker",
+          "members": [
+            {
+              "kind": "field",
+              "name": "open",
+              "type": {
+                "text": "boolean"
+              },
+              "default": "false",
+              "description": "Indicates whether the popup is open",
+              "privacy": "public"
+            },
+            {
+              "kind": "field",
+              "name": "swatches",
+              "type": {
+                "text": "ColorSwatch[]"
+              },
+              "default": "[]",
+              "description": "List of color swatches, has to be an array of objects\n\n### Examples",
+              "privacy": "public"
+            },
+            {
+              "kind": "field",
+              "name": "label",
+              "type": {
+                "text": "string | undefined"
+              },
+              "description": "The label for the form element.",
+              "inheritedFrom": {
+                "name": "FormElement",
+                "module": "src/shared/patterns/form-elements/form-element.ts"
+              }
+            },
+            {
+              "kind": "field",
+              "name": "#handleInvalidEvent",
+              "privacy": "private",
+              "inheritedFrom": {
+                "name": "FormElement",
+                "module": "src/shared/patterns/form-elements/form-element.ts"
+              }
+            },
+            {
+              "kind": "field",
+              "name": "validity",
+              "type": {
+                "text": "ValidityState"
+              },
+              "description": "Returns the validity state of the element",
+              "readonly": true,
+              "inheritedFrom": {
+                "name": "FormAssociated",
+                "module": "src/shared/foundation/form-associated/form-associated.ts"
+              }
+            },
+            {
+              "kind": "field",
+              "name": "form",
+              "type": {
+                "text": "HTMLFormElement | null"
+              },
+              "description": "Retrieve a reference to the associated form.\nReturns null if not associated to any form.",
+              "readonly": true,
+              "inheritedFrom": {
+                "name": "FormAssociated",
+                "module": "src/shared/foundation/form-associated/form-associated.ts"
+              }
+            },
+            {
+              "kind": "field",
+              "name": "validationMessage",
+              "type": {
+                "text": "string"
+              },
+              "description": "Retrieve the localized validation message,\nor custom validation message if set.",
+              "readonly": true,
+              "inheritedFrom": {
+                "name": "FormAssociated",
+                "module": "src/shared/foundation/form-associated/form-associated.ts"
+              }
+            },
+            {
+              "kind": "field",
+              "name": "willValidate",
+              "type": {
+                "text": "boolean"
+              },
+              "description": "Whether the element will be validated when the\nform is submitted",
+              "readonly": true,
+              "inheritedFrom": {
+                "name": "FormAssociated",
+                "module": "src/shared/foundation/form-associated/form-associated.ts"
+              }
+            },
+            {
+              "kind": "field",
+              "name": "labels",
+              "type": {
+                "text": "ReadonlyArray<Node>"
+              },
+              "description": "A reference to all associated label elements",
+              "readonly": true,
+              "inheritedFrom": {
+                "name": "FormAssociated",
+                "module": "src/shared/foundation/form-associated/form-associated.ts"
+              }
+            },
+            {
+              "kind": "field",
+              "name": "value",
+              "type": {
+                "text": "string"
+              },
+              "description": "The current value of the element.",
+              "inheritedFrom": {
+                "name": "FormAssociated",
+                "module": "src/shared/foundation/form-associated/form-associated.ts"
+              }
+            },
+            {
+              "kind": "field",
+              "name": "currentValue",
+              "inheritedFrom": {
+                "name": "FormAssociated",
+                "module": "src/shared/foundation/form-associated/form-associated.ts"
+              }
+            },
+            {
+              "kind": "field",
+              "name": "initialValue",
+              "type": {
+                "text": "string"
+              },
+              "description": "The default value of the element. This value sets the `value` property\nonly when the `value` property has not been explicitly set.",
+              "inheritedFrom": {
+                "name": "FormAssociated",
+                "module": "src/shared/foundation/form-associated/form-associated.ts"
+              }
+            },
+            {
+              "kind": "field",
+              "name": "disabled",
+              "type": {
+                "text": "boolean"
+              },
+              "default": "false",
+              "description": "Sets the element's disabled state. A disabled element will not be included during form submission.",
+              "inheritedFrom": {
+                "name": "FormAssociated",
+                "module": "src/shared/foundation/form-associated/form-associated.ts"
+              }
+            },
+            {
+              "kind": "field",
+              "name": "name",
+              "type": {
+                "text": "string"
+              },
+              "description": "The name of the element. This element's value will be surfaced during form submission under the provided name.",
+              "inheritedFrom": {
+                "name": "FormAssociated",
+                "module": "src/shared/foundation/form-associated/form-associated.ts"
+              }
+            },
+            {
+              "kind": "field",
+              "name": "required",
+              "type": {
+                "text": "boolean"
+              },
+              "description": "Require the field to be completed prior to form submission.",
+              "default": "false",
+              "inheritedFrom": {
+                "name": "FormAssociated",
+                "module": "src/shared/foundation/form-associated/form-associated.ts"
+              }
+            },
+            {
+              "kind": "method",
+              "name": "checkValidity",
+              "return": {
+                "type": {
+                  "text": "boolean"
+                }
+              },
+              "description": "Return the current validity of the element.",
+              "inheritedFrom": {
+                "name": "FormAssociated",
+                "module": "src/shared/foundation/form-associated/form-associated.ts"
+              }
+            },
+            {
+              "kind": "method",
+              "name": "reportValidity",
+              "return": {
+                "type": {
+                  "text": "boolean"
+                }
+              },
+              "description": "Return the current validity of the element.\nIf false, fires an invalid event at the element.",
+              "inheritedFrom": {
+                "name": "FormAssociated",
+                "module": "src/shared/foundation/form-associated/form-associated.ts"
+              }
+            }
+          ],
+          "mixins": [
+            {
+              "name": "Localized",
+              "module": "/src/shared/patterns"
+            },
+            {
+              "name": "FormElement",
+              "module": "/src/shared/patterns"
+            },
+            {
+              "name": "FormAssociated",
+              "module": "/src/shared/foundation/form-associated/form-associated"
+            }
+          ],
+          "parameters": [
+            {
+              "name": "Base",
+              "type": {
+                "text": "T"
+              }
+            }
+          ],
+          "attributes": [
+            {
+              "name": "open",
+              "type": {
+                "text": "boolean"
+              },
+              "default": "false",
+              "description": "Indicates whether the popup is open",
+              "fieldName": "open"
+            },
+            {
+              "name": "label",
+              "type": {
+                "text": "string | undefined"
+              },
+              "description": "The label for the form element.",
+              "fieldName": "label",
+              "inheritedFrom": {
+                "name": "FormElement",
+                "module": "src/shared/patterns/form-elements/form-element.ts"
+              }
+            },
+            {
+              "name": "current-value",
+              "type": {
+                "text": "string"
+              },
+              "description": "The current value of the element.",
+              "fieldName": "value",
+              "inheritedFrom": {
+                "name": "FormAssociated",
+                "module": "src/shared/foundation/form-associated/form-associated.ts"
+              }
+            },
+            {
+              "name": "value",
+              "type": {
+                "text": "string"
+              },
+              "description": "The default value of the element. This value sets the `value` property\nonly when the `value` property has not been explicitly set.",
+              "fieldName": "initialValue",
+              "inheritedFrom": {
+                "name": "FormAssociated",
+                "module": "src/shared/foundation/form-associated/form-associated.ts"
+              }
+            },
+            {
+              "name": "disabled",
+              "type": {
+                "text": "boolean"
+              },
+              "default": "false",
+              "description": "Sets the element's disabled state. A disabled element will not be included during form submission.",
+              "fieldName": "disabled",
+              "inheritedFrom": {
+                "name": "FormAssociated",
+                "module": "src/shared/foundation/form-associated/form-associated.ts"
+              }
+            },
+            {
+              "name": "name",
+              "type": {
+                "text": "string"
+              },
+              "description": "The name of the element. This element's value will be surfaced during form submission under the provided name.",
+              "fieldName": "name",
+              "inheritedFrom": {
+                "name": "FormAssociated",
+                "module": "src/shared/foundation/form-associated/form-associated.ts"
+              }
+            },
+            {
+              "name": "required",
+              "type": {
+                "text": "boolean"
+              },
+              "description": "Require the field to be completed prior to form submission.",
+              "default": "false",
+              "fieldName": "required",
+              "inheritedFrom": {
+                "name": "FormAssociated",
+                "module": "src/shared/foundation/form-associated/form-associated.ts"
+              }
+            }
+          ]
+        }
+      ],
+      "exports": [
+        {
+          "kind": "js",
+          "name": "BaseColorPicker",
+          "declaration": {
+            "name": "BaseColorPicker",
+            "module": "src/shared/color-picker/base-color-picker.ts"
+          }
+        }
+      ]
+    },
+    {
+      "kind": "javascript-module",
+      "path": "src/shared/color-picker/locale.ts",
+      "declarations": [],
+      "exports": []
+    },
+    {
+      "kind": "javascript-module",
+      "path": "src/shared/color-picker/types.ts",
+      "declarations": [],
+      "exports": []
+    },
+    {
+      "kind": "javascript-module",
+      "path": "src/shared/color-picker/utils.ts",
+      "declarations": [
+        {
+          "kind": "function",
+          "name": "isValidHexColor",
+          "return": {
+            "type": {
+              "text": "boolean"
+            }
+          },
+          "parameters": [
+            {
+              "name": "input",
+              "type": {
+                "text": "string"
+              }
+            }
+          ],
+          "description": "Check if input value is valid hex color"
+        },
+        {
+          "kind": "function",
+          "name": "getLuminance",
+          "return": {
+            "type": {
+              "text": "number"
+            }
+          },
+          "parameters": [
+            {
+              "name": "hexColor",
+              "type": {
+                "text": "string"
+              }
+            }
+          ],
+          "description": "Calculate the relative luminance of a hex color using WCAG formula"
+        },
+        {
+          "kind": "function",
+          "name": "getContrastRatio",
+          "return": {
+            "type": {
+              "text": "number"
+            }
+          },
+          "parameters": [
+            {
+              "name": "color1",
+              "type": {
+                "text": "string"
+              }
+            },
+            {
+              "name": "color2",
+              "type": {
+                "text": "string"
+              }
+            }
+          ],
+          "description": "Calculate contrast ratio between two colors"
+        },
+        {
+          "kind": "function",
+          "name": "getCSSCustomProperty",
+          "return": {
+            "type": {
+              "text": "string"
+            }
+          },
+          "parameters": [
+            {
+              "name": "propertyName",
+              "type": {
+                "text": "string"
+              }
+            },
+            {
+              "name": "element",
+              "optional": true,
+              "type": {
+                "text": "Element"
+              }
+            }
+          ],
+          "description": "Get CSS custom property value from the document"
+        }
+      ],
+      "exports": [
+        {
+          "kind": "js",
+          "name": "isValidHexColor",
+          "declaration": {
+            "name": "isValidHexColor",
+            "module": "src/shared/color-picker/utils.ts"
+          }
+        },
+        {
+          "kind": "js",
+          "name": "getLuminance",
+          "declaration": {
+            "name": "getLuminance",
+            "module": "src/shared/color-picker/utils.ts"
+          }
+        },
+        {
+          "kind": "js",
+          "name": "getContrastRatio",
+          "declaration": {
+            "name": "getContrastRatio",
+            "module": "src/shared/color-picker/utils.ts"
+          }
+        },
+        {
+          "kind": "js",
+          "name": "getCSSCustomProperty",
+          "declaration": {
+            "name": "getCSSCustomProperty",
+            "module": "src/shared/color-picker/utils.ts"
+          }
+        }
+      ]
     }
   ]
 }