@esri/calcite-components 2.2.0-next.10 → 2.2.0-next.12

package/dist/collection/components/checkbox/checkbox.js.map

@@ -1 +1 @@
-{"version":3,"file":"checkbox.js","sourceRoot":"","sources":["../../../../src/components/checkbox/checkbox.tsx"],"names":[],"mappings":"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","sourcesContent":["import {\n  Component,\n  Element,\n  Event,\n  EventEmitter,\n  h,\n  Host,\n  Method,\n  Prop,\n  VNode,\n} from \"@stencil/core\";\nimport { toAriaBoolean } from \"../../utils/dom\";\nimport {\n  CheckableFormComponent,\n  connectForm,\n  disconnectForm,\n  HiddenFormInputSlot,\n} from \"../../utils/form\";\nimport { guid } from \"../../utils/guid\";\nimport {\n  connectInteractive,\n  disconnectInteractive,\n  InteractiveComponent,\n  InteractiveContainer,\n  updateHostInteraction,\n} from \"../../utils/interactive\";\nimport { isActivationKey } from \"../../utils/key\";\nimport { connectLabel, disconnectLabel, getLabelText, LabelableComponent } from \"../../utils/label\";\nimport {\n  componentFocusable,\n  LoadableComponent,\n  setComponentLoaded,\n  setUpLoadableComponent,\n} from \"../../utils/loadable\";\nimport { Scale, Status } from \"../interfaces\";\n\n@Component({\n  tag: \"calcite-checkbox\",\n  styleUrl: \"checkbox.scss\",\n  shadow: true,\n})\nexport class Checkbox\n  implements LabelableComponent, CheckableFormComponent, InteractiveComponent, LoadableComponent\n{\n  //--------------------------------------------------------------------------\n  //\n  //  Properties\n  //\n  //--------------------------------------------------------------------------\n\n  /** When `true`, the component is checked. */\n  @Prop({ reflect: true, mutable: true }) checked = false;\n\n  /** When `true`, interaction is prevented and the component is displayed with lower opacity. */\n  @Prop({ reflect: true }) disabled = false;\n\n  /**\n   * The ID of the form that will be associated with the component.\n   *\n   * When not set, the component will be associated with its ancestor form element, if any.\n   */\n  @Prop({ reflect: true })\n  form: string;\n\n  /** The `id` attribute of the component. When omitted, a globally unique identifier is used. */\n  @Prop({ reflect: true, mutable: true }) guid: string;\n\n  /**\n   * The hovered state of the checkbox.\n   *\n   * @internal\n   */\n  @Prop({ reflect: true }) hovered = false;\n\n  /**\n   * When `true`, the component is initially indeterminate, which is independent from its `checked` value.\n   *\n   * The state is visual only, and can look different across browsers.\n   *\n   * @mdn [indeterminate](https://developer.mozilla.org/en-US/docs/Web/HTML/Element/input/checkbox#indeterminate_state_checkboxes)\n   */\n  @Prop({ reflect: true, mutable: true }) indeterminate = false;\n\n  /** Accessible name for the component. */\n  @Prop() label: string;\n\n  /** Specifies the name of the component on form submission. */\n  @Prop({ reflect: true }) name: string;\n\n  /**\n   * When `true`, the component must have a value in order for the form to submit.\n   *\n   * @internal\n   */\n  @Prop({ reflect: true }) required = false;\n\n  /** Specifies the size of the component. */\n  @Prop({ reflect: true }) scale: Scale = \"m\";\n\n  /** Specifies the status of the input field, which determines message and icons. */\n  @Prop({ reflect: true }) status: Status = \"idle\";\n\n  /** The component's value. */\n  @Prop() value: any;\n\n  //--------------------------------------------------------------------------\n  //\n  //  Private Properties\n  //\n  //--------------------------------------------------------------------------\n\n  @Element() el: HTMLCalciteCheckboxElement;\n\n  readonly checkedPath = \"M5.5 12L2 8.689l.637-.636L5.5 10.727l8.022-7.87.637.637z\";\n\n  readonly indeterminatePath = \"M13 8v1H3V8z\";\n\n  labelEl: HTMLCalciteLabelElement;\n\n  formEl: HTMLFormElement;\n\n  defaultChecked: boolean;\n\n  defaultValue: Checkbox[\"checked\"];\n\n  toggleEl: HTMLDivElement;\n\n  //--------------------------------------------------------------------------\n  //\n  //  Public Methods\n  //\n  //--------------------------------------------------------------------------\n\n  /** Sets focus on the component. */\n  @Method()\n  async setFocus(): Promise<void> {\n    await componentFocusable(this);\n\n    this.toggleEl?.focus();\n  }\n\n  //--------------------------------------------------------------------------\n  //\n  //  Private Methods\n  //\n  //--------------------------------------------------------------------------\n\n  syncHiddenFormInput(input: HTMLInputElement): void {\n    input.type = \"checkbox\";\n  }\n\n  getPath = (): string =>\n    this.indeterminate ? this.indeterminatePath : this.checked ? this.checkedPath : \"\";\n\n  toggle = (): void => {\n    if (!this.disabled) {\n      this.checked = !this.checked;\n      this.setFocus();\n      this.indeterminate = false;\n      this.calciteCheckboxChange.emit();\n    }\n  };\n\n  keyDownHandler = (event: KeyboardEvent): void => {\n    if (isActivationKey(event.key)) {\n      this.toggle();\n      event.preventDefault();\n    }\n  };\n\n  clickHandler = (): void => {\n    if (this.disabled) {\n      return;\n    }\n\n    this.toggle();\n  };\n\n  //--------------------------------------------------------------------------\n  //\n  //  Events\n  //\n  //--------------------------------------------------------------------------\n\n  /**\n   * Emits when the component is blurred.\n   *\n   * @internal\n   */\n  @Event({ cancelable: false }) calciteInternalCheckboxBlur: EventEmitter<boolean>;\n\n  /** Emits when the component's `checked` status changes. */\n  @Event({ cancelable: false }) calciteCheckboxChange: EventEmitter<void>;\n\n  /**\n   * Emits when the component is focused.\n   *\n   * @internal\n   */\n  @Event({ cancelable: false }) calciteInternalCheckboxFocus: EventEmitter<boolean>;\n\n  //--------------------------------------------------------------------------\n  //\n  //  Event Listeners\n  //\n  //--------------------------------------------------------------------------\n\n  onToggleBlur = (): void => {\n    this.calciteInternalCheckboxBlur.emit(false);\n  };\n\n  onToggleFocus = (): void => {\n    this.calciteInternalCheckboxFocus.emit(true);\n  };\n\n  onLabelClick = (): void => {\n    this.toggle();\n  };\n\n  //--------------------------------------------------------------------------\n  //\n  //  Lifecycle\n  //\n  //--------------------------------------------------------------------------\n\n  connectedCallback(): void {\n    this.guid = this.el.id || `calcite-checkbox-${guid()}`;\n    connectInteractive(this);\n    connectLabel(this);\n    connectForm(this);\n  }\n\n  disconnectedCallback(): void {\n    disconnectInteractive(this);\n    disconnectLabel(this);\n    disconnectForm(this);\n  }\n\n  componentWillLoad(): void {\n    setUpLoadableComponent(this);\n  }\n\n  componentDidLoad(): void {\n    setComponentLoaded(this);\n  }\n\n  componentDidRender(): void {\n    updateHostInteraction(this);\n  }\n\n  // --------------------------------------------------------------------------\n  //\n  //  Render Methods\n  //\n  // --------------------------------------------------------------------------\n\n  render(): VNode {\n    return (\n      <Host onClick={this.clickHandler} onKeyDown={this.keyDownHandler}>\n        <InteractiveContainer disabled={this.disabled}>\n          <div\n            aria-checked={toAriaBoolean(this.checked)}\n            aria-label={getLabelText(this)}\n            class=\"toggle\"\n            onBlur={this.onToggleBlur}\n            onFocus={this.onToggleFocus}\n            role=\"checkbox\"\n            tabIndex={this.disabled ? undefined : 0}\n            // eslint-disable-next-line react/jsx-sort-props -- ref should be last so node attrs/props are in sync (see https://github.com/Esri/calcite-design-system/pull/6530)\n            ref={(toggleEl) => (this.toggleEl = toggleEl)}\n          >\n            <svg aria-hidden=\"true\" class=\"check-svg\" viewBox=\"0 0 16 16\">\n              <path d={this.getPath()} />\n            </svg>\n            <slot />\n          </div>\n          <HiddenFormInputSlot component={this} />\n        </InteractiveContainer>\n      </Host>\n    );\n  }\n}\n"]}
+{"version":3,"file":"checkbox.js","sourceRoot":"","sources":["../../../../src/components/checkbox/checkbox.tsx"],"names":[],"mappings":"AAAA,OAAO,EACL,SAAS,EACT,OAAO,EACP,KAAK,EAEL,CAAC,EACD,IAAI,EACJ,MAAM,EACN,IAAI,GAEL,MAAM,eAAe,CAAC;AACvB,OAAO,EAAE,aAAa,EAAE,MAAM,iBAAiB,CAAC;AAChD,OAAO,EAEL,WAAW,EACX,cAAc,EACd,mBAAmB,GACpB,MAAM,kBAAkB,CAAC;AAC1B,OAAO,EAAE,IAAI,EAAE,MAAM,kBAAkB,CAAC;AACxC,OAAO,EACL,kBAAkB,EAClB,qBAAqB,EAErB,oBAAoB,EACpB,qBAAqB,GACtB,MAAM,yBAAyB,CAAC;AACjC,OAAO,EAAE,eAAe,EAAE,MAAM,iBAAiB,CAAC;AAClD,OAAO,EAAE,YAAY,EAAE,eAAe,EAAE,YAAY,EAAsB,MAAM,mBAAmB,CAAC;AACpG,OAAO,EACL,kBAAkB,EAElB,kBAAkB,EAClB,sBAAsB,GACvB,MAAM,sBAAsB,CAAC;AAQ9B,MAAM,OAAO,QAAQ;;QA4EV,gBAAW,GAAG,0DAA0D,CAAC;QAEzE,sBAAiB,GAAG,cAAc,CAAC;QAoC5C,YAAO,GAAG,GAAW,EAAE,CACrB,IAAI,CAAC,aAAa,CAAC,CAAC,CAAC,IAAI,CAAC,iBAAiB,CAAC,CAAC,CAAC,IAAI,CAAC,OAAO,CAAC,CAAC,CAAC,IAAI,CAAC,WAAW,CAAC,CAAC,CAAC,EAAE,CAAC;QAErF,WAAM,GAAG,GAAS,EAAE;YAClB,IAAI,CAAC,IAAI,CAAC,QAAQ,EAAE;gBAClB,IAAI,CAAC,OAAO,GAAG,CAAC,IAAI,CAAC,OAAO,CAAC;gBAC7B,IAAI,CAAC,QAAQ,EAAE,CAAC;gBAChB,IAAI,CAAC,aAAa,GAAG,KAAK,CAAC;gBAC3B,IAAI,CAAC,qBAAqB,CAAC,IAAI,EAAE,CAAC;aACnC;QACH,CAAC,CAAC;QAEF,mBAAc,GAAG,CAAC,KAAoB,EAAQ,EAAE;YAC9C,IAAI,eAAe,CAAC,KAAK,CAAC,GAAG,CAAC,EAAE;gBAC9B,IAAI,CAAC,MAAM,EAAE,CAAC;gBACd,KAAK,CAAC,cAAc,EAAE,CAAC;aACxB;QACH,CAAC,CAAC;QAEF,iBAAY,GAAG,GAAS,EAAE;YACxB,IAAI,IAAI,CAAC,QAAQ,EAAE;gBACjB,OAAO;aACR;YAED,IAAI,CAAC,MAAM,EAAE,CAAC;QAChB,CAAC,CAAC;QAyBF,4EAA4E;QAC5E,EAAE;QACF,mBAAmB;QACnB,EAAE;QACF,4EAA4E;QAE5E,iBAAY,GAAG,GAAS,EAAE;YACxB,IAAI,CAAC,2BAA2B,CAAC,IAAI,CAAC,KAAK,CAAC,CAAC;QAC/C,CAAC,CAAC;QAEF,kBAAa,GAAG,GAAS,EAAE;YACzB,IAAI,CAAC,4BAA4B,CAAC,IAAI,CAAC,IAAI,CAAC,CAAC;QAC/C,CAAC,CAAC;QAEF,iBAAY,GAAG,GAAS,EAAE;YACxB,IAAI,CAAC,MAAM,EAAE,CAAC;QAChB,CAAC,CAAC;uBA1KgD,KAAK;wBAGnB,KAAK;;;uBAkBN,KAAK;6BASgB,KAAK;;;wBAiBzB,KAAK;qBAGD,GAAG;sBAGD,MAAM;;;IA2BhD,4EAA4E;IAC5E,EAAE;IACF,kBAAkB;IAClB,EAAE;IACF,4EAA4E;IAE5E,mCAAmC;IAEnC,KAAK,CAAC,QAAQ;QACZ,MAAM,kBAAkB,CAAC,IAAI,CAAC,CAAC;QAE/B,IAAI,CAAC,QAAQ,EAAE,KAAK,EAAE,CAAC;IACzB,CAAC;IAED,4EAA4E;IAC5E,EAAE;IACF,mBAAmB;IACnB,EAAE;IACF,4EAA4E;IAE5E,mBAAmB,CAAC,KAAuB;QACzC,KAAK,CAAC,IAAI,GAAG,UAAU,CAAC;IAC1B,CAAC;IAsED,4EAA4E;IAC5E,EAAE;IACF,aAAa;IACb,EAAE;IACF,4EAA4E;IAE5E,iBAAiB;QACf,IAAI,CAAC,IAAI,GAAG,IAAI,CAAC,EAAE,CAAC,EAAE,IAAI,oBAAoB,IAAI,EAAE,EAAE,CAAC;QACvD,kBAAkB,CAAC,IAAI,CAAC,CAAC;QACzB,YAAY,CAAC,IAAI,CAAC,CAAC;QACnB,WAAW,CAAC,IAAI,CAAC,CAAC;IACpB,CAAC;IAED,oBAAoB;QAClB,qBAAqB,CAAC,IAAI,CAAC,CAAC;QAC5B,eAAe,CAAC,IAAI,CAAC,CAAC;QACtB,cAAc,CAAC,IAAI,CAAC,CAAC;IACvB,CAAC;IAED,iBAAiB;QACf,sBAAsB,CAAC,IAAI,CAAC,CAAC;IAC/B,CAAC;IAED,gBAAgB;QACd,kBAAkB,CAAC,IAAI,CAAC,CAAC;IAC3B,CAAC;IAED,kBAAkB;QAChB,qBAAqB,CAAC,IAAI,CAAC,CAAC;IAC9B,CAAC;IAED,6EAA6E;IAC7E,EAAE;IACF,kBAAkB;IAClB,EAAE;IACF,6EAA6E;IAE7E,MAAM;QACJ,OAAO,CACL,EAAC,IAAI,IAAC,OAAO,EAAE,IAAI,CAAC,YAAY,EAAE,SAAS,EAAE,IAAI,CAAC,cAAc;YAC9D,EAAC,oBAAoB,IAAC,QAAQ,EAAE,IAAI,CAAC,QAAQ;gBAC3C,2BACgB,aAAa,CAAC,IAAI,CAAC,OAAO,CAAC,gBAC7B,YAAY,CAAC,IAAI,CAAC,EAC9B,KAAK,EAAC,QAAQ,EACd,MAAM,EAAE,IAAI,CAAC,YAAY,EACzB,OAAO,EAAE,IAAI,CAAC,aAAa,EAC3B,IAAI,EAAC,UAAU,EACf,QAAQ,EAAE,IAAI,CAAC,QAAQ,CAAC,CAAC,CAAC,SAAS,CAAC,CAAC,CAAC,CAAC;oBACvC,oKAAoK;oBACpK,GAAG,EAAE,CAAC,QAAQ,EAAE,EAAE,CAAC,CAAC,IAAI,CAAC,QAAQ,GAAG,QAAQ,CAAC;oBAE7C,0BAAiB,MAAM,EAAC,KAAK,EAAC,WAAW,EAAC,OAAO,EAAC,WAAW;wBAC3D,YAAM,CAAC,EAAE,IAAI,CAAC,OAAO,EAAE,GAAI,CACvB;oBACN,eAAQ,CACJ;gBACN,EAAC,mBAAmB,IAAC,SAAS,EAAE,IAAI,GAAI,CACnB,CAClB,CACR,CAAC;IACJ,CAAC;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;CACF","sourcesContent":["import {\n  Component,\n  Element,\n  Event,\n  EventEmitter,\n  h,\n  Host,\n  Method,\n  Prop,\n  VNode,\n} from \"@stencil/core\";\nimport { toAriaBoolean } from \"../../utils/dom\";\nimport {\n  CheckableFormComponent,\n  connectForm,\n  disconnectForm,\n  HiddenFormInputSlot,\n} from \"../../utils/form\";\nimport { guid } from \"../../utils/guid\";\nimport {\n  connectInteractive,\n  disconnectInteractive,\n  InteractiveComponent,\n  InteractiveContainer,\n  updateHostInteraction,\n} from \"../../utils/interactive\";\nimport { isActivationKey } from \"../../utils/key\";\nimport { connectLabel, disconnectLabel, getLabelText, LabelableComponent } from \"../../utils/label\";\nimport {\n  componentFocusable,\n  LoadableComponent,\n  setComponentLoaded,\n  setUpLoadableComponent,\n} from \"../../utils/loadable\";\nimport { Scale, Status } from \"../interfaces\";\n\n@Component({\n  tag: \"calcite-checkbox\",\n  styleUrl: \"checkbox.scss\",\n  shadow: true,\n})\nexport class Checkbox\n  implements LabelableComponent, CheckableFormComponent, InteractiveComponent, LoadableComponent\n{\n  //--------------------------------------------------------------------------\n  //\n  //  Properties\n  //\n  //--------------------------------------------------------------------------\n\n  /** When `true`, the component is checked. */\n  @Prop({ reflect: true, mutable: true }) checked = false;\n\n  /** When `true`, interaction is prevented and the component is displayed with lower opacity. */\n  @Prop({ reflect: true }) disabled = false;\n\n  /**\n   * The ID of the form that will be associated with the component.\n   *\n   * When not set, the component will be associated with its ancestor form element, if any.\n   */\n  @Prop({ reflect: true })\n  form: string;\n\n  /** The `id` attribute of the component. When omitted, a globally unique identifier is used. */\n  @Prop({ reflect: true, mutable: true }) guid: string;\n\n  /**\n   * The hovered state of the checkbox.\n   *\n   * @internal\n   */\n  @Prop({ reflect: true }) hovered = false;\n\n  /**\n   * When `true`, the component is initially indeterminate, which is independent from its `checked` value.\n   *\n   * The state is visual only, and can look different across browsers.\n   *\n   * @mdn [indeterminate](https://developer.mozilla.org/en-US/docs/Web/HTML/Element/input/checkbox#indeterminate_state_checkboxes)\n   */\n  @Prop({ reflect: true, mutable: true }) indeterminate = false;\n\n  /** Accessible name for the component. */\n  @Prop() label: string;\n\n  /**\n   * Specifies the name of the component.\n   *\n   * Required to pass the component's `value` on form submission.\n   */\n  @Prop({ reflect: true }) name: string;\n\n  /**\n   * When `true`, the component must have a value in order for the form to submit.\n   *\n   * @internal\n   */\n  @Prop({ reflect: true }) required = false;\n\n  /** Specifies the size of the component. */\n  @Prop({ reflect: true }) scale: Scale = \"m\";\n\n  /** Specifies the status of the input field, which determines message and icons. */\n  @Prop({ reflect: true }) status: Status = \"idle\";\n\n  /** The component's value. */\n  @Prop() value: any;\n\n  //--------------------------------------------------------------------------\n  //\n  //  Private Properties\n  //\n  //--------------------------------------------------------------------------\n\n  @Element() el: HTMLCalciteCheckboxElement;\n\n  readonly checkedPath = \"M5.5 12L2 8.689l.637-.636L5.5 10.727l8.022-7.87.637.637z\";\n\n  readonly indeterminatePath = \"M13 8v1H3V8z\";\n\n  labelEl: HTMLCalciteLabelElement;\n\n  formEl: HTMLFormElement;\n\n  defaultChecked: boolean;\n\n  defaultValue: Checkbox[\"checked\"];\n\n  toggleEl: HTMLDivElement;\n\n  //--------------------------------------------------------------------------\n  //\n  //  Public Methods\n  //\n  //--------------------------------------------------------------------------\n\n  /** Sets focus on the component. */\n  @Method()\n  async setFocus(): Promise<void> {\n    await componentFocusable(this);\n\n    this.toggleEl?.focus();\n  }\n\n  //--------------------------------------------------------------------------\n  //\n  //  Private Methods\n  //\n  //--------------------------------------------------------------------------\n\n  syncHiddenFormInput(input: HTMLInputElement): void {\n    input.type = \"checkbox\";\n  }\n\n  getPath = (): string =>\n    this.indeterminate ? this.indeterminatePath : this.checked ? this.checkedPath : \"\";\n\n  toggle = (): void => {\n    if (!this.disabled) {\n      this.checked = !this.checked;\n      this.setFocus();\n      this.indeterminate = false;\n      this.calciteCheckboxChange.emit();\n    }\n  };\n\n  keyDownHandler = (event: KeyboardEvent): void => {\n    if (isActivationKey(event.key)) {\n      this.toggle();\n      event.preventDefault();\n    }\n  };\n\n  clickHandler = (): void => {\n    if (this.disabled) {\n      return;\n    }\n\n    this.toggle();\n  };\n\n  //--------------------------------------------------------------------------\n  //\n  //  Events\n  //\n  //--------------------------------------------------------------------------\n\n  /**\n   * Fires when the component is blurred.\n   *\n   * @internal\n   */\n  @Event({ cancelable: false }) calciteInternalCheckboxBlur: EventEmitter<boolean>;\n\n  /** Fires when the component's `checked` status changes. */\n  @Event({ cancelable: false }) calciteCheckboxChange: EventEmitter<void>;\n\n  /**\n   * Fires when the component is focused.\n   *\n   * @internal\n   */\n  @Event({ cancelable: false }) calciteInternalCheckboxFocus: EventEmitter<boolean>;\n\n  //--------------------------------------------------------------------------\n  //\n  //  Event Listeners\n  //\n  //--------------------------------------------------------------------------\n\n  onToggleBlur = (): void => {\n    this.calciteInternalCheckboxBlur.emit(false);\n  };\n\n  onToggleFocus = (): void => {\n    this.calciteInternalCheckboxFocus.emit(true);\n  };\n\n  onLabelClick = (): void => {\n    this.toggle();\n  };\n\n  //--------------------------------------------------------------------------\n  //\n  //  Lifecycle\n  //\n  //--------------------------------------------------------------------------\n\n  connectedCallback(): void {\n    this.guid = this.el.id || `calcite-checkbox-${guid()}`;\n    connectInteractive(this);\n    connectLabel(this);\n    connectForm(this);\n  }\n\n  disconnectedCallback(): void {\n    disconnectInteractive(this);\n    disconnectLabel(this);\n    disconnectForm(this);\n  }\n\n  componentWillLoad(): void {\n    setUpLoadableComponent(this);\n  }\n\n  componentDidLoad(): void {\n    setComponentLoaded(this);\n  }\n\n  componentDidRender(): void {\n    updateHostInteraction(this);\n  }\n\n  // --------------------------------------------------------------------------\n  //\n  //  Render Methods\n  //\n  // --------------------------------------------------------------------------\n\n  render(): VNode {\n    return (\n      <Host onClick={this.clickHandler} onKeyDown={this.keyDownHandler}>\n        <InteractiveContainer disabled={this.disabled}>\n          <div\n            aria-checked={toAriaBoolean(this.checked)}\n            aria-label={getLabelText(this)}\n            class=\"toggle\"\n            onBlur={this.onToggleBlur}\n            onFocus={this.onToggleFocus}\n            role=\"checkbox\"\n            tabIndex={this.disabled ? undefined : 0}\n            // eslint-disable-next-line react/jsx-sort-props -- ref should be last so node attrs/props are in sync (see https://github.com/Esri/calcite-design-system/pull/6530)\n            ref={(toggleEl) => (this.toggleEl = toggleEl)}\n          >\n            <svg aria-hidden=\"true\" class=\"check-svg\" viewBox=\"0 0 16 16\">\n              <path d={this.getPath()} />\n            </svg>\n            <slot />\n          </div>\n          <HiddenFormInputSlot component={this} />\n        </InteractiveContainer>\n      </Host>\n    );\n  }\n}\n"]}

package/dist/collection/components/chip/chip.css

@@ -1,22 +1,22 @@
 /**
  * Do not edit directly
- * Generated on Tue, 02 Jan 2024 20:04:13 GMT
+ * Generated on Tue, 09 Jan 2024 00:59:11 GMT
  */
 /**
  * Do not edit directly
- * Generated on Tue, 02 Jan 2024 20:04:13 GMT
+ * Generated on Tue, 09 Jan 2024 00:59:11 GMT
  */
 /**
  * Do not edit directly
- * Generated on Tue, 02 Jan 2024 20:04:13 GMT
+ * Generated on Tue, 09 Jan 2024 00:59:11 GMT
  */
 /**
  * Do not edit directly
- * Generated on Tue, 02 Jan 2024 20:04:13 GMT
+ * Generated on Tue, 09 Jan 2024 00:59:11 GMT
  */
 /**
  * Do not edit directly
- * Generated on Tue, 02 Jan 2024 20:04:10 GMT
+ * Generated on Tue, 09 Jan 2024 00:59:09 GMT
  */
 /* mixins & extensions */
 /* helper to properly scale internal durations */

package/dist/collection/components/chip/chip.e2e.js

@@ -1,7 +1,7 @@
 /*!
  * All material copyright ESRI, All Rights Reserved, unless otherwise specified.
  * See https://github.com/Esri/calcite-design-system/blob/main/LICENSE.md for details.
- * v2.2.0-next.10
+ * v2.2.0-next.12
  */
 import { newE2EPage } from "@stencil/core/testing";
 import { accessible, disabled, focusable, hidden, renders, slots, t9n } from "../../tests/commonTests";

package/dist/collection/components/chip/chip.js

@@ -1,7 +1,7 @@
 /*!
  * All material copyright ESRI, All Rights Reserved, unless otherwise specified.
  * See https://github.com/Esri/calcite-design-system/blob/main/LICENSE.md for details.
- * v2.2.0-next.10
+ * v2.2.0-next.12
  */
 import { Build, h, Host, } from "@stencil/core";
 import { toAriaBoolean, slotChangeHasAssignedElement } from "../../utils/dom";

package/dist/collection/components/chip/resources.js

@@ -1,7 +1,7 @@
 /*!
  * All material copyright ESRI, All Rights Reserved, unless otherwise specified.
  * See https://github.com/Esri/calcite-design-system/blob/main/LICENSE.md for details.
- * v2.2.0-next.10
+ * v2.2.0-next.12
  */
 export const CSS = {
     title: "title",

package/dist/collection/components/chip-group/chip-group.css

@@ -1,22 +1,22 @@
 /**
  * Do not edit directly
- * Generated on Tue, 02 Jan 2024 20:04:13 GMT
+ * Generated on Tue, 09 Jan 2024 00:59:11 GMT
  */
 /**
  * Do not edit directly
- * Generated on Tue, 02 Jan 2024 20:04:13 GMT
+ * Generated on Tue, 09 Jan 2024 00:59:11 GMT
  */
 /**
  * Do not edit directly
- * Generated on Tue, 02 Jan 2024 20:04:13 GMT
+ * Generated on Tue, 09 Jan 2024 00:59:11 GMT
  */
 /**
  * Do not edit directly
- * Generated on Tue, 02 Jan 2024 20:04:13 GMT
+ * Generated on Tue, 09 Jan 2024 00:59:11 GMT
  */
 /**
  * Do not edit directly
- * Generated on Tue, 02 Jan 2024 20:04:10 GMT
+ * Generated on Tue, 09 Jan 2024 00:59:09 GMT
  */
 /* mixins & extensions */
 /* helper to properly scale internal durations */

package/dist/collection/components/chip-group/chip-group.e2e.js

@@ -1,7 +1,7 @@
 /*!
  * All material copyright ESRI, All Rights Reserved, unless otherwise specified.
  * See https://github.com/Esri/calcite-design-system/blob/main/LICENSE.md for details.
- * v2.2.0-next.10
+ * v2.2.0-next.12
  */
 import { newE2EPage } from "@stencil/core/testing";
 import { html } from "../../../support/formatting";

package/dist/collection/components/chip-group/chip-group.js

@@ -1,7 +1,7 @@
 /*!
  * All material copyright ESRI, All Rights Reserved, unless otherwise specified.
  * See https://github.com/Esri/calcite-design-system/blob/main/LICENSE.md for details.
- * v2.2.0-next.10
+ * v2.2.0-next.12
  */
 import { h, } from "@stencil/core";
 import { focusElementInGroup, toAriaBoolean } from "../../utils/dom";
@@ -250,7 +250,7 @@ export class ChipGroup {
                 "optional": false,
                 "docs": {
                     "tags": [],
-                    "text": "Specifies the selection mode of the component."
+                    "text": "Specifies the selection mode of the component, where:\n\n`\"multiple\"` allows any number of selections,\n\n`\"single\"` allows only one selection,\n\n`\"single-persist\"` allows one selection and prevents de-selection, and\n\n`\"none\"` does not allow any selections."
                 },
                 "attribute": "selection-mode",
                 "reflect": true,
@@ -291,7 +291,7 @@ export class ChipGroup {
                 "composed": true,
                 "docs": {
                     "tags": [],
-                    "text": "Emits when the component's selection changes."
+                    "text": "Fires when the component's selection changes."
                 },
                 "complexType": {
                     "original": "void",

package/dist/collection/components/chip-group/chip-group.js.map

@@ -1 +1 @@
-{"version":3,"file":"chip-group.js","sourceRoot":"","sources":["../../../../src/components/chip-group/chip-group.tsx"],"names":[],"mappings":"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","sourcesContent":["import {\n  Component,\n  h,\n  VNode,\n  Prop,\n  Element,\n  Listen,\n  EventEmitter,\n  Event,\n  Method,\n  Watch,\n} from \"@stencil/core\";\nimport { focusElementInGroup, toAriaBoolean } from \"../../utils/dom\";\nimport {\n  connectInteractive,\n  disconnectInteractive,\n  InteractiveComponent,\n  InteractiveContainer,\n  updateHostInteraction,\n} from \"../../utils/interactive\";\nimport { createObserver } from \"../../utils/observers\";\nimport { Scale, SelectionMode } from \"../interfaces\";\nimport {\n  componentFocusable,\n  setComponentLoaded,\n  setUpLoadableComponent,\n} from \"../../utils/loadable\";\n/**\n * @slot - A slot for adding one or more `calcite-chip`s.\n */\n@Component({\n  tag: \"calcite-chip-group\",\n  styleUrl: \"chip-group.scss\",\n  shadow: true,\n})\nexport class ChipGroup implements InteractiveComponent {\n  //--------------------------------------------------------------------------\n  //\n  //  Public Properties\n  //\n  //--------------------------------------------------------------------------\n\n  /** When `true`, interaction is prevented and the component is displayed with lower opacity. */\n  @Prop({ reflect: true }) disabled = false;\n\n  /** Accessible name for the component. */\n  @Prop() label!: string;\n\n  /** Specifies the size of the component. Child `calcite-chip`s inherit the component's value. */\n  @Prop({ reflect: true }) scale: Scale = \"m\";\n\n  /** Specifies the selection mode of the component. */\n  @Prop({ reflect: true }) selectionMode: Extract<\n    \"multiple\" | \"single\" | \"single-persist\" | \"none\",\n    SelectionMode\n  > = \"none\";\n\n  @Watch(\"selectionMode\")\n  onSelectionModeChange(): void {\n    this.updateItems();\n  }\n\n  /**\n   * Specifies the component's selected items.\n   *\n   * @readonly\n   */\n  @Prop({ mutable: true }) selectedItems: HTMLCalciteChipElement[] = [];\n\n  //--------------------------------------------------------------------------\n  //\n  //  Private Properties\n  //\n  //--------------------------------------------------------------------------\n\n  @Element() el: HTMLCalciteChipGroupElement;\n\n  mutationObserver = createObserver(\"mutation\", () => this.updateItems());\n\n  private items: HTMLCalciteChipElement[] = [];\n\n  private slotRefEl: HTMLSlotElement;\n\n  //--------------------------------------------------------------------------\n  //\n  //  Events\n  //\n  //--------------------------------------------------------------------------\n\n  /** Emits when the component's selection changes. */\n  @Event({ cancelable: false }) calciteChipGroupSelect: EventEmitter<void>;\n\n  //--------------------------------------------------------------------------\n  //\n  //  Lifecycle\n  //\n  //--------------------------------------------------------------------------\n\n  connectedCallback(): void {\n    connectInteractive(this);\n    this.mutationObserver?.observe(this.el, { childList: true, subtree: true });\n  }\n\n  componentDidRender(): void {\n    disconnectInteractive(this);\n    updateHostInteraction(this);\n  }\n\n  componentDidLoad(): void {\n    setComponentLoaded(this);\n  }\n\n  disconnectedCallback(): void {\n    this.mutationObserver?.disconnect();\n  }\n\n  async componentWillLoad(): Promise<void> {\n    setUpLoadableComponent(this);\n  }\n  //--------------------------------------------------------------------------\n  //\n  //  Event Listeners\n  //\n  //--------------------------------------------------------------------------\n\n  @Listen(\"calciteInternalChipKeyEvent\")\n  calciteInternalChipKeyEventListener(event: CustomEvent): void {\n    if (event.composedPath().includes(this.el)) {\n      const interactiveItems = this.items?.filter((el) => !el.disabled);\n      switch (event.detail.key) {\n        case \"ArrowRight\":\n          focusElementInGroup(interactiveItems, event.detail.target, \"next\");\n          break;\n        case \"ArrowLeft\":\n          focusElementInGroup(interactiveItems, event.detail.target, \"previous\");\n          break;\n        case \"Home\":\n          focusElementInGroup(interactiveItems, event.detail.target, \"first\");\n          break;\n        case \"End\":\n          focusElementInGroup(interactiveItems, event.detail.target, \"last\");\n          break;\n      }\n    }\n  }\n\n  @Listen(\"calciteChipClose\")\n  calciteChipCloseListener(event: CustomEvent): void {\n    const item = event.target as HTMLCalciteChipElement;\n    if (this.items?.includes(item)) {\n      if (this.items?.indexOf(item) > 0) {\n        focusElementInGroup(this.items, item as HTMLCalciteChipElement, \"previous\");\n      } else if (this.items?.indexOf(item) === 0) {\n        focusElementInGroup(this.items, item as HTMLCalciteChipElement, \"next\");\n      } else {\n        focusElementInGroup(this.items, item as HTMLCalciteChipElement, \"first\");\n      }\n    }\n    this.items = this.items?.filter((el) => el !== item);\n  }\n\n  @Listen(\"calciteChipSelect\")\n  calciteChipSelectListener(event: CustomEvent): void {\n    if (event.composedPath().includes(this.el)) {\n      this.setSelectedItems(true, event.target as HTMLCalciteChipElement);\n    }\n  }\n\n  // --------------------------------------------------------------------------\n  //\n  //  Public Methods\n  //\n  // --------------------------------------------------------------------------\n\n  /**\n   * Sets focus on the component's first focusable element.\n   */\n  @Method()\n  async setFocus(): Promise<void> {\n    await componentFocusable(this);\n    if (!this.disabled) {\n      return (this.selectedItems[0] || this.items[0])?.setFocus();\n    }\n  }\n\n  //--------------------------------------------------------------------------\n  //\n  //  Private Methods\n  //\n  //--------------------------------------------------------------------------\n\n  private updateItems = (event?: Event): void => {\n    const target = event ? (event.target as HTMLSlotElement) : this.slotRefEl;\n    this.items = target\n      ?.assignedElements({ flatten: true })\n      .filter((el) => el?.matches(\"calcite-chip\")) as HTMLCalciteChipElement[];\n\n    this.items?.forEach((el) => {\n      el.interactive = true;\n      el.scale = this.scale;\n      el.selectionMode = this.selectionMode;\n    });\n\n    this.setSelectedItems(false);\n  };\n\n  private setSelectedItems = (emit: boolean, elToMatch?: HTMLCalciteChipElement): void => {\n    if (elToMatch) {\n      this.items?.forEach((el) => {\n        const matchingEl = elToMatch === el;\n        switch (this.selectionMode) {\n          case \"multiple\":\n            if (matchingEl) {\n              el.selected = !el.selected;\n            }\n            break;\n\n          case \"single\":\n            el.selected = matchingEl ? !el.selected : false;\n            break;\n\n          case \"single-persist\":\n            el.selected = !!matchingEl;\n            break;\n        }\n      });\n    }\n\n    this.selectedItems = this.items?.filter((el) => el.selected);\n\n    if (emit) {\n      this.calciteChipGroupSelect.emit();\n    }\n  };\n\n  //--------------------------------------------------------------------------\n  //\n  //  Render Methods\n  //\n  //--------------------------------------------------------------------------\n\n  render(): VNode {\n    const role =\n      this.selectionMode === \"none\" || this.selectionMode === \"multiple\" ? \"group\" : \"radiogroup\";\n    const { disabled } = this;\n\n    return (\n      <InteractiveContainer disabled={disabled}>\n        <div\n          aria-disabled={toAriaBoolean(disabled)}\n          aria-label={this.label}\n          class=\"container\"\n          role={role}\n        >\n          <slot\n            onSlotchange={this.updateItems}\n            ref={(el) => (this.slotRefEl = el as HTMLSlotElement)}\n          />\n        </div>\n      </InteractiveContainer>\n    );\n  }\n}\n"]}
+{"version":3,"file":"chip-group.js","sourceRoot":"","sources":["../../../../src/components/chip-group/chip-group.tsx"],"names":[],"mappings":"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","sourcesContent":["import {\n  Component,\n  h,\n  VNode,\n  Prop,\n  Element,\n  Listen,\n  EventEmitter,\n  Event,\n  Method,\n  Watch,\n} from \"@stencil/core\";\nimport { focusElementInGroup, toAriaBoolean } from \"../../utils/dom\";\nimport {\n  connectInteractive,\n  disconnectInteractive,\n  InteractiveComponent,\n  InteractiveContainer,\n  updateHostInteraction,\n} from \"../../utils/interactive\";\nimport { createObserver } from \"../../utils/observers\";\nimport { Scale, SelectionMode } from \"../interfaces\";\nimport {\n  componentFocusable,\n  setComponentLoaded,\n  setUpLoadableComponent,\n} from \"../../utils/loadable\";\n/**\n * @slot - A slot for adding one or more `calcite-chip`s.\n */\n@Component({\n  tag: \"calcite-chip-group\",\n  styleUrl: \"chip-group.scss\",\n  shadow: true,\n})\nexport class ChipGroup implements InteractiveComponent {\n  //--------------------------------------------------------------------------\n  //\n  //  Public Properties\n  //\n  //--------------------------------------------------------------------------\n\n  /** When `true`, interaction is prevented and the component is displayed with lower opacity. */\n  @Prop({ reflect: true }) disabled = false;\n\n  /** Accessible name for the component. */\n  @Prop() label!: string;\n\n  /** Specifies the size of the component. Child `calcite-chip`s inherit the component's value. */\n  @Prop({ reflect: true }) scale: Scale = \"m\";\n\n  /**\n   * Specifies the selection mode of the component, where:\n   *\n   * `\"multiple\"` allows any number of selections,\n   *\n   * `\"single\"` allows only one selection,\n   *\n   * `\"single-persist\"` allows one selection and prevents de-selection, and\n   *\n   * `\"none\"` does not allow any selections.\n   */\n  @Prop({ reflect: true }) selectionMode: Extract<\n    \"multiple\" | \"single\" | \"single-persist\" | \"none\",\n    SelectionMode\n  > = \"none\";\n\n  @Watch(\"selectionMode\")\n  onSelectionModeChange(): void {\n    this.updateItems();\n  }\n\n  /**\n   * Specifies the component's selected items.\n   *\n   * @readonly\n   */\n  @Prop({ mutable: true }) selectedItems: HTMLCalciteChipElement[] = [];\n\n  //--------------------------------------------------------------------------\n  //\n  //  Private Properties\n  //\n  //--------------------------------------------------------------------------\n\n  @Element() el: HTMLCalciteChipGroupElement;\n\n  mutationObserver = createObserver(\"mutation\", () => this.updateItems());\n\n  private items: HTMLCalciteChipElement[] = [];\n\n  private slotRefEl: HTMLSlotElement;\n\n  //--------------------------------------------------------------------------\n  //\n  //  Events\n  //\n  //--------------------------------------------------------------------------\n\n  /** Fires when the component's selection changes. */\n  @Event({ cancelable: false }) calciteChipGroupSelect: EventEmitter<void>;\n\n  //--------------------------------------------------------------------------\n  //\n  //  Lifecycle\n  //\n  //--------------------------------------------------------------------------\n\n  connectedCallback(): void {\n    connectInteractive(this);\n    this.mutationObserver?.observe(this.el, { childList: true, subtree: true });\n  }\n\n  componentDidRender(): void {\n    disconnectInteractive(this);\n    updateHostInteraction(this);\n  }\n\n  componentDidLoad(): void {\n    setComponentLoaded(this);\n  }\n\n  disconnectedCallback(): void {\n    this.mutationObserver?.disconnect();\n  }\n\n  async componentWillLoad(): Promise<void> {\n    setUpLoadableComponent(this);\n  }\n  //--------------------------------------------------------------------------\n  //\n  //  Event Listeners\n  //\n  //--------------------------------------------------------------------------\n\n  @Listen(\"calciteInternalChipKeyEvent\")\n  calciteInternalChipKeyEventListener(event: CustomEvent): void {\n    if (event.composedPath().includes(this.el)) {\n      const interactiveItems = this.items?.filter((el) => !el.disabled);\n      switch (event.detail.key) {\n        case \"ArrowRight\":\n          focusElementInGroup(interactiveItems, event.detail.target, \"next\");\n          break;\n        case \"ArrowLeft\":\n          focusElementInGroup(interactiveItems, event.detail.target, \"previous\");\n          break;\n        case \"Home\":\n          focusElementInGroup(interactiveItems, event.detail.target, \"first\");\n          break;\n        case \"End\":\n          focusElementInGroup(interactiveItems, event.detail.target, \"last\");\n          break;\n      }\n    }\n  }\n\n  @Listen(\"calciteChipClose\")\n  calciteChipCloseListener(event: CustomEvent): void {\n    const item = event.target as HTMLCalciteChipElement;\n    if (this.items?.includes(item)) {\n      if (this.items?.indexOf(item) > 0) {\n        focusElementInGroup(this.items, item as HTMLCalciteChipElement, \"previous\");\n      } else if (this.items?.indexOf(item) === 0) {\n        focusElementInGroup(this.items, item as HTMLCalciteChipElement, \"next\");\n      } else {\n        focusElementInGroup(this.items, item as HTMLCalciteChipElement, \"first\");\n      }\n    }\n    this.items = this.items?.filter((el) => el !== item);\n  }\n\n  @Listen(\"calciteChipSelect\")\n  calciteChipSelectListener(event: CustomEvent): void {\n    if (event.composedPath().includes(this.el)) {\n      this.setSelectedItems(true, event.target as HTMLCalciteChipElement);\n    }\n  }\n\n  // --------------------------------------------------------------------------\n  //\n  //  Public Methods\n  //\n  // --------------------------------------------------------------------------\n\n  /**\n   * Sets focus on the component's first focusable element.\n   */\n  @Method()\n  async setFocus(): Promise<void> {\n    await componentFocusable(this);\n    if (!this.disabled) {\n      return (this.selectedItems[0] || this.items[0])?.setFocus();\n    }\n  }\n\n  //--------------------------------------------------------------------------\n  //\n  //  Private Methods\n  //\n  //--------------------------------------------------------------------------\n\n  private updateItems = (event?: Event): void => {\n    const target = event ? (event.target as HTMLSlotElement) : this.slotRefEl;\n    this.items = target\n      ?.assignedElements({ flatten: true })\n      .filter((el) => el?.matches(\"calcite-chip\")) as HTMLCalciteChipElement[];\n\n    this.items?.forEach((el) => {\n      el.interactive = true;\n      el.scale = this.scale;\n      el.selectionMode = this.selectionMode;\n    });\n\n    this.setSelectedItems(false);\n  };\n\n  private setSelectedItems = (emit: boolean, elToMatch?: HTMLCalciteChipElement): void => {\n    if (elToMatch) {\n      this.items?.forEach((el) => {\n        const matchingEl = elToMatch === el;\n        switch (this.selectionMode) {\n          case \"multiple\":\n            if (matchingEl) {\n              el.selected = !el.selected;\n            }\n            break;\n\n          case \"single\":\n            el.selected = matchingEl ? !el.selected : false;\n            break;\n\n          case \"single-persist\":\n            el.selected = !!matchingEl;\n            break;\n        }\n      });\n    }\n\n    this.selectedItems = this.items?.filter((el) => el.selected);\n\n    if (emit) {\n      this.calciteChipGroupSelect.emit();\n    }\n  };\n\n  //--------------------------------------------------------------------------\n  //\n  //  Render Methods\n  //\n  //--------------------------------------------------------------------------\n\n  render(): VNode {\n    const role =\n      this.selectionMode === \"none\" || this.selectionMode === \"multiple\" ? \"group\" : \"radiogroup\";\n    const { disabled } = this;\n\n    return (\n      <InteractiveContainer disabled={disabled}>\n        <div\n          aria-disabled={toAriaBoolean(disabled)}\n          aria-label={this.label}\n          class=\"container\"\n          role={role}\n        >\n          <slot\n            onSlotchange={this.updateItems}\n            ref={(el) => (this.slotRefEl = el as HTMLSlotElement)}\n          />\n        </div>\n      </InteractiveContainer>\n    );\n  }\n}\n"]}

package/dist/collection/components/color-picker/color-picker.css

@@ -1,22 +1,22 @@
 /**
  * Do not edit directly
- * Generated on Tue, 02 Jan 2024 20:04:13 GMT
+ * Generated on Tue, 09 Jan 2024 00:59:11 GMT
  */
 /**
  * Do not edit directly
- * Generated on Tue, 02 Jan 2024 20:04:13 GMT
+ * Generated on Tue, 09 Jan 2024 00:59:11 GMT
  */
 /**
  * Do not edit directly
- * Generated on Tue, 02 Jan 2024 20:04:13 GMT
+ * Generated on Tue, 09 Jan 2024 00:59:11 GMT
  */
 /**
  * Do not edit directly
- * Generated on Tue, 02 Jan 2024 20:04:13 GMT
+ * Generated on Tue, 09 Jan 2024 00:59:11 GMT
  */
 /**
  * Do not edit directly
- * Generated on Tue, 02 Jan 2024 20:04:10 GMT
+ * Generated on Tue, 09 Jan 2024 00:59:09 GMT
  */
 /* mixins & extensions */
 /* helper to properly scale internal durations */

package/dist/collection/components/color-picker/color-picker.e2e.js

@@ -1,7 +1,7 @@
 /*!
  * All material copyright ESRI, All Rights Reserved, unless otherwise specified.
  * See https://github.com/Esri/calcite-design-system/blob/main/LICENSE.md for details.
- * v2.2.0-next.10
+ * v2.2.0-next.12
  */
 import { accessible, defaults, hidden, reflects, renders, focusable, disabled, t9n } from "../../tests/commonTests";
 import { CSS, DEFAULT_COLOR, DEFAULT_STORAGE_KEY_PREFIX, DIMENSIONS, SCOPE_SIZE } from "./resources";

package/dist/collection/components/color-picker/color-picker.js

@@ -1,7 +1,7 @@
 /*!
  * All material copyright ESRI, All Rights Reserved, unless otherwise specified.
  * See https://github.com/Esri/calcite-design-system/blob/main/LICENSE.md for details.
- * v2.2.0-next.10
+ * v2.2.0-next.12
  */
 import { h, } from "@stencil/core";
 import Color from "color";
@@ -901,7 +901,7 @@ export class ColorPicker {
                 "optional": false,
                 "docs": {
                     "tags": [],
-                    "text": "When `true`, an empty color (`null`) will be allowed as a `value`. When `false`, a color value is enforced, and clearing the input or blurring will restore the last valid `value`."
+                    "text": "When `true`, an empty color (`null`) will be allowed as a `value`.\n\nWhen `false`, a color value is enforced, and clearing the input or blurring will restore the last valid `value`."
                 },
                 "attribute": "allow-empty",
                 "reflect": true,
@@ -919,7 +919,7 @@ export class ColorPicker {
                 "optional": false,
                 "docs": {
                     "tags": [],
-                    "text": "When true, the component will allow updates to the color's alpha value."
+                    "text": "When `true`, the component will allow updates to the color's alpha value."
                 },
                 "attribute": "alpha-channel",
                 "reflect": false,
@@ -937,7 +937,7 @@ export class ColorPicker {
                 "optional": false,
                 "docs": {
                     "tags": [],
-                    "text": "When true, hides the RGB/HSV channel inputs"
+                    "text": "When `true`, hides the RGB/HSV channel inputs."
                 },
                 "attribute": "channels-disabled",
                 "reflect": false,
@@ -1046,7 +1046,7 @@ export class ColorPicker {
                 "optional": false,
                 "docs": {
                     "tags": [],
-                    "text": "When true, hides the hex input"
+                    "text": "When `true`, hides the hex input."
                 },
                 "attribute": "hex-disabled",
                 "reflect": false,
@@ -1106,7 +1106,7 @@ export class ColorPicker {
                 "optional": false,
                 "docs": {
                     "tags": [],
-                    "text": "When true, hides the saved colors section"
+                    "text": "When `true`, hides the saved colors section."
                 },
                 "attribute": "saved-disabled",
                 "reflect": true,