@scania/tegel 0.0.2 → 0.0.4

package/dist/types/foundations-stories/spacing/spacing-layout.stories.d.ts

@@ -1,8 +1,8 @@
-declare const _default: {
-  title: string;
-  parameters: {
-    layout: string;
-  };
-};
-export default _default;
-export declare const SpacingLayout: any;
+declare const _default: {
+  title: string;
+  parameters: {
+    layout: string;
+  };
+};
+export default _default;
+export declare const SpacingLayout: any;

package/dist/types/foundations-stories/typography/typography-body.stories.d.ts

@@ -1,8 +1,8 @@
-declare const _default: {
-  title: string;
-  parameters: {
-    layout: string;
-  };
-};
-export default _default;
-export declare const Body: any;
+declare const _default: {
+  title: string;
+  parameters: {
+    layout: string;
+  };
+};
+export default _default;
+export declare const Body: any;

package/dist/types/foundations-stories/typography/typography-detail.stories.d.ts

@@ -1,8 +1,8 @@
-declare const _default: {
-  title: string;
-  parameters: {
-    layout: string;
-  };
-};
-export default _default;
-export declare const Detail: any;
+declare const _default: {
+  title: string;
+  parameters: {
+    layout: string;
+  };
+};
+export default _default;
+export declare const Detail: any;

package/dist/types/foundations-stories/typography/typography-headline.stories.d.ts

@@ -1,21 +1,21 @@
-declare const _default: {
-  title: string;
-  parameters: {
-    layout: string;
-  };
-  argTypes: {
-    type: {
-      name: string;
-      description: string;
-      control: {
-        type: string;
-      };
-      options: {
-        Functional: string;
-        Expressive: string;
-      };
-    };
-  };
-};
-export default _default;
-export declare const Headlines: any;
+declare const _default: {
+  title: string;
+  parameters: {
+    layout: string;
+  };
+  argTypes: {
+    type: {
+      name: string;
+      description: string;
+      control: {
+        type: string;
+      };
+      options: {
+        Functional: string;
+        Expressive: string;
+      };
+    };
+  };
+};
+export default _default;
+export declare const Headlines: any;

package/dist/types/foundations-stories/typography/typography-paragraph.stories.d.ts

@@ -1,8 +1,8 @@
-declare const _default: {
-  title: string;
-  parameters: {
-    layout: string;
-  };
-};
-export default _default;
-export declare const Paragraph: any;
+declare const _default: {
+  title: string;
+  parameters: {
+    layout: string;
+  };
+};
+export default _default;
+export declare const Paragraph: any;

package/dist/types/index.d.ts

@@ -1 +1 @@
-export * from './components';
+export * from './components';

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;
@@ -836,8 +892,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;
@@ -1161,8 +1217,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 +1509,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 +1525,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/utils/utils.d.ts

@@ -1,2 +1,2 @@
-export declare const formatHtmlPreview: (htmlStr: any) => string;
-export declare function demoFormat(first: string, middle: string, last: string): string;
+export declare const formatHtmlPreview: (htmlStr: any) => string;
+export declare function demoFormat(first: string, middle: string, last: string): string;

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": "@scania/tegel",
-  "version": "0.0.2",
+  "version": "0.0.4",
   "description": "Tegel - Scania's Digital Design System",
   "keywords": [
     "tegel",
@@ -43,11 +43,12 @@
     "build-stencil:watch": "stencil build --docs-readme --watch",
     "start-storybook": "start-storybook -p 6006",
     "tegel": "concurrently --raw  'npm:build-stencil:watch' 'npm:start-storybook'",
-    "commit": "npm run --prefix ../ commit"
+    "commit": "npm run --prefix ../ commit",
+    "tegel-release": "./tegel-release.sh"
   },
   "dependencies": {
     "@popperjs/core": "^2.11.6",
-    "@stencil/core": "^2.20.0",
+    "@stencil/core": "^3.0.0",
     "@storybook/addon-google-analytics": "^6.2.9",
     "concurrently": "^7.4.0",
     "dotenv": "^16.0.3",