@pod-os/elements 0.11.1-497f3ef.0 → 0.11.1-5e652ae.0

package/dist/types/components.d.ts

@@ -6,6 +6,8 @@
  */
 import { HTMLStencilElement, JSXBase } from "./stencil-public-runtime";
 export namespace Components {
+    interface PosAddLiteralValue {
+    }
     interface PosApp {
     }
     interface PosAppBrowser {
@@ -30,6 +32,8 @@ export namespace Components {
         "alt": string;
         "src": string;
     }
+    interface PosErrorToast {
+    }
     interface PosImage {
         "alt": string;
         "src": string;
@@ -59,6 +63,9 @@ export namespace Components {
     }
     interface PosRouter {
     }
+    interface PosSelectTerm {
+        "placeholder": string;
+    }
     interface PosSubjects {
     }
     interface PosTypeBadges {
@@ -72,6 +79,10 @@ export namespace Components {
         "predicate": string;
     }
 }
+export interface PosAddLiteralValueCustomEvent<T> extends CustomEvent<T> {
+    detail: T;
+    target: HTMLPosAddLiteralValueElement;
+}
 export interface PosAppDocumentViewerCustomEvent<T> extends CustomEvent<T> {
     detail: T;
     target: HTMLPosAppDocumentViewerElement;
@@ -136,6 +147,10 @@ export interface PosRichLinkCustomEvent<T> extends CustomEvent<T> {
     detail: T;
     target: HTMLPosRichLinkElement;
 }
+export interface PosSelectTermCustomEvent<T> extends CustomEvent<T> {
+    detail: T;
+    target: HTMLPosSelectTermElement;
+}
 export interface PosSubjectsCustomEvent<T> extends CustomEvent<T> {
     detail: T;
     target: HTMLPosSubjectsElement;
@@ -153,6 +168,12 @@ export interface PosValueCustomEvent<T> extends CustomEvent<T> {
     target: HTMLPosValueElement;
 }
 declare global {
+    interface HTMLPosAddLiteralValueElement extends Components.PosAddLiteralValue, HTMLStencilElement {
+    }
+    var HTMLPosAddLiteralValueElement: {
+        prototype: HTMLPosAddLiteralValueElement;
+        new (): HTMLPosAddLiteralValueElement;
+    };
     interface HTMLPosAppElement extends Components.PosApp, HTMLStencilElement {
     }
     var HTMLPosAppElement: {
@@ -219,6 +240,12 @@ declare global {
         prototype: HTMLPosDocumentElement;
         new (): HTMLPosDocumentElement;
     };
+    interface HTMLPosErrorToastElement extends Components.PosErrorToast, HTMLStencilElement {
+    }
+    var HTMLPosErrorToastElement: {
+        prototype: HTMLPosErrorToastElement;
+        new (): HTMLPosErrorToastElement;
+    };
     interface HTMLPosImageElement extends Components.PosImage, HTMLStencilElement {
     }
     var HTMLPosImageElement: {
@@ -285,6 +312,12 @@ declare global {
         prototype: HTMLPosRouterElement;
         new (): HTMLPosRouterElement;
     };
+    interface HTMLPosSelectTermElement extends Components.PosSelectTerm, HTMLStencilElement {
+    }
+    var HTMLPosSelectTermElement: {
+        prototype: HTMLPosSelectTermElement;
+        new (): HTMLPosSelectTermElement;
+    };
     interface HTMLPosSubjectsElement extends Components.PosSubjects, HTMLStencilElement {
     }
     var HTMLPosSubjectsElement: {
@@ -310,6 +343,7 @@ declare global {
         new (): HTMLPosValueElement;
     };
     interface HTMLElementTagNameMap {
+        "pos-add-literal-value": HTMLPosAddLiteralValueElement;
         "pos-app": HTMLPosAppElement;
         "pos-app-browser": HTMLPosAppBrowserElement;
         "pos-app-document-viewer": HTMLPosAppDocumentViewerElement;
@@ -321,6 +355,7 @@ declare global {
         "pos-container-item": HTMLPosContainerItemElement;
         "pos-description": HTMLPosDescriptionElement;
         "pos-document": HTMLPosDocumentElement;
+        "pos-error-toast": HTMLPosErrorToastElement;
         "pos-image": HTMLPosImageElement;
         "pos-label": HTMLPosLabelElement;
         "pos-literals": HTMLPosLiteralsElement;
@@ -332,6 +367,7 @@ declare global {
         "pos-reverse-relations": HTMLPosReverseRelationsElement;
         "pos-rich-link": HTMLPosRichLinkElement;
         "pos-router": HTMLPosRouterElement;
+        "pos-select-term": HTMLPosSelectTermElement;
         "pos-subjects": HTMLPosSubjectsElement;
         "pos-type-badges": HTMLPosTypeBadgesElement;
         "pos-type-router": HTMLPosTypeRouterElement;
@@ -339,6 +375,18 @@ declare global {
     }
 }
 declare namespace LocalJSX {
+    interface PosAddLiteralValue {
+        /**
+          * The entered literal value has been added to the resource and successfully stored to the Pod.
+         */
+        "onPod-os:added-literal-value"?: (event: PosAddLiteralValueCustomEvent<any>) => void;
+        /**
+          * Something went wrong while adding the literal value.
+         */
+        "onPod-os:error"?: (event: PosAddLiteralValueCustomEvent<any>) => void;
+        "onPod-os:init"?: (event: PosAddLiteralValueCustomEvent<any>) => void;
+        "onPod-os:resource"?: (event: PosAddLiteralValueCustomEvent<any>) => void;
+    }
     interface PosApp {
     }
     interface PosAppBrowser {
@@ -374,6 +422,8 @@ declare namespace LocalJSX {
         "onPod-os:resource-loaded"?: (event: PosDocumentCustomEvent<string>) => void;
         "src"?: string;
     }
+    interface PosErrorToast {
+    }
     interface PosImage {
         "alt"?: string;
         "onPod-os:init"?: (event: PosImageCustomEvent<any>) => void;
@@ -420,6 +470,14 @@ declare namespace LocalJSX {
     }
     interface PosRouter {
     }
+    interface PosSelectTerm {
+        "onPod-os:init"?: (event: PosSelectTermCustomEvent<any>) => void;
+        /**
+          * Fires when a term is entered or selected
+         */
+        "onPod-os:term-selected"?: (event: PosSelectTermCustomEvent<any>) => void;
+        "placeholder"?: string;
+    }
     interface PosSubjects {
         "onPod-os:resource"?: (event: PosSubjectsCustomEvent<any>) => void;
     }
@@ -437,6 +495,7 @@ declare namespace LocalJSX {
         "predicate"?: string;
     }
     interface IntrinsicElements {
+        "pos-add-literal-value": PosAddLiteralValue;
         "pos-app": PosApp;
         "pos-app-browser": PosAppBrowser;
         "pos-app-document-viewer": PosAppDocumentViewer;
@@ -448,6 +507,7 @@ declare namespace LocalJSX {
         "pos-container-item": PosContainerItem;
         "pos-description": PosDescription;
         "pos-document": PosDocument;
+        "pos-error-toast": PosErrorToast;
         "pos-image": PosImage;
         "pos-label": PosLabel;
         "pos-literals": PosLiterals;
@@ -459,6 +519,7 @@ declare namespace LocalJSX {
         "pos-reverse-relations": PosReverseRelations;
         "pos-rich-link": PosRichLink;
         "pos-router": PosRouter;
+        "pos-select-term": PosSelectTerm;
         "pos-subjects": PosSubjects;
         "pos-type-badges": PosTypeBadges;
         "pos-type-router": PosTypeRouter;
@@ -469,6 +530,7 @@ export { LocalJSX as JSX };
 declare module "@stencil/core" {
     export namespace JSX {
         interface IntrinsicElements {
+            "pos-add-literal-value": LocalJSX.PosAddLiteralValue & JSXBase.HTMLAttributes<HTMLPosAddLiteralValueElement>;
             "pos-app": LocalJSX.PosApp & JSXBase.HTMLAttributes<HTMLPosAppElement>;
             "pos-app-browser": LocalJSX.PosAppBrowser & JSXBase.HTMLAttributes<HTMLPosAppBrowserElement>;
             "pos-app-document-viewer": LocalJSX.PosAppDocumentViewer & JSXBase.HTMLAttributes<HTMLPosAppDocumentViewerElement>;
@@ -480,6 +542,7 @@ declare module "@stencil/core" {
             "pos-container-item": LocalJSX.PosContainerItem & JSXBase.HTMLAttributes<HTMLPosContainerItemElement>;
             "pos-description": LocalJSX.PosDescription & JSXBase.HTMLAttributes<HTMLPosDescriptionElement>;
             "pos-document": LocalJSX.PosDocument & JSXBase.HTMLAttributes<HTMLPosDocumentElement>;
+            "pos-error-toast": LocalJSX.PosErrorToast & JSXBase.HTMLAttributes<HTMLPosErrorToastElement>;
             "pos-image": LocalJSX.PosImage & JSXBase.HTMLAttributes<HTMLPosImageElement>;
             "pos-label": LocalJSX.PosLabel & JSXBase.HTMLAttributes<HTMLPosLabelElement>;
             "pos-literals": LocalJSX.PosLiterals & JSXBase.HTMLAttributes<HTMLPosLiteralsElement>;
@@ -491,6 +554,7 @@ declare module "@stencil/core" {
             "pos-reverse-relations": LocalJSX.PosReverseRelations & JSXBase.HTMLAttributes<HTMLPosReverseRelationsElement>;
             "pos-rich-link": LocalJSX.PosRichLink & JSXBase.HTMLAttributes<HTMLPosRichLinkElement>;
             "pos-router": LocalJSX.PosRouter & JSXBase.HTMLAttributes<HTMLPosRouterElement>;
+            "pos-select-term": LocalJSX.PosSelectTerm & JSXBase.HTMLAttributes<HTMLPosSelectTermElement>;
             "pos-subjects": LocalJSX.PosSubjects & JSXBase.HTMLAttributes<HTMLPosSubjectsElement>;
             "pos-type-badges": LocalJSX.PosTypeBadges & JSXBase.HTMLAttributes<HTMLPosTypeBadgesElement>;
             "pos-type-router": LocalJSX.PosTypeRouter & JSXBase.HTMLAttributes<HTMLPosTypeRouterElement>;

package/dist/types/stencil-public-runtime.d.ts

@@ -257,6 +257,15 @@ export declare function getAssetPath(path: string): string;
  * @returns the set path
  */
 export declare function setAssetPath(path: string): string;
+/**
+ * Used to specify a nonce value that corresponds with an application's
+ * [Content Security Policy (CSP)](https://developer.mozilla.org/en-US/docs/Web/HTTP/CSP).
+ * When set, the nonce will be added to all dynamically created script and style tags at runtime.
+ * Alternatively, the nonce value can be set on a `meta` tag in the DOM head
+ * (<meta name="csp-nonce" content="{ nonce value here }" />) and will result in the same behavior.
+ * @param nonce The value to be used for the nonce attribute.
+ */
+export declare function setNonce(nonce: string): void;
 /**
  * Retrieve a Stencil element for a given reference
  * @param ref the ref to get the Stencil element for
@@ -476,6 +485,14 @@ export interface FunctionalUtilities {
 export interface FunctionalComponent<T = {}> {
     (props: T, children: VNode[], utils: FunctionalUtilities): VNode | VNode[];
 }
+/**
+ * A Child VDOM node
+ *
+ * This has most of the same properties as {@link VNode} but friendlier names
+ * (i.e. `vtag` instead of `$tag$`, `vchildren` instead of `$children$`) in
+ * order to provide a friendlier public interface for users of the
+ * {@link FunctionalUtilities}).
+ */
 export interface ChildNode {
     vtag?: string | number | Function;
     vkey?: string | number;
@@ -522,6 +539,9 @@ export declare function h(sel: any, children: Array<VNode | undefined | null>):
 export declare function h(sel: any, data: VNodeData | null, text: string): VNode;
 export declare function h(sel: any, data: VNodeData | null, children: Array<VNode | undefined | null>): VNode;
 export declare function h(sel: any, data: VNodeData | null, children: VNode): VNode;
+/**
+ * A virtual DOM node
+ */
 export interface VNode {
     $flags$: number;
     $tag$: string | number | Function;

package/loader/index.d.ts

@@ -10,3 +10,12 @@ export interface CustomElementsDefineOptions {
 }
 export declare function defineCustomElements(win?: Window, opts?: CustomElementsDefineOptions): Promise<void>;
 export declare function applyPolyfills(): Promise<void>;
+
+/** 
+ * Used to specify a nonce value that corresponds with an application's CSP.
+ * When set, the nonce will be added to all dynamically created script and style tags at runtime.
+ * Alternatively, the nonce value can be set on a meta tag in the DOM head
+ * (<meta name="csp-nonce" content="{ nonce value here }" />) which
+ * will result in the same behavior.
+ */
+export declare function setNonce(nonce: string): void;

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@pod-os/elements",
-  "version": "0.11.1-497f3ef.0",
+  "version": "0.11.1-5e652ae.0",
   "description": "Custom elements for usage with Solid Pods",
   "main": "dist/index.cjs.js",
   "module": "dist/index.js",
@@ -21,20 +21,20 @@
     "generate": "stencil generate"
   },
   "dependencies": {
-    "@ionic/core": "^6.4.2",
+    "@ionic/core": "^6.6.3",
     "@pod-os/core": "^0.7.0",
-    "@stencil/core": "^2.21.0",
-    "@stencil/store": "^2.0.2",
+    "@stencil/core": "^2.22.3",
+    "@stencil/store": "^2.0.4",
     "jest-when": "^3.5.2",
     "stencil-router-v2": "^0.6.0"
   },
   "devDependencies": {
-    "@testing-library/dom": "^8.19.1",
+    "@testing-library/dom": "^8.20.0",
     "@testing-library/jest-dom": "^5.16.5",
     "@types/jest": "^26.0.24",
     "jest": "^26.6.3",
     "jest-cli": "^26.6.3",
-    "prettier": "^2.8.2"
+    "prettier": "^2.8.6"
   },
   "license": "MIT",
   "repository": {

package/dist/cjs/index-731691ca.js

@@ -1,48 +0,0 @@
-'use strict';
-
-/* Ionicons v6.0.4, ES Modules */
-const arrowBackSharp = "data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' class='ionicon' viewBox='0 0 512 512'><title>Arrow Back</title><path stroke-linecap='square' stroke-miterlimit='10' stroke-width='48' d='M244 400L100 256l144-144M120 256h292' class='ionicon-fill-none'/></svg>";
-const arrowDown = "data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' class='ionicon' viewBox='0 0 512 512'><title>Arrow Down</title><path stroke-linecap='round' stroke-linejoin='round' stroke-width='48' d='M112 268l144 144 144-144M256 392V100' class='ionicon-fill-none'/></svg>";
-const caretBackSharp = "data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' class='ionicon' viewBox='0 0 512 512'><title>Caret Back</title><path d='M368 64L144 256l224 192V64z'/></svg>";
-const caretDownSharp = "data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' class='ionicon' viewBox='0 0 512 512'><title>Caret Down</title><path d='M64 144l192 224 192-224H64z'/></svg>";
-const caretUpSharp = "data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' class='ionicon' viewBox='0 0 512 512'><title>Caret Up</title><path d='M448 368L256 144 64 368h384z'/></svg>";
-const checkmarkOutline = "data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' class='ionicon' viewBox='0 0 512 512'><title>Checkmark</title><path stroke-linecap='round' stroke-linejoin='round' d='M416 128L192 384l-96-96' class='ionicon-fill-none ionicon-stroke-width'/></svg>";
-const chevronBack = "data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' class='ionicon' viewBox='0 0 512 512'><title>Chevron Back</title><path stroke-linecap='round' stroke-linejoin='round' stroke-width='48' d='M328 112L184 256l144 144' class='ionicon-fill-none'/></svg>";
-const chevronDown = "data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' class='ionicon' viewBox='0 0 512 512'><title>Chevron Down</title><path stroke-linecap='round' stroke-linejoin='round' stroke-width='48' d='M112 184l144 144 144-144' class='ionicon-fill-none'/></svg>";
-const chevronForward = "data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' class='ionicon' viewBox='0 0 512 512'><title>Chevron Forward</title><path stroke-linecap='round' stroke-linejoin='round' stroke-width='48' d='M184 112l144 144-144 144' class='ionicon-fill-none'/></svg>";
-const chevronForwardOutline = "data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' class='ionicon' viewBox='0 0 512 512'><title>Chevron Forward</title><path stroke-linecap='round' stroke-linejoin='round' stroke-width='48' d='M184 112l144 144-144 144' class='ionicon-fill-none'/></svg>";
-const close = "data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' class='ionicon' viewBox='0 0 512 512'><title>Close</title><path d='M289.94 256l95-95A24 24 0 00351 127l-95 95-95-95a24 24 0 00-34 34l95 95-95 95a24 24 0 1034 34l95-95 95 95a24 24 0 0034-34z'/></svg>";
-const closeCircle = "data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' class='ionicon' viewBox='0 0 512 512'><title>Close Circle</title><path d='M256 48C141.31 48 48 141.31 48 256s93.31 208 208 208 208-93.31 208-208S370.69 48 256 48zm75.31 260.69a16 16 0 11-22.62 22.62L256 278.63l-52.69 52.68a16 16 0 01-22.62-22.62L233.37 256l-52.68-52.69a16 16 0 0122.62-22.62L256 233.37l52.69-52.68a16 16 0 0122.62 22.62L278.63 256z'/></svg>";
-const closeSharp = "data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' class='ionicon' viewBox='0 0 512 512'><title>Close</title><path d='M400 145.49L366.51 112 256 222.51 145.49 112 112 145.49 222.51 256 112 366.51 145.49 400 256 289.49 366.51 400 400 366.51 289.49 256 400 145.49z'/></svg>";
-const ellipseOutline = "data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' class='ionicon' viewBox='0 0 512 512'><title>Ellipse</title><circle cx='256' cy='256' r='192' stroke-linecap='round' stroke-linejoin='round' class='ionicon-fill-none ionicon-stroke-width'/></svg>";
-const ellipsisHorizontal = "data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' class='ionicon' viewBox='0 0 512 512'><title>Ellipsis Horizontal</title><circle cx='256' cy='256' r='48'/><circle cx='416' cy='256' r='48'/><circle cx='96' cy='256' r='48'/></svg>";
-const menuOutline = "data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' class='ionicon' viewBox='0 0 512 512'><title>Menu</title><path stroke-linecap='round' stroke-miterlimit='10' d='M80 160h352M80 256h352M80 352h352' class='ionicon-fill-none ionicon-stroke-width'/></svg>";
-const menuSharp = "data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' class='ionicon' viewBox='0 0 512 512'><title>Menu</title><path d='M64 384h384v-42.67H64zm0-106.67h384v-42.66H64zM64 128v42.67h384V128z'/></svg>";
-const removeOutline = "data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' class='ionicon' viewBox='0 0 512 512'><title>Remove</title><path stroke-linecap='round' stroke-linejoin='round' d='M400 256H112' class='ionicon-fill-none ionicon-stroke-width'/></svg>";
-const reorderThreeOutline = "data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' class='ionicon' viewBox='0 0 512 512'><title>Reorder Three</title><path stroke-linecap='round' stroke-linejoin='round' d='M96 256h320M96 176h320M96 336h320' class='ionicon-fill-none ionicon-stroke-width'/></svg>";
-const reorderTwoSharp = "data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' class='ionicon' viewBox='0 0 512 512'><title>Reorder Two</title><path stroke-linecap='square' stroke-linejoin='round' stroke-width='44' d='M118 304h276M118 208h276' class='ionicon-fill-none'/></svg>";
-const searchOutline = "data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' class='ionicon' viewBox='0 0 512 512'><title>Search</title><path d='M221.09 64a157.09 157.09 0 10157.09 157.09A157.1 157.1 0 00221.09 64z' stroke-miterlimit='10' class='ionicon-fill-none ionicon-stroke-width'/><path stroke-linecap='round' stroke-miterlimit='10' d='M338.29 338.29L448 448' class='ionicon-fill-none ionicon-stroke-width'/></svg>";
-const searchSharp = "data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' class='ionicon' viewBox='0 0 512 512'><title>Search</title><path d='M464 428L339.92 303.9a160.48 160.48 0 0030.72-94.58C370.64 120.37 298.27 48 209.32 48S48 120.37 48 209.32s72.37 161.32 161.32 161.32a160.48 160.48 0 0094.58-30.72L428 464zM209.32 319.69a110.38 110.38 0 11110.37-110.37 110.5 110.5 0 01-110.37 110.37z'/></svg>";
-
-exports.arrowBackSharp = arrowBackSharp;
-exports.arrowDown = arrowDown;
-exports.caretBackSharp = caretBackSharp;
-exports.caretDownSharp = caretDownSharp;
-exports.caretUpSharp = caretUpSharp;
-exports.checkmarkOutline = checkmarkOutline;
-exports.chevronBack = chevronBack;
-exports.chevronDown = chevronDown;
-exports.chevronForward = chevronForward;
-exports.chevronForwardOutline = chevronForwardOutline;
-exports.close = close;
-exports.closeCircle = closeCircle;
-exports.closeSharp = closeSharp;
-exports.ellipseOutline = ellipseOutline;
-exports.ellipsisHorizontal = ellipsisHorizontal;
-exports.menuOutline = menuOutline;
-exports.menuSharp = menuSharp;
-exports.removeOutline = removeOutline;
-exports.reorderThreeOutline = reorderThreeOutline;
-exports.reorderTwoSharp = reorderTwoSharp;
-exports.searchOutline = searchOutline;
-exports.searchSharp = searchSharp;

package/dist/cjs/ion-input.cjs.entry.js

@@ -1,303 +0,0 @@
-'use strict';
-
-Object.defineProperty(exports, '__esModule', { value: true });
-
-const index = require('./index-4018a65a.js');
-const index$1 = require('./index-731691ca.js');
-const ionicGlobal = require('./ionic-global-3ede5d2d.js');
-const helpers = require('./helpers-cb08f5ae.js');
-const theme = require('./theme-fc63803b.js');
-
-const inputIosCss = ".sc-ion-input-ios-h{--placeholder-color:initial;--placeholder-font-style:initial;--placeholder-font-weight:initial;--placeholder-opacity:.5;--padding-top:0;--padding-end:0;--padding-bottom:0;--padding-start:0;--background:transparent;--color:initial;display:flex;position:relative;flex:1;align-items:center;width:100%;padding:0 !important;background:var(--background);color:var(--color);font-family:var(--ion-font-family, inherit);z-index:2}ion-item.sc-ion-input-ios-h:not(.item-label),ion-item:not(.item-label) .sc-ion-input-ios-h{--padding-start:0}.ion-color.sc-ion-input-ios-h{color:var(--ion-color-base)}.native-input.sc-ion-input-ios{border-radius:var(--border-radius);padding-left:var(--padding-start);padding-right:var(--padding-end);padding-top:var(--padding-top);padding-bottom:var(--padding-bottom);font-family:inherit;font-size:inherit;font-style:inherit;font-weight:inherit;letter-spacing:inherit;text-decoration:inherit;text-indent:inherit;text-overflow:inherit;text-transform:inherit;text-align:inherit;white-space:inherit;color:inherit;display:inline-block;flex:1;width:100%;max-width:100%;max-height:100%;border:0;outline:none;background:transparent;box-sizing:border-box;appearance:none}@supports (margin-inline-start: 0) or (-webkit-margin-start: 0){.native-input.sc-ion-input-ios{padding-left:unset;padding-right:unset;-webkit-padding-start:var(--padding-start);padding-inline-start:var(--padding-start);-webkit-padding-end:var(--padding-end);padding-inline-end:var(--padding-end)}}.native-input.sc-ion-input-ios::placeholder{color:var(--placeholder-color);font-family:inherit;font-style:var(--placeholder-font-style);font-weight:var(--placeholder-font-weight);opacity:var(--placeholder-opacity)}.native-input.sc-ion-input-ios:-webkit-autofill{background-color:transparent}.native-input.sc-ion-input-ios:invalid{box-shadow:none}.native-input.sc-ion-input-ios::-ms-clear{display:none}.native-input[disabled].sc-ion-input-ios:not(.cloned-input){opacity:0.4}.cloned-input.sc-ion-input-ios{left:0;top:0;position:absolute;pointer-events:none}[dir=rtl].sc-ion-input-ios .cloned-input.sc-ion-input-ios,[dir=rtl].sc-ion-input-ios-h .cloned-input.sc-ion-input-ios,[dir=rtl] .sc-ion-input-ios-h .cloned-input.sc-ion-input-ios{left:unset;right:unset;right:0}.cloned-input.sc-ion-input-ios:disabled{opacity:1}.input-clear-icon.sc-ion-input-ios{margin-left:0;margin-right:0;margin-top:0;margin-bottom:0;padding-left:0;padding-right:0;padding-top:0;padding-bottom:0;background-position:center;display:flex;align-items:center;justify-content:center;width:30px;height:30px;border:0;outline:none;background-color:transparent;background-repeat:no-repeat;visibility:hidden;appearance:none}.input-clear-icon.sc-ion-input-ios ion-icon.sc-ion-input-ios{color:var(--ion-color-step-600, #666666)}.input-clear-icon.sc-ion-input-ios:focus{opacity:0.5}.has-value.sc-ion-input-ios-h .input-clear-icon.sc-ion-input-ios{visibility:visible}.has-focus.sc-ion-input-ios-h{pointer-events:none}.has-focus.sc-ion-input-ios-h input.sc-ion-input-ios,.has-focus.sc-ion-input-ios-h a.sc-ion-input-ios,.has-focus.sc-ion-input-ios-h button.sc-ion-input-ios{pointer-events:auto}.item-label-floating.item-has-placeholder.sc-ion-input-ios-h:not(.item-has-value),.item-label-floating.item-has-placeholder:not(.item-has-value) .sc-ion-input-ios-h{opacity:0}.item-label-floating.item-has-placeholder.sc-ion-input-ios-h:not(.item-has-value).item-has-focus,.item-label-floating.item-has-placeholder:not(.item-has-value).item-has-focus .sc-ion-input-ios-h{transition:opacity 0.15s cubic-bezier(0.4, 0, 0.2, 1);opacity:1}.sc-ion-input-ios-h{--padding-top:10px;--padding-end:10px;--padding-bottom:10px;--padding-start:0;font-size:inherit}.item-label-stacked.sc-ion-input-ios-h,.item-label-stacked .sc-ion-input-ios-h,.item-label-floating.sc-ion-input-ios-h,.item-label-floating .sc-ion-input-ios-h{--padding-top:8px;--padding-bottom:8px;--padding-start:0px}.input-clear-icon.sc-ion-input-ios ion-icon.sc-ion-input-ios{width:18px;height:18px}";
-
-const inputMdCss = ".sc-ion-input-md-h{--placeholder-color:initial;--placeholder-font-style:initial;--placeholder-font-weight:initial;--placeholder-opacity:.5;--padding-top:0;--padding-end:0;--padding-bottom:0;--padding-start:0;--background:transparent;--color:initial;display:flex;position:relative;flex:1;align-items:center;width:100%;padding:0 !important;background:var(--background);color:var(--color);font-family:var(--ion-font-family, inherit);z-index:2}ion-item.sc-ion-input-md-h:not(.item-label),ion-item:not(.item-label) .sc-ion-input-md-h{--padding-start:0}.ion-color.sc-ion-input-md-h{color:var(--ion-color-base)}.native-input.sc-ion-input-md{border-radius:var(--border-radius);padding-left:var(--padding-start);padding-right:var(--padding-end);padding-top:var(--padding-top);padding-bottom:var(--padding-bottom);font-family:inherit;font-size:inherit;font-style:inherit;font-weight:inherit;letter-spacing:inherit;text-decoration:inherit;text-indent:inherit;text-overflow:inherit;text-transform:inherit;text-align:inherit;white-space:inherit;color:inherit;display:inline-block;flex:1;width:100%;max-width:100%;max-height:100%;border:0;outline:none;background:transparent;box-sizing:border-box;appearance:none}@supports (margin-inline-start: 0) or (-webkit-margin-start: 0){.native-input.sc-ion-input-md{padding-left:unset;padding-right:unset;-webkit-padding-start:var(--padding-start);padding-inline-start:var(--padding-start);-webkit-padding-end:var(--padding-end);padding-inline-end:var(--padding-end)}}.native-input.sc-ion-input-md::placeholder{color:var(--placeholder-color);font-family:inherit;font-style:var(--placeholder-font-style);font-weight:var(--placeholder-font-weight);opacity:var(--placeholder-opacity)}.native-input.sc-ion-input-md:-webkit-autofill{background-color:transparent}.native-input.sc-ion-input-md:invalid{box-shadow:none}.native-input.sc-ion-input-md::-ms-clear{display:none}.native-input[disabled].sc-ion-input-md:not(.cloned-input){opacity:0.4}.cloned-input.sc-ion-input-md{left:0;top:0;position:absolute;pointer-events:none}[dir=rtl].sc-ion-input-md .cloned-input.sc-ion-input-md,[dir=rtl].sc-ion-input-md-h .cloned-input.sc-ion-input-md,[dir=rtl] .sc-ion-input-md-h .cloned-input.sc-ion-input-md{left:unset;right:unset;right:0}.cloned-input.sc-ion-input-md:disabled{opacity:1}.input-clear-icon.sc-ion-input-md{margin-left:0;margin-right:0;margin-top:0;margin-bottom:0;padding-left:0;padding-right:0;padding-top:0;padding-bottom:0;background-position:center;display:flex;align-items:center;justify-content:center;width:30px;height:30px;border:0;outline:none;background-color:transparent;background-repeat:no-repeat;visibility:hidden;appearance:none}.input-clear-icon.sc-ion-input-md ion-icon.sc-ion-input-md{color:var(--ion-color-step-600, #666666)}.input-clear-icon.sc-ion-input-md:focus{opacity:0.5}.has-value.sc-ion-input-md-h .input-clear-icon.sc-ion-input-md{visibility:visible}.has-focus.sc-ion-input-md-h{pointer-events:none}.has-focus.sc-ion-input-md-h input.sc-ion-input-md,.has-focus.sc-ion-input-md-h a.sc-ion-input-md,.has-focus.sc-ion-input-md-h button.sc-ion-input-md{pointer-events:auto}.item-label-floating.item-has-placeholder.sc-ion-input-md-h:not(.item-has-value),.item-label-floating.item-has-placeholder:not(.item-has-value) .sc-ion-input-md-h{opacity:0}.item-label-floating.item-has-placeholder.sc-ion-input-md-h:not(.item-has-value).item-has-focus,.item-label-floating.item-has-placeholder:not(.item-has-value).item-has-focus .sc-ion-input-md-h{transition:opacity 0.15s cubic-bezier(0.4, 0, 0.2, 1);opacity:1}.sc-ion-input-md-h{--padding-top:10px;--padding-end:0;--padding-bottom:10px;--padding-start:8px;font-size:inherit}.item-label-stacked.sc-ion-input-md-h,.item-label-stacked .sc-ion-input-md-h,.item-label-floating.sc-ion-input-md-h,.item-label-floating .sc-ion-input-md-h{--padding-top:8px;--padding-bottom:8px;--padding-start:0}.input-clear-icon.sc-ion-input-md ion-icon.sc-ion-input-md{width:22px;height:22px}";
-
-const Input = class {
-  constructor(hostRef) {
-    index.registerInstance(this, hostRef);
-    this.ionInput = index.createEvent(this, "ionInput", 7);
-    this.ionChange = index.createEvent(this, "ionChange", 7);
-    this.ionBlur = index.createEvent(this, "ionBlur", 7);
-    this.ionFocus = index.createEvent(this, "ionFocus", 7);
-    this.ionStyle = index.createEvent(this, "ionStyle", 7);
-    this.inputId = `ion-input-${inputIds++}`;
-    this.didBlurAfterEdit = false;
-    this.inheritedAttributes = {};
-    this.isComposing = false;
-    /**
-     * This is required for a WebKit bug which requires us to
-     * blur and focus an input to properly focus the input in
-     * an item with delegatesFocus. It will no longer be needed
-     * with iOS 14.
-     *
-     * @internal
-     */
-    this.fireFocusEvents = true;
-    this.hasFocus = false;
-    /**
-     * Indicates whether and how the text value should be automatically capitalized as it is entered/edited by the user.
-     * Available options: `"off"`, `"none"`, `"on"`, `"sentences"`, `"words"`, `"characters"`.
-     */
-    this.autocapitalize = 'off';
-    /**
-     * Indicates whether the value of the control can be automatically completed by the browser.
-     */
-    this.autocomplete = 'off';
-    /**
-     * Whether auto correction should be enabled when the user is entering/editing the text value.
-     */
-    this.autocorrect = 'off';
-    /**
-     * This Boolean attribute lets you specify that a form control should have input focus when the page loads.
-     */
-    this.autofocus = false;
-    /**
-     * If `true`, a clear icon will appear in the input when there is a value. Clicking it clears the input.
-     */
-    this.clearInput = false;
-    /**
-     * Set the amount of time, in milliseconds, to wait to trigger the `ionChange` event after each keystroke. This also impacts form bindings such as `ngModel` or `v-model`.
-     */
-    this.debounce = 0;
-    /**
-     * If `true`, the user cannot interact with the input.
-     */
-    this.disabled = false;
-    /**
-     * The name of the control, which is submitted with the form data.
-     */
-    this.name = this.inputId;
-    /**
-     * If `true`, the user cannot modify the value.
-     */
-    this.readonly = false;
-    /**
-     * If `true`, the user must fill in a value before submitting a form.
-     */
-    this.required = false;
-    /**
-     * If `true`, the element will have its spelling and grammar checked.
-     */
-    this.spellcheck = false;
-    /**
-     * The type of control to display. The default type is text.
-     */
-    this.type = 'text';
-    /**
-     * The value of the input.
-     */
-    this.value = '';
-    this.onInput = (ev) => {
-      const input = ev.target;
-      if (input) {
-        this.value = input.value || '';
-      }
-      this.ionInput.emit(ev);
-    };
-    this.onBlur = (ev) => {
-      this.hasFocus = false;
-      this.focusChanged();
-      this.emitStyle();
-      if (this.fireFocusEvents) {
-        this.ionBlur.emit(ev);
-      }
-    };
-    this.onFocus = (ev) => {
-      this.hasFocus = true;
-      this.focusChanged();
-      this.emitStyle();
-      if (this.fireFocusEvents) {
-        this.ionFocus.emit(ev);
-      }
-    };
-    this.onKeydown = (ev) => {
-      if (this.shouldClearOnEdit()) {
-        // Did the input value change after it was blurred and edited?
-        // Do not clear if user is hitting Enter to submit form
-        if (this.didBlurAfterEdit && this.hasValue() && ev.key !== 'Enter') {
-          // Clear the input
-          this.clearTextInput();
-        }
-        // Reset the flag
-        this.didBlurAfterEdit = false;
-      }
-    };
-    this.onCompositionStart = () => {
-      this.isComposing = true;
-    };
-    this.onCompositionEnd = () => {
-      this.isComposing = false;
-    };
-    this.clearTextInput = (ev) => {
-      if (this.clearInput && !this.readonly && !this.disabled && ev) {
-        ev.preventDefault();
-        ev.stopPropagation();
-        // Attempt to focus input again after pressing clear button
-        this.setFocus();
-      }
-      this.value = '';
-      /**
-       * This is needed for clearOnEdit
-       * Otherwise the value will not be cleared
-       * if user is inside the input
-       */
-      if (this.nativeInput) {
-        this.nativeInput.value = '';
-      }
-    };
-  }
-  debounceChanged() {
-    this.ionChange = helpers.debounceEvent(this.ionChange, this.debounce);
-  }
-  disabledChanged() {
-    this.emitStyle();
-  }
-  /**
-   * Update the item classes when the placeholder changes
-   */
-  placeholderChanged() {
-    this.emitStyle();
-  }
-  /**
-   * Update the native input element when the value changes
-   */
-  valueChanged() {
-    const nativeInput = this.nativeInput;
-    const value = this.getValue();
-    if (nativeInput && nativeInput.value !== value && !this.isComposing) {
-      /**
-       * Assigning the native input's value on attribute
-       * value change, allows `ionInput` implementations
-       * to override the control's value.
-       *
-       * Used for patterns such as input trimming (removing whitespace),
-       * or input masking.
-       */
-      nativeInput.value = value;
-    }
-    this.emitStyle();
-    this.ionChange.emit({ value: this.value == null ? this.value : this.value.toString() });
-  }
-  componentWillLoad() {
-    this.inheritedAttributes = Object.assign(Object.assign({}, helpers.inheritAriaAttributes(this.el)), helpers.inheritAttributes(this.el, ['tabindex', 'title', 'data-form-type']));
-  }
-  connectedCallback() {
-    this.emitStyle();
-    this.debounceChanged();
-    {
-      document.dispatchEvent(new CustomEvent('ionInputDidLoad', {
-        detail: this.el,
-      }));
-    }
-  }
-  componentDidLoad() {
-    const nativeInput = this.nativeInput;
-    if (nativeInput) {
-      // TODO: FW-729 Update to JSX bindings when Stencil resolves bug with:
-      // https://github.com/ionic-team/stencil/issues/3235
-      nativeInput.addEventListener('compositionstart', this.onCompositionStart);
-      nativeInput.addEventListener('compositionend', this.onCompositionEnd);
-    }
-  }
-  disconnectedCallback() {
-    {
-      document.dispatchEvent(new CustomEvent('ionInputDidUnload', {
-        detail: this.el,
-      }));
-    }
-    const nativeInput = this.nativeInput;
-    if (nativeInput) {
-      nativeInput.removeEventListener('compositionstart', this.onCompositionStart);
-      nativeInput.removeEventListener('compositionEnd', this.onCompositionEnd);
-    }
-  }
-  /**
-   * Sets focus on the native `input` in `ion-input`. Use this method instead of the global
-   * `input.focus()`.
-   *
-   * Developers who wish to focus an input when a page enters
-   * should call `setFocus()` in the `ionViewDidEnter()` lifecycle method.
-   */
-  async setFocus() {
-    if (this.nativeInput) {
-      this.nativeInput.focus();
-    }
-  }
-  /**
-   * Sets blur on the native `input` in `ion-input`. Use this method instead of the global
-   * `input.blur()`.
-   * @internal
-   */
-  async setBlur() {
-    if (this.nativeInput) {
-      this.nativeInput.blur();
-    }
-  }
-  /**
-   * Returns the native `<input>` element used under the hood.
-   */
-  getInputElement() {
-    return Promise.resolve(this.nativeInput);
-  }
-  shouldClearOnEdit() {
-    const { type, clearOnEdit } = this;
-    return clearOnEdit === undefined ? type === 'password' : clearOnEdit;
-  }
-  getValue() {
-    return typeof this.value === 'number' ? this.value.toString() : (this.value || '').toString();
-  }
-  emitStyle() {
-    this.ionStyle.emit({
-      interactive: true,
-      input: true,
-      'has-placeholder': this.placeholder !== undefined,
-      'has-value': this.hasValue(),
-      'has-focus': this.hasFocus,
-      'interactive-disabled': this.disabled,
-    });
-  }
-  focusChanged() {
-    // If clearOnEdit is enabled and the input blurred but has a value, set a flag
-    if (!this.hasFocus && this.shouldClearOnEdit() && this.hasValue()) {
-      this.didBlurAfterEdit = true;
-    }
-  }
-  hasValue() {
-    return this.getValue().length > 0;
-  }
-  render() {
-    const mode = ionicGlobal.getIonMode(this);
-    const value = this.getValue();
-    const labelId = this.inputId + '-lbl';
-    const label = helpers.findItemLabel(this.el);
-    if (label) {
-      label.id = labelId;
-    }
-    return (index.h(index.Host, { "aria-disabled": this.disabled ? 'true' : null, class: theme.createColorClasses(this.color, {
-        [mode]: true,
-        'has-value': this.hasValue(),
-        'has-focus': this.hasFocus,
-      }) }, index.h("input", Object.assign({ class: "native-input", ref: (input) => (this.nativeInput = input), "aria-labelledby": label ? labelId : null, disabled: this.disabled, accept: this.accept, autoCapitalize: this.autocapitalize, autoComplete: this.autocomplete, autoCorrect: this.autocorrect, autoFocus: this.autofocus, enterKeyHint: this.enterkeyhint, inputMode: this.inputmode, min: this.min, max: this.max, minLength: this.minlength, maxLength: this.maxlength, multiple: this.multiple, name: this.name, pattern: this.pattern, placeholder: this.placeholder || '', readOnly: this.readonly, required: this.required, spellcheck: this.spellcheck, step: this.step, size: this.size, type: this.type, value: value, onInput: this.onInput, onBlur: this.onBlur, onFocus: this.onFocus, onKeyDown: this.onKeydown }, this.inheritedAttributes)), this.clearInput && !this.readonly && !this.disabled && (index.h("button", { "aria-label": "reset", type: "button", class: "input-clear-icon", onPointerDown: (ev) => {
-        /**
-         * This prevents mobile browsers from
-         * blurring the input when the clear
-         * button is activated.
-         */
-        ev.preventDefault();
-      }, onClick: this.clearTextInput }, index.h("ion-icon", { "aria-hidden": "true", icon: mode === 'ios' ? index$1.closeCircle : index$1.closeSharp })))));
-  }
-  get el() { return index.getElement(this); }
-  static get watchers() { return {
-    "debounce": ["debounceChanged"],
-    "disabled": ["disabledChanged"],
-    "placeholder": ["placeholderChanged"],
-    "value": ["valueChanged"]
-  }; }
-};
-let inputIds = 0;
-Input.style = {
-  ios: inputIosCss,
-  md: inputMdCss
-};
-
-exports.ion_input = Input;