@nova-design-system/nova-webcomponents 3.0.0-beta.17

package/dist/collection/components/nv-col/nv-col.js

@@ -0,0 +1,63 @@
+import { Host, h } from "@stencil/core";
+import clsx from "clsx";
+/**
+ * @slot default - The column content.
+ */
+export class NvCol {
+    constructor() {
+        this.size = undefined;
+    }
+    //#endregion PROPERTIES
+    /****************************************************************************/
+    //#region METHODS
+    /**
+     * Get the column size class.
+     * @returns {string | undefined} The column size class.
+     */
+    getColSize() {
+        if (this.size) {
+            if (this.size < 1 || this.size > 12)
+                return;
+            return `w-${this.size}/12`;
+        }
+    }
+    //#endregion METHODS
+    /****************************************************************************/
+    //#region RENDER
+    render() {
+        return (h(Host, { key: 'e0caccedd19c02c1854eb48f89302405e2cb0f46', class: clsx(this.getColSize()) }, h("slot", { key: 'a8d672a55a70d6ee551e9ac9e7366455f76aa1e5' })));
+    }
+    static get is() { return "nv-col"; }
+    static get originalStyleUrls() {
+        return {
+            "$": ["./nv-col.scss"]
+        };
+    }
+    static get styleUrls() {
+        return {
+            "$": ["nv-col.css"]
+        };
+    }
+    static get properties() {
+        return {
+            "size": {
+                "type": "number",
+                "mutable": false,
+                "complexType": {
+                    "original": "number",
+                    "resolved": "number",
+                    "references": {}
+                },
+                "required": false,
+                "optional": false,
+                "docs": {
+                    "tags": [],
+                    "text": "Defines the column size based on a 12 column grid system."
+                },
+                "attribute": "size",
+                "reflect": true
+            }
+        };
+    }
+}
+//# sourceMappingURL=nv-col.js.map

package/dist/collection/components/nv-col/nv-col.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"nv-col.js","sourceRoot":"","sources":["../../../src/components/nv-col/nv-col.tsx"],"names":[],"mappings":"AAAA,OAAO,EAAE,SAAS,EAAE,IAAI,EAAE,IAAI,EAAE,CAAC,EAAE,MAAM,eAAe,CAAC;AACzD,OAAO,IAAI,MAAM,MAAM,CAAC;AAExB;;GAEG;AAMH,MAAM,OAAO,KAAK;;;;IAUhB,uBAAuB;IACvB,8EAA8E;IAC9E,iBAAiB;IAEjB;;;OAGG;IACK,UAAU;QAChB,IAAI,IAAI,CAAC,IAAI,EAAE,CAAC;YACd,IAAI,IAAI,CAAC,IAAI,GAAG,CAAC,IAAI,IAAI,CAAC,IAAI,GAAG,EAAE;gBAAE,OAAO;YAC5C,OAAO,KAAK,IAAI,CAAC,IAAI,KAAK,CAAC;QAC7B,CAAC;IACH,CAAC;IAED,oBAAoB;IACpB,8EAA8E;IAC9E,gBAAgB;IAEhB,MAAM;QACJ,OAAO,CACL,EAAC,IAAI,qDAAC,KAAK,EAAE,IAAI,CAAC,IAAI,CAAC,UAAU,EAAE,CAAC;YAClC,8DAAa,CACR,CACR,CAAC;IACJ,CAAC;;;;;;;;;;;;;;;;;;;;;;;;;;;CAGF","sourcesContent":["import { Component, Host, Prop, h } from '@stencil/core';\nimport clsx from 'clsx';\n\n/**\n * @slot default - The column content.\n */\n@Component({\n  tag: 'nv-col',\n  styleUrl: './nv-col.scss',\n  shadow: false,\n})\nexport class NvCol {\n  /****************************************************************************/\n  //#region PROPERTIES\n\n  /**\n   * Defines the column size based on a 12 column grid system.\n   */\n  @Prop({ reflect: true })\n  readonly size: number;\n\n  //#endregion PROPERTIES\n  /****************************************************************************/\n  //#region METHODS\n\n  /**\n   * Get the column size class.\n   * @returns {string | undefined} The column size class.\n   */\n  private getColSize() {\n    if (this.size) {\n      if (this.size < 1 || this.size > 12) return;\n      return `w-${this.size}/12`;\n    }\n  }\n\n  //#endregion METHODS\n  /****************************************************************************/\n  //#region RENDER\n\n  render() {\n    return (\n      <Host class={clsx(this.getColSize())}>\n        <slot></slot>\n      </Host>\n    );\n  }\n\n  //#endregion RENDER\n}\n"]}

package/dist/collection/components/nv-fieldcheckbox/nv-fieldcheckbox.css

@@ -0,0 +1,136 @@
+nv-fieldcheckbox {
+  --nv-fieldcheckbox-border-default: var(--components-form-field-border-default);
+  --nv-fieldcheckbox-border-hover: var(--components-form-field-border-hover);
+  --nv-fieldcheckbox-border-focus: var(--components-form-field-border-default);
+  --nv-fieldcheckbox-background-default: var(--components-form-field-background-default);
+  --nv-fieldcheckbox-background-checked: var(--components-form-field-background-checked);
+  --nv-fieldcheckbox-background-disabled: var(--components-form-field-background-disabled);
+  --nv-fieldcheckbox-focus-box-shadow: var(--color-focus-brand);
+  --nv-fieldcheckbox-color-checked: var(--components-form-shape-foreground-default);
+  --nv-fieldcheckbox-color-disabled: var(--components-form-shape-foreground-disabled);
+  --nv-fieldcheckbox-outline-color: var(--color-focus-brand);
+  display: inline-flex;
+  align-items: flex-start;
+  gap: var(--form-gap-x);
+  position: relative;
+}
+nv-fieldcheckbox:not([disabled], [readonly]) input,
+nv-fieldcheckbox:not([disabled], [readonly]) label {
+  cursor: pointer;
+}
+nv-fieldcheckbox.error .input-container {
+  --nv-fieldcheckbox-border-default: var(--components-form-field-border-error);
+  --nv-fieldcheckbox-border-hover: var(--nv-fieldcheckbox-border-default);
+  --nv-fieldcheckbox-border-focus: var(--components-form-field-border-error);
+  --nv-fieldcheckbox-focus-box-shadow: var(--color-focus-destructive);
+  --nv-fieldcheckbox-color-disabled: var(--components-form-shape-foreground-disabled-error);
+  --nv-fieldcheckbox-background-checked: var(--components-form-field-background-error);
+  --nv-fieldcheckbox-outline-color: var(--color-focus-destructive);
+}
+nv-fieldcheckbox.label-placement-before {
+  flex-direction: row-reverse;
+}
+nv-fieldcheckbox[disabled] {
+  opacity: 0.5;
+}
+nv-fieldcheckbox label {
+  align-self: stretch;
+  color: var(--components-form-text-label-default);
+  font-family: "TT Norms Pro", sans-serif;
+  font-size: var(--form-label-font-size);
+  font-style: normal;
+  font-weight: var(--form-label-font-weight);
+  line-height: var(--form-label-line-height);
+}
+nv-fieldcheckbox .input-container {
+  position: relative;
+  color: var(--nv-fieldcheckbox-color-checked);
+}
+nv-fieldcheckbox .input-container input[type=checkbox][readonly] {
+  opacity: 0.5;
+}
+nv-fieldcheckbox .input-container:has(input[type=checkbox]:disabled:not([readonly])) {
+  color: var(--nv-fieldcheckbox-color-disabled);
+}
+nv-fieldcheckbox .input-container input[type=checkbox] {
+  appearance: none;
+  position: relative;
+  display: flex;
+  width: var(--form-checkbox-size);
+  height: var(--form-checkbox-size);
+  flex-direction: column;
+  align-items: flex-start;
+  border-radius: var(--form-checkbox-radius);
+  border-width: var(--form-checkbox-border-width);
+  border-style: solid;
+  border-color: var(--nv-fieldcheckbox-border-default);
+  background: var(--nv-fieldcheckbox-background-default);
+}
+nv-fieldcheckbox .input-container input[type=checkbox]:hover {
+  border-color: var(--nv-fieldcheckbox-border-hover);
+}
+nv-fieldcheckbox .input-container input[type=checkbox]:focus {
+  border-color: var(--nv-fieldcheckbox-border-focus);
+}
+nv-fieldcheckbox .input-container input[type=checkbox]:focus, nv-fieldcheckbox .input-container input[type=checkbox]:focus-within {
+  outline: none;
+}
+nv-fieldcheckbox .input-container input[type=checkbox]:focus-visible, nv-fieldcheckbox .input-container input[type=checkbox]:has(:focus-visible) {
+  outline: var(--focus-outline-stroke) solid var(--nv-fieldcheckbox-outline-color);
+  outline-offset: calc(var(--focus-outline-offset) * 1);
+}
+nv-fieldcheckbox .input-container input[type=checkbox]:checked, nv-fieldcheckbox .input-container input[type=checkbox]:indeterminate {
+  background: var(--nv-fieldcheckbox-background-checked);
+  border-color: var(--nv-fieldcheckbox-background-checked);
+}
+nv-fieldcheckbox .input-container input[type=checkbox]:disabled:not([readonly]) {
+  background: var(--nv-fieldcheckbox-background-disabled);
+  border-color: var(--nv-fieldcheckbox-border-default);
+}
+nv-fieldcheckbox .input-container input[type=checkbox][readonly] {
+  opacity: 0.5;
+}
+nv-fieldcheckbox .input-container .icon {
+  pointer-events: none;
+  position: absolute;
+  top: 0;
+  left: 0;
+  width: 100%;
+  height: 100%;
+  display: flex;
+  justify-content: center;
+  align-items: center;
+}
+nv-fieldcheckbox .input-container .icon svg {
+  width: var(--form-checkbox-icon-size);
+  height: var(--form-checkbox-icon-size);
+  fill: none;
+  stroke: currentcolor;
+  stroke-width: var(--form-checkbox-icon-stroke);
+  flex-shrink: 0;
+}
+nv-fieldcheckbox .description {
+  align-self: stretch;
+  color: var(--components-form-text-description-default);
+  font-family: "TT Norms Pro", sans-serif;
+  font-size: var(--form-description-font-size);
+  font-style: normal;
+  font-weight: var(--form-description-font-weight);
+  line-height: var(--form-description-line-height);
+}
+nv-fieldcheckbox .error-description {
+  align-self: stretch;
+  color: var(--components-form-text-description-default);
+  font-family: "TT Norms Pro", sans-serif;
+  font-size: var(--form-description-font-size);
+  font-style: normal;
+  font-weight: var(--form-description-font-weight);
+  line-height: var(--form-description-line-height);
+  color: var(--components-form-text-description-error);
+}
+nv-fieldcheckbox .text-container {
+  display: flex;
+  flex-direction: column;
+  align-items: flex-start;
+  flex: 1 0 0;
+}

package/dist/collection/components/nv-fieldcheckbox/nv-fieldcheckbox.docs.js

@@ -0,0 +1,231 @@
+import { h } from "@stencil/core";
+import { nameof } from "../../utils/class.utils";
+const NvFieldcheckboxDocs = {
+    component: 'nv-fieldcheckbox',
+    stories: [
+        {
+            name: 'Default',
+            args: {
+                checked: true,
+                label: 'Label checkbox',
+                description: 'Your description',
+            },
+            template: h("nv-fieldcheckbox", { "data-storybook-args": true }),
+        },
+        {
+            name: 'AllVariants',
+            template: (h("div", { "data-class": "flex flex-col gap-16" }, h("div", { "data-class": "flex gap-4 " }, h("nv-fieldcheckbox", { "data-storybook-args": true, name: "Unchecked", label: "Unchecked", "label-placement": "after", description: "Description" }), h("nv-fieldcheckbox", { "data-storybook-args": true, checked: true, name: "Checked", label: "Checked", "label-placement": "after", description: "Description" }), h("nv-fieldcheckbox", { "data-storybook-args": true, checked: true, name: "Indeterminate", label: "Indeterminate", indeterminate: true, "label-placement": "after", description: "Description" })), h("div", { "data-class": "flex gap-4 " }, h("nv-fieldcheckbox", { "data-storybook-args": true, required: true, name: "Unchecked required", label: "Unchecked required", "label-placement": "after", description: "Description" }), h("nv-fieldcheckbox", { "data-storybook-args": true, checked: true, required: true, name: "Checked required", label: "Checked required", "label-placement": "after", description: "Description" }), h("nv-fieldcheckbox", { "data-storybook-args": true, checked: true, required: true, name: "Indeterminate required", label: "Indeterminate required", indeterminate: true, "label-placement": "after", description: "Description" })), h("div", { "data-class": "flex gap-4 " }, h("nv-fieldcheckbox", { "data-storybook-args": true, disabled: true, name: "Unchecked disabled", label: "Unchecked disabled", "label-placement": "after", description: "Description" }), h("nv-fieldcheckbox", { "data-storybook-args": true, checked: true, disabled: true, name: "Checked disabled", label: "Checked disabled", "label-placement": "after", description: "Description" }), h("nv-fieldcheckbox", { "data-storybook-args": true, checked: true, disabled: true, name: "Indeterminate disabled", label: "Indeterminate disabled", indeterminate: true, "label-placement": "after", description: "Description" })), h("div", { "data-class": "flex gap-4 " }, h("nv-fieldcheckbox", { "data-storybook-args": true, readonly: true, name: "Unchecked readonly", label: "Unchecked readonly", "label-placement": "after", description: "Description" }), h("nv-fieldcheckbox", { "data-storybook-args": true, checked: true, readonly: true, name: "Checked readonly", label: "Checked readonly", "label-placement": "after", description: "Description" }), h("nv-fieldcheckbox", { "data-storybook-args": true, checked: true, readonly: true, name: "Indeterminate readonly", label: "Indeterminate readonly", indeterminate: true, "label-placement": "after", description: "Description" })), h("div", { "data-class": "flex gap-4 " }, h("nv-fieldcheckbox", { "data-storybook-args": true, error: true, "error-description": "An error occurred", name: "Unchecked error", label: "Unchecked error", "label-placement": "after", description: "Description" }), h("nv-fieldcheckbox", { "data-storybook-args": true, checked: true, error: true, "error-description": "An error occurred", name: "Checked error", label: "Checked error", "label-placement": "after", description: "Description" }), h("nv-fieldcheckbox", { "data-storybook-args": true, checked: true, error: true, "error-description": "An error occurred", name: "Indeterminate error", label: "Indeterminate error", indeterminate: true, "label-placement": "after", description: "Description" })), h("div", { "data-class": "flex gap-4 " }, h("nv-fieldcheckbox", { "data-storybook-args": true, error: true, "error-description": "An error occurred", disabled: true, name: "Unchecked disabled error", label: "Unchecked disabled error", "label-placement": "after", description: "Description" }), h("nv-fieldcheckbox", { "data-storybook-args": true, checked: true, error: true, "error-description": "An error occurred", disabled: true, name: "Checked disabled error", label: "Checked disabled error", "label-placement": "after", description: "Description" }), h("nv-fieldcheckbox", { "data-storybook-args": true, checked: true, error: true, "error-description": "An error occurred", disabled: true, name: "Indeterminate disabled error", label: "Indeterminate disabled error", indeterminate: true, "label-placement": "after", description: "Description" })), h("div", { "data-class": "flex gap-4 " }, h("nv-fieldcheckbox", { "data-storybook-args": true, error: true, "error-description": "An error occurred", readonly: true, name: "Unchecked readonly error", label: "Unchecked readonly error", "label-placement": "after", description: "Description" }), h("nv-fieldcheckbox", { "data-storybook-args": true, checked: true, error: true, "error-description": "An error occurred", readonly: true, name: "Checked readonly error", label: "Checked readonly error", "label-placement": "after", description: "Description" }), h("nv-fieldcheckbox", { "data-storybook-args": true, checked: true, error: true, "error-description": "An error occurred", readonly: true, name: "Indeterminate readonly error", label: "Indeterminate readonly error", indeterminate: true, "label-placement": "after", description: "Description" })), h("div", { "data-class": "flex gap-4 " }, h("nv-fieldcheckbox", { "data-storybook-args": true, name: "Unchecked", label: "Unchecked", "label-placement": "before", description: "Description" }), h("nv-fieldcheckbox", { "data-storybook-args": true, checked: true, name: "Checked", label: "Checked", "label-placement": "before", description: "Description" }), h("nv-fieldcheckbox", { "data-storybook-args": true, checked: true, name: "Indeterminate", label: "Indeterminate", indeterminate: true, "label-placement": "before", description: "Description" })), h("div", { "data-class": "flex gap-4 " }, h("nv-fieldcheckbox", { "data-storybook-args": true, required: true, name: "Unchecked required", label: "Unchecked required", "label-placement": "before", description: "Description" }), h("nv-fieldcheckbox", { "data-storybook-args": true, checked: true, required: true, name: "Checked required", label: "Checked required", "label-placement": "before", description: "Description" }), h("nv-fieldcheckbox", { "data-storybook-args": true, checked: true, required: true, name: "Indeterminate required", label: "Indeterminate required", indeterminate: true, "label-placement": "before", description: "Description" })), h("div", { "data-class": "flex gap-4 " }, h("nv-fieldcheckbox", { "data-storybook-args": true, disabled: true, name: "Unchecked disabled", label: "Unchecked disabled", "label-placement": "before", description: "Description" }), h("nv-fieldcheckbox", { "data-storybook-args": true, checked: true, disabled: true, name: "Checked disabled", label: "Checked disabled", "label-placement": "before", description: "Description" }), h("nv-fieldcheckbox", { "data-storybook-args": true, checked: true, disabled: true, name: "Indeterminate disabled", label: "Indeterminate disabled", indeterminate: true, "label-placement": "before", description: "Description" })), h("div", { "data-class": "flex gap-4 " }, h("nv-fieldcheckbox", { "data-storybook-args": true, readonly: true, name: "Unchecked readonly", label: "Unchecked readonly", "label-placement": "before", description: "Description" }), h("nv-fieldcheckbox", { "data-storybook-args": true, checked: true, readonly: true, name: "Checked readonly", label: "Checked readonly", "label-placement": "before", description: "Description" }), h("nv-fieldcheckbox", { "data-storybook-args": true, checked: true, readonly: true, name: "Indeterminate readonly", label: "Indeterminate readonly", indeterminate: true, "label-placement": "before", description: "Description" })), h("div", { "data-class": "flex gap-4 " }, h("nv-fieldcheckbox", { "data-storybook-args": true, error: true, "error-description": "An error occurred", name: "Unchecked error", label: "Unchecked error", "label-placement": "before", description: "Description" }), h("nv-fieldcheckbox", { "data-storybook-args": true, checked: true, error: true, "error-description": "An error occurred", name: "Checked error", label: "Checked error", "label-placement": "before", description: "Description" }), h("nv-fieldcheckbox", { "data-storybook-args": true, checked: true, error: true, "error-description": "An error occurred", name: "Indeterminate error", label: "Indeterminate error", indeterminate: true, "label-placement": "before", description: "Description" })), h("div", { "data-class": "flex gap-4 " }, h("nv-fieldcheckbox", { "data-storybook-args": true, error: true, "error-description": "An error occurred", disabled: true, name: "Unchecked disabled error", label: "Unchecked disabled error", "label-placement": "before", description: "Description" }), h("nv-fieldcheckbox", { "data-storybook-args": true, checked: true, error: true, "error-description": "An error occurred", disabled: true, name: "Checked disabled error", label: "Checked disabled error", "label-placement": "before", description: "Description" }), h("nv-fieldcheckbox", { "data-storybook-args": true, checked: true, error: true, "error-description": "An error occurred", disabled: true, name: "Indeterminate disabled error", label: "Indeterminate disabled error", indeterminate: true, "label-placement": "before", description: "Description" })), h("div", { "data-class": "flex gap-4 " }, h("nv-fieldcheckbox", { "data-storybook-args": true, error: true, "error-description": "An error occurred", readonly: true, name: "Unchecked readonly error", label: "Unchecked readonly error", "label-placement": "before", description: "Description" }), h("nv-fieldcheckbox", { "data-storybook-args": true, checked: true, error: true, "error-description": "An error occurred", readonly: true, name: "Checked readonly error", label: "Checked readonly error", "label-placement": "before", description: "Description" }), h("nv-fieldcheckbox", { "data-storybook-args": true, checked: true, error: true, "error-description": "An error occurred", readonly: true, name: "Indeterminate readonly error", label: "Indeterminate readonly error", indeterminate: true, "label-placement": "before", description: "Description" })))),
+        },
+        {
+            name: nameof(x => x.checked),
+            args: {
+                checked: true,
+                name: 'checkbox-default',
+                label: 'Default Checked',
+                description: 'This is a default checked checkbox',
+                error: false,
+                errorDescription: '',
+                indeterminate: false,
+                disabled: false,
+                readonly: false,
+                required: false,
+            },
+            template: (h("nv-fieldcheckbox", { id: "default-checked", "data-storybook-args": true })),
+        },
+        {
+            name: 'Unchecked',
+            args: {
+                checked: false,
+                name: 'checkbox-unchecked',
+                label: 'Unchecked Checkbox',
+                description: 'This is an unchecked checkbox',
+                error: false,
+                errorDescription: '',
+                indeterminate: false,
+                disabled: false,
+                readonly: false,
+                required: false,
+            },
+            template: (h("nv-fieldcheckbox", { id: "unchecked", "data-storybook-args": true })),
+        },
+        {
+            name: nameof(x => x.indeterminate),
+            args: {
+                checked: false,
+                name: 'checkbox-indeterminate',
+                label: 'Indeterminate Checkbox',
+                description: 'This is an indeterminate checkbox',
+                error: false,
+                errorDescription: '',
+                indeterminate: true,
+                disabled: false,
+                readonly: false,
+                required: false,
+            },
+            template: (h("nv-fieldcheckbox", { id: "indeterminate", "data-storybook-args": true })),
+        },
+        {
+            name: nameof(x => x.label),
+            args: {
+                checked: true,
+                name: 'checkbox-default',
+                label: 'Checkbox with label',
+            },
+            template: (h("nv-fieldcheckbox", { id: "default-checked", "data-storybook-args": true })),
+        },
+        {
+            name: nameof(x => x.description),
+            args: {
+                checked: true,
+                name: 'checkbox-default',
+                description: 'This is a checkbox with a description',
+                label: 'Checkbox',
+            },
+            template: (h("nv-fieldcheckbox", { id: "default-checked", "data-storybook-args": true })),
+        },
+        {
+            name: 'DisabledChecked',
+            args: {
+                checked: true,
+                name: 'checkbox-disabled-checked',
+                label: 'Disabled Checked',
+                description: 'This is a disabled checked checkbox',
+                error: false,
+                errorDescription: '',
+                indeterminate: false,
+                disabled: true,
+                readonly: false,
+                required: false,
+            },
+            template: (h("nv-fieldcheckbox", { id: "disabled-checked", "data-storybook-args": true })),
+        },
+        {
+            name: 'DisabledAndError',
+            args: {
+                checked: false,
+                name: 'checkbox-disabled-error',
+                label: 'Disabled and Error',
+                description: 'This checkbox is disabled with an error',
+                error: true,
+                errorDescription: 'An error occurred',
+                indeterminate: false,
+                disabled: true,
+                readonly: false,
+                required: false,
+            },
+            template: (h("nv-fieldcheckbox", { id: "disabled-error", "data-storybook-args": true })),
+        },
+        {
+            name: 'ReadonlyChecked',
+            args: {
+                checked: true,
+                name: 'checkbox-readonly-checked',
+                label: 'Readonly Checked',
+                description: 'This is a readonly checked checkbox',
+                error: false,
+                errorDescription: '',
+                indeterminate: false,
+                disabled: false,
+                readonly: true,
+                required: false,
+            },
+            template: (h("nv-fieldcheckbox", { id: "readonly-checked", "data-storybook-args": true })),
+        },
+        {
+            name: 'ErrorState',
+            args: {
+                checked: false,
+                name: 'checkbox-error',
+                label: 'Error Checkbox',
+                description: 'This checkbox has an error',
+                error: true,
+                errorDescription: 'An error occurred',
+                indeterminate: false,
+                disabled: false,
+                readonly: false,
+                required: false,
+            },
+            template: (h("nv-fieldcheckbox", { id: "error", "data-storybook-args": true })),
+        },
+        {
+            name: nameof(x => x.required),
+            args: {
+                checked: false,
+                name: 'checkbox-required',
+                label: 'Required Checkbox',
+                description: 'This is a required checkbox',
+                error: false,
+                errorDescription: '',
+                indeterminate: false,
+                disabled: false,
+                readonly: false,
+                required: true,
+            },
+            template: (h("nv-fieldcheckbox", { id: "required", "data-storybook-args": true })),
+        },
+        {
+            name: nameof(x => x.hideLabel),
+            args: {
+                checked: false,
+                name: 'checkbox-hidden-label',
+                label: 'Hidden Label',
+                error: false,
+                errorDescription: '',
+                indeterminate: false,
+                disabled: false,
+                readonly: false,
+                required: false,
+                hideLabel: true,
+            },
+            template: (h("nv-fieldcheckbox", { id: "hidden-label", "data-storybook-args": true })),
+        },
+        {
+            name: nameof(x => x.labelPlacement),
+            args: {
+                checked: false,
+                name: 'checkbox-hidden-label',
+                label: 'Hidden Label',
+                labelPlacement: 'before',
+                description: 'This checkbox has a label placement end',
+                error: false,
+                errorDescription: '',
+                indeterminate: false,
+                disabled: false,
+                readonly: false,
+                required: false,
+                hideLabel: false,
+            },
+            template: (h("nv-fieldcheckbox", { id: "hidden-label", "data-storybook-args": true })),
+        },
+        {
+            name: 'SlotLabel',
+            description: 'Checkbox button replacing the label with custom html.',
+            args: {
+                label: 'Label',
+            },
+            template: (h("nv-fieldcheckbox", { "data-storybook-args": true }, h("span", { slot: "label" }, "Custom Label"))),
+        },
+        {
+            name: 'SlotDescription',
+            description: 'Checkbox button replacing the description with custom html.',
+            args: {
+                label: 'Label',
+                description: 'Description',
+                error: true,
+            },
+            template: (h("nv-fieldcheckbox", { "data-storybook-args": true }, h("span", { slot: "description" }, "Custom Description"))),
+        },
+        {
+            name: 'SlotErrorDescription',
+            description: 'Checkbox button replacing the error description with custom html.',
+            args: {
+                label: 'Label',
+                error: true,
+                errorDescription: 'Error Description',
+            },
+            template: (h("nv-fieldcheckbox", { "data-storybook-args": true }, h("span", { slot: "error-description" }, "Custom Error Description"))),
+        },
+    ],
+};
+export default NvFieldcheckboxDocs;
+//# sourceMappingURL=nv-fieldcheckbox.docs.js.map

package/dist/collection/components/nv-fieldcheckbox/nv-fieldcheckbox.docs.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"nv-fieldcheckbox.docs.js","sourceRoot":"","sources":["../../../src/components/nv-fieldcheckbox/nv-fieldcheckbox.docs.tsx"],"names":[],"mappings":"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","sourcesContent":["import { h } from '@stencil/core';\nimport type { NovaDocs } from '../../nova-docs';\nimport { Components } from '../../components';\nimport { nameof } from '../../utils/class.utils';\n\nconst NvFieldcheckboxDocs: NovaDocs<Components.NvFieldcheckbox> = {\n  component: 'nv-fieldcheckbox',\n  stories: [\n    {\n      name: 'Default',\n      args: {\n        checked: true,\n        label: 'Label checkbox',\n        description: 'Your description',\n      },\n      template: <nv-fieldcheckbox data-storybook-args></nv-fieldcheckbox>,\n    },\n    {\n      name: 'AllVariants',\n      template: (\n        <div data-class=\"flex flex-col gap-16\">\n          <div data-class=\"flex gap-4 \">\n            <nv-fieldcheckbox\n              data-storybook-args\n              name=\"Unchecked\"\n              label=\"Unchecked\"\n              label-placement=\"after\"\n              description=\"Description\"\n            ></nv-fieldcheckbox>\n            <nv-fieldcheckbox\n              data-storybook-args\n              checked\n              name=\"Checked\"\n              label=\"Checked\"\n              label-placement=\"after\"\n              description=\"Description\"\n            ></nv-fieldcheckbox>\n            <nv-fieldcheckbox\n              data-storybook-args\n              checked\n              name=\"Indeterminate\"\n              label=\"Indeterminate\"\n              indeterminate\n              label-placement=\"after\"\n              description=\"Description\"\n            ></nv-fieldcheckbox>\n          </div>\n          <div data-class=\"flex gap-4 \">\n            <nv-fieldcheckbox\n              data-storybook-args\n              required\n              name=\"Unchecked required\"\n              label=\"Unchecked required\"\n              label-placement=\"after\"\n              description=\"Description\"\n            ></nv-fieldcheckbox>\n            <nv-fieldcheckbox\n              data-storybook-args\n              checked\n              required\n              name=\"Checked required\"\n              label=\"Checked required\"\n              label-placement=\"after\"\n              description=\"Description\"\n            ></nv-fieldcheckbox>\n            <nv-fieldcheckbox\n              data-storybook-args\n              checked\n              required\n              name=\"Indeterminate required\"\n              label=\"Indeterminate required\"\n              indeterminate\n              label-placement=\"after\"\n              description=\"Description\"\n            ></nv-fieldcheckbox>\n          </div>\n          <div data-class=\"flex gap-4 \">\n            <nv-fieldcheckbox\n              data-storybook-args\n              disabled\n              name=\"Unchecked disabled\"\n              label=\"Unchecked disabled\"\n              label-placement=\"after\"\n              description=\"Description\"\n            ></nv-fieldcheckbox>\n            <nv-fieldcheckbox\n              data-storybook-args\n              checked\n              disabled\n              name=\"Checked disabled\"\n              label=\"Checked disabled\"\n              label-placement=\"after\"\n              description=\"Description\"\n            ></nv-fieldcheckbox>\n            <nv-fieldcheckbox\n              data-storybook-args\n              checked\n              disabled\n              name=\"Indeterminate disabled\"\n              label=\"Indeterminate disabled\"\n              indeterminate\n              label-placement=\"after\"\n              description=\"Description\"\n            ></nv-fieldcheckbox>\n          </div>\n          <div data-class=\"flex gap-4 \">\n            <nv-fieldcheckbox\n              data-storybook-args\n              readonly\n              name=\"Unchecked readonly\"\n              label=\"Unchecked readonly\"\n              label-placement=\"after\"\n              description=\"Description\"\n            ></nv-fieldcheckbox>\n            <nv-fieldcheckbox\n              data-storybook-args\n              checked\n              readonly\n              name=\"Checked readonly\"\n              label=\"Checked readonly\"\n              label-placement=\"after\"\n              description=\"Description\"\n            ></nv-fieldcheckbox>\n            <nv-fieldcheckbox\n              data-storybook-args\n              checked\n              readonly\n              name=\"Indeterminate readonly\"\n              label=\"Indeterminate readonly\"\n              indeterminate\n              label-placement=\"after\"\n              description=\"Description\"\n            ></nv-fieldcheckbox>\n          </div>\n          <div data-class=\"flex gap-4 \">\n            <nv-fieldcheckbox\n              data-storybook-args\n              error\n              error-description=\"An error occurred\"\n              name=\"Unchecked error\"\n              label=\"Unchecked error\"\n              label-placement=\"after\"\n              description=\"Description\"\n            ></nv-fieldcheckbox>\n            <nv-fieldcheckbox\n              data-storybook-args\n              checked\n              error\n              error-description=\"An error occurred\"\n              name=\"Checked error\"\n              label=\"Checked error\"\n              label-placement=\"after\"\n              description=\"Description\"\n            ></nv-fieldcheckbox>\n            <nv-fieldcheckbox\n              data-storybook-args\n              checked\n              error\n              error-description=\"An error occurred\"\n              name=\"Indeterminate error\"\n              label=\"Indeterminate error\"\n              indeterminate\n              label-placement=\"after\"\n              description=\"Description\"\n            ></nv-fieldcheckbox>\n          </div>\n          <div data-class=\"flex gap-4 \">\n            <nv-fieldcheckbox\n              data-storybook-args\n              error\n              error-description=\"An error occurred\"\n              disabled\n              name=\"Unchecked disabled error\"\n              label=\"Unchecked disabled error\"\n              label-placement=\"after\"\n              description=\"Description\"\n            ></nv-fieldcheckbox>\n            <nv-fieldcheckbox\n              data-storybook-args\n              checked\n              error\n              error-description=\"An error occurred\"\n              disabled\n              name=\"Checked disabled error\"\n              label=\"Checked disabled error\"\n              label-placement=\"after\"\n              description=\"Description\"\n            ></nv-fieldcheckbox>\n            <nv-fieldcheckbox\n              data-storybook-args\n              checked\n              error\n              error-description=\"An error occurred\"\n              disabled\n              name=\"Indeterminate disabled error\"\n              label=\"Indeterminate disabled error\"\n              indeterminate\n              label-placement=\"after\"\n              description=\"Description\"\n            ></nv-fieldcheckbox>\n          </div>\n          <div data-class=\"flex gap-4 \">\n            <nv-fieldcheckbox\n              data-storybook-args\n              error\n              error-description=\"An error occurred\"\n              readonly\n              name=\"Unchecked readonly error\"\n              label=\"Unchecked readonly error\"\n              label-placement=\"after\"\n              description=\"Description\"\n            ></nv-fieldcheckbox>\n            <nv-fieldcheckbox\n              data-storybook-args\n              checked\n              error\n              error-description=\"An error occurred\"\n              readonly\n              name=\"Checked readonly error\"\n              label=\"Checked readonly error\"\n              label-placement=\"after\"\n              description=\"Description\"\n            ></nv-fieldcheckbox>\n            <nv-fieldcheckbox\n              data-storybook-args\n              checked\n              error\n              error-description=\"An error occurred\"\n              readonly\n              name=\"Indeterminate readonly error\"\n              label=\"Indeterminate readonly error\"\n              indeterminate\n              label-placement=\"after\"\n              description=\"Description\"\n            ></nv-fieldcheckbox>\n          </div>\n          <div data-class=\"flex gap-4 \">\n            <nv-fieldcheckbox\n              data-storybook-args\n              name=\"Unchecked\"\n              label=\"Unchecked\"\n              label-placement=\"before\"\n              description=\"Description\"\n            ></nv-fieldcheckbox>\n            <nv-fieldcheckbox\n              data-storybook-args\n              checked\n              name=\"Checked\"\n              label=\"Checked\"\n              label-placement=\"before\"\n              description=\"Description\"\n            ></nv-fieldcheckbox>\n            <nv-fieldcheckbox\n              data-storybook-args\n              checked\n              name=\"Indeterminate\"\n              label=\"Indeterminate\"\n              indeterminate\n              label-placement=\"before\"\n              description=\"Description\"\n            ></nv-fieldcheckbox>\n          </div>\n          <div data-class=\"flex gap-4 \">\n            <nv-fieldcheckbox\n              data-storybook-args\n              required\n              name=\"Unchecked required\"\n              label=\"Unchecked required\"\n              label-placement=\"before\"\n              description=\"Description\"\n            ></nv-fieldcheckbox>\n            <nv-fieldcheckbox\n              data-storybook-args\n              checked\n              required\n              name=\"Checked required\"\n              label=\"Checked required\"\n              label-placement=\"before\"\n              description=\"Description\"\n            ></nv-fieldcheckbox>\n            <nv-fieldcheckbox\n              data-storybook-args\n              checked\n              required\n              name=\"Indeterminate required\"\n              label=\"Indeterminate required\"\n              indeterminate\n              label-placement=\"before\"\n              description=\"Description\"\n            ></nv-fieldcheckbox>\n          </div>\n          <div data-class=\"flex gap-4 \">\n            <nv-fieldcheckbox\n              data-storybook-args\n              disabled\n              name=\"Unchecked disabled\"\n              label=\"Unchecked disabled\"\n              label-placement=\"before\"\n              description=\"Description\"\n            ></nv-fieldcheckbox>\n            <nv-fieldcheckbox\n              data-storybook-args\n              checked\n              disabled\n              name=\"Checked disabled\"\n              label=\"Checked disabled\"\n              label-placement=\"before\"\n              description=\"Description\"\n            ></nv-fieldcheckbox>\n            <nv-fieldcheckbox\n              data-storybook-args\n              checked\n              disabled\n              name=\"Indeterminate disabled\"\n              label=\"Indeterminate disabled\"\n              indeterminate\n              label-placement=\"before\"\n              description=\"Description\"\n            ></nv-fieldcheckbox>\n          </div>\n          <div data-class=\"flex gap-4 \">\n            <nv-fieldcheckbox\n              data-storybook-args\n              readonly\n              name=\"Unchecked readonly\"\n              label=\"Unchecked readonly\"\n              label-placement=\"before\"\n              description=\"Description\"\n            ></nv-fieldcheckbox>\n            <nv-fieldcheckbox\n              data-storybook-args\n              checked\n              readonly\n              name=\"Checked readonly\"\n              label=\"Checked readonly\"\n              label-placement=\"before\"\n              description=\"Description\"\n            ></nv-fieldcheckbox>\n            <nv-fieldcheckbox\n              data-storybook-args\n              checked\n              readonly\n              name=\"Indeterminate readonly\"\n              label=\"Indeterminate readonly\"\n              indeterminate\n              label-placement=\"before\"\n              description=\"Description\"\n            ></nv-fieldcheckbox>\n          </div>\n          <div data-class=\"flex gap-4 \">\n            <nv-fieldcheckbox\n              data-storybook-args\n              error\n              error-description=\"An error occurred\"\n              name=\"Unchecked error\"\n              label=\"Unchecked error\"\n              label-placement=\"before\"\n              description=\"Description\"\n            ></nv-fieldcheckbox>\n            <nv-fieldcheckbox\n              data-storybook-args\n              checked\n              error\n              error-description=\"An error occurred\"\n              name=\"Checked error\"\n              label=\"Checked error\"\n              label-placement=\"before\"\n              description=\"Description\"\n            ></nv-fieldcheckbox>\n            <nv-fieldcheckbox\n              data-storybook-args\n              checked\n              error\n              error-description=\"An error occurred\"\n              name=\"Indeterminate error\"\n              label=\"Indeterminate error\"\n              indeterminate\n              label-placement=\"before\"\n              description=\"Description\"\n            ></nv-fieldcheckbox>\n          </div>\n          <div data-class=\"flex gap-4 \">\n            <nv-fieldcheckbox\n              data-storybook-args\n              error\n              error-description=\"An error occurred\"\n              disabled\n              name=\"Unchecked disabled error\"\n              label=\"Unchecked disabled error\"\n              label-placement=\"before\"\n              description=\"Description\"\n            ></nv-fieldcheckbox>\n            <nv-fieldcheckbox\n              data-storybook-args\n              checked\n              error\n              error-description=\"An error occurred\"\n              disabled\n              name=\"Checked disabled error\"\n              label=\"Checked disabled error\"\n              label-placement=\"before\"\n              description=\"Description\"\n            ></nv-fieldcheckbox>\n            <nv-fieldcheckbox\n              data-storybook-args\n              checked\n              error\n              error-description=\"An error occurred\"\n              disabled\n              name=\"Indeterminate disabled error\"\n              label=\"Indeterminate disabled error\"\n              indeterminate\n              label-placement=\"before\"\n              description=\"Description\"\n            ></nv-fieldcheckbox>\n          </div>\n          <div data-class=\"flex gap-4 \">\n            <nv-fieldcheckbox\n              data-storybook-args\n              error\n              error-description=\"An error occurred\"\n              readonly\n              name=\"Unchecked readonly error\"\n              label=\"Unchecked readonly error\"\n              label-placement=\"before\"\n              description=\"Description\"\n            ></nv-fieldcheckbox>\n            <nv-fieldcheckbox\n              data-storybook-args\n              checked\n              error\n              error-description=\"An error occurred\"\n              readonly\n              name=\"Checked readonly error\"\n              label=\"Checked readonly error\"\n              label-placement=\"before\"\n              description=\"Description\"\n            ></nv-fieldcheckbox>\n            <nv-fieldcheckbox\n              data-storybook-args\n              checked\n              error\n              error-description=\"An error occurred\"\n              readonly\n              name=\"Indeterminate readonly error\"\n              label=\"Indeterminate readonly error\"\n              indeterminate\n              label-placement=\"before\"\n              description=\"Description\"\n            ></nv-fieldcheckbox>\n          </div>\n        </div>\n      ),\n    },\n    {\n      name: nameof<Components.NvFieldcheckbox>(x => x.checked),\n      args: {\n        checked: true,\n        name: 'checkbox-default',\n        label: 'Default Checked',\n        description: 'This is a default checked checkbox',\n        error: false,\n        errorDescription: '',\n        indeterminate: false,\n        disabled: false,\n        readonly: false,\n        required: false,\n      },\n      template: (\n        <nv-fieldcheckbox\n          id=\"default-checked\"\n          data-storybook-args\n        ></nv-fieldcheckbox>\n      ),\n    },\n    {\n      name: 'Unchecked',\n      args: {\n        checked: false,\n        name: 'checkbox-unchecked',\n        label: 'Unchecked Checkbox',\n        description: 'This is an unchecked checkbox',\n        error: false,\n        errorDescription: '',\n        indeterminate: false,\n        disabled: false,\n        readonly: false,\n        required: false,\n      },\n      template: (\n        <nv-fieldcheckbox id=\"unchecked\" data-storybook-args></nv-fieldcheckbox>\n      ),\n    },\n    {\n      name: nameof<Components.NvFieldcheckbox>(x => x.indeterminate),\n      args: {\n        checked: false,\n        name: 'checkbox-indeterminate',\n        label: 'Indeterminate Checkbox',\n        description: 'This is an indeterminate checkbox',\n        error: false,\n        errorDescription: '',\n        indeterminate: true,\n        disabled: false,\n        readonly: false,\n        required: false,\n      },\n      template: (\n        <nv-fieldcheckbox\n          id=\"indeterminate\"\n          data-storybook-args\n        ></nv-fieldcheckbox>\n      ),\n    },\n    {\n      name: nameof<Components.NvFieldcheckbox>(x => x.label),\n      args: {\n        checked: true,\n        name: 'checkbox-default',\n        label: 'Checkbox with label',\n      },\n      template: (\n        <nv-fieldcheckbox\n          id=\"default-checked\"\n          data-storybook-args\n        ></nv-fieldcheckbox>\n      ),\n    },\n    {\n      name: nameof<Components.NvFieldcheckbox>(x => x.description),\n      args: {\n        checked: true,\n        name: 'checkbox-default',\n        description: 'This is a checkbox with a description',\n        label: 'Checkbox',\n      },\n      template: (\n        <nv-fieldcheckbox\n          id=\"default-checked\"\n          data-storybook-args\n        ></nv-fieldcheckbox>\n      ),\n    },\n    {\n      name: 'DisabledChecked',\n      args: {\n        checked: true,\n        name: 'checkbox-disabled-checked',\n        label: 'Disabled Checked',\n        description: 'This is a disabled checked checkbox',\n        error: false,\n        errorDescription: '',\n        indeterminate: false,\n        disabled: true,\n        readonly: false,\n        required: false,\n      },\n      template: (\n        <nv-fieldcheckbox\n          id=\"disabled-checked\"\n          data-storybook-args\n        ></nv-fieldcheckbox>\n      ),\n    },\n    {\n      name: 'DisabledAndError',\n      args: {\n        checked: false,\n        name: 'checkbox-disabled-error',\n        label: 'Disabled and Error',\n        description: 'This checkbox is disabled with an error',\n        error: true,\n        errorDescription: 'An error occurred',\n        indeterminate: false,\n        disabled: true,\n        readonly: false,\n        required: false,\n      },\n      template: (\n        <nv-fieldcheckbox\n          id=\"disabled-error\"\n          data-storybook-args\n        ></nv-fieldcheckbox>\n      ),\n    },\n    {\n      name: 'ReadonlyChecked',\n      args: {\n        checked: true,\n        name: 'checkbox-readonly-checked',\n        label: 'Readonly Checked',\n        description: 'This is a readonly checked checkbox',\n        error: false,\n        errorDescription: '',\n        indeterminate: false,\n        disabled: false,\n        readonly: true,\n        required: false,\n      },\n      template: (\n        <nv-fieldcheckbox\n          id=\"readonly-checked\"\n          data-storybook-args\n        ></nv-fieldcheckbox>\n      ),\n    },\n    {\n      name: 'ErrorState',\n      args: {\n        checked: false,\n        name: 'checkbox-error',\n        label: 'Error Checkbox',\n        description: 'This checkbox has an error',\n        error: true,\n        errorDescription: 'An error occurred',\n        indeterminate: false,\n        disabled: false,\n        readonly: false,\n        required: false,\n      },\n      template: (\n        <nv-fieldcheckbox id=\"error\" data-storybook-args></nv-fieldcheckbox>\n      ),\n    },\n    {\n      name: nameof<Components.NvFieldcheckbox>(x => x.required),\n      args: {\n        checked: false,\n        name: 'checkbox-required',\n        label: 'Required Checkbox',\n        description: 'This is a required checkbox',\n        error: false,\n        errorDescription: '',\n        indeterminate: false,\n        disabled: false,\n        readonly: false,\n        required: true,\n      },\n      template: (\n        <nv-fieldcheckbox id=\"required\" data-storybook-args></nv-fieldcheckbox>\n      ),\n    },\n    {\n      name: nameof<Components.NvFieldcheckbox>(x => x.hideLabel),\n      args: {\n        checked: false,\n        name: 'checkbox-hidden-label',\n        label: 'Hidden Label',\n        error: false,\n        errorDescription: '',\n        indeterminate: false,\n        disabled: false,\n        readonly: false,\n        required: false,\n        hideLabel: true,\n      },\n      template: (\n        <nv-fieldcheckbox\n          id=\"hidden-label\"\n          data-storybook-args\n        ></nv-fieldcheckbox>\n      ),\n    },\n    {\n      name: nameof<Components.NvFieldcheckbox>(x => x.labelPlacement),\n      args: {\n        checked: false,\n        name: 'checkbox-hidden-label',\n        label: 'Hidden Label',\n        labelPlacement: 'before',\n        description: 'This checkbox has a label placement end',\n        error: false,\n        errorDescription: '',\n        indeterminate: false,\n        disabled: false,\n        readonly: false,\n        required: false,\n        hideLabel: false,\n      },\n      template: (\n        <nv-fieldcheckbox\n          id=\"hidden-label\"\n          data-storybook-args\n        ></nv-fieldcheckbox>\n      ),\n    },\n    {\n      name: 'SlotLabel',\n      description: 'Checkbox button replacing the label with custom html.',\n      args: {\n        label: 'Label',\n      },\n      template: (\n        <nv-fieldcheckbox data-storybook-args>\n          <span slot=\"label\">Custom Label</span>\n        </nv-fieldcheckbox>\n      ),\n    },\n    {\n      name: 'SlotDescription',\n      description:\n        'Checkbox button replacing the description with custom html.',\n      args: {\n        label: 'Label',\n        description: 'Description',\n        error: true,\n      },\n      template: (\n        <nv-fieldcheckbox data-storybook-args>\n          <span slot=\"description\">Custom Description</span>\n        </nv-fieldcheckbox>\n      ),\n    },\n    {\n      name: 'SlotErrorDescription',\n      description:\n        'Checkbox button replacing the error description with custom html.',\n      args: {\n        label: 'Label',\n        error: true,\n        errorDescription: 'Error Description',\n      },\n      template: (\n        <nv-fieldcheckbox data-storybook-args>\n          <span slot=\"error-description\">Custom Error Description</span>\n        </nv-fieldcheckbox>\n      ),\n    },\n  ],\n};\n\nexport default NvFieldcheckboxDocs;\n"]}