@nanoporetech-digital/components 4.4.0 → 4.5.0

package/dist/types/components.d.ts

@@ -49,6 +49,10 @@ export namespace Components {
           * Hides the alert
          */
         "hide": () => Promise<boolean>;
+        /**
+          * Relocate the dialog to the root of the DOM. Most useful in conjunction with `alert()` when parental elements have css stacking constraints which don't allow for `position: fixed`
+         */
+        "hoist": boolean;
         /**
           * Indicates whether or not the alert is open. You can use this in lieu of the show/hide methods.
          */
@@ -340,6 +344,7 @@ export namespace Components {
     | 'checkbox'
     | 'tag'
     | 'segment'
+    | 'switch'
     | 'segment-pill';
         /**
           * Current validation message - if any. @readonly
@@ -1267,6 +1272,10 @@ export namespace Components {
           * Sets focus on the internal button
          */
         "setFocus": () => Promise<void>;
+        /**
+          * display the label as a `<nano-tooltip />`
+         */
+        "showTooltip": boolean;
         /**
           * Specifies where to display the linked URL. Only applies when an `href` is provided. Special keywords: `"_blank"`, `"_self"`, `"_parent"`, `"_top"`.
          */
@@ -2206,9 +2215,9 @@ export namespace Components {
         "name": string;
     }
     /**
-     * A tradtional tab implementation. It nests `nano-tab` and `nano-tab-content` sub-components.
+     * A traditional tab implementation. It nests `nano-tab` and `nano-tab-content` sub-components.
      * Tabs can be stacked vertically or horizontally (which presents different styling variations) using the `placement` attribute.
-     * Horizonal tabs that don't fit will overflow and scroll appropriately.
+     * Horizontal tabs that don't fit will overflow and scroll appropriately.
      * Tab-content can also be swiped to change tabs.
      */
     interface NanoTabGroup {
@@ -3055,9 +3064,9 @@ declare global {
         new (): HTMLNanoTabContentElement;
     };
     /**
-     * A tradtional tab implementation. It nests `nano-tab` and `nano-tab-content` sub-components.
+     * A traditional tab implementation. It nests `nano-tab` and `nano-tab-content` sub-components.
      * Tabs can be stacked vertically or horizontally (which presents different styling variations) using the `placement` attribute.
-     * Horizonal tabs that don't fit will overflow and scroll appropriately.
+     * Horizontal tabs that don't fit will overflow and scroll appropriately.
      * Tab-content can also be swiped to change tabs.
      */
     interface HTMLNanoTabGroupElement extends Components.NanoTabGroup, HTMLStencilElement {
@@ -3176,6 +3185,10 @@ declare namespace LocalJSX {
           * The length of time, in milliseconds, the alert will show before closing itself. If the user interacts with the alert before it closes (e.g. moves the mouse over it), the timer will restart.
          */
         "duration"?: number;
+        /**
+          * Relocate the dialog to the root of the DOM. Most useful in conjunction with `alert()` when parental elements have css stacking constraints which don't allow for `position: fixed`
+         */
+        "hoist"?: boolean;
         /**
           * Emitted after the alert closes and all transitions are complete.
          */
@@ -3489,6 +3502,7 @@ declare namespace LocalJSX {
     | 'checkbox'
     | 'tag'
     | 'segment'
+    | 'switch'
     | 'segment-pill';
         /**
           * Current validation message - if any. @readonly
@@ -4458,6 +4472,10 @@ declare namespace LocalJSX {
           * The name of the button, submitted as a pair with the button’s value as part of the form data.
          */
         "name"?: string;
+        /**
+          * display the label as a `<nano-tooltip />`
+         */
+        "showTooltip"?: boolean;
         /**
           * Specifies where to display the linked URL. Only applies when an `href` is provided. Special keywords: `"_blank"`, `"_self"`, `"_parent"`, `"_top"`.
          */
@@ -5439,9 +5457,9 @@ declare namespace LocalJSX {
         "name"?: string;
     }
     /**
-     * A tradtional tab implementation. It nests `nano-tab` and `nano-tab-content` sub-components.
+     * A traditional tab implementation. It nests `nano-tab` and `nano-tab-content` sub-components.
      * Tabs can be stacked vertically or horizontally (which presents different styling variations) using the `placement` attribute.
-     * Horizonal tabs that don't fit will overflow and scroll appropriately.
+     * Horizontal tabs that don't fit will overflow and scroll appropriately.
      * Tab-content can also be swiped to change tabs.
      */
     interface NanoTabGroup {
@@ -5998,9 +6016,9 @@ declare module "@stencil/core" {
             "nano-tab": LocalJSX.NanoTab & JSXBase.HTMLAttributes<HTMLNanoTabElement>;
             "nano-tab-content": LocalJSX.NanoTabContent & JSXBase.HTMLAttributes<HTMLNanoTabContentElement>;
             /**
-             * A tradtional tab implementation. It nests `nano-tab` and `nano-tab-content` sub-components.
+             * A traditional tab implementation. It nests `nano-tab` and `nano-tab-content` sub-components.
              * Tabs can be stacked vertically or horizontally (which presents different styling variations) using the `placement` attribute.
-             * Horizonal tabs that don't fit will overflow and scroll appropriately.
+             * Horizontal tabs that don't fit will overflow and scroll appropriately.
              * Tab-content can also be swiped to change tabs.
              */
             "nano-tab-group": LocalJSX.NanoTabGroup & JSXBase.HTMLAttributes<HTMLNanoTabGroupElement>;

package/docs-json.json

@@ -1,5 +1,5 @@
 {
-  "timestamp": "2023-03-10T11:01:02",
+  "timestamp": "2023-04-18T12:12:50",
   "compiler": {
     "name": "@stencil/core",
     "version": "2.23.0",
@@ -209,6 +209,25 @@
           "getter": false,
           "setter": false
         },
+        {
+          "name": "hoist",
+          "type": "boolean",
+          "mutable": false,
+          "attr": "hoist",
+          "reflectToAttr": false,
+          "docs": "Relocate the dialog to the root of the DOM.\nMost useful in conjunction with `alert()` when parental elements\nhave css stacking constraints which don't allow for `position: fixed`",
+          "docsTags": [],
+          "default": "false",
+          "values": [
+            {
+              "type": "boolean"
+            }
+          ],
+          "optional": false,
+          "required": false,
+          "getter": false,
+          "setter": false
+        },
         {
           "name": "open",
           "type": "boolean",
@@ -411,7 +430,8 @@
           "nano-icon-button"
         ],
         "nano-icon-button": [
-          "nano-icon"
+          "nano-icon",
+          "nano-tooltip"
         ]
       }
     },
@@ -1854,7 +1874,7 @@
         },
         {
           "name": "type",
-          "type": "\"checkbox\" | \"radio\" | \"segment\" | \"segment-pill\" | \"tag\"",
+          "type": "\"checkbox\" | \"radio\" | \"segment\" | \"segment-pill\" | \"switch\" | \"tag\"",
           "mutable": false,
           "attr": "type",
           "reflectToAttr": true,
@@ -1878,6 +1898,10 @@
               "value": "segment-pill",
               "type": "string"
             },
+            {
+              "value": "switch",
+              "type": "string"
+            },
             {
               "value": "tag",
               "type": "string"
@@ -2113,7 +2137,17 @@
         {
           "name": "--segment-shadow",
           "annotation": "prop",
-          "docs": "0 1px 4px rgb(0 0 0 / 20%);"
+          "docs": "Defaults to 0 1px 4px rgb(0 0 0 / 20%);"
+        },
+        {
+          "name": "--switch-active-color",
+          "annotation": "prop",
+          "docs": "Defaults to #007495;"
+        },
+        {
+          "name": "--switch-inactive-color",
+          "annotation": "prop",
+          "docs": "Defaults to rgb(181 174 167 / 70%);"
         },
         {
           "name": "--tagbox-bg-color",
@@ -4705,7 +4739,8 @@
           "nano-icon-button"
         ],
         "nano-icon-button": [
-          "nano-icon"
+          "nano-icon",
+          "nano-tooltip"
         ]
       }
     },
@@ -5753,7 +5788,28 @@
           "docsTags": []
         }
       ],
-      "listeners": [],
+      "listeners": [
+        {
+          "event": "nanoChange",
+          "capture": false,
+          "passive": false
+        },
+        {
+          "event": "input",
+          "capture": false,
+          "passive": false
+        },
+        {
+          "event": "change",
+          "capture": false,
+          "passive": false
+        },
+        {
+          "event": "submit",
+          "capture": false,
+          "passive": false
+        }
+      ],
       "styles": [],
       "slots": [],
       "parts": [],
@@ -6373,7 +6429,8 @@
           "nano-icon-button"
         ],
         "nano-icon-button": [
-          "nano-icon"
+          "nano-icon",
+          "nano-tooltip"
         ]
       }
     },
@@ -6436,6 +6493,14 @@
           "name": "part",
           "text": "burger-content - the main content area of the overflow / burger menu"
         },
+        {
+          "name": "part",
+          "text": "sticker - the `nano-sticker` wrapping the main nav-bar"
+        },
+        {
+          "name": "part",
+          "text": "bars - the main wrapper around the `main-bar` and `search-bar` nav bars"
+        },
         {
           "name": "part",
           "text": "main-bar - the main nav menu bar"
@@ -7059,6 +7124,10 @@
         }
       ],
       "parts": [
+        {
+          "name": "bars",
+          "docs": "the main wrapper around the `main-bar` and `search-bar` nav bars"
+        },
         {
           "name": "burger",
           "docs": "the overflow / burger menu"
@@ -7082,6 +7151,10 @@
         {
           "name": "search-bar",
           "docs": "the search bar that appears under the main nav menu bar"
+        },
+        {
+          "name": "sticker",
+          "docs": "the `nano-sticker` wrapping the main nav-bar"
         }
       ],
       "dependents": [],
@@ -8141,7 +8214,16 @@
       "tag": "nano-icon-button",
       "readme": "# nano-icon-button\n\n\n",
       "docs": "Icons buttons are simple, icon-only buttons that can be used for actions and in toolbars.",
-      "docsTags": [],
+      "docsTags": [
+        {
+          "name": "part",
+          "text": "base - the main control (either `<a />` or `<button />`)"
+        },
+        {
+          "name": "part",
+          "text": "icon - a `<nano-icon />` component"
+        }
+      ],
       "usage": {},
       "props": [
         {
@@ -8253,6 +8335,25 @@
           "getter": false,
           "setter": false
         },
+        {
+          "name": "showTooltip",
+          "type": "boolean",
+          "mutable": false,
+          "attr": "show-tooltip",
+          "reflectToAttr": false,
+          "docs": "display the label as a `<nano-tooltip />`",
+          "docsTags": [],
+          "default": "false",
+          "values": [
+            {
+              "type": "boolean"
+            }
+          ],
+          "optional": false,
+          "required": false,
+          "getter": false,
+          "setter": false
+        },
         {
           "name": "target",
           "type": "string",
@@ -8369,7 +8470,11 @@
       "parts": [
         {
           "name": "base",
-          "docs": ""
+          "docs": "the main control (either `<a />` or `<button />`)"
+        },
+        {
+          "name": "icon",
+          "docs": "a `<nano-icon />` component"
         }
       ],
       "dependents": [
@@ -8380,11 +8485,13 @@
         "nano-tab"
       ],
       "dependencies": [
-        "nano-icon"
+        "nano-icon",
+        "nano-tooltip"
       ],
       "dependencyGraph": {
         "nano-icon-button": [
-          "nano-icon"
+          "nano-icon",
+          "nano-tooltip"
         ],
         "nano-alert": [
           "nano-icon-button"
@@ -11148,7 +11255,8 @@
           "nano-icon-button"
         ],
         "nano-icon-button": [
-          "nano-icon"
+          "nano-icon",
+          "nano-tooltip"
         ]
       }
     },
@@ -14677,7 +14785,8 @@
           "nano-icon-button"
         ],
         "nano-icon-button": [
-          "nano-icon"
+          "nano-icon",
+          "nano-tooltip"
         ]
       }
     },
@@ -14759,7 +14868,7 @@
       "encapsulation": "shadow",
       "tag": "nano-tab-group",
       "readme": "# nano-tab\n\n\n",
-      "docs": "A tradtional tab implementation. It nests `nano-tab` and `nano-tab-content` sub-components.\n\nTabs can be stacked vertically or horizontally (which presents different styling variations) using the `placement` attribute.\nHorizonal tabs that don't fit will overflow and scroll appropriately.\nTab-content can also be swiped to change tabs.",
+      "docs": "A traditional tab implementation. It nests `nano-tab` and `nano-tab-content` sub-components.\n\nTabs can be stacked vertically or horizontally (which presents different styling variations) using the `placement` attribute.\nHorizontal tabs that don't fit will overflow and scroll appropriately.\nTab-content can also be swiped to change tabs.",
       "docsTags": [
         {
           "name": "slot",
@@ -16286,6 +16395,7 @@
       ],
       "dependents": [
         "nano-file-upload",
+        "nano-icon-button",
         "nano-table"
       ],
       "dependencies": [],
@@ -16293,6 +16403,9 @@
         "nano-file-upload": [
           "nano-tooltip"
         ],
+        "nano-icon-button": [
+          "nano-tooltip"
+        ],
         "nano-table": [
           "nano-tooltip"
         ]

package/docs-vscode.json

@@ -91,6 +91,10 @@
           "name": "duration",
           "description": "The length of time, in milliseconds, the alert will show before closing itself. If the user interacts with the\nalert before it closes (e.g. moves the mouse over it), the timer will restart."
         },
+        {
+          "name": "hoist",
+          "description": "Relocate the dialog to the root of the DOM.\nMost useful in conjunction with `alert()` when parental elements\nhave css stacking constraints which don't allow for `position: fixed`"
+        },
         {
           "name": "open",
           "description": "Indicates whether or not the alert is open. You can use this in lieu of the show/hide methods."
@@ -447,6 +451,9 @@
             {
               "name": "segment-pill"
             },
+            {
+              "name": "switch"
+            },
             {
               "name": "tag"
             }
@@ -1543,6 +1550,10 @@
           "name": "name",
           "description": "The name of the button, submitted as a pair with the button’s value as part of the form data."
         },
+        {
+          "name": "show-tooltip",
+          "description": "display the label as a `<nano-tooltip />`"
+        },
         {
           "name": "target",
           "description": "Specifies where to display the linked URL. Only applies when an `href` is provided.\nSpecial keywords: `\"_blank\"`, `\"_self\"`, `\"_parent\"`, `\"_top\"`."
@@ -2640,7 +2651,7 @@
       "name": "nano-tab-group",
       "description": {
         "kind": "markdown",
-        "value": "A tradtional tab implementation. It nests `nano-tab` and `nano-tab-content` sub-components.\n\nTabs can be stacked vertically or horizontally (which presents different styling variations) using the `placement` attribute.\nHorizonal tabs that don't fit will overflow and scroll appropriately.\nTab-content can also be swiped to change tabs."
+        "value": "A traditional tab implementation. It nests `nano-tab` and `nano-tab-content` sub-components.\n\nTabs can be stacked vertically or horizontally (which presents different styling variations) using the `placement` attribute.\nHorizontal tabs that don't fit will overflow and scroll appropriately.\nTab-content can also be swiped to change tabs."
       },
       "attributes": [
         {