@telia-ace/widget-components-close-button 1.0.31 → 1.1.1-rc.0

package/close-button-13dd4fb3.mjs

@@ -0,0 +1,55 @@
+import { jsx as a } from "react/jsx-runtime";
+import { C as h, u as f, a as y, b as C, c as b, n as l, B as x, d as S, S as B } from "./index-d8df022f.mjs";
+import { useContext as p, useState as u, useEffect as $ } from "react";
+import "react-dom";
+const g = () => p(h), v = () => {
+  const e = f(), t = g(), [o, i] = u([]), [d, m] = u();
+  return $(() => {
+    if (e && t) {
+      const r = new y(e).withId(t.id), n = e.actions(r, t.type || C());
+      m(n), o !== null && (o.forEach((s) => {
+        n.dispatch(s.key, s.data).then((c) => s.resolve(c)).catch((c) => s.reject(c));
+      }), i(null));
+    }
+  }, [e, t.id]), (r, n) => o !== null ? new Promise((s, c) => {
+    o.push({
+      key: r,
+      data: n,
+      resolve: s,
+      reject: c
+    });
+  }) : d.dispatch(r, n);
+}, w = () => p(b), T = ({ className: e, ...t }) => {
+  const o = v(), { ariaLabel: i = "" } = w();
+  return /* @__PURE__ */ a(P, { ...t, className: e, children: /* @__PURE__ */ a(j, { onClick: () => o("close"), "aria-label": i, children: /* @__PURE__ */ a(k, { size: 12, symbol: { type: "Svg", content: "close" } }) }) });
+}, P = l.div`
+    display: flex;
+    justify-content: flex-end;
+    align-items: flex-start;
+`, j = l(x)`
+    &:focus-visible {
+        ${S}
+        padding: ${(e) => {
+  var t, o;
+  return `calc(${(t = e.theme.sizes) == null ? void 0 : t.small} / 2) ${(o = e.theme.sizes) == null ? void 0 : o.small}`;
+}};
+        line,
+        path {
+            stroke: ${(e) => {
+  var t, o;
+  return (o = (t = e.theme.accessibility) == null ? void 0 : t.colors) == null ? void 0 : o.inactiveText;
+}};
+        }
+    }
+`, k = l(B)`
+    line,
+    path {
+        stroke: ${(e) => {
+  var t;
+  return (t = e.theme.colors) == null ? void 0 : t.text;
+}};
+    }
+`;
+export {
+  T as default
+};

package/close-button-7e0fabd8.js

@@ -0,0 +1,19 @@
+"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const a=require("react/jsx-runtime"),o=require("./index-9afe331a.js"),i=require("react");require("react-dom");const y=()=>i.useContext(o.ComponentNodeContext),m=()=>{const t=o.useComponentPlatform(),e=y(),[n,u]=i.useState([]),[d,p]=i.useState();return i.useEffect(()=>{if(t&&e){const l=new o.ComponentQuery(t).withId(e.id),c=t.actions(l,e.type||o.uuid());p(c),n!==null&&(n.forEach(s=>{c.dispatch(s.key,s.data).then(r=>s.resolve(r)).catch(r=>s.reject(r))}),u(null))}},[t,e.id]),(l,c)=>n!==null?new Promise((s,r)=>{n.push({key:l,data:c,resolve:s,reject:r})}):d.dispatch(l,c)},h=()=>i.useContext(o.ComponentPropertyContext),f=({className:t,...e})=>{const n=m(),{ariaLabel:u=""}=h();return a.jsx(x,{...e,className:t,children:a.jsx(S,{onClick:()=>n("close"),"aria-label":u,children:a.jsx(C,{size:12,symbol:{type:"Svg",content:"close"}})})})},x=o.newStyled.div`
+    display: flex;
+    justify-content: flex-end;
+    align-items: flex-start;
+`,S=o.newStyled(o.Button)`
+    &:focus-visible {
+        ${o.borderTabStyle}
+        padding: ${t=>{var e,n;return`calc(${(e=t.theme.sizes)==null?void 0:e.small} / 2) ${(n=t.theme.sizes)==null?void 0:n.small}`}};
+        line,
+        path {
+            stroke: ${t=>{var e,n;return(n=(e=t.theme.accessibility)==null?void 0:e.colors)==null?void 0:n.inactiveText}};
+        }
+    }
+`,C=o.newStyled(o.SymbolBadge)`
+    line,
+    path {
+        stroke: ${t=>{var e;return(e=t.theme.colors)==null?void 0:e.text}};
+    }
+`;exports.default=f;