@telia-ace/widget-components-tab-stop 1.0.4 → 1.0.7

package/dist/index.js

@@ -0,0 +1,6 @@
+import { createReactComponent } from "@telia-ace/widget-ui";
+const TabStopComponent = (container) => {
+  return createReactComponent(container, "tab-stop", import("./tab-stop.js"));
+};
+export { TabStopComponent as default };
+//# sourceMappingURL=index.js.map

package/dist/index.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"index.js","sources":["../src/tab-stop-component.ts"],"sourcesContent":["import { createReactComponent } from '@telia-ace/widget-ui';\r\nimport { Container } from '@webprovisions/platform';\r\n\r\nexport type TabStopComponentProps = {\r\n    position: 'start' | 'end';\r\n};\r\n\r\nconst TabStopComponent = (container: Container) => {\r\n    return createReactComponent(container, 'tab-stop', import('./tab-stop'));\r\n};\r\n\r\nexport default TabStopComponent;\r\n"],"names":[],"mappings":";AAOM,MAAA,mBAAmB,CAAC,cAAyB;AAC/C,SAAO,qBAAqB,WAAW,YAAY,OAAO,gBAAa;AAC3E;;"}

package/dist/tab-stop.js

@@ -0,0 +1,85 @@
+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 } from "@telia-ace/widget-ui";
+import { appendClassNames } from "@telia-ace/widget-utilities";
+import React, { useRef, useEffect } from "react";
+import styled from "styled-components";
+const TabStop = (_a) => {
+  var _b = _a, { className } = _b, other = __objRest(_b, ["className"]);
+  const node = useRef();
+  const container = useContainer();
+  const { position = "end" } = useProperties();
+  const positionRef = useRef(position);
+  useEffect(() => {
+    positionRef.current = position;
+  }, [position]);
+  const focusHandler = () => {
+    const [widgetDOMElement] = container.get("widgetDOMElements");
+    const focusable = widgetDOMElement.querySelectorAll('button, [href], input, select, textarea, [tabindex]:not([tabindex="-1"]):not(.humany-tab-stop)');
+    const filtered = [].filter.call(focusable, (el) => {
+      if (typeof window === "undefined") {
+        return true;
+      }
+      const style = window.getComputedStyle(el);
+      if (style.display === "none" || el.offsetWidth <= 0 && el.offsetHeight <= 0) {
+        return false;
+      }
+      return true;
+    });
+    const target = positionRef.current === "end" ? filtered[0] : filtered[filtered.length - 1];
+    if (target) {
+      target.focus();
+    }
+  };
+  useEffect(() => {
+    const [widgetDOMElement] = container.get("widgetDOMElements");
+    if (node.current && widgetDOMElement) {
+      node.current.addEventListener("focus", focusHandler);
+    }
+    return () => {
+      if (node.current) {
+        node.current.removeEventListener("focus", focusHandler);
+      }
+    };
+  }, []);
+  return /* @__PURE__ */ React.createElement(Wrapper, __spreadProps(__spreadValues({}, other), {
+    tabIndex: 0,
+    ref: node,
+    className: appendClassNames(className, "humany-tab-stop")
+  }));
+};
+const Wrapper = styled.div`
+    opacity: 0;
+    position: absolute;
+`;
+export { TabStop as default };
+//# sourceMappingURL=tab-stop.js.map

package/dist/tab-stop.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"tab-stop.js","sources":["../src/tab-stop.tsx"],"sourcesContent":["import { useContainer, useProperties } from '@telia-ace/widget-ui';\r\nimport { appendClassNames } from '@telia-ace/widget-utilities';\r\nimport React, { useEffect, useRef } from 'react';\r\nimport styled from 'styled-components';\r\nimport { TabStopComponentProps } from './tab-stop-component';\r\n\r\ntype Props = {\r\n    className: string;\r\n};\r\n\r\nconst TabStop: React.SFC<Props> = ({ className, ...other }) => {\r\n    const node = useRef() as React.MutableRefObject<HTMLDivElement>;\r\n    const container = useContainer();\r\n    const { position = 'end' } = useProperties<TabStopComponentProps>();\r\n    const positionRef = useRef(position) as React.MutableRefObject<'start' | 'end'>;\r\n\r\n    useEffect(() => {\r\n        positionRef.current = position;\r\n    }, [position]);\r\n\r\n    const focusHandler = () => {\r\n        const [widgetDOMElement] = container.get('widgetDOMElements') as HTMLElement[];\r\n\r\n        const focusable = widgetDOMElement.querySelectorAll(\r\n            'button, [href], input, select, textarea, [tabindex]:not([tabindex=\"-1\"]):not(.humany-tab-stop)'\r\n        );\r\n\r\n        // ensure that elements is visible\r\n        const filtered = [].filter.call(focusable, (el: HTMLElement) => {\r\n            if (typeof window === 'undefined') {\r\n                return true;\r\n            }\r\n\r\n            const style = window.getComputedStyle(el);\r\n            if (style.display === 'none' || (el.offsetWidth <= 0 && el.offsetHeight <= 0)) {\r\n                return false;\r\n            }\r\n            return true;\r\n        }) as HTMLElement[];\r\n\r\n        const target = positionRef.current === 'end' ? filtered[0] : filtered[filtered.length - 1];\r\n\r\n        if (target) {\r\n            target.focus();\r\n        }\r\n    };\r\n\r\n    useEffect(() => {\r\n        const [widgetDOMElement] = container.get('widgetDOMElements');\r\n\r\n        if (node.current && widgetDOMElement) {\r\n            node.current.addEventListener('focus', focusHandler);\r\n        }\r\n\r\n        return () => {\r\n            if (node.current) {\r\n                node.current.removeEventListener('focus', focusHandler);\r\n            }\r\n        };\r\n    }, []);\r\n\r\n    return (\r\n        <Wrapper\r\n            {...other}\r\n            tabIndex={0}\r\n            ref={node}\r\n            className={appendClassNames(className, 'humany-tab-stop')}\r\n        />\r\n    );\r\n};\r\n\r\nexport default TabStop;\r\n\r\nconst Wrapper = styled.div`\r\n    opacity: 0;\r\n    position: absolute;\r\n`;\r\n"],"names":[],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;AAUA,MAAM,UAA4B,CAAC,OAA4B;AAA5B,eAAE,gBAAF,IAAgB,kBAAhB,IAAgB,CAAd;AACjC,QAAM,OAAO;AACb,QAAM,YAAY;AACZ,QAAA,EAAE,WAAW,UAAU,cAAqC;AAC5D,QAAA,cAAc,OAAO,QAAQ;AAEnC,YAAU,MAAM;AACZ,gBAAY,UAAU;AAAA,EAAA,GACvB,CAAC,QAAQ,CAAC;AAEb,QAAM,eAAe,MAAM;AACvB,UAAM,CAAC,oBAAoB,UAAU,IAAI,mBAAmB;AAEtD,UAAA,YAAY,iBAAiB,iBAC/B,gGACJ;AAGA,UAAM,WAAW,CAAA,EAAG,OAAO,KAAK,WAAW,CAAC,OAAoB;AACxD,UAAA,OAAO,WAAW,aAAa;AACxB,eAAA;AAAA,MACX;AAEM,YAAA,QAAQ,OAAO,iBAAiB,EAAE;AACpC,UAAA,MAAM,YAAY,UAAW,GAAG,eAAe,KAAK,GAAG,gBAAgB,GAAI;AACpE,eAAA;AAAA,MACX;AACO,aAAA;AAAA,IAAA,CACV;AAEK,UAAA,SAAS,YAAY,YAAY,QAAQ,SAAS,KAAK,SAAS,SAAS,SAAS;AAExF,QAAI,QAAQ;AACR,aAAO,MAAM;AAAA,IACjB;AAAA,EAAA;AAGJ,YAAU,MAAM;AACZ,UAAM,CAAC,oBAAoB,UAAU,IAAI,mBAAmB;AAExD,QAAA,KAAK,WAAW,kBAAkB;AAC7B,WAAA,QAAQ,iBAAiB,SAAS,YAAY;AAAA,IACvD;AAEA,WAAO,MAAM;AACT,UAAI,KAAK,SAAS;AACT,aAAA,QAAQ,oBAAoB,SAAS,YAAY;AAAA,MAC1D;AAAA,IAAA;AAAA,EAER,GAAG,CAAE,CAAA;AAEL,SACK,sBAAA,cAAA,SAAA,iCACO,QADP;AAAA,IAEG,UAAU;AAAA,IACV,KAAK;AAAA,IACL,WAAW,iBAAiB,WAAW,iBAAiB;AAAA,EAAA,EAC5D;AAER;AAIA,MAAM,UAAU,OAAO;AAAA;AAAA;AAAA;;"}

package/package.json

@@ -1,31 +1,30 @@
 {
     "name": "@telia-ace/widget-components-tab-stop",
-    "version": "1.0.4",
+    "version": "1.0.7",
     "description": "Tab stop component for ACE 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/widget-ui": "^1.0.6",
+        "@telia-ace/widget-ui": "^1.0.9",
         "@telia-ace/widget-utilities": "^1.0.1",
         "@webprovisions/platform": "^1.1.2"
     },
@@ -39,5 +38,5 @@
         "@types/react-dom": "^16.8.0",
         "@types/styled-components": "^5.1.7"
     },
-    "gitHead": "993320b5ff4692cf9cb896b0011acf5f42734a74"
+    "gitHead": "cbf3ac8268821668619bd7a3d0fb60bb13d9fb5b"
 }

package/lib/index.d.ts

@@ -1,2 +0,0 @@
-import TabStopComponent from './tab-stop-component';
-export default TabStopComponent;

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 tab_stop_component_1 = __importDefault(require("./tab-stop-component"));
-exports.default = tab_stop_component_1.default;

package/lib/tab-stop-component.d.ts

@@ -1,6 +0,0 @@
-import { Container } from '@webprovisions/platform';
-export declare type TabStopComponentProps = {
-    position: 'start' | 'end';
-};
-declare const TabStopComponent: (container: Container) => Promise<void>;
-export default TabStopComponent;

package/lib/tab-stop-component.js

@@ -1,30 +0,0 @@
-"use strict";
-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;
-};
-Object.defineProperty(exports, "__esModule", { value: true });
-var widget_ui_1 = require("@telia-ace/widget-ui");
-var TabStopComponent = function (container) {
-    return (0, widget_ui_1.createReactComponent)(container, 'tab-stop', Promise.resolve().then(function () { return __importStar(require('./tab-stop')); }));
-};
-exports.default = TabStopComponent;

package/lib/tab-stop.d.ts

@@ -1,6 +0,0 @@
-import React from 'react';
-declare type Props = {
-    className: string;
-};
-declare const TabStop: React.SFC<Props>;
-export default TabStop;

package/lib/tab-stop.js

@@ -1,118 +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 __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;
-};
-var __importDefault = (this && this.__importDefault) || function (mod) {
-    return (mod && mod.__esModule) ? mod : { "default": mod };
-};
-Object.defineProperty(exports, "__esModule", { value: true });
-var widget_ui_1 = require("@telia-ace/widget-ui");
-var widget_utilities_1 = require("@telia-ace/widget-utilities");
-var react_1 = __importStar(require("react"));
-var styled_components_1 = __importDefault(require("styled-components"));
-var TabStop = function (_a) {
-    var className = _a.className, other = __rest(_a, ["className"]);
-    var node = (0, react_1.useRef)();
-    var container = (0, widget_ui_1.useContainer)();
-    var _b = (0, widget_ui_1.useProperties)().position, position = _b === void 0 ? 'end' : _b;
-    var positionRef = (0, react_1.useRef)(position);
-    (0, react_1.useEffect)(function () {
-        positionRef.current = position;
-    }, [position]);
-    var focusHandler = function () {
-        var _a = __read(container.get('widgetDOMElements'), 1), widgetDOMElement = _a[0];
-        var focusable = widgetDOMElement.querySelectorAll('button, [href], input, select, textarea, [tabindex]:not([tabindex="-1"]):not(.humany-tab-stop)');
-        // ensure that elements is visible
-        var filtered = [].filter.call(focusable, function (el) {
-            if (typeof window === 'undefined') {
-                return true;
-            }
-            var style = window.getComputedStyle(el);
-            if (style.display === 'none' || (el.offsetWidth <= 0 && el.offsetHeight <= 0)) {
-                return false;
-            }
-            return true;
-        });
-        var target = positionRef.current === 'end' ? filtered[0] : filtered[filtered.length - 1];
-        if (target) {
-            target.focus();
-        }
-    };
-    (0, react_1.useEffect)(function () {
-        var _a = __read(container.get('widgetDOMElements'), 1), widgetDOMElement = _a[0];
-        if (node.current && widgetDOMElement) {
-            node.current.addEventListener('focus', focusHandler);
-        }
-        return function () {
-            if (node.current) {
-                node.current.removeEventListener('focus', focusHandler);
-            }
-        };
-    }, []);
-    return (react_1.default.createElement(Wrapper, __assign({}, other, { tabIndex: 0, ref: node, className: (0, widget_utilities_1.appendClassNames)(className, 'humany-tab-stop') })));
-};
-exports.default = TabStop;
-var Wrapper = styled_components_1.default.div(templateObject_1 || (templateObject_1 = __makeTemplateObject(["\n    opacity: 0;\n    position: absolute;\n"], ["\n    opacity: 0;\n    position: absolute;\n"])));
-var templateObject_1;

package/lib-esm/index.js

@@ -1,2 +0,0 @@
-import TabStopComponent from './tab-stop-component';
-export default TabStopComponent;

package/lib-esm/tab-stop-component.js

@@ -1,5 +0,0 @@
-import { createReactComponent } from '@telia-ace/widget-ui';
-var TabStopComponent = function (container) {
-    return createReactComponent(container, 'tab-stop', import('./tab-stop'));
-};
-export default TabStopComponent;

package/lib-esm/tab-stop.js

@@ -1,90 +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;
-};
-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 { useContainer, useProperties } from '@telia-ace/widget-ui';
-import { appendClassNames } from '@telia-ace/widget-utilities';
-import React, { useEffect, useRef } from 'react';
-import styled from 'styled-components';
-var TabStop = function (_a) {
-    var className = _a.className, other = __rest(_a, ["className"]);
-    var node = useRef();
-    var container = useContainer();
-    var _b = useProperties().position, position = _b === void 0 ? 'end' : _b;
-    var positionRef = useRef(position);
-    useEffect(function () {
-        positionRef.current = position;
-    }, [position]);
-    var focusHandler = function () {
-        var _a = __read(container.get('widgetDOMElements'), 1), widgetDOMElement = _a[0];
-        var focusable = widgetDOMElement.querySelectorAll('button, [href], input, select, textarea, [tabindex]:not([tabindex="-1"]):not(.humany-tab-stop)');
-        // ensure that elements is visible
-        var filtered = [].filter.call(focusable, function (el) {
-            if (typeof window === 'undefined') {
-                return true;
-            }
-            var style = window.getComputedStyle(el);
-            if (style.display === 'none' || (el.offsetWidth <= 0 && el.offsetHeight <= 0)) {
-                return false;
-            }
-            return true;
-        });
-        var target = positionRef.current === 'end' ? filtered[0] : filtered[filtered.length - 1];
-        if (target) {
-            target.focus();
-        }
-    };
-    useEffect(function () {
-        var _a = __read(container.get('widgetDOMElements'), 1), widgetDOMElement = _a[0];
-        if (node.current && widgetDOMElement) {
-            node.current.addEventListener('focus', focusHandler);
-        }
-        return function () {
-            if (node.current) {
-                node.current.removeEventListener('focus', focusHandler);
-            }
-        };
-    }, []);
-    return (React.createElement(Wrapper, __assign({}, other, { tabIndex: 0, ref: node, className: appendClassNames(className, 'humany-tab-stop') })));
-};
-export default TabStop;
-var Wrapper = styled.div(templateObject_1 || (templateObject_1 = __makeTemplateObject(["\n    opacity: 0;\n    position: absolute;\n"], ["\n    opacity: 0;\n    position: absolute;\n"])));
-var templateObject_1;