@zywave/zui-formfield 4.1.1-pre.0 → 4.1.1

package/CHANGELOG.md

@@ -3,6 +3,10 @@
 All notable changes to this project will be documented in this file.
 See [Conventional Commits](https://conventionalcommits.org) for commit guidelines.
 
+## [4.1.1](https://gitlab.com/zywave/app-platform/devkit/web-sdk/zui/compare/@zywave/zui-formfield@4.1.1-pre.1...@zywave/zui-formfield@4.1.1) (2024-01-12)
+
+**Note:** Version bump only for package @zywave/zui-formfield
+
 # [4.1.0](https://gitlab.com/zywave/app-platform/devkit/web-sdk/zui/compare/@zywave/zui-formfield@4.1.0-pre.0...@zywave/zui-formfield@4.1.0) (2023-10-27)
 
 **Note:** Version bump only for package @zywave/zui-formfield

package/dist/zui-formfield.js

@@ -4,12 +4,6 @@ var __decorate = (this && this.__decorate) || function (decorators, target, key,
     else for (var i = decorators.length - 1; i >= 0; i--) if (d = decorators[i]) r = (c < 3 ? d(r) : c > 3 ? d(target, key, r) : d(target, key)) || r;
     return c > 3 && r && Object.defineProperty(target, key, r), r;
 };
-var __classPrivateFieldGet = (this && this.__classPrivateFieldGet) || function (receiver, state, kind, f) {
-    if (kind === "a" && !f) throw new TypeError("Private accessor was defined without a getter");
-    if (typeof state === "function" ? receiver !== state || !f : !state.has(receiver)) throw new TypeError("Cannot read private member from an object whose class did not declare it");
-    return kind === "m" ? f : kind === "a" ? f.call(receiver) : f ? f.value : state.get(receiver);
-};
-var _ZuiFormField_instances, _ZuiFormField_control_get, _ZuiFormField_onLabelClick;
 import { ZuiBaseElement } from '@zywave/zui-base';
 import { findAssignedElement } from '@zywave/zui-base/dist/utils/find-assigned-element';
 import { html, nothing } from 'lit';
@@ -26,7 +20,6 @@ import { style } from './zui-formfield-css.js';
 export class ZuiFormField extends ZuiBaseElement {
     constructor() {
         super(...arguments);
-        _ZuiFormField_instances.add(this);
         /**
          * (optional): Label text, for the form control. Alternatively can slot in label text instead. If necessary, can be styled with `::part(label)`.
          */
@@ -36,25 +29,25 @@ export class ZuiFormField extends ZuiBaseElement {
          */
         this.controlSelector = '*';
     }
+    get #control() {
+        return findAssignedElement(this._slotEl, this.controlSelector);
+    }
     static get styles() {
         return [super.styles, style];
     }
     render() {
         return html `
       <div class="container" part="container">
-        ${this.label ? html ` <label @click="${__classPrivateFieldGet(this, _ZuiFormField_instances, "m", _ZuiFormField_onLabelClick)}" part="label">${this.label}</label> ` : nothing}
+        ${this.label ? html ` <label @click="${this.#onLabelClick}" part="label">${this.label}</label> ` : nothing}
         <slot></slot>
       </div>
     `;
     }
+    #onLabelClick() {
+        this.#control?.focus();
+        this.#control?.click();
+    }
 }
-_ZuiFormField_instances = new WeakSet(), _ZuiFormField_control_get = function _ZuiFormField_control_get() {
-    return findAssignedElement(this._slotEl, this.controlSelector);
-}, _ZuiFormField_onLabelClick = function _ZuiFormField_onLabelClick() {
-    var _a, _b;
-    (_a = __classPrivateFieldGet(this, _ZuiFormField_instances, "a", _ZuiFormField_control_get)) === null || _a === void 0 ? void 0 : _a.focus();
-    (_b = __classPrivateFieldGet(this, _ZuiFormField_instances, "a", _ZuiFormField_control_get)) === null || _b === void 0 ? void 0 : _b.click();
-};
 __decorate([
     property({ type: String })
 ], ZuiFormField.prototype, "label", void 0);

package/dist/zui-formfield.js.map

@@ -1 +1 @@
-{"version":3,"file":"zui-formfield.js","sourceRoot":"","sources":["../src/zui-formfield.ts"],"names":[],"mappings":";;;;;;;;;;;;AAAA,OAAO,EAAE,cAAc,EAAE,MAAM,kBAAkB,CAAC;AAClD,OAAO,EAAE,mBAAmB,EAAE,MAAM,mDAAmD,CAAC;AACxF,OAAO,EAAE,IAAI,EAAE,OAAO,EAAE,MAAM,KAAK,CAAC;AACpC,OAAO,EAAE,QAAQ,EAAE,KAAK,EAAE,MAAM,mBAAmB,CAAC;AACpD,OAAO,EAAE,KAAK,EAAE,MAAM,wBAAwB,CAAC;AAE/C;;;;;;;GAOG;AACH,MAAM,OAAO,YAAa,SAAQ,cAAc;IAAhD;;;QACE;;WAEG;QAEH,UAAK,GAAkB,IAAI,CAAC;QAE5B;;WAEG;QAEH,oBAAe,GAAG,GAAG,CAAC;IA0BxB,CAAC;IAjBC,MAAM,KAAK,MAAM;QACf,OAAO,CAAC,KAAK,CAAC,MAAM,EAAE,KAAK,CAAC,CAAC;IAC/B,CAAC;IAED,MAAM;QACJ,OAAO,IAAI,CAAA;;UAEL,IAAI,CAAC,KAAK,CAAC,CAAC,CAAC,IAAI,CAAA,mBAAmB,uBAAA,IAAI,2DAAc,kBAAkB,IAAI,CAAC,KAAK,WAAW,CAAC,CAAC,CAAC,OAAO;;;KAG5G,CAAC;IACJ,CAAC;CAMF;;IApBG,OAAO,mBAAmB,CAAC,IAAI,CAAC,OAAO,EAAE,IAAI,CAAC,eAAe,CAAC,CAAC;AACjE,CAAC;;IAgBC,MAAA,uBAAA,IAAI,0DAAS,0CAAE,KAAK,EAAE,CAAC;IACvB,MAAA,uBAAA,IAAI,0DAAS,0CAAE,KAAK,EAAE,CAAC;AACzB,CAAC;AA/BD;IADC,QAAQ,CAAC,EAAE,IAAI,EAAE,MAAM,EAAE,CAAC;2CACC;AAM5B;IADC,QAAQ,CAAC,EAAE,IAAI,EAAE,MAAM,EAAE,SAAS,EAAE,kBAAkB,EAAE,CAAC;qDACpC;AAGtB;IADC,KAAK,CAAC,MAAM,CAAC;6CACW;AAyB3B,MAAM,CAAC,cAAc,CAAC,MAAM,CAAC,eAAe,EAAE,YAAY,CAAC,CAAC","sourcesContent":["import { ZuiBaseElement } from '@zywave/zui-base';\nimport { findAssignedElement } from '@zywave/zui-base/dist/utils/find-assigned-element';\nimport { html, nothing } from 'lit';\nimport { property, query } from 'lit/decorators.js';\nimport { style } from './zui-formfield-css.js';\n\n/**\n * `<zui-formfield>` provides a standardized way of labeling and styling form controls.\n *\n * @slot - Default, unnamed slot; for inserting form controls, such as `<select>`, `<input>`, `<zui-input>`, `<zui-select>`, etc., into `<zui-formfield>`\n *\n * @csspart container - The container for form fields inserted into `zui-formfield`; this is exposed as a CSS shadow part and can be accessed with `::part(container)`.\n * @csspart label - The label for `zui-formfield`; this is exposed as a CSS shadow part and can be accessed with `::part(label)`.\n */\nexport class ZuiFormField extends ZuiBaseElement {\n  /**\n   * (optional): Label text, for the form control. Alternatively can slot in label text instead. If necessary, can be styled with `::part(label)`.\n   */\n  @property({ type: String })\n  label: string | null = null;\n\n  /**\n   * (optional): Provide a valid CSS selector to help `zui-formfield` find the correct form control. Defaults to the first child element.\n   */\n  @property({ type: String, attribute: 'control-selector' })\n  controlSelector = '*';\n\n  @query('slot')\n  _slotEl: HTMLSlotElement;\n\n  get #control() {\n    return findAssignedElement(this._slotEl, this.controlSelector);\n  }\n\n  static get styles() {\n    return [super.styles, style];\n  }\n\n  render() {\n    return html`\n      <div class=\"container\" part=\"container\">\n        ${this.label ? html` <label @click=\"${this.#onLabelClick}\" part=\"label\">${this.label}</label> ` : nothing}\n        <slot></slot>\n      </div>\n    `;\n  }\n\n  #onLabelClick() {\n    this.#control?.focus();\n    this.#control?.click();\n  }\n}\n\nwindow.customElements.define('zui-formfield', ZuiFormField);\n\ndeclare global {\n  interface HTMLElementTagNameMap {\n    'zui-formfield': ZuiFormField;\n  }\n}\n"]}
+{"version":3,"file":"zui-formfield.js","sourceRoot":"","sources":["../src/zui-formfield.ts"],"names":[],"mappings":";;;;;;AAAA,OAAO,EAAE,cAAc,EAAE,MAAM,kBAAkB,CAAC;AAClD,OAAO,EAAE,mBAAmB,EAAE,MAAM,mDAAmD,CAAC;AACxF,OAAO,EAAE,IAAI,EAAE,OAAO,EAAE,MAAM,KAAK,CAAC;AACpC,OAAO,EAAE,QAAQ,EAAE,KAAK,EAAE,MAAM,mBAAmB,CAAC;AACpD,OAAO,EAAE,KAAK,EAAE,MAAM,wBAAwB,CAAC;AAE/C;;;;;;;GAOG;AACH,MAAM,OAAO,YAAa,SAAQ,cAAc;IAAhD;;QACE;;WAEG;QAEH,UAAK,GAAkB,IAAI,CAAC;QAE5B;;WAEG;QAEH,oBAAe,GAAG,GAAG,CAAC;IA0BxB,CAAC;IArBC,IAAI,QAAQ;QACV,OAAO,mBAAmB,CAAC,IAAI,CAAC,OAAO,EAAE,IAAI,CAAC,eAAe,CAAC,CAAC;IACjE,CAAC;IAED,MAAM,KAAK,MAAM;QACf,OAAO,CAAC,KAAK,CAAC,MAAM,EAAE,KAAK,CAAC,CAAC;IAC/B,CAAC;IAED,MAAM;QACJ,OAAO,IAAI,CAAA;;UAEL,IAAI,CAAC,KAAK,CAAC,CAAC,CAAC,IAAI,CAAA,mBAAmB,IAAI,CAAC,aAAa,kBAAkB,IAAI,CAAC,KAAK,WAAW,CAAC,CAAC,CAAC,OAAO;;;KAG5G,CAAC;IACJ,CAAC;IAED,aAAa;QACX,IAAI,CAAC,QAAQ,EAAE,KAAK,EAAE,CAAC;QACvB,IAAI,CAAC,QAAQ,EAAE,KAAK,EAAE,CAAC;IACzB,CAAC;CACF;AAhCC;IADC,QAAQ,CAAC,EAAE,IAAI,EAAE,MAAM,EAAE,CAAC;2CACC;AAM5B;IADC,QAAQ,CAAC,EAAE,IAAI,EAAE,MAAM,EAAE,SAAS,EAAE,kBAAkB,EAAE,CAAC;qDACpC;AAGtB;IADC,KAAK,CAAC,MAAM,CAAC;6CACW;AAyB3B,MAAM,CAAC,cAAc,CAAC,MAAM,CAAC,eAAe,EAAE,YAAY,CAAC,CAAC","sourcesContent":["import { ZuiBaseElement } from '@zywave/zui-base';\nimport { findAssignedElement } from '@zywave/zui-base/dist/utils/find-assigned-element';\nimport { html, nothing } from 'lit';\nimport { property, query } from 'lit/decorators.js';\nimport { style } from './zui-formfield-css.js';\n\n/**\n * `<zui-formfield>` provides a standardized way of labeling and styling form controls.\n *\n * @slot - Default, unnamed slot; for inserting form controls, such as `<select>`, `<input>`, `<zui-input>`, `<zui-select>`, etc., into `<zui-formfield>`\n *\n * @csspart container - The container for form fields inserted into `zui-formfield`; this is exposed as a CSS shadow part and can be accessed with `::part(container)`.\n * @csspart label - The label for `zui-formfield`; this is exposed as a CSS shadow part and can be accessed with `::part(label)`.\n */\nexport class ZuiFormField extends ZuiBaseElement {\n  /**\n   * (optional): Label text, for the form control. Alternatively can slot in label text instead. If necessary, can be styled with `::part(label)`.\n   */\n  @property({ type: String })\n  label: string | null = null;\n\n  /**\n   * (optional): Provide a valid CSS selector to help `zui-formfield` find the correct form control. Defaults to the first child element.\n   */\n  @property({ type: String, attribute: 'control-selector' })\n  controlSelector = '*';\n\n  @query('slot')\n  _slotEl: HTMLSlotElement;\n\n  get #control() {\n    return findAssignedElement(this._slotEl, this.controlSelector);\n  }\n\n  static get styles() {\n    return [super.styles, style];\n  }\n\n  render() {\n    return html`\n      <div class=\"container\" part=\"container\">\n        ${this.label ? html` <label @click=\"${this.#onLabelClick}\" part=\"label\">${this.label}</label> ` : nothing}\n        <slot></slot>\n      </div>\n    `;\n  }\n\n  #onLabelClick() {\n    this.#control?.focus();\n    this.#control?.click();\n  }\n}\n\nwindow.customElements.define('zui-formfield', ZuiFormField);\n\ndeclare global {\n  interface HTMLElementTagNameMap {\n    'zui-formfield': ZuiFormField;\n  }\n}\n"]}

package/package.json

@@ -1,11 +1,11 @@
 {
   "name": "@zywave/zui-formfield",
-  "version": "4.1.1-pre.0",
+  "version": "4.1.1",
   "main": "dist/index.js",
   "module": "dist/index.js",
   "license": "UNLICENSED",
   "dependencies": {
-    "@zywave/zui-base": "^4.1.26"
+    "@zywave/zui-base": "^4.2.0"
   },
   "scripts": {
     "build": "yarn run build:scss && yarn run build:ts",
@@ -24,5 +24,5 @@
     "access": "public"
   },
   "customElements": "dist/custom-elements.json",
-  "gitHead": "649c124f4987b32df414dbcf389fa1116eb3d825"
+  "gitHead": "500e77ea31accee660b9b8dc9187cc200bb5e70d"
 }