@scouterna/ui-webc 2.0.0 → 2.2.0

package/dist/esm/ui-webc.js

@@ -1,8 +1,8 @@
-import { p as promiseResolve, g as globalScripts, b as bootstrapLazy } from './index-DByXnE9g.js';
-export { s as setNonce } from './index-DByXnE9g.js';
+import { p as promiseResolve, g as globalScripts, b as bootstrapLazy } from './index-Cp4mWtfs.js';
+export { s as setNonce } from './index-Cp4mWtfs.js';
 
 /*
- Stencil Client Patch Browser v4.38.1 | MIT Licensed | https://stenciljs.com
+ Stencil Client Patch Browser v4.38.3 | MIT Licensed | https://stenciljs.com
  */
 
 var patchBrowser = () => {
@@ -16,6 +16,6 @@ var patchBrowser = () => {
 
 patchBrowser().then(async (options) => {
   await globalScripts();
-  return bootstrapLazy([["scout-bottom-bar",[[273,"scout-bottom-bar"]]],["scout-bottom-bar-item",[[273,"scout-bottom-bar-item",{"type":[1],"href":[1],"icon":[1],"label":[1],"active":[4]}]]],["scout-button",[[273,"scout-button",{"type":[1],"variant":[1],"icon":[1]}]]],["scout-card",[[273,"scout-card"]]],["scout-checkbox",[[258,"scout-checkbox",{"checked":[4],"disabled":[4],"ariaLabelledby":[1,"aria-labelledby"],"label":[1],"ariaId":[32]}]]],["scout-field",[[262,"scout-field",{"label":[1],"helpText":[1,"help-text"],"inputId":[32],"errorText":[32],"errorHidden":[32]},[[0,"_fieldId","catchFieldId"],[0,"scoutInputChange","handleInputChange"],[0,"scoutBlur","handleValidationBlur"]]]]],["scout-input",[[258,"scout-input",{"type":[1],"inputmode":[1],"pattern":[1],"value":[1],"disabled":[4],"validate":[16],"ariaId":[32]}]]],["scout-switch",[[273,"scout-switch",{"toggled":[4],"disabled":[4],"ariaLabelledby":[1,"aria-labelledby"],"label":[1],"ariaId":[32]}]]]], options);
+  return bootstrapLazy([["scout-list-view-item",[[785,"scout-list-view-item",{"icon":[1],"primary":[1],"secondary":[1],"type":[1],"href":[1],"target":[1],"rel":[1],"name":[1],"value":[1],"checked":[4]}]]],["scout-app-bar",[[785,"scout-app-bar",{"titleText":[1,"title-text"]}]]],["scout-bottom-bar",[[273,"scout-bottom-bar"]]],["scout-bottom-bar-item",[[785,"scout-bottom-bar-item",{"type":[1],"href":[1],"target":[1],"rel":[1],"icon":[1],"label":[1],"active":[4]}]]],["scout-button",[[785,"scout-button",{"type":[1],"href":[1],"target":[1],"rel":[1],"variant":[1],"icon":[1],"iconOnly":[4,"icon-only"]}]]],["scout-card",[[273,"scout-card"]]],["scout-divider",[[273,"scout-divider"]]],["scout-field",[[774,"scout-field",{"label":[1],"helpText":[1,"help-text"],"inputId":[32],"errorText":[32],"errorHidden":[32]},[[0,"_fieldId","catchFieldId"],[0,"scoutInputChange","handleInputChange"],[0,"scoutBlur","handleValidationBlur"]]]]],["scout-input",[[770,"scout-input",{"type":[1],"inputmode":[1],"pattern":[1],"value":[1],"name":[1],"disabled":[4],"validate":[16],"ariaId":[32]}]]],["scout-link",[[785,"scout-link",{"href":[1],"label":[1],"rel":[1],"linkAriaLabel":[1,"link-aria-label"],"type":[1],"target":[1]}]]],["scout-list-view",[[273,"scout-list-view",null,[[0,"scoutChecked","onScoutChecked"]]]]],["scout-list-view-subheader",[[785,"scout-list-view-subheader",{"text":[1],"headingLevel":[1,"heading-level"]}]]],["scout-loader",[[769,"scout-loader",{"text":[1],"size":[1]}]]],["scout-select",[[774,"scout-select",{"value":[1],"disabled":[4],"name":[1],"validate":[16],"ariaId":[32]}]]],["scout-stack",[[785,"scout-stack",{"direction":[1],"gapSize":[1,"gap-size"]}]]],["scout-switch",[[785,"scout-switch",{"toggled":[4],"disabled":[4],"ariaLabelledby":[1,"aria-labelledby"],"label":[1],"ariaId":[32]}]]],["scout-checkbox_2",[[770,"scout-checkbox",{"checked":[4],"disabled":[4],"ariaLabelledby":[1,"aria-labelledby"],"label":[1],"value":[1],"name":[1],"ariaId":[32]}],[770,"scout-radio-button",{"checked":[4],"disabled":[4],"ariaLabelledby":[1,"aria-labelledby"],"label":[1],"value":[1],"name":[1],"ariaId":[32]}]]]], options);
 });
 //# sourceMappingURL=ui-webc.js.map

package/dist/esm/ui-webc.js.map

@@ -1 +1 @@
-{"version":3,"file":"ui-webc.js","sources":["../../node_modules/.pnpm/@stencil+core@4.38.1/node_modules/@stencil/core/internal/client/patch-browser.js","@lazy-browser-entrypoint?app-data=conditional"],"sourcesContent":["/*\n Stencil Client Patch Browser v4.38.1 | MIT Licensed | https://stenciljs.com\n */\n\n// src/client/client-patch-browser.ts\nimport { BUILD, NAMESPACE } from \"@stencil/core/internal/app-data\";\nimport { consoleDevInfo, H, promiseResolve, win } from \"@stencil/core\";\nvar patchBrowser = () => {\n  if (BUILD.isDev && !BUILD.isTesting) {\n    consoleDevInfo(\"Running in development mode.\");\n  }\n  if (BUILD.cloneNodeFix) {\n    patchCloneNodeFix(H.prototype);\n  }\n  const scriptElm = BUILD.scriptDataOpts ? win.document && Array.from(win.document.querySelectorAll(\"script\")).find(\n    (s) => new RegExp(`/${NAMESPACE}(\\\\.esm)?\\\\.js($|\\\\?|#)`).test(s.src) || s.getAttribute(\"data-stencil-namespace\") === NAMESPACE\n  ) : null;\n  const importMeta = import.meta.url;\n  const opts = BUILD.scriptDataOpts ? (scriptElm || {})[\"data-opts\"] || {} : {};\n  if (importMeta !== \"\") {\n    opts.resourcesUrl = new URL(\".\", importMeta).href;\n  }\n  return promiseResolve(opts);\n};\nvar patchCloneNodeFix = (HTMLElementPrototype) => {\n  const nativeCloneNodeFn = HTMLElementPrototype.cloneNode;\n  HTMLElementPrototype.cloneNode = function(deep) {\n    if (this.nodeName === \"TEMPLATE\") {\n      return nativeCloneNodeFn.call(this, deep);\n    }\n    const clonedNode = nativeCloneNodeFn.call(this, false);\n    const srcChildNodes = this.childNodes;\n    if (deep) {\n      for (let i = 0; i < srcChildNodes.length; i++) {\n        if (srcChildNodes[i].nodeType !== 2) {\n          clonedNode.appendChild(srcChildNodes[i].cloneNode(true));\n        }\n      }\n    }\n    return clonedNode;\n  };\n};\nexport {\n  patchBrowser\n};\n","export { setNonce } from '@stencil/core';\nimport { bootstrapLazy } from '@stencil/core';\nimport { patchBrowser } from '@stencil/core/internal/client/patch-browser';\nimport { globalScripts } from '@stencil/core/internal/app-globals';\npatchBrowser().then(async (options) => {\n  await globalScripts();\n  return bootstrapLazy([/*!__STENCIL_LAZY_DATA__*/], options);\n});\n"],"names":[],"mappings":";;;AAAA;AACA;AACA;;AAKA,IAAI,YAAY,GAAG,MAAM;AAUzB,EAAE,MAAM,UAAU,GAAG,MAAM,CAAC,IAAI,CAAC,GAAG;AACpC,EAAE,MAAM,IAAI,GAAiE,EAAE;AAC/E,EAAE,IAAI,UAAU,KAAK,EAAE,EAAE;AACzB,IAAI,IAAI,CAAC,YAAY,GAAG,IAAI,GAAG,CAAC,GAAG,EAAE,UAAU,CAAC,CAAC,IAAI;AACrD;AACA,EAAE,OAAO,cAAc,CAAC,IAAI,CAAC;AAC7B,CAAC;;ACnBD,YAAY,EAAE,CAAC,IAAI,CAAC,OAAO,OAAO,KAAK;AACvC,EAAE,MAAM,aAAa,EAAE;AACvB,EAAE,OAAO,aAAa,CAAC,4BAA4B,EAAE,OAAO,CAAC;AAC7D,CAAC,CAAC","x_google_ignoreList":[0]}
+{"version":3,"file":"ui-webc.js","sources":["../../node_modules/.pnpm/@stencil+core@4.38.3/node_modules/@stencil/core/internal/client/patch-browser.js","@lazy-browser-entrypoint?app-data=conditional"],"sourcesContent":["/*\n Stencil Client Patch Browser v4.38.3 | MIT Licensed | https://stenciljs.com\n */\n\n// src/client/client-patch-browser.ts\nimport { BUILD, NAMESPACE } from \"@stencil/core/internal/app-data\";\nimport { consoleDevInfo, H, promiseResolve, win } from \"@stencil/core\";\nvar patchBrowser = () => {\n  if (BUILD.isDev && !BUILD.isTesting) {\n    consoleDevInfo(\"Running in development mode.\");\n  }\n  if (BUILD.cloneNodeFix) {\n    patchCloneNodeFix(H.prototype);\n  }\n  const scriptElm = BUILD.scriptDataOpts ? win.document && Array.from(win.document.querySelectorAll(\"script\")).find(\n    (s) => new RegExp(`/${NAMESPACE}(\\\\.esm)?\\\\.js($|\\\\?|#)`).test(s.src) || s.getAttribute(\"data-stencil-namespace\") === NAMESPACE\n  ) : null;\n  const importMeta = import.meta.url;\n  const opts = BUILD.scriptDataOpts ? (scriptElm || {})[\"data-opts\"] || {} : {};\n  if (importMeta !== \"\") {\n    opts.resourcesUrl = new URL(\".\", importMeta).href;\n  }\n  return promiseResolve(opts);\n};\nvar patchCloneNodeFix = (HTMLElementPrototype) => {\n  const nativeCloneNodeFn = HTMLElementPrototype.cloneNode;\n  HTMLElementPrototype.cloneNode = function(deep) {\n    if (this.nodeName === \"TEMPLATE\") {\n      return nativeCloneNodeFn.call(this, deep);\n    }\n    const clonedNode = nativeCloneNodeFn.call(this, false);\n    const srcChildNodes = this.childNodes;\n    if (deep) {\n      for (let i = 0; i < srcChildNodes.length; i++) {\n        if (srcChildNodes[i].nodeType !== 2) {\n          clonedNode.appendChild(srcChildNodes[i].cloneNode(true));\n        }\n      }\n    }\n    return clonedNode;\n  };\n};\nexport {\n  patchBrowser\n};\n","export { setNonce } from '@stencil/core';\nimport { bootstrapLazy } from '@stencil/core';\nimport { patchBrowser } from '@stencil/core/internal/client/patch-browser';\nimport { globalScripts } from '@stencil/core/internal/app-globals';\npatchBrowser().then(async (options) => {\n  await globalScripts();\n  return bootstrapLazy([/*!__STENCIL_LAZY_DATA__*/], options);\n});\n"],"names":[],"mappings":";;;AAAA;AACA;AACA;;AAKA,IAAI,YAAY,GAAG,MAAM;AAUzB,EAAE,MAAM,UAAU,GAAG,MAAM,CAAC,IAAI,CAAC,GAAG;AACpC,EAAE,MAAM,IAAI,GAAiE,EAAE;AAC/E,EAAE,IAAI,UAAU,KAAK,EAAE,EAAE;AACzB,IAAI,IAAI,CAAC,YAAY,GAAG,IAAI,GAAG,CAAC,GAAG,EAAE,UAAU,CAAC,CAAC,IAAI;AACrD;AACA,EAAE,OAAO,cAAc,CAAC,IAAI,CAAC;AAC7B,CAAC;;ACnBD,YAAY,EAAE,CAAC,IAAI,CAAC,OAAO,OAAO,KAAK;AACvC,EAAE,MAAM,aAAa,EAAE;AACvB,EAAE,OAAO,aAAa,CAAC,4BAA4B,EAAE,OAAO,CAAC;AAC7D,CAAC,CAAC","x_google_ignoreList":[0]}

package/dist/types/components/app-bar/app-bar.d.ts

@@ -0,0 +1,4 @@
+export declare class ScoutAppBar {
+    titleText?: string;
+    render(): any;
+}

package/dist/types/components/bottom-bar-item/bottom-bar-item.d.ts

@@ -14,6 +14,8 @@ export declare class ScoutBottomBarItem {
      * `type` is set to "link".
      */
     href?: string;
+    target?: string;
+    rel?: string;
     /**
      * An icon to display above the label. Must be an SVG string.
      */

package/dist/types/components/button/button.d.ts

@@ -4,7 +4,10 @@ export type Variant = "primary" | "outlined" | "text" | "caution" | "danger";
  * A simple button component.
  */
 export declare class ScoutButton {
-    type: "button" | "submit" | "reset";
+    type: "button" | "submit" | "reset" | "link";
+    href?: string;
+    target?: string;
+    rel?: string;
     /**
      * The variant primarily affects the color of the button.
      */
@@ -13,6 +16,7 @@ export declare class ScoutButton {
      * An optional icon to display alongside the button text. Must be an SVG string.
      */
     icon?: string;
+    iconOnly: boolean;
     scoutClick: EventEmitter<void>;
     render(): any;
 }

package/dist/types/components/checkbox/checkbox.d.ts

@@ -7,8 +7,10 @@ export declare class ScoutCheckbox {
      */
     ariaLabelledby: string;
     label: string;
+    value: string;
+    name: string;
     ariaId: string;
-    scoutCheckboxChecked: EventEmitter<{
+    scoutChecked: EventEmitter<{
         checked: boolean;
         element: HTMLInputElement;
     }>;
@@ -17,6 +19,6 @@ export declare class ScoutCheckbox {
      */
     _fieldId: EventEmitter<string>;
     componentWillLoad(): Promise<void> | void;
-    onClick(event: Event): void;
+    onChange(event: Event): void;
     render(): any;
 }

package/dist/types/components/divider/divider.d.ts

@@ -0,0 +1,3 @@
+export declare class ScoutDivider {
+    render(): any;
+}

package/dist/types/components/input/input.d.ts

@@ -20,6 +20,7 @@ export declare class ScoutInput implements ComponentInterface {
      * Value of the input element, in case you want to control it yourself.
      */
     value: string;
+    name: string;
     /**
      * Whether the input is disabled. Disabled inputs are not editable, excluded
      * from tab order and are not validated.

package/dist/types/components/link/link.d.ts

@@ -0,0 +1,39 @@
+import { type EventEmitter } from "../../stencil-public-runtime";
+export declare class ScoutLink {
+    /**
+     * The URL that the link points to. Required when type is set to link
+     */
+    href?: string;
+    /**
+     * Text to be displayed for the link
+     */
+    label: string;
+    rel?: string;
+    /**
+     * If the label property is not sufficient to describe its use, add an aria-label describing what happens
+     * when pressing the button or where the user navigates if it is a link.
+     */
+    linkAriaLabel?: string;
+    /**
+     * There are two types. If you intend to use it as a button with onclick, a button is rendered, however if you want to you it
+     * as a normal link, a link with href is rendered.
+     */
+    type: "link" | "button";
+    /**
+     * _blank	Opens the linked document in a new window or tab
+     *
+     * _self	Opens the linked document in the same frame as it was clicked (this is default)
+     *
+     * _parent	Opens the linked document in the parent frame
+     *
+     * _top	Opens the linked document in the full body of the window
+     *
+     * _framename	Opens the linked document in the named iframe
+     */
+    target?: "_blank" | "_self" | "_parent" | "_top" | "framename";
+    /**
+     * Only sent if the link is a button.
+     */
+    scoutLinkClick: EventEmitter<HTMLButtonElement>;
+    render(): any;
+}

package/dist/types/components/list-view/list-view.d.ts

@@ -0,0 +1,8 @@
+export declare class ScoutListView {
+    el: HTMLElement;
+    onScoutChecked(event: CustomEvent<{
+        checked: boolean;
+        element: HTMLInputElement;
+    }>): void;
+    render(): any;
+}

package/dist/types/components/list-view-item/list-view-item.d.ts

@@ -0,0 +1,19 @@
+import { type EventEmitter } from "../../stencil-public-runtime";
+export type ItemType = "button" | "link" | "radio" | "checkbox";
+export declare class ScoutListViewItem {
+    icon?: string;
+    primary?: string;
+    secondary?: string;
+    type: ItemType;
+    href?: string;
+    target?: string;
+    rel?: string;
+    name?: string;
+    value?: string;
+    checked?: boolean;
+    scoutClick: EventEmitter<void>;
+    render(): any;
+    private getPrefix;
+    private getContent;
+    private getSuffix;
+}

package/dist/types/components/list-view-subheader/list-view-subheader.d.ts

@@ -0,0 +1,5 @@
+export declare class ScoutListViewSubheader {
+    text: string;
+    headingLevel: "h1" | "h2" | "h3" | "h4" | "h5" | "h6";
+    render(): any;
+}

package/dist/types/components/loader/loader.d.ts

@@ -0,0 +1,15 @@
+import { type ComponentInterface } from "../../stencil-public-runtime";
+export declare class ScoutLoader implements ComponentInterface {
+    text?: string;
+    size?: "xs" | "sm" | "base" | "lg" | "xl";
+    private symbols;
+    private symbolElements;
+    private currentSymbolIndex;
+    componentDidLoad(): void;
+    render(): any;
+    showElement(el: HTMLDivElement): void;
+    hideElement(el: HTMLDivElement): void;
+    next(): void;
+    tickDone(event: AnimationEvent): void;
+    getSymbols(): any[];
+}

package/dist/types/components/radio-button/radio-button.d.ts

@@ -0,0 +1,24 @@
+import { type EventEmitter } from "../../stencil-public-runtime";
+export declare class ScoutRadioButton {
+    checked: boolean;
+    disabled: boolean;
+    /**
+     * Use this prop if you need to connect your radio button with another element describing its use, other than the property label.
+     */
+    ariaLabelledby: string;
+    label: string;
+    value: string;
+    name: string;
+    ariaId: string;
+    scoutChecked: EventEmitter<{
+        checked: boolean;
+        element: HTMLInputElement;
+    }>;
+    /**
+     * Internal event used for form field association.
+     */
+    _fieldId: EventEmitter<string>;
+    componentWillLoad(): Promise<void> | void;
+    onChange(event: Event): void;
+    render(): any;
+}

package/dist/types/components/select/select.d.ts

@@ -0,0 +1,32 @@
+import { type ComponentInterface, type EventEmitter } from "../../stencil-public-runtime";
+export declare class ScoutSelect implements ComponentInterface {
+    /**
+     * Value of the select element, in case you want to control it yourself.
+     */
+    value: string;
+    /**
+     * Whether the select is disabled. Disabled selects are not editable, excluded
+     * from tab order and are not validated.
+     */
+    disabled: boolean;
+    name: string;
+    /**
+     * Custom validation function run on top of the implicit validation performed
+     * by the browser. Return a string with the validation message to mark the
+     * select as invalid, or null to mark it as valid.
+     */
+    validate?: (value: string) => string | null;
+    scoutInputChange: EventEmitter<{
+        value: string;
+        element: HTMLSelectElement;
+    }>;
+    scoutBlur: EventEmitter<void>;
+    /**
+     * Internal event used for form field association.
+     */
+    _fieldId: EventEmitter<string>;
+    ariaId: string;
+    componentWillLoad(): Promise<void> | void;
+    onChange(event: Event): void;
+    render(): any;
+}

package/dist/types/components/stack/stack.d.ts

@@ -0,0 +1,22 @@
+export type Direction = "row" | "column";
+declare enum GapSizeValues {
+    xs = "2",
+    s = "4",
+    m = "8",
+    l = "12",
+    xl = "16",
+    xxl = "20"
+}
+export type GapSize = keyof typeof GapSizeValues;
+export declare class ScoutStack {
+    /**
+     * The direction of the stack.
+     */
+    direction: Direction;
+    /**
+     * Gap size. If more sizes are needed, we can expand.
+     */
+    gapSize: GapSize;
+    render(): any;
+}
+export {};