@ukic/web-components 2.1.0-beta.9 → 2.2.0

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

@@ -133,7 +133,7 @@ export interface ListenOptions {
      */
     passive?: boolean;
 }
-export declare type ListenTargetOptions = 'body' | 'document' | 'window';
+export type ListenTargetOptions = 'body' | 'document' | 'window';
 export interface StateDecorator {
     (): PropertyDecorator;
 }
@@ -214,8 +214,8 @@ export declare const State: StateDecorator;
  * https://stenciljs.com/docs/reactive-data#watch-decorator
  */
 export declare const Watch: WatchDecorator;
-export declare type ResolutionHandler = (elm: HTMLElement) => string | undefined | null;
-export declare type ErrorHandler = (err: any, element?: HTMLElement) => void;
+export type ResolutionHandler = (elm: HTMLElement) => string | undefined | null;
+export type ErrorHandler = (err: any, element?: HTMLElement) => void;
 /**
  * `setMode()` is used for libraries which provide multiple "modes" for styles.
  */
@@ -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
@@ -433,13 +442,57 @@ interface HostAttributes {
     ref?: (el: HTMLElement | null) => void;
     [prop: string]: any;
 }
+/**
+ * Utilities for working with functional Stencil components. An object
+ * conforming to this interface is passed by the Stencil runtime as the third
+ * argument to a functional component, allowing component authors to work with
+ * features like children.
+ *
+ * The children of a functional component will be passed as the second
+ * argument, so a functional component which uses these utils to transform its
+ * children might look like the following:
+ *
+ * ```ts
+ * export const AddClass: FunctionalComponent = (_, children, utils) => (
+ *  utils.map(children, child => ({
+ *    ...child,
+ *    vattrs: {
+ *      ...child.vattrs,
+ *      class: `${child.vattrs.class} add-class`
+ *    }
+ *  }))
+ * );
+ * ```
+ *
+ * For more see the Stencil documentation, here:
+ * https://stenciljs.com/docs/functional-components
+ */
 export interface FunctionalUtilities {
+    /**
+     * Utility for reading the children of a functional component at runtime.
+     * Since the Stencil runtime uses a different interface for children it is
+     * not recommendeded to read the children directly, and is preferable to use
+     * this utility to, for instance, perform a side effect for each child.
+     */
     forEach: (children: VNode[], cb: (vnode: ChildNode, index: number, array: ChildNode[]) => void) => void;
+    /**
+     * Utility for transforming the children of a functional component. Given an
+     * array of children and a callback this will return a list of the results of
+     * passing each child to the supplied callback.
+     */
     map: (children: VNode[], cb: (vnode: ChildNode, index: number, array: ChildNode[]) => ChildNode) => VNode[];
 }
 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;
@@ -486,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;
@@ -756,6 +812,7 @@ export declare namespace JSXBase {
         datetime?: string;
     }
     interface DialogHTMLAttributes<T> extends HTMLAttributes<T> {
+        onCancel?: (event: Event) => void;
         onClose?: (event: Event) => void;
         open?: boolean;
         returnValue?: string;
@@ -836,8 +893,8 @@ export declare namespace JSXBase {
         accept?: string;
         allowdirs?: boolean;
         alt?: string;
-        autoCapitalize?: any;
-        autocapitalize?: any;
+        autoCapitalize?: string;
+        autocapitalize?: string;
         autoComplete?: string;
         autocomplete?: string;
         autoFocus?: boolean;
@@ -1074,6 +1131,8 @@ export declare namespace JSXBase {
         summary?: string;
     }
     interface TextareaHTMLAttributes<T> extends HTMLAttributes<T> {
+        autoComplete?: string;
+        autocomplete?: string;
         autoFocus?: boolean;
         autofocus?: boolean | string;
         cols?: number;
@@ -1161,8 +1220,8 @@ export declare namespace JSXBase {
         resource?: string;
         typeof?: string;
         vocab?: string;
-        autoCapitalize?: any;
-        autocapitalize?: any;
+        autoCapitalize?: string;
+        autocapitalize?: string;
         autoCorrect?: string;
         autocorrect?: string;
         autoSave?: string;
@@ -1453,12 +1512,12 @@ export declare namespace JSXBase {
         onCutCapture?: (event: ClipboardEvent) => void;
         onPaste?: (event: ClipboardEvent) => void;
         onPasteCapture?: (event: ClipboardEvent) => void;
-        onCompositionEnd?: (event: CompositionEvent) => void;
-        onCompositionEndCapture?: (event: CompositionEvent) => void;
-        onCompositionStart?: (event: CompositionEvent) => void;
-        onCompositionStartCapture?: (event: CompositionEvent) => void;
-        onCompositionUpdate?: (event: CompositionEvent) => void;
-        onCompositionUpdateCapture?: (event: CompositionEvent) => void;
+        onCompositionend?: (event: CompositionEvent) => void;
+        onCompositionendCapture?: (event: CompositionEvent) => void;
+        onCompositionstart?: (event: CompositionEvent) => void;
+        onCompositionstartCapture?: (event: CompositionEvent) => void;
+        onCompositionupdate?: (event: CompositionEvent) => void;
+        onCompositionupdateCapture?: (event: CompositionEvent) => void;
         onFocus?: (event: FocusEvent) => void;
         onFocusCapture?: (event: FocusEvent) => void;
         onFocusin?: (event: FocusEvent) => void;
@@ -1469,8 +1528,8 @@ export declare namespace JSXBase {
         onBlurCapture?: (event: FocusEvent) => void;
         onChange?: (event: Event) => void;
         onChangeCapture?: (event: Event) => void;
-        onInput?: (event: Event) => void;
-        onInputCapture?: (event: Event) => void;
+        onInput?: (event: InputEvent) => void;
+        onInputCapture?: (event: InputEvent) => void;
         onReset?: (event: Event) => void;
         onResetCapture?: (event: Event) => void;
         onSubmit?: (event: Event) => void;

package/dist/types/testspec.setup.d.ts

@@ -1,4 +1,15 @@
+type TestKeyboardEvent = {
+  key: string;
+  preventDefault: () => void;
+  stopImmediatePropagation: () => void;
+  shiftKey: boolean;
+  target: {
+    id: string;
+  };
+};
 export declare const waitForTimeout: (ms: number) => Promise<void>;
 export declare const mockDeviceSize: (size: number) => void;
 export declare const waitForNavGroupLoad: () => Promise<void>;
 export declare const resizeTo: (windowObj: typeof window, width: number, height: number) => void;
+export declare const testKeyboardEvent: (keyboardKey: string) => TestKeyboardEvent;
+export {};

package/dist/types/utils/helpers.d.ts

@@ -120,3 +120,4 @@ export declare const getForm: (el: HTMLElement) => HTMLFormElement | null;
 export declare const addFormResetListener: (el: HTMLElement, callbackFn: IcCallbackFunctionNoReturn) => void;
 export declare const removeFormResetListener: (el: HTMLElement, callbackFn: IcCallbackFunctionNoReturn) => void;
 export declare const pxToRem: (px: string, base?: number) => string;
+export declare const removeDisabledFalse: (disabled: boolean, element: HTMLElement) => void;

package/dist/types/utils/types.d.ts

@@ -1,41 +1,41 @@
-export declare type IcFocusableComponents = HTMLIcBreadcrumbElement | HTMLIcButtonElement | HTMLIcCardElement | HTMLIcCheckboxElement | HTMLIcChipElement | HTMLIcLinkElement | HTMLIcNavigationButtonElement | HTMLIcNavigationGroupElement | HTMLIcNavigationItemElement | HTMLIcRadioOptionElement | HTMLIcSearchBarElement | HTMLIcSelectElement | HTMLIcSwitchElement | HTMLIcTabElement | HTMLIcTextFieldElement;
-export declare type IcStatusVariants = "neutral" | "info" | "warning" | "error" | "success";
+export type IcFocusableComponents = HTMLIcBreadcrumbElement | HTMLIcButtonElement | HTMLIcCardElement | HTMLIcCheckboxElement | HTMLIcChipElement | HTMLIcLinkElement | HTMLIcNavigationButtonElement | HTMLIcNavigationGroupElement | HTMLIcNavigationItemElement | HTMLIcRadioOptionElement | HTMLIcSearchBarElement | HTMLIcSelectElement | HTMLIcSwitchElement | HTMLIcTabElement | HTMLIcTextFieldElement;
+export type IcStatusVariants = "neutral" | "info" | "warning" | "error" | "success";
 export declare enum IcInformationStatus {
   Warning = "warning",
   Error = "error",
   Success = "success"
 }
-export declare type IcInformationStatusOrEmpty = "warning" | "error" | "success" | "";
-export declare type IcNavType = "side" | "top" | "page-header";
-export declare type IcAutocompleteTypes = "on" | "off" | "name" | "honorific-prefix" | "given-name" | "additional-name" | "family-name" | "honorific-suffix" | "nickname" | "email" | "username" | "new-password" | "current-password" | "one-time-code" | "organization-title" | "organization" | "street-address" | "address-line1" | "address-line2" | "address-line3" | "address-level4" | "address-level3" | "address-level2" | "address-level1" | "country" | "country-name" | "postal-code" | "cc-name" | "cc-given-name" | "cc-additional-name" | "cc-family-name" | "cc-family-name" | "cc-number" | "cc-exp" | "cc-exp-month" | "cc-exp-year" | "cc-csc" | "cc-type" | "transaction-currency" | "transaction-amount" | "language" | "bday" | "bday-day" | "bday-month" | "bday-year" | "sex" | "tel" | "tel-country-code" | "tel-national" | "tel-area-code" | "tel-local" | "tel-extension" | "impp" | "url" | "photo";
-export declare type IcAlignment = "left" | "center" | "full-width";
+export type IcInformationStatusOrEmpty = "warning" | "error" | "success" | "";
+export type IcNavType = "side" | "top" | "page-header";
+export type IcAutocompleteTypes = "on" | "off" | "name" | "honorific-prefix" | "given-name" | "additional-name" | "family-name" | "honorific-suffix" | "nickname" | "email" | "username" | "new-password" | "current-password" | "one-time-code" | "organization-title" | "organization" | "street-address" | "address-line1" | "address-line2" | "address-line3" | "address-level4" | "address-level3" | "address-level2" | "address-level1" | "country" | "country-name" | "postal-code" | "cc-name" | "cc-given-name" | "cc-additional-name" | "cc-family-name" | "cc-family-name" | "cc-number" | "cc-exp" | "cc-exp-month" | "cc-exp-year" | "cc-csc" | "cc-type" | "transaction-currency" | "transaction-amount" | "language" | "bday" | "bday-day" | "bday-month" | "bday-year" | "sex" | "tel" | "tel-country-code" | "tel-national" | "tel-area-code" | "tel-local" | "tel-extension" | "impp" | "url" | "photo";
+export type IcAlignment = "left" | "center" | "full-width";
 export declare enum IcThemeForegroundEnum {
   Default = "default",
   Dark = "dark",
   Light = "light"
 }
-export declare type IcThemeForeground = "default" | "dark" | "light";
-export declare type IcThemeForegroundNoDefault = "dark" | "light";
-export declare type IcTheme = {
+export type IcThemeForeground = "default" | "dark" | "light";
+export type IcThemeForegroundNoDefault = "dark" | "light";
+export type IcTheme = {
   mode: IcThemeForeground;
   color: IcColorRGB;
 };
-export declare type IcAdditionalFieldTypes = "static" | "dynamic";
-export declare type IcColorRGB = {
+export type IcAdditionalFieldTypes = "static" | "dynamic";
+export type IcColorRGB = {
   r: number;
   g: number;
   b: number;
 };
-export declare type IcColorRGBA = IcColorRGB & {
+export type IcColorRGBA = IcColorRGB & {
   a: number;
 };
-export declare type IcActivationTypes = "automatic" | "manual";
-export declare type IcAutocorrectStates = "on" | "off";
-export declare type IcNavParentDetails = {
+export type IcActivationTypes = "automatic" | "manual";
+export type IcAutocorrectStates = "on" | "off";
+export type IcNavParentDetails = {
   navType: IcNavType | "";
   parent: HTMLElement;
 };
-export declare type IcTypographyVariants = "h1" | "h2" | "h3" | "h4" | "subtitle-large" | "subtitle-small" | "body" | "label" | "label-uppercase" | "caption" | "caption-uppercase";
+export type IcTypographyVariants = "h1" | "h2" | "h3" | "h4" | "subtitle-large" | "subtitle-small" | "body" | "label" | "label-uppercase" | "caption" | "caption-uppercase" | "code-large" | "code-small" | "code-extra-small";
 export interface IcMenuOption {
   value?: string;
   label: string;
@@ -43,18 +43,21 @@ export interface IcMenuOption {
   disabled?: boolean;
   recommended?: boolean;
   children?: IcMenuOption[];
+  loading?: boolean;
+  timedOut?: boolean;
 }
-export declare type IcSearchMatchPositions = "start" | "anywhere";
-export declare type IcCallbackFunctionNoReturn = (...args: unknown[]) => void;
-export declare type IcRequiredPropsTypes = string | boolean | number | HTMLElement | IcMenuOption[];
-export declare type IcPropObject = {
+export type IcSearchMatchPositions = "start" | "anywhere";
+export type IcCallbackFunctionNoReturn = (...args: unknown[]) => void;
+export type IcRequiredPropsTypes = string | boolean | number | HTMLElement | IcMenuOption[];
+export type IcPropObject = {
   prop: IcRequiredPropsTypes;
   propName: string;
 };
-export declare type IcRelatedTarget = EventTarget | undefined;
-export declare type IcOrientation = "horizontal" | "vertical";
+export type IcRelatedTarget = EventTarget | undefined;
+export type IcOrientation = "horizontal" | "vertical";
 export interface IcValueEventDetail {
   value: string;
+  keyPressed?: string;
 }
 export interface IcBlurEventDetail {
   relatedTarget: IcRelatedTarget;

package/hydrate/index.d.ts

@@ -1,4 +1,4 @@
-// Generated by dts-bundle-generator v7.1.0
+// Generated by dts-bundle-generator v7.2.0
 
 export declare function createWindowFromHtml(templateHtml: string, uniqueId: string): any;
 export interface HydrateDocumentOptions {
@@ -141,24 +141,25 @@ export interface HydrateFactoryOptions extends SerializeDocumentOptions {
 	destroyDocument: boolean;
 }
 export interface Diagnostic {
-	level: "error" | "warn" | "info" | "log" | "debug";
-	type: string;
+	absFilePath?: string | undefined;
+	code?: string;
+	columnNumber?: number | undefined;
+	debugText?: string;
 	header?: string;
 	language?: string;
+	level: "error" | "warn" | "info" | "log" | "debug";
+	lineNumber?: number | undefined;
+	lines: PrintLine[];
 	messageText: string;
-	debugText?: string;
-	code?: string;
-	absFilePath?: string;
-	relFilePath?: string;
-	lineNumber?: number;
-	columnNumber?: number;
-	lines?: {
-		lineIndex: number;
-		lineNumber: number;
-		text?: string;
-		errorCharStart: number;
-		errorLength?: number;
-	}[];
+	relFilePath?: string | undefined;
+	type: string;
+}
+export interface PrintLine {
+	lineIndex: number;
+	lineNumber: number;
+	text?: string;
+	errorCharStart: number;
+	errorLength?: number;
 }
 export interface HydrateResults {
 	buildId: string;