@warp-ds/elements 2.10.0-next.18 → 2.10.0-next.19
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
- package/dist/custom-elements.json +179 -159
- package/dist/docs/affix/affix.md +117 -0
- package/dist/docs/affix/styling.md +107 -0
- package/dist/docs/breadcrumbs/breadcrumbs.md +67 -4
- package/dist/docs/breadcrumbs/styling.md +67 -4
- package/dist/docs/index.md +1 -1
- package/dist/docs/select/select.md +91 -0
- package/dist/docs/select/styling.md +91 -0
- package/dist/docs/textarea/styling.md +91 -0
- package/dist/docs/textarea/textarea.md +91 -0
- package/dist/docs/textfield/api.md +8 -0
- package/dist/docs/textfield/styling.md +95 -0
- package/dist/docs/textfield/textfield.md +103 -0
- package/dist/index.d.ts +90 -64
- package/dist/packages/affix/affix-styles.d.ts +8 -0
- package/dist/packages/affix/affix-styles.js +108 -0
- package/dist/packages/affix/affix.d.ts +11 -8
- package/dist/packages/affix/affix.js +118 -17
- package/dist/packages/affix/affix.js.map +4 -4
- package/dist/packages/affix/affix.react.stories.d.ts +1 -1
- package/dist/packages/affix/react.d.ts +1 -1
- package/dist/packages/alert/alert.js.map +1 -1
- package/dist/packages/attention/attention.js.map +1 -1
- package/dist/packages/breadcrumb-item/breadcrumb-item.js +16 -7
- package/dist/packages/breadcrumb-item/breadcrumb-item.js.map +2 -2
- package/dist/packages/breadcrumb-item/styles.js +14 -5
- package/dist/packages/button/button.react.stories.d.ts +2 -2
- package/dist/packages/button/react.d.ts +1 -1
- package/dist/packages/checkbox-group/react.d.ts +1 -1
- package/dist/packages/combobox/combobox.react.stories.d.ts +2 -2
- package/dist/packages/combobox/react.d.ts +1 -1
- package/dist/packages/datepicker/datepicker.js.map +1 -1
- package/dist/packages/datepicker/datepicker.react.stories.d.ts +2 -2
- package/dist/packages/datepicker/react.d.ts +1 -1
- package/dist/packages/expandable/expandable.js.map +1 -1
- package/dist/packages/icon/icon.js +2 -2
- package/dist/packages/icon/icon.js.map +1 -1
- package/dist/packages/icon/icon.react.stories.d.ts +2 -1
- package/dist/packages/icon/icon.react.stories.js +1 -1
- package/dist/packages/modal-header/modal-header.js.map +1 -1
- package/dist/packages/pagination/pagination.js.map +1 -1
- package/dist/packages/pill/pill.js.map +1 -1
- package/dist/packages/radio-group/react.d.ts +1 -1
- package/dist/packages/select/input-styles.d.ts +11 -0
- package/dist/packages/select/input-styles.js +88 -0
- package/dist/packages/select/react.d.ts +1 -1
- package/dist/packages/select/select.js +96 -19
- package/dist/packages/select/select.js.map +4 -4
- package/dist/packages/select/select.react.stories.d.ts +2 -2
- package/dist/packages/slider/react.d.ts +1 -1
- package/dist/packages/slider/slider.react.stories.d.ts +1 -1
- package/dist/packages/slider-thumb/react.d.ts +1 -1
- package/dist/packages/snackbar/snackbar.d.ts +2 -2
- package/dist/packages/snackbar/snackbar.js +1 -1
- package/dist/packages/snackbar/snackbar.js.map +2 -2
- package/dist/packages/step/step.js.map +1 -1
- package/dist/packages/textarea/input-styles.d.ts +11 -0
- package/dist/packages/textarea/input-styles.js +88 -0
- package/dist/packages/textarea/react.d.ts +1 -1
- package/dist/packages/textarea/textarea.js +99 -20
- package/dist/packages/textarea/textarea.js.map +4 -4
- package/dist/packages/textarea/textarea.react.stories.d.ts +2 -2
- package/dist/packages/textfield/input-styles.d.ts +11 -0
- package/dist/packages/textfield/input-styles.js +88 -0
- package/dist/packages/textfield/locales/da/messages.d.mts +1 -0
- package/dist/packages/textfield/locales/da/messages.mjs +1 -0
- package/dist/packages/textfield/locales/en/messages.d.mts +1 -0
- package/dist/packages/textfield/locales/en/messages.mjs +1 -0
- package/dist/packages/textfield/locales/fi/messages.d.mts +1 -0
- package/dist/packages/textfield/locales/fi/messages.mjs +1 -0
- package/dist/packages/textfield/locales/nb/messages.d.mts +1 -0
- package/dist/packages/textfield/locales/nb/messages.mjs +1 -0
- package/dist/packages/textfield/locales/sv/messages.d.mts +1 -0
- package/dist/packages/textfield/locales/sv/messages.mjs +1 -0
- package/dist/packages/textfield/react.d.ts +1 -1
- package/dist/packages/textfield/textfield.d.ts +11 -1
- package/dist/packages/textfield/textfield.js +111 -24
- package/dist/packages/textfield/textfield.js.map +4 -4
- package/dist/packages/textfield/textfield.react.stories.d.ts +2 -2
- package/dist/packages/toast/toast.js.map +1 -1
- package/dist/web-types.json +60 -50
- package/eik/index.js +20 -20
- package/package.json +1 -1
|
@@ -1,4 +1,4 @@
|
|
|
1
|
-
var h=Object.defineProperty;var w=Object.getOwnPropertyDescriptor;var c=(i,o,e,t)=>{for(var s=t>1?void 0:t?w(o,e):o,r=i.length-1,
|
|
1
|
+
var h=Object.defineProperty;var w=Object.getOwnPropertyDescriptor;var c=(i,o,e,t)=>{for(var s=t>1?void 0:t?w(o,e):o,r=i.length-1,l;r>=0;r--)(l=i[r])&&(s=(t?l(o,e,s):l(s))||s);return t&&s&&h(o,e,s),s};import{html as g,LitElement as u}from"lit";import{property as a,state as f}from"lit/decorators.js";import{classMap as v}from"lit/directives/class-map.js";import{css as d}from"lit";var p=d`
|
|
2
2
|
:host {
|
|
3
3
|
display: inline-block;
|
|
4
4
|
}
|
|
@@ -28,5 +28,5 @@ var h=Object.defineProperty;var w=Object.getOwnPropertyDescriptor;var c=(i,o,e,t
|
|
|
28
28
|
part="w-${t.toLowerCase()}"
|
|
29
29
|
>
|
|
30
30
|
${this.svg}
|
|
31
|
-
</div>`}};n.styles=[p],c([
|
|
31
|
+
</div>`}};n.styles=[p],c([a({type:String,reflect:!0})],n.prototype,"name",2),c([a({type:String,reflect:!0})],n.prototype,"size",2),c([a({type:String,reflect:!0,useDefault:!0})],n.prototype,"locale",2),c([f()],n.prototype,"svg",2);var _=n;customElements.get("w-icon")||customElements.define("w-icon",n);export{_ as WIcon,n as WarpIcon};
|
|
32
32
|
//# sourceMappingURL=icon.js.map
|
|
@@ -1,7 +1,7 @@
|
|
|
1
1
|
{
|
|
2
2
|
"version": 3,
|
|
3
3
|
"sources": ["../../../packages/icon/icon.ts", "../../../packages/icon/style.ts"],
|
|
4
|
-
"sourcesContent": ["import { html, LitElement, TemplateResult } from \"lit\";\nimport { property, state } from \"lit/decorators.js\";\nimport { classMap } from \"lit/directives/class-map.js\";\nimport { styles } from \"./style.js\";\n\n// Generic parser for fetch responses\ntype ResponseParser<T> = (response: Response) => Promise<T>;\n\ntype PixelValue = `${number}px`;\n\ninterface CacheFetchOptions<T> {\n\tresponseParser?: ResponseParser<T>;\n}\n\nconst _fetchMap = new Map<string, Promise<
|
|
4
|
+
"sourcesContent": ["import { html, LitElement, TemplateResult } from \"lit\";\nimport { property, state } from \"lit/decorators.js\";\nimport { classMap } from \"lit/directives/class-map.js\";\nimport { styles } from \"./style.js\";\n\n// Generic parser for fetch responses\ntype ResponseParser<T> = (response: Response) => Promise<T>;\n\ntype PixelValue = `${number}px`;\n\ninterface CacheFetchOptions<T> {\n\tresponseParser?: ResponseParser<T>;\n}\n\nconst _fetchMap = new Map<string, Promise<unknown>>();\nconst ERROR_SVG =\n\t'<svg xmlns=\"http://www.w3.org/2000/svg\" viewBox=\"0 0 32 32\"></svg>';\n\n/**\n * A minimal in-memory map to de-duplicate Fetch API media requests.\n *\n * @param uri - Resource URL\n * @param options - Optional parser for the response\n * @returns Promise of parsed response\n */\nfunction cacheFetch<T = string>(\n\turi: string,\n\toptions: CacheFetchOptions<T> = {},\n): Promise<T> {\n\tconst parser =\n\t\toptions.responseParser ?? ((res: Response) => res.text() as Promise<T>);\n\tif (!_fetchMap.has(uri)) {\n\t\t_fetchMap.set(uri, fetch(uri).then(parser));\n\t}\n\treturn _fetchMap.get(uri) as Promise<T>;\n}\n\nexport class WarpIcon extends LitElement {\n\tstatic styles = [styles];\n\n\t/** Icon filename (without .svg) */\n\t@property({ type: String, reflect: true })\n\tname!: string;\n\n\t/**\n\t * Size: small, medium, large or pixel value (e.g. \"32px\").\n\t *\n\t * @default \"medium\"\n\t */\n\t@property({ type: String, reflect: true })\n\tsize: \"small\" | \"medium\" | \"large\" | PixelValue | undefined;\n\n\t/**\n\t * Locale used for `<title>` text.\n\t *\n\t * Reads the `lang` attribute from `<html>`, falls back to 'en'.\n\t */\n\t@property({ type: String, reflect: true, useDefault: true })\n\tlocale: string = document.documentElement.lang || \"en\";\n\n\t/** Parsed SVG element (not reflected as attribute) */\n\t@state()\n\tprivate svg: SVGElement | null = null;\n\n\t/**\n\t * Fetch an icon SVG from the CDN, with caching\n\t * @param iconName - Name of the icon file\n\t * @returns SVGElement or null on failure\n\t */\n\tprivate async fetchIcon(iconName: string): Promise<SVGElement | null> {\n\t\tconst uri = `https://assets.finn.no/pkg/eikons/~1/${this.locale}/${iconName}.svg`;\n\t\ttry {\n\t\t\tconst svgText = await cacheFetch<string>(uri);\n\t\t\tconst doc = new DOMParser().parseFromString(svgText, \"text/html\");\n\t\t\treturn doc.body.querySelector(\"svg\");\n\t\t} catch {\n\t\t\treturn null;\n\t\t}\n\t}\n\n\tprotected firstUpdated(): void {\n\t\tthis.loadIcon();\n\t}\n\n\tprotected updated(changedProps: Map<string, unknown>): void {\n\t\tif (changedProps.has(\"name\") || changedProps.has(\"locale\")) {\n\t\t\tthis.loadIcon();\n\t\t}\n\t}\n\n\tprivate async loadIcon(): Promise<void> {\n\t\tif (!this.name) {\n\t\t\tthis.svg = null;\n\t\t\treturn;\n\t\t}\n\n\t\tlet iconEl = await this.fetchIcon(this.name);\n\t\tif (!iconEl) {\n\t\t\tconst doc = new DOMParser().parseFromString(ERROR_SVG, \"text/html\");\n\t\t\ticonEl = doc.body.firstElementChild as SVGElement;\n\t\t}\n\t\tthis.svg = iconEl;\n\t}\n\n\trender(): TemplateResult {\n\t\tconst size = this.size || \"medium\";\n\t\tconst name = this.name || \"\";\n\t\tconst classes = {\n\t\t\t\"w-icon\": true,\n\t\t\t\"w-icon--s\": size === \"small\",\n\t\t\t\"w-icon--m\": size === \"medium\",\n\t\t\t\"w-icon--l\": size === \"large\",\n\t\t};\n\t\tconst customStyle =\n\t\t\ttypeof size === \"string\" && size.endsWith(\"px\")\n\t\t\t\t? `--w-icon-size: ${size};`\n\t\t\t\t: \"\";\n\t\treturn html`<div\n\t\t\tclass=\"${classMap(classes)}\"\n\t\t\tstyle=\"${customStyle}\"\n\t\t\tpart=\"w-${name.toLowerCase()}\"\n\t\t>\n\t\t\t${this.svg}\n\t\t</div>`;\n\t}\n}\n\n/** @deprecated Exported for backwards compatibility. Use WarpIcon. */\nexport const WIcon = WarpIcon;\n\ndeclare global {\n\tinterface HTMLElementTagNameMap {\n\t\t\"w-icon\": WarpIcon;\n\t}\n}\n\nif (!customElements.get(\"w-icon\")) {\n\tcustomElements.define(\"w-icon\", WarpIcon);\n}\n", "import { css } from \"lit\";\n\nexport const styles = css`\n\t:host {\n\t\tdisplay: inline-block;\n\t}\n\t.w-icon {\n\t\t--_w-icon-size: var(--w-icon-size, 24px);\n\t\theight: var(--_w-icon-size);\n\t\twidth: var(--_w-icon-size);\n\t\tdisplay: flex;\n\t}\n\t.w-icon svg {\n\t\tpointer-events: none;\n\t\theight: var(--_w-icon-size);\n\t\twidth: var(--_w-icon-size);\n\t}\n\t.w-icon--s {\n\t\t--w-icon-size: 16px;\n\t}\n\t.w-icon--m {\n\t\t--w-icon-size: 24px;\n\t}\n\t.w-icon--l {\n\t\t--w-icon-size: 32px;\n\t}\n`;\n"],
|
|
5
5
|
"mappings": "wMAAA,OAAS,QAAAA,EAAM,cAAAC,MAAkC,MACjD,OAAS,YAAAC,EAAU,SAAAC,MAAa,oBAChC,OAAS,YAAAC,MAAgB,8BCFzB,OAAS,OAAAC,MAAW,MAEb,IAAMC,EAASD;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;EDYtB,IAAME,EAAY,IAAI,IAChBC,EACL,qEASD,SAASC,EACRC,EACAC,EAAgC,CAAC,EACpB,CACb,IAAMC,EACLD,EAAQ,iBAAoBE,GAAkBA,EAAI,KAAK,GACxD,OAAKN,EAAU,IAAIG,CAAG,GACrBH,EAAU,IAAIG,EAAK,MAAMA,CAAG,EAAE,KAAKE,CAAM,CAAC,EAEpCL,EAAU,IAAIG,CAAG,CACzB,CAEO,IAAMI,EAAN,cAAuBC,CAAW,CAAlC,kCAqBN,YAAiB,SAAS,gBAAgB,MAAQ,KAIlD,KAAQ,IAAyB,KAOjC,MAAc,UAAUC,EAA8C,CACrE,IAAMN,EAAM,wCAAwC,KAAK,MAAM,IAAIM,CAAQ,OAC3E,GAAI,CACH,IAAMC,EAAU,MAAMR,EAAmBC,CAAG,EAE5C,OADY,IAAI,UAAU,EAAE,gBAAgBO,EAAS,WAAW,EACrD,KAAK,cAAc,KAAK,CACpC,MAAQ,CACP,OAAO,IACR,CACD,CAEU,cAAqB,CAC9B,KAAK,SAAS,CACf,CAEU,QAAQC,EAA0C,EACvDA,EAAa,IAAI,MAAM,GAAKA,EAAa,IAAI,QAAQ,IACxD,KAAK,SAAS,CAEhB,CAEA,MAAc,UAA0B,CACvC,GAAI,CAAC,KAAK,KAAM,CACf,KAAK,IAAM,KACX,MACD,CAEA,IAAIC,EAAS,MAAM,KAAK,UAAU,KAAK,IAAI,EACtCA,IAEJA,EADY,IAAI,UAAU,EAAE,gBAAgBX,EAAW,WAAW,EACrD,KAAK,mBAEnB,KAAK,IAAMW,CACZ,CAEA,QAAyB,CACxB,IAAMC,EAAO,KAAK,MAAQ,SACpBC,EAAO,KAAK,MAAQ,GACpBC,EAAU,CACf,SAAU,GACV,YAAaF,IAAS,QACtB,YAAaA,IAAS,SACtB,YAAaA,IAAS,OACvB,EACMG,EACL,OAAOH,GAAS,UAAYA,EAAK,SAAS,IAAI,EAC3C,kBAAkBA,CAAI,IACtB,GACJ,OAAOI;AAAA,YACGC,EAASH,CAAO,CAAC;AAAA,YACjBC,CAAW;AAAA,aACVF,EAAK,YAAY,CAAC;AAAA;AAAA,KAE1B,KAAK,GAAG;AAAA,SAEZ,CACD,EAxFaP,EACL,OAAS,CAACY,CAAM,EAIvBC,EAAA,CADCC,EAAS,CAAE,KAAM,OAAQ,QAAS,EAAK,CAAC,GAJ7Bd,EAKZ,oBAQAa,EAAA,CADCC,EAAS,CAAE,KAAM,OAAQ,QAAS,EAAK,CAAC,GAZ7Bd,EAaZ,oBAQAa,EAAA,CADCC,EAAS,CAAE,KAAM,OAAQ,QAAS,GAAM,WAAY,EAAK,CAAC,GApB/Cd,EAqBZ,sBAIQa,EAAA,CADPE,EAAM,GAxBKf,EAyBJ,mBAkEF,IAAMgB,EAAQhB,EAQhB,eAAe,IAAI,QAAQ,GAC/B,eAAe,OAAO,SAAUA,CAAQ",
|
|
6
6
|
"names": ["html", "LitElement", "property", "state", "classMap", "css", "styles", "_fetchMap", "ERROR_SVG", "cacheFetch", "uri", "options", "parser", "res", "WarpIcon", "LitElement", "iconName", "svgText", "changedProps", "iconEl", "size", "name", "classes", "customStyle", "html", "classMap", "styles", "__decorateClass", "property", "state", "WIcon"]
|
|
7
7
|
}
|
|
@@ -1,4 +1,5 @@
|
|
|
1
1
|
import React from "react";
|
|
2
|
+
import { Icon } from "./react.js";
|
|
2
3
|
declare const _default: {
|
|
3
4
|
component: import("@lit/react").ReactWebComponent<import("./icon.js").WarpIcon, {}>;
|
|
4
5
|
title: string;
|
|
@@ -24,5 +25,5 @@ declare const _default: {
|
|
|
24
25
|
};
|
|
25
26
|
};
|
|
26
27
|
export default _default;
|
|
27
|
-
export declare const Default: (args:
|
|
28
|
+
export declare const Default: (args: React.ComponentProps<typeof Icon>) => React.JSX.Element;
|
|
28
29
|
export declare const Example: () => React.JSX.Element;
|
|
@@ -290,7 +290,7 @@ export default {
|
|
|
290
290
|
},
|
|
291
291
|
},
|
|
292
292
|
};
|
|
293
|
-
const Template = (args) => React.createElement(Icon, { ...args });
|
|
293
|
+
const Template = (args) => (React.createElement(Icon, { ...args }));
|
|
294
294
|
export const Default = Template.bind({});
|
|
295
295
|
// @ts-expect-error It's fine
|
|
296
296
|
Default.args = {
|