@telia-ace/knowledge-widget-components-related-tag-list 1.0.6 → 1.0.11

package/dist/index.js

@@ -0,0 +1,73 @@
+var __defProp = Object.defineProperty;
+var __defProps = Object.defineProperties;
+var __getOwnPropDescs = Object.getOwnPropertyDescriptors;
+var __getOwnPropSymbols = Object.getOwnPropertySymbols;
+var __hasOwnProp = Object.prototype.hasOwnProperty;
+var __propIsEnum = Object.prototype.propertyIsEnumerable;
+var __defNormalProp = (obj, key, value) => key in obj ? __defProp(obj, key, { enumerable: true, configurable: true, writable: true, value }) : obj[key] = value;
+var __spreadValues = (a, b) => {
+  for (var prop in b || (b = {}))
+    if (__hasOwnProp.call(b, prop))
+      __defNormalProp(a, prop, b[prop]);
+  if (__getOwnPropSymbols)
+    for (var prop of __getOwnPropSymbols(b)) {
+      if (__propIsEnum.call(b, prop))
+        __defNormalProp(a, prop, b[prop]);
+    }
+  return a;
+};
+var __spreadProps = (a, b) => __defProps(a, __getOwnPropDescs(b));
+import { createEventSubscriber, extendComponent } from "@telia-ace/knowledge-widget-core";
+import { DataType } from "@telia-ace/knowledge-widget-types-grid";
+import { createReactComponent } from "@telia-ace/knowledge-widget-ui";
+const RelatedTagListComponent = (container) => {
+  return createReactComponent(container, "related-tag-list", import("./related-tag-list.js"), (component) => {
+    const { events } = container.get("$widget");
+    const [subscribe, unsubscribe] = createEventSubscriber(events);
+    const fetch = (params) => {
+      component.writeProperties({ loading: true, error: void 0 });
+      component.actions.dispatch("fetch", { params });
+    };
+    component.actions.create("fetch", ({ items = [] }) => {
+      return component.actions.dispatch("fetched", {
+        items,
+        loading: true
+      });
+    });
+    component.actions.create("fetched", (input) => {
+      return component.writeProperties(__spreadProps(__spreadValues({}, input), { loading: false }));
+    });
+    container.getAsync("router").then((router) => {
+      const { params } = router.getRouteData();
+      fetch(params);
+    });
+    subscribe("router:changed", (_, { current }) => {
+      fetch(current.routeData.params);
+    });
+    return () => {
+      unsubscribe();
+    };
+  }).then(() => {
+    return extendComponent(container, "related-tag-list", (component) => {
+      component.actions.watch("related-tag-list.fetch", (input, next) => {
+        const {
+          params: { guide, connection }
+        } = input;
+        if (typeof guide !== "undefined") {
+          return container.getAsync("dataClient").then((dataClient) => {
+            return dataClient.fetch(DataType.Guide, {
+              connection,
+              guideId: guide
+            }).then(({ tags }) => {
+              return next(__spreadProps(__spreadValues({}, input), { items: tags || [] }));
+            }).catch((e) => {
+              return next(input);
+            });
+          });
+        }
+      });
+    });
+  });
+};
+export { RelatedTagListComponent as default };
+//# sourceMappingURL=index.js.map

package/dist/index.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"index.js","sources":["../src/related-tag-list-component.ts"],"sourcesContent":["import { createEventSubscriber, extendComponent } from '@telia-ace/knowledge-widget-core';\r\nimport { DataClient, DataType } from '@telia-ace/knowledge-widget-types-grid';\r\nimport { createReactComponent } from '@telia-ace/knowledge-widget-ui';\r\nimport { Container } from '@webprovisions/platform';\r\n\r\nexport type RelatedTagListComponentProps = {\r\n    header: string;\r\n    route?: string;\r\n    items?: any[]; // internal\r\n    showIcons?: boolean;\r\n};\r\n\r\nconst RelatedTagListComponent = (container: Container) => {\r\n    return createReactComponent(\r\n        container,\r\n        'related-tag-list',\r\n        import('./related-tag-list'),\r\n        (component) => {\r\n            const { events } = container.get('$widget');\r\n            const [subscribe, unsubscribe] = createEventSubscriber(events);\r\n\r\n            const fetch = (params: { [key: string]: string }) => {\r\n                component.writeProperties({ loading: true, error: undefined });\r\n                component.actions.dispatch('fetch', { params });\r\n            };\r\n\r\n            component.actions.create('fetch', ({ items = [] }) => {\r\n                return component.actions.dispatch('fetched', {\r\n                    items,\r\n                    loading: true,\r\n                });\r\n            });\r\n\r\n            component.actions.create('fetched', (input) => {\r\n                return component.writeProperties({ ...input, loading: false });\r\n            });\r\n\r\n            container.getAsync('router').then((router) => {\r\n                const { params } = router.getRouteData();\r\n                fetch(params);\r\n            });\r\n            subscribe('router:changed', (_, { current }) => {\r\n                fetch(current.routeData.params);\r\n            });\r\n            return () => {\r\n                unsubscribe();\r\n            };\r\n        }\r\n    ).then(() => {\r\n        return extendComponent(container, 'related-tag-list', (component) => {\r\n            component.actions.watch('related-tag-list.fetch', (input, next) => {\r\n                const {\r\n                    params: { guide, connection },\r\n                } = input;\r\n\r\n                if (typeof guide !== 'undefined') {\r\n                    return container.getAsync('dataClient').then((dataClient: DataClient) => {\r\n                        return dataClient\r\n                            .fetch(DataType.Guide, {\r\n                                connection,\r\n                                guideId: guide,\r\n                            })\r\n                            .then(({ tags }) => {\r\n                                return next({ ...input, items: tags || [] });\r\n                            })\r\n                            .catch((e: any) => {\r\n                                return next(input);\r\n                            });\r\n                    });\r\n                }\r\n            });\r\n        });\r\n    });\r\n};\r\nexport default RelatedTagListComponent;\r\n"],"names":[],"mappings":";;;;;;;;;;;;;;;;;;;;;;AAYM,MAAA,0BAA0B,CAAC,cAAyB;AACtD,SAAO,qBACH,WACA,oBACA,OAAO,0BACP,CAAC,cAAc;AACX,UAAM,EAAE,WAAW,UAAU,IAAI,SAAS;AAC1C,UAAM,CAAC,WAAW,eAAe,sBAAsB,MAAM;AAEvD,UAAA,QAAQ,CAAC,WAAsC;AACjD,gBAAU,gBAAgB,EAAE,SAAS,MAAM,OAAO,QAAW;AAC7D,gBAAU,QAAQ,SAAS,SAAS,EAAE,OAAQ,CAAA;AAAA,IAAA;AAGlD,cAAU,QAAQ,OAAO,SAAS,CAAC,EAAE,QAAQ,CAAA,QAAS;AAC3C,aAAA,UAAU,QAAQ,SAAS,WAAW;AAAA,QACzC;AAAA,QACA,SAAS;AAAA,MAAA,CACZ;AAAA,IAAA,CACJ;AAED,cAAU,QAAQ,OAAO,WAAW,CAAC,UAAU;AAC3C,aAAO,UAAU,gBAAgB,iCAAK,QAAL,EAAY,SAAS,QAAO;AAAA,IAAA,CAChE;AAED,cAAU,SAAS,QAAQ,EAAE,KAAK,CAAC,WAAW;AACpC,YAAA,EAAE,WAAW,OAAO,aAAa;AACvC,YAAM,MAAM;AAAA,IAAA,CACf;AACD,cAAU,kBAAkB,CAAC,GAAG,EAAE,cAAc;AACtC,YAAA,QAAQ,UAAU,MAAM;AAAA,IAAA,CACjC;AACD,WAAO,MAAM;AACG;IAAA;AAAA,EAChB,CAER,EAAE,KAAK,MAAM;AACT,WAAO,gBAAgB,WAAW,oBAAoB,CAAC,cAAc;AACjE,gBAAU,QAAQ,MAAM,0BAA0B,CAAC,OAAO,SAAS;AACzD,cAAA;AAAA,UACF,QAAQ,EAAE,OAAO;AAAA,YACjB;AAEA,YAAA,OAAO,UAAU,aAAa;AAC9B,iBAAO,UAAU,SAAS,YAAY,EAAE,KAAK,CAAC,eAA2B;AAC9D,mBAAA,WACF,MAAM,SAAS,OAAO;AAAA,cACnB;AAAA,cACA,SAAS;AAAA,YACZ,CAAA,EACA,KAAK,CAAC,EAAE,WAAW;AACT,qBAAA,KAAK,iCAAK,QAAL,EAAY,OAAO,QAAQ,KAAI;AAAA,YAAA,CAC9C,EACA,MAAM,CAAC,MAAW;AACf,qBAAO,KAAK,KAAK;AAAA,YAAA,CACpB;AAAA,UAAA,CACR;AAAA,QACL;AAAA,MAAA,CACH;AAAA,IAAA,CACJ;AAAA,EAAA,CACJ;AACL;;"}

package/dist/related-tag-list.js

@@ -0,0 +1,167 @@
+var __defProp = Object.defineProperty;
+var __defProps = Object.defineProperties;
+var __getOwnPropDescs = Object.getOwnPropertyDescriptors;
+var __getOwnPropSymbols = Object.getOwnPropertySymbols;
+var __hasOwnProp = Object.prototype.hasOwnProperty;
+var __propIsEnum = Object.prototype.propertyIsEnumerable;
+var __defNormalProp = (obj, key, value) => key in obj ? __defProp(obj, key, { enumerable: true, configurable: true, writable: true, value }) : obj[key] = value;
+var __spreadValues = (a, b) => {
+  for (var prop in b || (b = {}))
+    if (__hasOwnProp.call(b, prop))
+      __defNormalProp(a, prop, b[prop]);
+  if (__getOwnPropSymbols)
+    for (var prop of __getOwnPropSymbols(b)) {
+      if (__propIsEnum.call(b, prop))
+        __defNormalProp(a, prop, b[prop]);
+    }
+  return a;
+};
+var __spreadProps = (a, b) => __defProps(a, __getOwnPropDescs(b));
+var __objRest = (source, exclude) => {
+  var target = {};
+  for (var prop in source)
+    if (__hasOwnProp.call(source, prop) && exclude.indexOf(prop) < 0)
+      target[prop] = source[prop];
+  if (source != null && __getOwnPropSymbols)
+    for (var prop of __getOwnPropSymbols(source)) {
+      if (exclude.indexOf(prop) < 0 && __propIsEnum.call(source, prop))
+        target[prop] = source[prop];
+    }
+  return target;
+};
+import { useContainer, useProperties, useRouteData, createEmptyComponent, SymbolBadge, ItemList, itemList, contentBox, TextLink, borderTabStyle } from "@telia-ace/knowledge-widget-ui";
+import { appendClassNames, createParams } from "@telia-ace/widget-utilities";
+import React from "react";
+import styled, { css } from "styled-components";
+const getIcon = (selected, defaultIcon, activeIcon) => {
+  if (selected && activeIcon) {
+    return /* @__PURE__ */ React.createElement(StyledSymbolBadge, {
+      symbol: activeIcon,
+      size: 18
+    });
+  }
+  if (defaultIcon) {
+    return /* @__PURE__ */ React.createElement(StyledSymbolBadge, {
+      symbol: defaultIcon,
+      size: 18
+    });
+  }
+  return null;
+};
+const RelatedTagList = (_a) => {
+  var _b = _a, { className, embedded = false } = _b, other = __objRest(_b, ["className", "embedded"]);
+  const container = useContainer();
+  const {
+    route = "search",
+    header,
+    items = [],
+    showIcons
+  } = useProperties();
+  const { params } = useRouteData();
+  if (!items.length) {
+    return createEmptyComponent(container, __spreadProps(__spreadValues({}, other), {
+      className: appendClassNames(className, "humany-tag-list", "humany-related-tag-list")
+    }));
+  }
+  return /* @__PURE__ */ React.createElement(StyledItemList, __spreadProps(__spreadValues({
+    embedded: embedded ? "true" : "false"
+  }, other), {
+    className: appendClassNames(className, "humany-tag-list", "humany-related-tag-list"),
+    header,
+    items,
+    renderItem: (item) => {
+      const { id, title, defaultIcon, activeIcon } = item;
+      const selected = params.tag === item.id || !params.tag && item.id === "0";
+      return /* @__PURE__ */ React.createElement("li", {
+        key: id,
+        "data-tag": id
+      }, /* @__PURE__ */ React.createElement(StyledLink, {
+        routeName: route,
+        selected,
+        params: createParams({
+          tag: id
+        }),
+        text: title
+      }, showIcons && getIcon(selected, defaultIcon, activeIcon)));
+    }
+  }));
+};
+const StyledSymbolBadge = styled(SymbolBadge)`
+    margin-right: ${(p) => {
+  var _a;
+  return (_a = p.theme.sizes) == null ? void 0 : _a.small;
+}};
+    ${(p) => {
+  if (p.symbol.type === "Uri") {
+    return `
+        width: ${p.size}px;
+        height: ${p.size}px;
+      `;
+  }
+  if (p.symbol.type === "FontAwesome") {
+    return `
+        font-size: ${p.size}px;
+      `;
+  }
+}}
+`;
+const StyledItemList = styled(ItemList)`
+    ${itemList}
+    ${(p) => p.embedded === "false" && contentBox}
+  ${(p) => {
+  var _a;
+  return `padding: ${(_a = p.theme.sizes) == null ? void 0 : _a.large};`;
+}}
+  justify-content: flex-start;
+
+    ul {
+        display: flex;
+        flex-wrap: wrap;
+        li {
+            margin: 0 ${(p) => {
+  var _a, _b;
+  return `${(_a = p.theme.sizes) == null ? void 0 : _a.small} ${(_b = p.theme.sizes) == null ? void 0 : _b.small}`;
+}} 0;
+
+            a {
+                color: #fff;
+            }
+        }
+    }
+`;
+const StyledLink = styled(TextLink)`
+    padding: 8px 15px;
+    background-color: ${(p) => {
+  var _a, _b;
+  return p.selected ? (_a = p.theme.colors) == null ? void 0 : _a.text : (_b = p.theme.colors) == null ? void 0 : _b.primary;
+}};
+    font-weight: 300;
+    border-radius: ${(p) => p.theme.borderRadius};
+    display: block;
+    font-size: ${(p) => {
+  var _a;
+  return (_a = p.theme.fonts) == null ? void 0 : _a.normal;
+}};
+
+    &:focus {
+        ${(p) => {
+  var _a;
+  return ((_a = p.theme.accessibility) == null ? void 0 : _a.isTabbing) && css`
+                ${borderTabStyle}
+                padding: 6px 15px;
+                background-color: transparent;
+            `;
+}};
+    }
+
+    @media (hover: hover) {
+        &:hover {
+            background-color: ${(p) => {
+  var _a, _b;
+  return p.selected ? (_a = p.theme.colors) == null ? void 0 : _a.primary : (_b = p.theme.colors) == null ? void 0 : _b.text;
+}};
+        }
+    }
+`;
+export { RelatedTagList as default };
+//# sourceMappingURL=related-tag-list.js.map

package/dist/related-tag-list.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"related-tag-list.js","sources":["../src/related-tag-list.tsx"],"sourcesContent":["import { Symbol, Tag } from '@telia-ace/knowledge-widget-core';\r\nimport {\r\n    borderTabStyle,\r\n    contentBox,\r\n    createEmptyComponent,\r\n    ItemList,\r\n    itemList,\r\n    SymbolBadge,\r\n    TextLink,\r\n    useContainer,\r\n    useProperties,\r\n    useRouteData,\r\n} from '@telia-ace/knowledge-widget-ui';\r\nimport { appendClassNames, createParams } from '@telia-ace/widget-utilities';\r\nimport React from 'react';\r\nimport styled, { css } from 'styled-components';\r\nimport { RelatedTagListComponentProps } from './related-tag-list-component';\r\n\r\nconst getIcon = (selected: boolean, defaultIcon?: Symbol, activeIcon?: Symbol) => {\r\n    if (selected && activeIcon) {\r\n        return <StyledSymbolBadge symbol={activeIcon} size={18} />;\r\n    }\r\n    if (defaultIcon) {\r\n        return <StyledSymbolBadge symbol={defaultIcon} size={18} />;\r\n    }\r\n    return null;\r\n};\r\n\r\ntype Props = {\r\n    className: string;\r\n    embedded?: boolean;\r\n};\r\n\r\nconst RelatedTagList: React.FC<Props> = ({ className, embedded = false, ...other }) => {\r\n    const container = useContainer();\r\n    const {\r\n        route = 'search',\r\n        header,\r\n        items = [],\r\n        showIcons,\r\n    } = useProperties<RelatedTagListComponentProps>();\r\n    const { params } = useRouteData();\r\n\r\n    if (!items.length) {\r\n        return createEmptyComponent(container, {\r\n            ...other,\r\n            className: appendClassNames(className, 'humany-tag-list', 'humany-related-tag-list'),\r\n        });\r\n    }\r\n\r\n    return (\r\n        <StyledItemList\r\n            embedded={embedded ? 'true' : 'false'}\r\n            {...other}\r\n            className={appendClassNames(className, 'humany-tag-list', 'humany-related-tag-list')}\r\n            header={header}\r\n            items={items}\r\n            renderItem={(item: Tag) => {\r\n                const { id, title, defaultIcon, activeIcon } = item;\r\n                const selected = params.tag === item.id || (!params.tag && item.id === '0');\r\n\r\n                return (\r\n                    <li key={id} data-tag={id}>\r\n                        <StyledLink\r\n                            routeName={route}\r\n                            selected={selected}\r\n                            params={createParams({\r\n                                tag: id,\r\n                            })}\r\n                            text={title}\r\n                        >\r\n                            {showIcons && getIcon(selected, defaultIcon, activeIcon)}\r\n                        </StyledLink>\r\n                    </li>\r\n                );\r\n            }}\r\n        />\r\n    );\r\n};\r\n\r\nexport default RelatedTagList;\r\n\r\nconst StyledSymbolBadge = styled(SymbolBadge)<{ size: number; symbol: Symbol }>`\r\n    margin-right: ${(p) => p.theme.sizes?.small};\r\n    ${(p: any) => {\r\n        if (p.symbol.type === 'Uri') {\r\n            return `\r\n        width: ${p.size}px;\r\n        height: ${p.size}px;\r\n      `;\r\n        }\r\n\r\n        if (p.symbol.type === 'FontAwesome') {\r\n            return `\r\n        font-size: ${p.size}px;\r\n      `;\r\n        }\r\n    }}\r\n`;\r\n\r\nconst StyledItemList = styled(ItemList)<any>`\r\n    ${itemList}\r\n    ${(p) => p.embedded === 'false' && contentBox}\r\n  ${(p) => `padding: ${p.theme.sizes?.large};`}\r\n  justify-content: flex-start;\r\n\r\n    ul {\r\n        display: flex;\r\n        flex-wrap: wrap;\r\n        li {\r\n            margin: 0 ${(p) => `${p.theme.sizes?.small} ${p.theme.sizes?.small}`} 0;\r\n\r\n            a {\r\n                color: #fff;\r\n            }\r\n        }\r\n    }\r\n`;\r\n\r\nconst StyledLink = styled(TextLink)<any>`\r\n    padding: 8px 15px;\r\n    background-color: ${(p) => (p.selected ? p.theme.colors?.text : p.theme.colors?.primary)};\r\n    font-weight: 300;\r\n    border-radius: ${(p) => p.theme.borderRadius};\r\n    display: block;\r\n    font-size: ${(p) => p.theme.fonts?.normal};\r\n\r\n    &:focus {\r\n        ${(p) =>\r\n            p.theme.accessibility?.isTabbing &&\r\n            css`\r\n                ${borderTabStyle}\r\n                padding: 6px 15px;\r\n                background-color: transparent;\r\n            `};\r\n    }\r\n\r\n    @media (hover: hover) {\r\n        &:hover {\r\n            background-color: ${(p) =>\r\n                p.selected ? p.theme.colors?.primary : p.theme.colors?.text};\r\n        }\r\n    }\r\n`;\r\n"],"names":[],"mappings":"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"}

package/package.json

@@ -1,34 +1,33 @@
 {
     "name": "@telia-ace/knowledge-widget-components-related-tag-list",
-    "version": "1.0.6",
+    "version": "1.0.11",
     "description": "Related tag list component for ACE Knowledge Widgets.",
     "license": "SEE LICENSE IN LICENSE.txt",
     "author": "Telia Company AB",
     "keywords": [
         "telia"
     ],
-    "main": "lib/index.js",
-    "module": "lib-esm/index.js",
+    "module": "dist/index.js",
+    "types": "dist/index.d.ts",
     "files": [
         "LICENSE.txt",
         "README.md",
-        "lib/",
-        "lib-esm/"
+        "dist/"
     ],
     "publishConfig": {
         "access": "public"
     },
     "scripts": {
-        "clean": "cleandir lib && cleandir lib-esm",
-        "compile": "tsc -p tsconfig.cjs.json && tsc -p tsconfig.esm.json"
+        "clean": "rimraf ./dist",
+        "precompile": "tsc -emitDeclarationOnly",
+        "compile": "vite build"
     },
     "sideEffects": false,
-    "typings": "lib/index.d.ts",
     "dependencies": {
-        "@telia-ace/knowledge-widget-core": "^1.0.6",
-        "@telia-ace/knowledge-widget-types-grid": "^1.0.13",
-        "@telia-ace/knowledge-widget-ui": "^1.0.10",
-        "@telia-ace/widget-utilities": "^1.0.1",
+        "@telia-ace/knowledge-widget-core": "^1.0.10",
+        "@telia-ace/knowledge-widget-types-grid": "^1.0.17",
+        "@telia-ace/knowledge-widget-ui": "^1.0.14",
+        "@telia-ace/widget-utilities": "^1.0.2",
         "@webprovisions/platform": "^1.1.2"
     },
     "peerDependencies": {
@@ -41,5 +40,5 @@
         "@types/react-dom": "^16.8.0",
         "@types/styled-components": "^5.1.7"
     },
-    "gitHead": "141db586e3989e54f2671aa2079c62a250a00557"
+    "gitHead": "3821c16ef534210308ecca6b2e16d098ddde37a4"
 }

package/lib/index.d.ts

@@ -1,2 +0,0 @@
-import RelatedTagListComponent from './related-tag-list-component';
-export default RelatedTagListComponent;

package/lib/index.js

@@ -1,7 +0,0 @@
-"use strict";
-var __importDefault = (this && this.__importDefault) || function (mod) {
-    return (mod && mod.__esModule) ? mod : { "default": mod };
-};
-Object.defineProperty(exports, "__esModule", { value: true });
-var related_tag_list_component_1 = __importDefault(require("./related-tag-list-component"));
-exports.default = related_tag_list_component_1.default;

package/lib/related-tag-list-component.d.ts

@@ -1,9 +0,0 @@
-import { Container } from '@webprovisions/platform';
-export declare type RelatedTagListComponentProps = {
-    header: string;
-    route?: string;
-    items?: any[];
-    showIcons?: boolean;
-};
-declare const RelatedTagListComponent: (container: Container) => Promise<void>;
-export default RelatedTagListComponent;

package/lib/related-tag-list-component.js

@@ -1,109 +0,0 @@
-"use strict";
-var __assign = (this && this.__assign) || function () {
-    __assign = Object.assign || function(t) {
-        for (var s, i = 1, n = arguments.length; i < n; i++) {
-            s = arguments[i];
-            for (var p in s) if (Object.prototype.hasOwnProperty.call(s, p))
-                t[p] = s[p];
-        }
-        return t;
-    };
-    return __assign.apply(this, arguments);
-};
-var __createBinding = (this && this.__createBinding) || (Object.create ? (function(o, m, k, k2) {
-    if (k2 === undefined) k2 = k;
-    var desc = Object.getOwnPropertyDescriptor(m, k);
-    if (!desc || ("get" in desc ? !m.__esModule : desc.writable || desc.configurable)) {
-      desc = { enumerable: true, get: function() { return m[k]; } };
-    }
-    Object.defineProperty(o, k2, desc);
-}) : (function(o, m, k, k2) {
-    if (k2 === undefined) k2 = k;
-    o[k2] = m[k];
-}));
-var __setModuleDefault = (this && this.__setModuleDefault) || (Object.create ? (function(o, v) {
-    Object.defineProperty(o, "default", { enumerable: true, value: v });
-}) : function(o, v) {
-    o["default"] = v;
-});
-var __importStar = (this && this.__importStar) || function (mod) {
-    if (mod && mod.__esModule) return mod;
-    var result = {};
-    if (mod != null) for (var k in mod) if (k !== "default" && Object.prototype.hasOwnProperty.call(mod, k)) __createBinding(result, mod, k);
-    __setModuleDefault(result, mod);
-    return result;
-};
-var __read = (this && this.__read) || function (o, n) {
-    var m = typeof Symbol === "function" && o[Symbol.iterator];
-    if (!m) return o;
-    var i = m.call(o), r, ar = [], e;
-    try {
-        while ((n === void 0 || n-- > 0) && !(r = i.next()).done) ar.push(r.value);
-    }
-    catch (error) { e = { error: error }; }
-    finally {
-        try {
-            if (r && !r.done && (m = i["return"])) m.call(i);
-        }
-        finally { if (e) throw e.error; }
-    }
-    return ar;
-};
-Object.defineProperty(exports, "__esModule", { value: true });
-var knowledge_widget_core_1 = require("@telia-ace/knowledge-widget-core");
-var knowledge_widget_types_grid_1 = require("@telia-ace/knowledge-widget-types-grid");
-var knowledge_widget_ui_1 = require("@telia-ace/knowledge-widget-ui");
-var RelatedTagListComponent = function (container) {
-    return (0, knowledge_widget_ui_1.createReactComponent)(container, 'related-tag-list', Promise.resolve().then(function () { return __importStar(require('./related-tag-list')); }), function (component) {
-        var events = container.get('$widget').events;
-        var _a = __read((0, knowledge_widget_core_1.createEventSubscriber)(events), 2), subscribe = _a[0], unsubscribe = _a[1];
-        var fetch = function (params) {
-            component.writeProperties({ loading: true, error: undefined });
-            component.actions.dispatch('fetch', { params: params });
-        };
-        component.actions.create('fetch', function (_a) {
-            var _b = _a.items, items = _b === void 0 ? [] : _b;
-            return component.actions.dispatch('fetched', {
-                items: items,
-                loading: true,
-            });
-        });
-        component.actions.create('fetched', function (input) {
-            return component.writeProperties(__assign(__assign({}, input), { loading: false }));
-        });
-        container.getAsync('router').then(function (router) {
-            var params = router.getRouteData().params;
-            fetch(params);
-        });
-        subscribe('router:changed', function (_, _a) {
-            var current = _a.current;
-            fetch(current.routeData.params);
-        });
-        return function () {
-            unsubscribe();
-        };
-    }).then(function () {
-        return (0, knowledge_widget_core_1.extendComponent)(container, 'related-tag-list', function (component) {
-            component.actions.watch('related-tag-list.fetch', function (input, next) {
-                var _a = input.params, guide = _a.guide, connection = _a.connection;
-                if (typeof guide !== 'undefined') {
-                    return container.getAsync('dataClient').then(function (dataClient) {
-                        return dataClient
-                            .fetch(knowledge_widget_types_grid_1.DataType.Guide, {
-                            connection: connection,
-                            guideId: guide,
-                        })
-                            .then(function (_a) {
-                            var tags = _a.tags;
-                            return next(__assign(__assign({}, input), { items: tags || [] }));
-                        })
-                            .catch(function (e) {
-                            return next(input);
-                        });
-                    });
-                }
-            });
-        });
-    });
-};
-exports.default = RelatedTagListComponent;

package/lib/related-tag-list.d.ts

@@ -1,7 +0,0 @@
-import React from 'react';
-declare type Props = {
-    className: string;
-    embedded?: boolean;
-};
-declare const RelatedTagList: React.FC<Props>;
-export default RelatedTagList;

package/lib/related-tag-list.js

@@ -1,99 +0,0 @@
-"use strict";
-var __makeTemplateObject = (this && this.__makeTemplateObject) || function (cooked, raw) {
-    if (Object.defineProperty) { Object.defineProperty(cooked, "raw", { value: raw }); } else { cooked.raw = raw; }
-    return cooked;
-};
-var __assign = (this && this.__assign) || function () {
-    __assign = Object.assign || function(t) {
-        for (var s, i = 1, n = arguments.length; i < n; i++) {
-            s = arguments[i];
-            for (var p in s) if (Object.prototype.hasOwnProperty.call(s, p))
-                t[p] = s[p];
-        }
-        return t;
-    };
-    return __assign.apply(this, arguments);
-};
-var __createBinding = (this && this.__createBinding) || (Object.create ? (function(o, m, k, k2) {
-    if (k2 === undefined) k2 = k;
-    var desc = Object.getOwnPropertyDescriptor(m, k);
-    if (!desc || ("get" in desc ? !m.__esModule : desc.writable || desc.configurable)) {
-      desc = { enumerable: true, get: function() { return m[k]; } };
-    }
-    Object.defineProperty(o, k2, desc);
-}) : (function(o, m, k, k2) {
-    if (k2 === undefined) k2 = k;
-    o[k2] = m[k];
-}));
-var __setModuleDefault = (this && this.__setModuleDefault) || (Object.create ? (function(o, v) {
-    Object.defineProperty(o, "default", { enumerable: true, value: v });
-}) : function(o, v) {
-    o["default"] = v;
-});
-var __importStar = (this && this.__importStar) || function (mod) {
-    if (mod && mod.__esModule) return mod;
-    var result = {};
-    if (mod != null) for (var k in mod) if (k !== "default" && Object.prototype.hasOwnProperty.call(mod, k)) __createBinding(result, mod, k);
-    __setModuleDefault(result, mod);
-    return result;
-};
-var __rest = (this && this.__rest) || function (s, e) {
-    var t = {};
-    for (var p in s) if (Object.prototype.hasOwnProperty.call(s, p) && e.indexOf(p) < 0)
-        t[p] = s[p];
-    if (s != null && typeof Object.getOwnPropertySymbols === "function")
-        for (var i = 0, p = Object.getOwnPropertySymbols(s); i < p.length; i++) {
-            if (e.indexOf(p[i]) < 0 && Object.prototype.propertyIsEnumerable.call(s, p[i]))
-                t[p[i]] = s[p[i]];
-        }
-    return t;
-};
-var __importDefault = (this && this.__importDefault) || function (mod) {
-    return (mod && mod.__esModule) ? mod : { "default": mod };
-};
-Object.defineProperty(exports, "__esModule", { value: true });
-var knowledge_widget_ui_1 = require("@telia-ace/knowledge-widget-ui");
-var widget_utilities_1 = require("@telia-ace/widget-utilities");
-var react_1 = __importDefault(require("react"));
-var styled_components_1 = __importStar(require("styled-components"));
-var getIcon = function (selected, defaultIcon, activeIcon) {
-    if (selected && activeIcon) {
-        return react_1.default.createElement(StyledSymbolBadge, { symbol: activeIcon, size: 18 });
-    }
-    if (defaultIcon) {
-        return react_1.default.createElement(StyledSymbolBadge, { symbol: defaultIcon, size: 18 });
-    }
-    return null;
-};
-var RelatedTagList = function (_a) {
-    var className = _a.className, _b = _a.embedded, embedded = _b === void 0 ? false : _b, other = __rest(_a, ["className", "embedded"]);
-    var container = (0, knowledge_widget_ui_1.useContainer)();
-    var _c = (0, knowledge_widget_ui_1.useProperties)(), _d = _c.route, route = _d === void 0 ? 'search' : _d, header = _c.header, _e = _c.items, items = _e === void 0 ? [] : _e, showIcons = _c.showIcons;
-    var params = (0, knowledge_widget_ui_1.useRouteData)().params;
-    if (!items.length) {
-        return (0, knowledge_widget_ui_1.createEmptyComponent)(container, __assign(__assign({}, other), { className: (0, widget_utilities_1.appendClassNames)(className, 'humany-tag-list', 'humany-related-tag-list') }));
-    }
-    return (react_1.default.createElement(StyledItemList, __assign({ embedded: embedded ? 'true' : 'false' }, other, { className: (0, widget_utilities_1.appendClassNames)(className, 'humany-tag-list', 'humany-related-tag-list'), header: header, items: items, renderItem: function (item) {
-            var id = item.id, title = item.title, defaultIcon = item.defaultIcon, activeIcon = item.activeIcon;
-            var selected = params.tag === item.id || (!params.tag && item.id === '0');
-            return (react_1.default.createElement("li", { key: id, "data-tag": id },
-                react_1.default.createElement(StyledLink, { routeName: route, selected: selected, params: (0, widget_utilities_1.createParams)({
-                        tag: id,
-                    }), text: title }, showIcons && getIcon(selected, defaultIcon, activeIcon))));
-        } })));
-};
-exports.default = RelatedTagList;
-var StyledSymbolBadge = (0, styled_components_1.default)(knowledge_widget_ui_1.SymbolBadge)(templateObject_1 || (templateObject_1 = __makeTemplateObject(["\n    margin-right: ", ";\n    ", "\n"], ["\n    margin-right: ", ";\n    ", "\n"])), function (p) { var _a; return (_a = p.theme.sizes) === null || _a === void 0 ? void 0 : _a.small; }, function (p) {
-    if (p.symbol.type === 'Uri') {
-        return "\n        width: ".concat(p.size, "px;\n        height: ").concat(p.size, "px;\n      ");
-    }
-    if (p.symbol.type === 'FontAwesome') {
-        return "\n        font-size: ".concat(p.size, "px;\n      ");
-    }
-});
-var StyledItemList = (0, styled_components_1.default)(knowledge_widget_ui_1.ItemList)(templateObject_2 || (templateObject_2 = __makeTemplateObject(["\n    ", "\n    ", "\n  ", "\n  justify-content: flex-start;\n\n    ul {\n        display: flex;\n        flex-wrap: wrap;\n        li {\n            margin: 0 ", " 0;\n\n            a {\n                color: #fff;\n            }\n        }\n    }\n"], ["\n    ", "\n    ", "\n  ", "\n  justify-content: flex-start;\n\n    ul {\n        display: flex;\n        flex-wrap: wrap;\n        li {\n            margin: 0 ", " 0;\n\n            a {\n                color: #fff;\n            }\n        }\n    }\n"])), knowledge_widget_ui_1.itemList, function (p) { return p.embedded === 'false' && knowledge_widget_ui_1.contentBox; }, function (p) { var _a; return "padding: ".concat((_a = p.theme.sizes) === null || _a === void 0 ? void 0 : _a.large, ";"); }, function (p) { var _a, _b; return "".concat((_a = p.theme.sizes) === null || _a === void 0 ? void 0 : _a.small, " ").concat((_b = p.theme.sizes) === null || _b === void 0 ? void 0 : _b.small); });
-var StyledLink = (0, styled_components_1.default)(knowledge_widget_ui_1.TextLink)(templateObject_4 || (templateObject_4 = __makeTemplateObject(["\n    padding: 8px 15px;\n    background-color: ", ";\n    font-weight: 300;\n    border-radius: ", ";\n    display: block;\n    font-size: ", ";\n\n    &:focus {\n        ", ";\n    }\n\n    @media (hover: hover) {\n        &:hover {\n            background-color: ", ";\n        }\n    }\n"], ["\n    padding: 8px 15px;\n    background-color: ", ";\n    font-weight: 300;\n    border-radius: ", ";\n    display: block;\n    font-size: ", ";\n\n    &:focus {\n        ", ";\n    }\n\n    @media (hover: hover) {\n        &:hover {\n            background-color: ", ";\n        }\n    }\n"])), function (p) { var _a, _b; return (p.selected ? (_a = p.theme.colors) === null || _a === void 0 ? void 0 : _a.text : (_b = p.theme.colors) === null || _b === void 0 ? void 0 : _b.primary); }, function (p) { return p.theme.borderRadius; }, function (p) { var _a; return (_a = p.theme.fonts) === null || _a === void 0 ? void 0 : _a.normal; }, function (p) {
-    var _a;
-    return ((_a = p.theme.accessibility) === null || _a === void 0 ? void 0 : _a.isTabbing) && (0, styled_components_1.css)(templateObject_3 || (templateObject_3 = __makeTemplateObject(["\n                ", "\n                padding: 6px 15px;\n                background-color: transparent;\n            "], ["\n                ", "\n                padding: 6px 15px;\n                background-color: transparent;\n            "])), knowledge_widget_ui_1.borderTabStyle);
-}, function (p) { var _a, _b; return p.selected ? (_a = p.theme.colors) === null || _a === void 0 ? void 0 : _a.primary : (_b = p.theme.colors) === null || _b === void 0 ? void 0 : _b.text; });
-var templateObject_1, templateObject_2, templateObject_3, templateObject_4;

package/lib-esm/index.js

@@ -1,2 +0,0 @@
-import RelatedTagListComponent from './related-tag-list-component';
-export default RelatedTagListComponent;

package/lib-esm/related-tag-list-component.js

@@ -1,84 +0,0 @@
-var __assign = (this && this.__assign) || function () {
-    __assign = Object.assign || function(t) {
-        for (var s, i = 1, n = arguments.length; i < n; i++) {
-            s = arguments[i];
-            for (var p in s) if (Object.prototype.hasOwnProperty.call(s, p))
-                t[p] = s[p];
-        }
-        return t;
-    };
-    return __assign.apply(this, arguments);
-};
-var __read = (this && this.__read) || function (o, n) {
-    var m = typeof Symbol === "function" && o[Symbol.iterator];
-    if (!m) return o;
-    var i = m.call(o), r, ar = [], e;
-    try {
-        while ((n === void 0 || n-- > 0) && !(r = i.next()).done) ar.push(r.value);
-    }
-    catch (error) { e = { error: error }; }
-    finally {
-        try {
-            if (r && !r.done && (m = i["return"])) m.call(i);
-        }
-        finally { if (e) throw e.error; }
-    }
-    return ar;
-};
-import { createEventSubscriber, extendComponent } from '@telia-ace/knowledge-widget-core';
-import { DataType } from '@telia-ace/knowledge-widget-types-grid';
-import { createReactComponent } from '@telia-ace/knowledge-widget-ui';
-var RelatedTagListComponent = function (container) {
-    return createReactComponent(container, 'related-tag-list', import('./related-tag-list'), function (component) {
-        var events = container.get('$widget').events;
-        var _a = __read(createEventSubscriber(events), 2), subscribe = _a[0], unsubscribe = _a[1];
-        var fetch = function (params) {
-            component.writeProperties({ loading: true, error: undefined });
-            component.actions.dispatch('fetch', { params: params });
-        };
-        component.actions.create('fetch', function (_a) {
-            var _b = _a.items, items = _b === void 0 ? [] : _b;
-            return component.actions.dispatch('fetched', {
-                items: items,
-                loading: true,
-            });
-        });
-        component.actions.create('fetched', function (input) {
-            return component.writeProperties(__assign(__assign({}, input), { loading: false }));
-        });
-        container.getAsync('router').then(function (router) {
-            var params = router.getRouteData().params;
-            fetch(params);
-        });
-        subscribe('router:changed', function (_, _a) {
-            var current = _a.current;
-            fetch(current.routeData.params);
-        });
-        return function () {
-            unsubscribe();
-        };
-    }).then(function () {
-        return extendComponent(container, 'related-tag-list', function (component) {
-            component.actions.watch('related-tag-list.fetch', function (input, next) {
-                var _a = input.params, guide = _a.guide, connection = _a.connection;
-                if (typeof guide !== 'undefined') {
-                    return container.getAsync('dataClient').then(function (dataClient) {
-                        return dataClient
-                            .fetch(DataType.Guide, {
-                            connection: connection,
-                            guideId: guide,
-                        })
-                            .then(function (_a) {
-                            var tags = _a.tags;
-                            return next(__assign(__assign({}, input), { items: tags || [] }));
-                        })
-                            .catch(function (e) {
-                            return next(input);
-                        });
-                    });
-                }
-            });
-        });
-    });
-};
-export default RelatedTagListComponent;

package/lib-esm/related-tag-list.js

@@ -1,71 +0,0 @@
-var __makeTemplateObject = (this && this.__makeTemplateObject) || function (cooked, raw) {
-    if (Object.defineProperty) { Object.defineProperty(cooked, "raw", { value: raw }); } else { cooked.raw = raw; }
-    return cooked;
-};
-var __assign = (this && this.__assign) || function () {
-    __assign = Object.assign || function(t) {
-        for (var s, i = 1, n = arguments.length; i < n; i++) {
-            s = arguments[i];
-            for (var p in s) if (Object.prototype.hasOwnProperty.call(s, p))
-                t[p] = s[p];
-        }
-        return t;
-    };
-    return __assign.apply(this, arguments);
-};
-var __rest = (this && this.__rest) || function (s, e) {
-    var t = {};
-    for (var p in s) if (Object.prototype.hasOwnProperty.call(s, p) && e.indexOf(p) < 0)
-        t[p] = s[p];
-    if (s != null && typeof Object.getOwnPropertySymbols === "function")
-        for (var i = 0, p = Object.getOwnPropertySymbols(s); i < p.length; i++) {
-            if (e.indexOf(p[i]) < 0 && Object.prototype.propertyIsEnumerable.call(s, p[i]))
-                t[p[i]] = s[p[i]];
-        }
-    return t;
-};
-import { borderTabStyle, contentBox, createEmptyComponent, ItemList, itemList, SymbolBadge, TextLink, useContainer, useProperties, useRouteData, } from '@telia-ace/knowledge-widget-ui';
-import { appendClassNames, createParams } from '@telia-ace/widget-utilities';
-import React from 'react';
-import styled, { css } from 'styled-components';
-var getIcon = function (selected, defaultIcon, activeIcon) {
-    if (selected && activeIcon) {
-        return React.createElement(StyledSymbolBadge, { symbol: activeIcon, size: 18 });
-    }
-    if (defaultIcon) {
-        return React.createElement(StyledSymbolBadge, { symbol: defaultIcon, size: 18 });
-    }
-    return null;
-};
-var RelatedTagList = function (_a) {
-    var className = _a.className, _b = _a.embedded, embedded = _b === void 0 ? false : _b, other = __rest(_a, ["className", "embedded"]);
-    var container = useContainer();
-    var _c = useProperties(), _d = _c.route, route = _d === void 0 ? 'search' : _d, header = _c.header, _e = _c.items, items = _e === void 0 ? [] : _e, showIcons = _c.showIcons;
-    var params = useRouteData().params;
-    if (!items.length) {
-        return createEmptyComponent(container, __assign(__assign({}, other), { className: appendClassNames(className, 'humany-tag-list', 'humany-related-tag-list') }));
-    }
-    return (React.createElement(StyledItemList, __assign({ embedded: embedded ? 'true' : 'false' }, other, { className: appendClassNames(className, 'humany-tag-list', 'humany-related-tag-list'), header: header, items: items, renderItem: function (item) {
-            var id = item.id, title = item.title, defaultIcon = item.defaultIcon, activeIcon = item.activeIcon;
-            var selected = params.tag === item.id || (!params.tag && item.id === '0');
-            return (React.createElement("li", { key: id, "data-tag": id },
-                React.createElement(StyledLink, { routeName: route, selected: selected, params: createParams({
-                        tag: id,
-                    }), text: title }, showIcons && getIcon(selected, defaultIcon, activeIcon))));
-        } })));
-};
-export default RelatedTagList;
-var StyledSymbolBadge = styled(SymbolBadge)(templateObject_1 || (templateObject_1 = __makeTemplateObject(["\n    margin-right: ", ";\n    ", "\n"], ["\n    margin-right: ", ";\n    ", "\n"])), function (p) { var _a; return (_a = p.theme.sizes) === null || _a === void 0 ? void 0 : _a.small; }, function (p) {
-    if (p.symbol.type === 'Uri') {
-        return "\n        width: ".concat(p.size, "px;\n        height: ").concat(p.size, "px;\n      ");
-    }
-    if (p.symbol.type === 'FontAwesome') {
-        return "\n        font-size: ".concat(p.size, "px;\n      ");
-    }
-});
-var StyledItemList = styled(ItemList)(templateObject_2 || (templateObject_2 = __makeTemplateObject(["\n    ", "\n    ", "\n  ", "\n  justify-content: flex-start;\n\n    ul {\n        display: flex;\n        flex-wrap: wrap;\n        li {\n            margin: 0 ", " 0;\n\n            a {\n                color: #fff;\n            }\n        }\n    }\n"], ["\n    ", "\n    ", "\n  ", "\n  justify-content: flex-start;\n\n    ul {\n        display: flex;\n        flex-wrap: wrap;\n        li {\n            margin: 0 ", " 0;\n\n            a {\n                color: #fff;\n            }\n        }\n    }\n"])), itemList, function (p) { return p.embedded === 'false' && contentBox; }, function (p) { var _a; return "padding: ".concat((_a = p.theme.sizes) === null || _a === void 0 ? void 0 : _a.large, ";"); }, function (p) { var _a, _b; return "".concat((_a = p.theme.sizes) === null || _a === void 0 ? void 0 : _a.small, " ").concat((_b = p.theme.sizes) === null || _b === void 0 ? void 0 : _b.small); });
-var StyledLink = styled(TextLink)(templateObject_4 || (templateObject_4 = __makeTemplateObject(["\n    padding: 8px 15px;\n    background-color: ", ";\n    font-weight: 300;\n    border-radius: ", ";\n    display: block;\n    font-size: ", ";\n\n    &:focus {\n        ", ";\n    }\n\n    @media (hover: hover) {\n        &:hover {\n            background-color: ", ";\n        }\n    }\n"], ["\n    padding: 8px 15px;\n    background-color: ", ";\n    font-weight: 300;\n    border-radius: ", ";\n    display: block;\n    font-size: ", ";\n\n    &:focus {\n        ", ";\n    }\n\n    @media (hover: hover) {\n        &:hover {\n            background-color: ", ";\n        }\n    }\n"])), function (p) { var _a, _b; return (p.selected ? (_a = p.theme.colors) === null || _a === void 0 ? void 0 : _a.text : (_b = p.theme.colors) === null || _b === void 0 ? void 0 : _b.primary); }, function (p) { return p.theme.borderRadius; }, function (p) { var _a; return (_a = p.theme.fonts) === null || _a === void 0 ? void 0 : _a.normal; }, function (p) {
-    var _a;
-    return ((_a = p.theme.accessibility) === null || _a === void 0 ? void 0 : _a.isTabbing) && css(templateObject_3 || (templateObject_3 = __makeTemplateObject(["\n                ", "\n                padding: 6px 15px;\n                background-color: transparent;\n            "], ["\n                ", "\n                padding: 6px 15px;\n                background-color: transparent;\n            "])), borderTabStyle);
-}, function (p) { var _a, _b; return p.selected ? (_a = p.theme.colors) === null || _a === void 0 ? void 0 : _a.primary : (_b = p.theme.colors) === null || _b === void 0 ? void 0 : _b.text; });
-var templateObject_1, templateObject_2, templateObject_3, templateObject_4;