@telia-ace/widget-components-grid 1.1.1-rc.1 → 1.1.1-rc.3
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/grid-0e98e1b2.js +14 -0
- package/grid-29fcfd00.mjs +79 -0
- package/index-580deb6d.mjs +63 -0
- package/index-fd0bf089.js +1 -0
- package/index.js +1 -1
- package/index.mjs +4 -4
- package/package.json +5 -5
- package/detached-component-bbc4cabe.js +0 -1
- package/detached-component-dc527d32.mjs +0 -22
- package/grid-0afdffb6.js +0 -75
- package/grid-713c2f6f.mjs +0 -727
- package/index-aa5a29d4.js +0 -624
- package/index-e0485d7b.mjs +0 -8052
package/grid-0e98e1b2.js
ADDED
|
@@ -0,0 +1,14 @@
|
|
|
1
|
+
"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const i=require("react/jsx-runtime"),o=require("@telia-ace/widget-ui"),s=require("@emotion/react"),g=require("@emotion/styled"),m=require("@telia-ace/widget-types-grid"),l=require("@telia-ace/widget-utilities"),u=require("react"),p=require("./index-fd0bf089.js");require("@telia-ace/widget-core");const x=e=>{const r=e.map(t=>"min-content").join(" "),a=e[0].split(" ").map(t=>"1fr").join(" "),n=e.map(t=>`'${t}'`).join(" ");return s.css`
|
|
2
|
+
grid-template-columns: ${a};
|
|
3
|
+
grid-template-rows: ${r};
|
|
4
|
+
grid-template-areas: ${n};
|
|
5
|
+
`},f=e=>{const r=o.useChildren(),a=u.useMemo(()=>Object.entries(e.areas).map(([n,t])=>{const c=r.find(d=>d.name===n);return p.isNestedGrid(t)?{name:n,componentDef:c,context:t.context,areaSettings:t.areaSettings,template:t.template,areas:t.areas,gap:t.gap}:{name:n,componentDef:c,areaSettings:t.areaSettings,child:t.child,context:t.context}}),[e,r]);return i.jsx($,{"data-grid-area":e.gridArea,gridArea:e.gridArea,gap:e.gap,template:e.template,className:l.appendClassNames(e.className,"humany-grid"),children:a.map(n=>n.componentDef?i.jsx(m.Component,{id:n.componentDef.id,branch:"default",context:{}},n.componentDef.id):null)})},$=g.div`
|
|
6
|
+
display: grid;
|
|
7
|
+
${e=>e.gridArea&&s.css`
|
|
8
|
+
grid-area: ${e.gridArea};
|
|
9
|
+
`}
|
|
10
|
+
${e=>x(e.template)}
|
|
11
|
+
${e=>e.gap&&s.css`
|
|
12
|
+
grid-gap: ${e.gap}rem;
|
|
13
|
+
`}
|
|
14
|
+
`,j=({className:e})=>{const r=o.useProperties();return i.jsx(f,{template:r.template,areas:r.areas,gap:r.gap,areaSettings:r.areaSettings,context:r.context})};exports.default=j;
|
|
@@ -0,0 +1,79 @@
|
|
|
1
|
+
import { jsx as i } from "react/jsx-runtime";
|
|
2
|
+
import { useChildren as c, useProperties as d } from "@telia-ace/widget-ui";
|
|
3
|
+
import { css as o } from "@emotion/react";
|
|
4
|
+
import p from "@emotion/styled";
|
|
5
|
+
import { Component as g } from "@telia-ace/widget-types-grid";
|
|
6
|
+
import { appendClassNames as l } from "@telia-ace/widget-utilities";
|
|
7
|
+
import { useMemo as f } from "react";
|
|
8
|
+
import { i as u } from "./index-580deb6d.mjs";
|
|
9
|
+
import "@telia-ace/widget-core";
|
|
10
|
+
const x = (e) => {
|
|
11
|
+
const r = e.map((t) => "min-content").join(" "), n = e[0].split(" ").map((t) => "1fr").join(" "), a = e.map((t) => `'${t}'`).join(" ");
|
|
12
|
+
return o`
|
|
13
|
+
grid-template-columns: ${n};
|
|
14
|
+
grid-template-rows: ${r};
|
|
15
|
+
grid-template-areas: ${a};
|
|
16
|
+
`;
|
|
17
|
+
}, $ = (e) => {
|
|
18
|
+
const r = c(), n = f(() => Object.entries(e.areas).map(([a, t]) => {
|
|
19
|
+
const s = r.find((m) => m.name === a);
|
|
20
|
+
return u(t) ? {
|
|
21
|
+
name: a,
|
|
22
|
+
componentDef: s,
|
|
23
|
+
context: t.context,
|
|
24
|
+
areaSettings: t.areaSettings,
|
|
25
|
+
template: t.template,
|
|
26
|
+
areas: t.areas,
|
|
27
|
+
gap: t.gap
|
|
28
|
+
} : {
|
|
29
|
+
name: a,
|
|
30
|
+
componentDef: s,
|
|
31
|
+
areaSettings: t.areaSettings,
|
|
32
|
+
child: t.child,
|
|
33
|
+
context: t.context
|
|
34
|
+
};
|
|
35
|
+
}), [e, r]);
|
|
36
|
+
return /* @__PURE__ */ i(
|
|
37
|
+
h,
|
|
38
|
+
{
|
|
39
|
+
"data-grid-area": e.gridArea,
|
|
40
|
+
gridArea: e.gridArea,
|
|
41
|
+
gap: e.gap,
|
|
42
|
+
template: e.template,
|
|
43
|
+
className: l(e.className, "humany-grid"),
|
|
44
|
+
children: n.map((a) => a.componentDef ? /* @__PURE__ */ i(
|
|
45
|
+
g,
|
|
46
|
+
{
|
|
47
|
+
id: a.componentDef.id,
|
|
48
|
+
branch: "default",
|
|
49
|
+
context: {}
|
|
50
|
+
},
|
|
51
|
+
a.componentDef.id
|
|
52
|
+
) : null)
|
|
53
|
+
}
|
|
54
|
+
);
|
|
55
|
+
}, h = p.div`
|
|
56
|
+
display: grid;
|
|
57
|
+
${(e) => e.gridArea && o`
|
|
58
|
+
grid-area: ${e.gridArea};
|
|
59
|
+
`}
|
|
60
|
+
${(e) => x(e.template)}
|
|
61
|
+
${(e) => e.gap && o`
|
|
62
|
+
grid-gap: ${e.gap}rem;
|
|
63
|
+
`}
|
|
64
|
+
`, _ = ({ className: e }) => {
|
|
65
|
+
const r = d();
|
|
66
|
+
return /* @__PURE__ */ i(
|
|
67
|
+
$,
|
|
68
|
+
{
|
|
69
|
+
template: r.template,
|
|
70
|
+
areas: r.areas,
|
|
71
|
+
gap: r.gap,
|
|
72
|
+
areaSettings: r.areaSettings,
|
|
73
|
+
context: r.context
|
|
74
|
+
}
|
|
75
|
+
);
|
|
76
|
+
};
|
|
77
|
+
export {
|
|
78
|
+
_ as default
|
|
79
|
+
};
|
|
@@ -0,0 +1,63 @@
|
|
|
1
|
+
import { createReactComponent as N } from "@telia-ace/widget-ui";
|
|
2
|
+
import { createChildren as h } from "@telia-ace/widget-core";
|
|
3
|
+
import { Logger as O } from "@telia-ace/widget-utilities";
|
|
4
|
+
const I = (i) => !!i.template, L = (i) => N(i, "grid", import("./grid-29fcfd00.mjs"), (d) => {
|
|
5
|
+
}), P = (i, d) => {
|
|
6
|
+
var m, g, x, l;
|
|
7
|
+
const { platform: s, node: u, references: j, definitions: p, views: f, branch: b } = d, e = p[i.definitionId];
|
|
8
|
+
if (process.env.NODE_ENV !== "production" && !e) {
|
|
9
|
+
O.error(`No definition found for component type '${i.definitionId}'.`);
|
|
10
|
+
return;
|
|
11
|
+
}
|
|
12
|
+
const t = s.createNode(e.type);
|
|
13
|
+
if (t.name = i.definitionId, t.tags = e.tags || [], e.properties && t.writeProperties(e.properties), e.context && t.writeContext(e.context), e.layout && t.writeLayout(e.layout), u.appendChild(t, b), i.overrides.forEach((r) => {
|
|
14
|
+
const n = { breakpoints: r.breakpoints };
|
|
15
|
+
r.properties && t.writeProperties(r.properties, n), r.context && t.writeContext(r.context, n), r.layout && t.writeLayout(r.layout, n);
|
|
16
|
+
}), (m = e.properties) != null && m.areas && ((g = e.properties) != null && g.areas)) {
|
|
17
|
+
const r = Object.entries(e.properties.areas).reduce(
|
|
18
|
+
(n, [a, o]) => {
|
|
19
|
+
if (o.child) {
|
|
20
|
+
const c = Object.entries(o.areaSettings || {}).reduce((y, [w, C]) => (y[`css-${w}`] = C, y), {});
|
|
21
|
+
n[a] = {
|
|
22
|
+
type: "area",
|
|
23
|
+
context: o.context || {},
|
|
24
|
+
children: [o.child],
|
|
25
|
+
properties: {
|
|
26
|
+
"css-grid-area": a,
|
|
27
|
+
...c
|
|
28
|
+
}
|
|
29
|
+
};
|
|
30
|
+
} else {
|
|
31
|
+
const c = {
|
|
32
|
+
type: "grid",
|
|
33
|
+
context: {},
|
|
34
|
+
properties: {
|
|
35
|
+
areaSettings: {},
|
|
36
|
+
areas: o.areas,
|
|
37
|
+
context: o.context,
|
|
38
|
+
gap: o.gap,
|
|
39
|
+
gridArea: o.gridArea,
|
|
40
|
+
template: o.template
|
|
41
|
+
}
|
|
42
|
+
};
|
|
43
|
+
n[a] = c;
|
|
44
|
+
}
|
|
45
|
+
return n;
|
|
46
|
+
},
|
|
47
|
+
p
|
|
48
|
+
);
|
|
49
|
+
h(
|
|
50
|
+
s,
|
|
51
|
+
t,
|
|
52
|
+
Object.keys(e.properties.areas),
|
|
53
|
+
r,
|
|
54
|
+
f
|
|
55
|
+
);
|
|
56
|
+
} else
|
|
57
|
+
(x = e.properties) != null && x.child && h(s, t, [(l = e.properties) == null ? void 0 : l.child], p, f);
|
|
58
|
+
};
|
|
59
|
+
export {
|
|
60
|
+
L as G,
|
|
61
|
+
P as g,
|
|
62
|
+
I as i
|
|
63
|
+
};
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
"use strict";const N=require("@telia-ace/widget-ui"),C=require("@telia-ace/widget-core"),q=require("@telia-ace/widget-utilities"),G=o=>!!o.template,O=o=>N.createReactComponent(o,"grid",Promise.resolve().then(()=>require("./grid-0e98e1b2.js")),d=>{}),P=(o,d)=>{var g,m,l,u;const{platform:s,node:h,references:j,definitions:p,views:f,branch:w}=d,e=p[o.definitionId];if(process.env.NODE_ENV!=="production"&&!e){q.Logger.error(`No definition found for component type '${o.definitionId}'.`);return}const t=s.createNode(e.type);if(t.name=o.definitionId,t.tags=e.tags||[],e.properties&&t.writeProperties(e.properties),e.context&&t.writeContext(e.context),e.layout&&t.writeLayout(e.layout),h.appendChild(t,w),o.overrides.forEach(r=>{const n={breakpoints:r.breakpoints};r.properties&&t.writeProperties(r.properties,n),r.context&&t.writeContext(r.context,n),r.layout&&t.writeLayout(r.layout,n)}),(g=e.properties)!=null&&g.areas&&((m=e.properties)!=null&&m.areas)){const r=Object.entries(e.properties.areas).reduce((n,[c,i])=>{if(i.child){const a=Object.entries(i.areaSettings||{}).reduce((x,[y,b])=>(x[`css-${y}`]=b,x),{});n[c]={type:"area",context:i.context||{},children:[i.child],properties:{"css-grid-area":c,...a}}}else{const a={type:"grid",context:{},properties:{areaSettings:{},areas:i.areas,context:i.context,gap:i.gap,gridArea:i.gridArea,template:i.template}};n[c]=a}return n},p);C.createChildren(s,t,Object.keys(e.properties.areas),r,f)}else(l=e.properties)!=null&&l.child&&C.createChildren(s,t,[(u=e.properties)==null?void 0:u.child],p,f)};exports.GridComponent=O;exports.gridComponentHandler=P;exports.isNestedGrid=G;
|
package/index.js
CHANGED
|
@@ -1 +1 @@
|
|
|
1
|
-
"use strict";Object.defineProperties(exports,{__esModule:{value:!0},[Symbol.toStringTag]:{value:"Module"}});const e=require("./index-
|
|
1
|
+
"use strict";Object.defineProperties(exports,{__esModule:{value:!0},[Symbol.toStringTag]:{value:"Module"}});const e=require("./index-fd0bf089.js");require("@telia-ace/widget-ui");require("@telia-ace/widget-core");require("@telia-ace/widget-utilities");exports.default=e.GridComponent;exports.gridComponentHandler=e.gridComponentHandler;
|
package/index.mjs
CHANGED
|
@@ -1,7 +1,7 @@
|
|
|
1
|
-
import {
|
|
2
|
-
import "
|
|
3
|
-
import "
|
|
4
|
-
import "
|
|
1
|
+
import { G as a, g as e } from "./index-580deb6d.mjs";
|
|
2
|
+
import "@telia-ace/widget-ui";
|
|
3
|
+
import "@telia-ace/widget-core";
|
|
4
|
+
import "@telia-ace/widget-utilities";
|
|
5
5
|
export {
|
|
6
6
|
a as default,
|
|
7
7
|
e as gridComponentHandler
|
package/package.json
CHANGED
|
@@ -1,6 +1,6 @@
|
|
|
1
1
|
{
|
|
2
2
|
"name": "@telia-ace/widget-components-grid",
|
|
3
|
-
"version": "1.1.1-rc.
|
|
3
|
+
"version": "1.1.1-rc.3",
|
|
4
4
|
"main": "./index.js",
|
|
5
5
|
"types": "./index.d.ts",
|
|
6
6
|
"exports": {
|
|
@@ -10,10 +10,10 @@
|
|
|
10
10
|
}
|
|
11
11
|
},
|
|
12
12
|
"dependencies": {
|
|
13
|
-
"@telia-ace/widget-core": "^1.1.1-rc.
|
|
14
|
-
"@telia-ace/widget-types-grid": "^1.1.1-rc.
|
|
15
|
-
"@telia-ace/widget-ui": "^1.1.1-rc.
|
|
16
|
-
"@telia-ace/widget-utilities": "^1.1.1-rc.
|
|
13
|
+
"@telia-ace/widget-core": "^1.1.1-rc.3",
|
|
14
|
+
"@telia-ace/widget-types-grid": "^1.1.1-rc.3",
|
|
15
|
+
"@telia-ace/widget-ui": "^1.1.1-rc.3",
|
|
16
|
+
"@telia-ace/widget-utilities": "^1.1.1-rc.3",
|
|
17
17
|
"@webprovisions/platform": "^1.1.4"
|
|
18
18
|
},
|
|
19
19
|
"peerDependencies": {
|
|
@@ -1 +0,0 @@
|
|
|
1
|
-
"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const c=require("react/jsx-runtime"),i=require("./index-aa5a29d4.js"),r=require("react");require("react-dom");const d=require("./grid-0afdffb6.js"),a=({builder:s})=>{const o=i.useContainer(),[e,u]=r.useState(null);return r.useEffect(()=>{o.getAsync("components").then(t=>s(t).then(n=>{u(n)}))},[]),r.useEffect(()=>()=>{e&&o.getAsync("components").then(t=>{t.nodes.detached=t.nodes.detached.filter(n=>n.id!==e.id)})},[e]),e?c.jsx(d.Component,{id:e.id,node:e,branch:"default"}):null};exports.default=a;
|
|
@@ -1,22 +0,0 @@
|
|
|
1
|
-
import { jsx as i } from "react/jsx-runtime";
|
|
2
|
-
import { h as a } from "./index-e0485d7b.mjs";
|
|
3
|
-
import { useState as c, useEffect as r } from "react";
|
|
4
|
-
import "react-dom";
|
|
5
|
-
import { C as m } from "./grid-713c2f6f.mjs";
|
|
6
|
-
const C = ({ builder: s }) => {
|
|
7
|
-
const o = a(), [e, d] = c(null);
|
|
8
|
-
return r(() => {
|
|
9
|
-
o.getAsync("components").then((t) => s(t).then((n) => {
|
|
10
|
-
d(n);
|
|
11
|
-
}));
|
|
12
|
-
}, []), r(() => () => {
|
|
13
|
-
e && o.getAsync("components").then((t) => {
|
|
14
|
-
t.nodes.detached = t.nodes.detached.filter(
|
|
15
|
-
(n) => n.id !== e.id
|
|
16
|
-
);
|
|
17
|
-
});
|
|
18
|
-
}, [e]), e ? /* @__PURE__ */ i(m, { id: e.id, node: e, branch: "default" }) : null;
|
|
19
|
-
};
|
|
20
|
-
export {
|
|
21
|
-
C as default
|
|
22
|
-
};
|
package/grid-0afdffb6.js
DELETED
|
@@ -1,75 +0,0 @@
|
|
|
1
|
-
"use strict";const p=require("react/jsx-runtime"),o=require("./index-aa5a29d4.js"),l=require("react");require("react-dom");const K=e=>e==="entering"||e==="entered",X=e=>e==="exiting"||e==="exited",E={fade:{in:"opacity: 1;",out:"opacity: 0;"},"slide-left":{in:"transform: translateX(0);",out:"transform: translateX(-100%);"},"slide-right":{in:"transform: translateX(0);",out:"transform: translateX(100%);"},"slide-up":{in:"transform: translateY(0);",out:"transform: translateY(100%);"},"slide-down":{in:"transform: translateY(0);",out:"transform: translateY(-100%);"},scale:{in:"transform: scale(1);",out:"transform: scale(0);"}},Y=["slide-up","slide-down","slide-left","slide-right","scale"],A={compose:(e="exited",t)=>{const{enter:r,exit:s}=t,n=r.transitionKeys.split(" "),i=Y.indexOf(n[0])>-1?"transform":"opacity";if(K(e))return n&&n.length>0?o.css`
|
|
2
|
-
${n&&n.length>0&&n.map(c=>E[c]?E[c].in:"")}
|
|
3
|
-
transition: ${i} ${r.duration}ms ${r.easing};
|
|
4
|
-
`:"";const a=n&&n.length>0&&o.css`
|
|
5
|
-
${n.map(c=>E[c]?E[c].out:"")}
|
|
6
|
-
`;if(X(e)){const c=s.transitionKeys.split(" ");return c&&c.length>0&&e==="exiting"?o.css`
|
|
7
|
-
${a};
|
|
8
|
-
${c.map(u=>E[u]?E[u].out:"")}
|
|
9
|
-
transition: ${i} ${s.duration}ms ${s.easing};
|
|
10
|
-
`:a}},composeViewTransition:(e,t,r)=>{if(t==="slide")return A.compose(e,{enter:{transitionKeys:r==="forth"?"slide-right":"slide-left",duration:500},exit:{transitionKeys:r==="forth"?"slide-left":"slide-right",duration:500}});if(t==="fade")return A.compose(e,{enter:{transitionKeys:"fade",duration:500},exit:{transitionKeys:"fade",duration:500}})},get:e=>E[e]},q=(e={})=>(Object.keys(e).forEach(t=>{(e[t]===null||typeof e[t]>"u")&&delete e[t]}),e);function B(e){if(e===void 0)throw new ReferenceError("this hasn't been initialised - super() hasn't been called");return e}function F(e,t){var r=function(i){return t&&l.isValidElement(i)?t(i):i},s=Object.create(null);return e&&l.Children.map(e,function(n){return n}).forEach(function(n){s[n.key]=r(n)}),s}function U(e,t){e=e||{},t=t||{};function r(m){return m in t?t[m]:e[m]}var s=Object.create(null),n=[];for(var i in e)i in t?n.length&&(s[i]=n,n=[]):n.push(i);var a,c={};for(var u in t){if(s[u])for(a=0;a<s[u].length;a++){var d=s[u][a];c[s[u][a]]=r(d)}c[u]=r(u)}for(a=0;a<n.length;a++)c[n[a]]=r(n[a]);return c}function S(e,t,r){return r[t]!=null?r[t]:e.props[t]}function H(e,t){return F(e.children,function(r){return l.cloneElement(r,{onExited:t.bind(null,r),in:!0,appear:S(r,"appear",e),enter:S(r,"enter",e),exit:S(r,"exit",e)})})}function J(e,t,r){var s=F(e.children),n=U(t,s);return Object.keys(n).forEach(function(i){var a=n[i];if(l.isValidElement(a)){var c=i in t,u=i in s,d=t[i],m=l.isValidElement(d)&&!d.props.in;u&&(!c||m)?n[i]=l.cloneElement(a,{onExited:r.bind(null,a),in:!0,exit:S(a,"exit",e),enter:S(a,"enter",e)}):!u&&c&&!m?n[i]=l.cloneElement(a,{in:!1}):u&&c&&l.isValidElement(d)&&(n[i]=l.cloneElement(a,{onExited:r.bind(null,a),in:d.props.in,exit:S(a,"exit",e),enter:S(a,"enter",e)}))}}),n}var Q=Object.values||function(e){return Object.keys(e).map(function(t){return e[t]})},Z={component:"div",childFactory:function(t){return t}},I=function(e){o._inheritsLoose(t,e);function t(s,n){var i;i=e.call(this,s,n)||this;var a=i.handleExited.bind(B(i));return i.state={contextValue:{isMounting:!0},handleExited:a,firstRender:!0},i}var r=t.prototype;return r.componentDidMount=function(){this.mounted=!0,this.setState({contextValue:{isMounting:!1}})},r.componentWillUnmount=function(){this.mounted=!1},t.getDerivedStateFromProps=function(n,i){var a=i.children,c=i.handleExited,u=i.firstRender;return{children:u?H(n,c):J(n,a,c),firstRender:!1}},r.handleExited=function(n,i){var a=F(this.props.children);n.key in a||(n.props.onExited&&n.props.onExited(i),this.mounted&&this.setState(function(c){var u=o._extends({},c.children);return delete u[n.key],{children:u}}))},r.render=function(){var n=this.props,i=n.component,a=n.childFactory,c=o._objectWithoutPropertiesLoose(n,["component","childFactory"]),u=this.state.contextValue,d=Q(this.state.children).map(a);return delete c.appear,delete c.enter,delete c.exit,i===null?l.createElement(o.TransitionGroupContext.Provider,{value:u},d):l.createElement(o.TransitionGroupContext.Provider,{value:u},l.createElement(i,c,d))},t}(l.Component);I.propTypes=process.env.NODE_ENV!=="production"?{component:o.PropTypes.any,children:o.PropTypes.node,appear:o.PropTypes.bool,enter:o.PropTypes.bool,exit:o.PropTypes.bool,childFactory:o.PropTypes.func}:{};I.defaultProps=Z;const k=I,L=()=>l.useContext(o.ComponentNodeContext),_=(e,t)=>({id:e.id,type:e.type,name:e.name,branch:t||"default"}),ee=()=>{const e=o.useComponentNode(),t=o.useComponentPlatform(),[r,s]=l.useState([]),n=o.useIsMounted(),i=l.useCallback(a=>{if(t&&n.current&&a){const c=t.getBranch(a),u=a.getChildren(c).map(d=>_(d));s(u)}},[n,t,s,e]);return l.useEffect(()=>{e&&i(e)},[e,t]),l.useEffect(()=>{if(t){const[a,c]=o.createEventSubscriber(t.events);return a("components:set-layout",(u,d)=>{(e===d.node.parent||d.node.parent===t.nodes.root)&&i(d.node.parent)}),a("components:node-appended",(u,d)=>{(e===d.node.parent||d.node.parent===t.nodes.root)&&i(d.node.parent)}),a("components:node-removed",(u,{parentNode:d})=>{(d===e||d===t.nodes.root)&&i(d)}),()=>{c()}}},[e,t,i]),r},te=()=>l.useContext(o.ColumnContext),ne=(e,t)=>{const r=L(),s=o.useContainer(),[n,i]=l.useState(void 0),a=o.useIsMounted(),c=e||r.type||"";return l.useEffect(()=>{if(c){let u;return(t||s).getAsync("componentResolver").then(d=>{if(a.current){const m=d.getComponent(c);i(m)}u=d.registerResolver(c,m=>{a.current&&i(m)})}),()=>{u&&u()}}},[a,c,t,s]),n},re=e=>{const t=o.useComponentNode(e),r=o.useComponentPlatform(),[s,n]=l.useState({}),i=o.useIsMounted();return l.useEffect(()=>{t&&i.current&&n(t.attributes.layout)},[t,i]),l.useEffect(()=>{if(r){const a=r.events.subscribe("components:layout-changed",(c,u)=>{t===u.node&&i.current&&n(u.node.attributes.layout)});return()=>{a()}}},[r,i,t]),s},z=()=>l.useContext(o.ComponentPropertyContext),oe=e=>{const t=o.useContainer(),r=o.useRouter(),[s,n]=l.useState({name:"",params:{}}),i=o.useIsMounted();return l.useEffect(()=>{const a=(e||t).get("$widget");if(!a)return;const{events:c}=a;return c.subscribe("router:change",(d,{next:{routeData:m}})=>{if(i.current){const{name:f,params:y}=m;q(y),n({name:f,params:y})}})},[i,e,t]),l.useEffect(()=>{if(r&&r.history&&i.current){const a=r.getRouteData(),{name:c,params:u}=a;q(u),n({name:c,params:u})}},[r,i]),s};var G=(e=>(e.back="back",e.forth="forth",e))(G||{});const se=(e,t,r)=>typeof r[e]=="number"&&typeof r[t]=="number"&&r[e]>r[t]?"back":"forth",W=({views:e,location:t,render:r})=>p.jsx(o.Switch,{location:t&&{...t,pathname:t.pathname.split("?")[0]},children:[...Object.keys(e).filter(s=>!!e[s].path),...Object.keys(e).filter(s=>!e[s].path)].map(s=>{const{path:n}=e[s];return n?Array.isArray(n)?n.map(i=>p.jsx(o.Route,{exact:!0,path:i,render:()=>r(s)},s)):p.jsx(o.Route,{exact:!0,path:n,render:()=>r(s)},s):p.jsx(o.Route,{render:()=>r(s)},s)})}),ie=o.newStyled.div`
|
|
11
|
-
position: relative;
|
|
12
|
-
width: 100%;
|
|
13
|
-
flex: 1;
|
|
14
|
-
`,ae=o.newStyled(o.Grid)`
|
|
15
|
-
position: absolute;
|
|
16
|
-
left: 0;
|
|
17
|
-
right: 0;
|
|
18
|
-
${e=>!!e.animationCss&&e.animationCss}
|
|
19
|
-
${e=>!!e.scrollableCss&&e.scrollableCss}
|
|
20
|
-
`,ce={index:1,search:2,browse:3,guide:4,contact:5,"contact-method":6,conversation:7},ue=({className:e="",...t})=>{const[r,s]=l.useState("index"),[n,i]=l.useState(G.forth),a=oe(),c=o.useRouter(),u=z(),d=o.useContext(),m=o.useContainer(),f=o.useComponentNode(),{gap:y="0"}=d,{columns:w=1,animation:v="none",scrollable:g=!1,...P}=u,[R,N]=o.useScroll(g);if(!f||!c)return null;const{location:D}=c;a.name!==r&&a.name!==""&&v&&(i(se(r,a.name,ce)),s(a.name));const{views:b}=m.get("$settings");if(!Object.keys(b).length)return null;const C=(h,$,j)=>{const x=O($,j),M=f.getChildren(h)[0];return p.jsx(ae,{...t,...P,scrollableCss:R,ref:N,columns:w,gap:y,...x,className:o.appendClassNames(e,"humany-view"),children:p.jsx(V,{id:M.id,branch:"default"})})},O=(h,$)=>{if(v==="slide"||v==="fade")return{animationCss:A.composeViewTransition(h,v,$),"data-state":h}};return p.jsx(ie,{className:"humany-animated-view",children:p.jsx(k,{component:null,childFactory:h=>l.cloneElement(h,{direction:n}),children:p.jsx(o.Transition,{timeout:{enter:500,exit:500},onEnter:h=>h==null?void 0:h.clientHeight,unmountOnExit:!0,direction:G.forth,children:(h,{direction:$})=>p.jsx(W,{views:b,location:D,render:j=>C(j,h,$)})},r)})})},le=o.newStyled(o.Grid)`
|
|
21
|
-
${e=>!!e.scrollableCss&&e.scrollableCss}
|
|
22
|
-
`,de=({className:e="",...t})=>{const r=z(),s=o.useContext(),n=o.useContainer(),i=o.useComponentNode(),{views:a}=n.get("$settings"),{gap:c="0"}=s,{columns:u=1,animation:d="none",scrollable:m=!1,...f}=r,[y,w]=o.useScroll(m);return i?p.jsx(le,{...t,...f,scrollableCss:y,ref:w,columns:u,gap:c,className:o.appendClassNames(e,"humany-view"),children:p.jsx(W,{views:a,render:v=>{const g=i.getChildren(v)[0];return p.jsx(V,{id:g.id,node:g,branch:"default"})}})}):null},T=e=>{var t,r;return o.css`
|
|
23
|
-
outline: none;
|
|
24
|
-
box-sizing: border-box;
|
|
25
|
-
* {
|
|
26
|
-
box-sizing: border-box;
|
|
27
|
-
outline: none;
|
|
28
|
-
}
|
|
29
|
-
|
|
30
|
-
grid-column: ${e["data-indent"]?`${e["data-indent"]+1} / ${e["data-indent"]+(e["data-width"]||0)+1}`:`span ${e["data-width"]}`};
|
|
31
|
-
|
|
32
|
-
${((t=e.theme.fonts)==null?void 0:t.type)&&`
|
|
33
|
-
font-family: ${e.theme.fonts.type};
|
|
34
|
-
|
|
35
|
-
input, textarea {
|
|
36
|
-
font-family: ${e.theme.fonts.type};
|
|
37
|
-
}
|
|
38
|
-
`}
|
|
39
|
-
|
|
40
|
-
${((r=e.theme.fonts)==null?void 0:r.base)&&`
|
|
41
|
-
font-size: ${e.theme.fonts.base};
|
|
42
|
-
`}
|
|
43
|
-
|
|
44
|
-
&:focus-visible {
|
|
45
|
-
${o.paddedBorderTabStyle(e)};
|
|
46
|
-
}
|
|
47
|
-
`},pe=o.newStyled(de)`
|
|
48
|
-
${e=>T(e)}
|
|
49
|
-
`,me=o.newStyled(ue)`
|
|
50
|
-
${e=>T(e)}
|
|
51
|
-
`,fe=o.newStyled.div`
|
|
52
|
-
text-align: center;
|
|
53
|
-
${e=>{var t,r,s;return typeof((t=e.theme.colors)==null?void 0:t.warning)<"u"&&o.css`
|
|
54
|
-
color: ${(r=e.theme.colors)==null?void 0:r.warning};
|
|
55
|
-
border: 2px dashed ${(s=e.theme.colors)==null?void 0:s.warning};
|
|
56
|
-
`}}
|
|
57
|
-
${e=>typeof e.theme.borderRadius<"u"&&`border-radius: ${e.theme.borderRadius};`}
|
|
58
|
-
${e=>T(e)}
|
|
59
|
-
`,he=l.forwardRef(({className:e="",children:t,...r},s)=>{const n=ne(),{name:i,type:a,id:c}=L(),u=l.useMemo(()=>n?o.newStyled(n)`
|
|
60
|
-
${T}
|
|
61
|
-
${o.filterCssPropsStyle}
|
|
62
|
-
`:null,[n]);return typeof n>"u"?null:n===null||u===null?process.env.NODE_ENV!=="production"?p.jsx(fe,{...r,title:`type: ${a}, definition-id: ${i}, instance-id: ${c}`,className:o.appendClassNames(e,"humany-non-resolved-component"),children:p.jsx(o.Typography,{variant:"h5",children:"Non Resolved Component Type"})}):null:p.jsx(l.Suspense,{fallback:null,children:p.jsx(u,{ref:s,...r,className:o.appendClassNames(e,"humany-component",`humany-component-${i}`),children:t})})}),ge=e=>{const t=o.useComponentNode(e),r=o.useComponentPlatform(),[s,n]=l.useState({}),i=o.useIsMounted();return l.useEffect(()=>{t&&i.current&&n(t.attributes.properties)},[t,e,i]),l.useEffect(()=>{if(r){const a=r.events.subscribe("components:properties-changed",(c,u)=>{t===u.node&&i.current&&n(u.node.attributes.properties)});return()=>{a()}}},[r,i,e,t]),s},xe=(e,t)=>t?!0:typeof e=="string"?e==="full":e>0,V=l.forwardRef(({className:e="",id:t,branch:r,node:s,ariaLabel:n,tabIndex:i,context:a,...c},u)=>{const d=o.useComponentPlatform(),m=o.useContainer(),[f,y]=l.useState(),w=te(),v=o.useContext(t),g=ge(t),{size:P="none",indent:R=0}=re(t),N=xe(P,s);if(l.useEffect(()=>{if(d){if(t&&!s){const x=d.nodes.get(t);if(x&&(y(_(x,r)),N)){const M=x.mount(m);return()=>{M()}}}else if(s){y(_(s,r));const x=s.mount(m);return()=>{x()}}}},[d,t,s,N]),!f||!N)return null;const D={...v,...a||{}},{cardinal:b,fonts:C={},accessibility:O={},...h}=D,$={type:C.type,base:C.base||"16px",small:C.small||"0.8em",normal:C.normal||"1em",medium:C.medium||"1.2em",large:C.large||"1.6em",huge:C.huge||"2.5em"},j={...h,fonts:$,accessibility:{...O}};return typeof b=="number"&&(j.sizes={cardinal:b,small:`${b}px`,normal:`${b*3}px`,medium:`${b*5}px`,large:`${b*8}px`}),p.jsx(o.ThemeProvider,{theme:j,children:p.jsx(o.ComponentNodeContext.Provider,{value:f,children:p.jsx(o.ComponentPropertyContext.Provider,{value:g,children:(()=>{const x={"data-width":P==="full"?w:Math.min(P,w),"data-indent":R,"data-name":f.name,"data-node-id":f.id,"data-component-type":f.type,"aria-label":n,tabIndex:i,id:f.id,role:g&&g.role,...c};switch(f.type){case"view":return typeof g.animation=="string"&&g.animation!=="none"?p.jsx(me,{...x,className:e}):p.jsx(pe,{...x,className:e});default:{const M=o.filterCssProps(g);return p.jsx(he,{ref:u,...x,...M,className:e})}}})()})})})});l.lazy(()=>Promise.resolve().then(()=>require("./detached-component-bbc4cabe.js")));const ye=e=>{const t=e.map(n=>"min-content").join(" "),r=e[0].split(" ").map(n=>"1fr").join(" "),s=e.map(n=>`'${n}'`).join(" ");return o.css`
|
|
63
|
-
grid-template-columns: ${r};
|
|
64
|
-
grid-template-rows: ${t};
|
|
65
|
-
grid-template-areas: ${s};
|
|
66
|
-
`},be=e=>{const t=ee(),r=l.useMemo(()=>Object.entries(e.areas).map(([s,n])=>{const i=t.find(a=>a.name===s);return o.isNestedGrid(n)?{name:s,componentDef:i,context:n.context,areaSettings:n.areaSettings,template:n.template,areas:n.areas,gap:n.gap}:{name:s,componentDef:i,areaSettings:n.areaSettings,child:n.child,context:n.context}}),[e,t]);return p.jsx(Ce,{"data-grid-area":e.gridArea,gridArea:e.gridArea,gap:e.gap,template:e.template,className:o.appendClassNames(e.className,"humany-grid"),children:r.map(s=>s.componentDef?p.jsx(V,{id:s.componentDef.id,branch:"default",context:{}},s.componentDef.id):null)})},Ce=o.newStyled.div`
|
|
67
|
-
display: grid;
|
|
68
|
-
${e=>e.gridArea&&o.css`
|
|
69
|
-
grid-area: ${e.gridArea};
|
|
70
|
-
`}
|
|
71
|
-
${e=>ye(e.template)}
|
|
72
|
-
${e=>e.gap&&o.css`
|
|
73
|
-
grid-gap: ${e.gap}rem;
|
|
74
|
-
`}
|
|
75
|
-
`,ve=({className:e})=>{const t=z();return p.jsx(be,{template:t.template,areas:t.areas,gap:t.gap,areaSettings:t.areaSettings,context:t.context})},$e=Object.freeze(Object.defineProperty({__proto__:null,default:ve},Symbol.toStringTag,{value:"Module"}));exports.Component=V;exports.grid=$e;
|