@telia-ace/widget-components-grid 1.0.19 → 1.0.20

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.
@@ -3,7 +3,7 @@ import i, { useMemo as p } from "react";
3
3
  import { Component as l } from "@telia-ace/widget-types-grid";
4
4
  import { appendClassNames as g } from "@telia-ace/widget-utilities";
5
5
  import u, { css as s } from "styled-components";
6
- import { i as f } from "./index.cfc936fb.js";
6
+ import { i as f } from "./index.bce2e13c.js";
7
7
  import "@telia-ace/widget-core";
8
8
  const $ = (e) => {
9
9
  const r = e.map((t) => "min-content").join(" "), n = e[0].split(" ").map((t) => "1fr").join(" "), a = e.map((t) => `'${t}'`).join(" ");
@@ -65,4 +65,4 @@ const $ = (e) => {
65
65
  export {
66
66
  E as default
67
67
  };
68
- //# sourceMappingURL=grid.c9cced26.js.map
68
+ //# sourceMappingURL=grid.e80d9035.js.map
@@ -1 +1 @@
1
- {"version":3,"file":"grid.c9cced26.js","sources":["../src/utils.ts","../src/nested-grid-area.tsx","../src/grid.tsx"],"sourcesContent":["import { css } from 'styled-components';\r\n\r\nexport const generateGridTemplateAreasValue = (template: string[]) => {\r\n const rows = template.map((_) => 'min-content').join(' ');\r\n const columns = template[0]\r\n .split(' ')\r\n .map((_) => '1fr')\r\n .join(' ');\r\n const areas = template.map((value) => `'${value}'`).join(' ');\r\n\r\n return css`\r\n grid-template-columns: ${columns};\r\n grid-template-rows: ${rows};\r\n grid-template-areas: ${areas};\r\n `;\r\n};\r\n","import { Component } from '@telia-ace/widget-types-grid';\r\nimport { useChildren } from '@telia-ace/widget-ui';\r\nimport { appendClassNames } from '@telia-ace/widget-utilities';\r\nimport React, { useMemo } from 'react';\r\nimport styled, { css } from 'styled-components';\r\nimport { GridAreaProps, isNestedGrid, NestedArea } from './grid-component';\r\nimport { generateGridTemplateAreasValue } from './utils';\r\n\r\ntype Props = {\r\n className?: string;\r\n gridArea?: string;\r\n} & NestedArea;\r\nconst NestedGridArea: React.FC<Props> = (props) => {\r\n const children = useChildren();\r\n\r\n const areas = useMemo<(GridAreaProps & { name: string })[]>(() => {\r\n return Object.entries(props.areas).map(([key, area]) => {\r\n const componentDef = children.find((child) => child.name === key);\r\n\r\n if (!isNestedGrid(area)) {\r\n return {\r\n name: key,\r\n componentDef,\r\n areaSettings: area.areaSettings,\r\n child: area.child,\r\n context: area.context,\r\n };\r\n }\r\n return {\r\n name: key,\r\n componentDef,\r\n context: area.context,\r\n areaSettings: area.areaSettings,\r\n template: area.template,\r\n areas: area.areas,\r\n gap: area.gap,\r\n };\r\n });\r\n }, [props, children]);\r\n\r\n return (\r\n <Wrapper\r\n data-grid-area={props.gridArea}\r\n gridArea={props.gridArea}\r\n gap={props.gap}\r\n template={props.template}\r\n className={appendClassNames(props.className, 'humany-grid')}\r\n >\r\n {areas.map((area) => {\r\n if (!(area as any).componentDef) {\r\n return null;\r\n }\r\n return (\r\n <Component\r\n key={(area as any).componentDef.id}\r\n id={(area as any).componentDef.id}\r\n branch=\"default\"\r\n context={{}}\r\n />\r\n );\r\n })}\r\n </Wrapper>\r\n );\r\n};\r\n\r\nexport default NestedGridArea;\r\n\r\nconst Wrapper = styled.div<{\r\n template: string[];\r\n gridArea?: string;\r\n gap?: number;\r\n}>`\r\n display: grid;\r\n ${(p) =>\r\n p.gridArea &&\r\n css`\r\n grid-area: ${p.gridArea};\r\n `}\r\n ${(p) => generateGridTemplateAreasValue(p.template)}\r\n ${(p) =>\r\n p.gap &&\r\n css`\r\n grid-gap: ${p.gap}rem;\r\n `}\r\n`;\r\n","import { useProperties } from '@telia-ace/widget-ui';\r\nimport React from 'react';\r\nimport { GridComponentProps } from './grid-component';\r\nimport NestedGridArea from './nested-grid-area';\r\n\r\ntype Props = { className?: string };\r\nconst Grid: React.FC<Props> = ({ className }) => {\r\n const properties = useProperties<GridComponentProps>();\r\n return (\r\n <NestedGridArea\r\n template={properties.template}\r\n areas={properties.areas}\r\n gap={properties.gap}\r\n areaSettings={properties.areaSettings}\r\n context={properties.context}\r\n />\r\n );\r\n};\r\n\r\nexport default Grid;\r\n"],"names":[],"mappings":";;;;;;;AAEa,MAAA,IAAiC,CAAC,MAAuB;AAC5D,QAAA,IAAO,EAAS,IAAI,CAAC,MAAM,aAAa,EAAE,KAAK,GAAG,GAClD,IAAU,EAAS,GACpB,MAAM,GAAG,EACT,IAAI,CAAC,MAAM,KAAK,EAChB,KAAK,GAAG,GACP,IAAQ,EAAS,IAAI,CAAC,MAAU,IAAI,IAAQ,EAAE,KAAK,GAAG;AAErD,SAAA;AAAA,iCACsB;AAAA,8BACH;AAAA,+BACC;AAAA;AAE/B,GCHM,IAAkC,CAAC,MAAU;AAC/C,QAAM,IAAW,KAEX,IAAQ,EAA8C,MACjD,OAAO,QAAQ,EAAM,KAAK,EAAE,IAAI,CAAC,CAAC,GAAK,OAAU;AACpD,UAAM,IAAe,EAAS,KAAK,CAAC,MAAU,EAAM,SAAS,CAAG;AAE5D,WAAC,EAAa,CAAI,IASf;AAAA,MACH,MAAM;AAAA,MACN;AAAA,MACA,SAAS,EAAK;AAAA,MACd,cAAc,EAAK;AAAA,MACnB,UAAU,EAAK;AAAA,MACf,OAAO,EAAK;AAAA,MACZ,KAAK,EAAK;AAAA,IAAA,IAfH;AAAA,MACH,MAAM;AAAA,MACN;AAAA,MACA,cAAc,EAAK;AAAA,MACnB,OAAO,EAAK;AAAA,MACZ,SAAS,EAAK;AAAA,IAAA;AAAA,EAWtB,CACH,GACF,CAAC,GAAO,CAAQ,CAAC;AAEpB,SACK,kBAAA,cAAA,GAAA;AAAA,IACG,kBAAgB,EAAM;AAAA,IACtB,UAAU,EAAM;AAAA,IAChB,KAAK,EAAM;AAAA,IACX,UAAU,EAAM;AAAA,IAChB,WAAW,EAAiB,EAAM,WAAW,aAAa;AAAA,EAAA,GAEzD,EAAM,IAAI,CAAC,MACF,EAAa,eAId,kBAAA,cAAA,GAAA;AAAA,IACG,KAAM,EAAa,aAAa;AAAA,IAChC,IAAK,EAAa,aAAa;AAAA,IAC/B,QAAO;AAAA,IACP,SAAS,CAAC;AAAA,EAAA,CACd,IARO,IAUd,CACL;AAER,GAIM,IAAU,EAAO;AAAA;AAAA,MAMjB,CAAC,MACC,EAAE,YACF;AAAA,yBACiB,EAAE;AAAA;AAAA,MAErB,CAAC,MAAM,EAA+B,EAAE,QAAQ;AAAA,IAClD,CAAC,MACG,EAAE,OACF;AAAA,wBACgB,EAAE;AAAA;AAAA,GC5EpB,IAAwB,CAAC,EAAE,mBAAgB;AAC7C,QAAM,IAAa;AACnB,SACK,kBAAA,cAAA,GAAA;AAAA,IACG,UAAU,EAAW;AAAA,IACrB,OAAO,EAAW;AAAA,IAClB,KAAK,EAAW;AAAA,IAChB,cAAc,EAAW;AAAA,IACzB,SAAS,EAAW;AAAA,EAAA,CACxB;AAER;"}
1
+ {"version":3,"file":"grid.e80d9035.js","sources":["../src/utils.ts","../src/nested-grid-area.tsx","../src/grid.tsx"],"sourcesContent":["import { css } from 'styled-components';\r\n\r\nexport const generateGridTemplateAreasValue = (template: string[]) => {\r\n const rows = template.map((_) => 'min-content').join(' ');\r\n const columns = template[0]\r\n .split(' ')\r\n .map((_) => '1fr')\r\n .join(' ');\r\n const areas = template.map((value) => `'${value}'`).join(' ');\r\n\r\n return css`\r\n grid-template-columns: ${columns};\r\n grid-template-rows: ${rows};\r\n grid-template-areas: ${areas};\r\n `;\r\n};\r\n","import { Component } from '@telia-ace/widget-types-grid';\r\nimport { useChildren } from '@telia-ace/widget-ui';\r\nimport { appendClassNames } from '@telia-ace/widget-utilities';\r\nimport React, { useMemo } from 'react';\r\nimport styled, { css } from 'styled-components';\r\nimport { GridAreaProps, isNestedGrid, NestedArea } from './grid-component';\r\nimport { generateGridTemplateAreasValue } from './utils';\r\n\r\ntype Props = {\r\n className?: string;\r\n gridArea?: string;\r\n} & NestedArea;\r\nconst NestedGridArea: React.FC<Props> = (props) => {\r\n const children = useChildren();\r\n\r\n const areas = useMemo<(GridAreaProps & { name: string })[]>(() => {\r\n return Object.entries(props.areas).map(([key, area]) => {\r\n const componentDef = children.find((child) => child.name === key);\r\n\r\n if (!isNestedGrid(area)) {\r\n return {\r\n name: key,\r\n componentDef,\r\n areaSettings: area.areaSettings,\r\n child: area.child,\r\n context: area.context,\r\n };\r\n }\r\n return {\r\n name: key,\r\n componentDef,\r\n context: area.context,\r\n areaSettings: area.areaSettings,\r\n template: area.template,\r\n areas: area.areas,\r\n gap: area.gap,\r\n };\r\n });\r\n }, [props, children]);\r\n\r\n return (\r\n <Wrapper\r\n data-grid-area={props.gridArea}\r\n gridArea={props.gridArea}\r\n gap={props.gap}\r\n template={props.template}\r\n className={appendClassNames(props.className, 'humany-grid')}\r\n >\r\n {areas.map((area) => {\r\n if (!(area as any).componentDef) {\r\n return null;\r\n }\r\n return (\r\n <Component\r\n key={(area as any).componentDef.id}\r\n id={(area as any).componentDef.id}\r\n branch=\"default\"\r\n context={{}}\r\n />\r\n );\r\n })}\r\n </Wrapper>\r\n );\r\n};\r\n\r\nexport default NestedGridArea;\r\n\r\nconst Wrapper = styled.div<{\r\n template: string[];\r\n gridArea?: string;\r\n gap?: number;\r\n}>`\r\n display: grid;\r\n ${(p) =>\r\n p.gridArea &&\r\n css`\r\n grid-area: ${p.gridArea};\r\n `}\r\n ${(p) => generateGridTemplateAreasValue(p.template)}\r\n ${(p) =>\r\n p.gap &&\r\n css`\r\n grid-gap: ${p.gap}rem;\r\n `}\r\n`;\r\n","import { useProperties } from '@telia-ace/widget-ui';\r\nimport React from 'react';\r\nimport { GridComponentProps } from './grid-component';\r\nimport NestedGridArea from './nested-grid-area';\r\n\r\ntype Props = { className?: string };\r\nconst Grid: React.FC<Props> = ({ className }) => {\r\n const properties = useProperties<GridComponentProps>();\r\n return (\r\n <NestedGridArea\r\n template={properties.template}\r\n areas={properties.areas}\r\n gap={properties.gap}\r\n areaSettings={properties.areaSettings}\r\n context={properties.context}\r\n />\r\n );\r\n};\r\n\r\nexport default Grid;\r\n"],"names":["generateGridTemplateAreasValue","template","rows","_","columns","areas","value","css","NestedGridArea","props","children","useChildren","useMemo","key","area","componentDef","child","isNestedGrid","React","Wrapper","appendClassNames","Component","styled","p","Grid","className","properties","useProperties"],"mappings":";;;;;;;AAEa,MAAAA,IAAiC,CAACC,MAAuB;AAC5D,QAAAC,IAAOD,EAAS,IAAI,CAACE,MAAM,aAAa,EAAE,KAAK,GAAG,GAClDC,IAAUH,EAAS,GACpB,MAAM,GAAG,EACT,IAAI,CAACE,MAAM,KAAK,EAChB,KAAK,GAAG,GACPE,IAAQJ,EAAS,IAAI,CAACK,MAAU,IAAIA,IAAQ,EAAE,KAAK,GAAG;AAErD,SAAAC;AAAA,iCACsBH;AAAA,8BACHF;AAAA,+BACCG;AAAA;AAE/B,GCHMG,IAAkC,CAACC,MAAU;AAC/C,QAAMC,IAAWC,KAEXN,IAAQO,EAA8C,MACjD,OAAO,QAAQH,EAAM,KAAK,EAAE,IAAI,CAAC,CAACI,GAAKC,CAAI,MAAM;AACpD,UAAMC,IAAeL,EAAS,KAAK,CAACM,MAAUA,EAAM,SAASH,CAAG;AAE5D,WAACI,EAAaH,CAAI,IASf;AAAA,MACH,MAAMD;AAAA,MACN,cAAAE;AAAA,MACA,SAASD,EAAK;AAAA,MACd,cAAcA,EAAK;AAAA,MACnB,UAAUA,EAAK;AAAA,MACf,OAAOA,EAAK;AAAA,MACZ,KAAKA,EAAK;AAAA,IAAA,IAfH;AAAA,MACH,MAAMD;AAAA,MACN,cAAAE;AAAA,MACA,cAAcD,EAAK;AAAA,MACnB,OAAOA,EAAK;AAAA,MACZ,SAASA,EAAK;AAAA,IAAA;AAAA,EAWtB,CACH,GACF,CAACL,GAAOC,CAAQ,CAAC;AAEpB,SACK,gBAAAQ,EAAA,cAAAC,GAAA;AAAA,IACG,kBAAgBV,EAAM;AAAA,IACtB,UAAUA,EAAM;AAAA,IAChB,KAAKA,EAAM;AAAA,IACX,UAAUA,EAAM;AAAA,IAChB,WAAWW,EAAiBX,EAAM,WAAW,aAAa;AAAA,EAAA,GAEzDJ,EAAM,IAAI,CAACS,MACFA,EAAa,eAId,gBAAAI,EAAA,cAAAG,GAAA;AAAA,IACG,KAAMP,EAAa,aAAa;AAAA,IAChC,IAAKA,EAAa,aAAa;AAAA,IAC/B,QAAO;AAAA,IACP,SAAS,CAAC;AAAA,EAAA,CACd,IARO,IAUd,CACL;AAER,GAIMK,IAAUG,EAAO;AAAA;AAAA,MAMjB,CAACC,MACCA,EAAE,YACFhB;AAAA,yBACiBgB,EAAE;AAAA;AAAA,MAErB,CAACA,MAAMvB,EAA+BuB,EAAE,QAAQ;AAAA,IAClD,CAACA,MACGA,EAAE,OACFhB;AAAA,wBACgBgB,EAAE;AAAA;AAAA,GC5EpBC,IAAwB,CAAC,EAAE,WAAAC,QAAgB;AAC7C,QAAMC,IAAaC;AACnB,SACK,gBAAAT,EAAA,cAAAV,GAAA;AAAA,IACG,UAAUkB,EAAW;AAAA,IACrB,OAAOA,EAAW;AAAA,IAClB,KAAKA,EAAW;AAAA,IAChB,cAAcA,EAAW;AAAA,IACzB,SAASA,EAAW;AAAA,EAAA,CACxB;AAER;"}
@@ -12,7 +12,7 @@ var u = (e, o, r) => o in e ? D(e, o, { enumerable: !0, configurable: !0, writab
12
12
  import { createReactComponent as I } from "@telia-ace/widget-ui";
13
13
  import { createChildren as w } from "@telia-ace/widget-core";
14
14
  import { Logger as L } from "@telia-ace/widget-utilities";
15
- const H = (e) => !!e.template, V = (e) => I(e, "grid", import("./grid.c9cced26.js"), (o) => {
15
+ const H = (e) => !!e.template, V = (e) => I(e, "grid", import("./grid.e80d9035.js"), (o) => {
16
16
  }), _ = (e, o) => {
17
17
  var m, g, x, l;
18
18
  const { platform: r, node: C, references: P, definitions: a, views: f, branch: N } = o, t = a[e.definitionId];
@@ -25,35 +25,44 @@ const H = (e) => !!e.template, V = (e) => I(e, "grid", import("./grid.c9cced26.j
25
25
  const p = { breakpoints: n.breakpoints };
26
26
  n.properties && i.writeProperties(n.properties, p), n.context && i.writeContext(n.context, p), n.layout && i.writeLayout(n.layout, p);
27
27
  }), ((m = t.properties) == null ? void 0 : m.areas) && !!((g = t.properties) != null && g.areas)) {
28
- const n = Object.entries(t.properties.areas).reduce((p, [c, s]) => {
29
- if (s.child) {
30
- const d = Object.entries(s.areaSettings || {}).reduce((y, [O, j]) => (y[`css-${O}`] = j, y), {});
31
- p[c] = {
32
- type: "area",
33
- context: s.context || {},
34
- children: [s.child],
35
- properties: b({
36
- "css-grid-area": c
37
- }, d)
38
- };
39
- } else {
40
- const d = {
41
- type: "grid",
42
- context: {},
43
- properties: {
44
- areaSettings: {},
45
- areas: s.areas,
46
- context: s.context,
47
- gap: s.gap,
48
- gridArea: s.gridArea,
49
- template: s.template
50
- }
51
- };
52
- p[c] = d;
53
- }
54
- return p;
55
- }, a);
56
- w(r, i, Object.keys(t.properties.areas), n, f);
28
+ const n = Object.entries(t.properties.areas).reduce(
29
+ (p, [c, s]) => {
30
+ if (s.child) {
31
+ const d = Object.entries(s.areaSettings || {}).reduce((y, [O, j]) => (y[`css-${O}`] = j, y), {});
32
+ p[c] = {
33
+ type: "area",
34
+ context: s.context || {},
35
+ children: [s.child],
36
+ properties: b({
37
+ "css-grid-area": c
38
+ }, d)
39
+ };
40
+ } else {
41
+ const d = {
42
+ type: "grid",
43
+ context: {},
44
+ properties: {
45
+ areaSettings: {},
46
+ areas: s.areas,
47
+ context: s.context,
48
+ gap: s.gap,
49
+ gridArea: s.gridArea,
50
+ template: s.template
51
+ }
52
+ };
53
+ p[c] = d;
54
+ }
55
+ return p;
56
+ },
57
+ a
58
+ );
59
+ w(
60
+ r,
61
+ i,
62
+ Object.keys(t.properties.areas),
63
+ n,
64
+ f
65
+ );
57
66
  } else
58
67
  (x = t.properties) != null && x.child && w(r, i, [(l = t.properties) == null ? void 0 : l.child], a, f);
59
68
  };
@@ -62,4 +71,4 @@ export {
62
71
  _ as g,
63
72
  H as i
64
73
  };
65
- //# sourceMappingURL=index.cfc936fb.js.map
74
+ //# sourceMappingURL=index.bce2e13c.js.map
@@ -1 +1 @@
1
- {"version":3,"file":"index.cfc936fb.js","sources":["../src/grid-component.ts","../src/handler.ts"],"sourcesContent":["import { createReactComponent } from '@telia-ace/widget-ui';\r\nimport { Container } from '@webprovisions/platform';\r\n\r\ntype AreaWithChild = {\r\n child: string;\r\n areaSettings: { [key: string]: string };\r\n context: { [key: string]: any };\r\n};\r\n\r\nexport type NestedArea = {\r\n context: { [key: string]: any };\r\n template: string[];\r\n areaSettings: { [key: string]: string };\r\n gap: number;\r\n areas: {\r\n [key: string]: GridAreaProps;\r\n };\r\n};\r\n\r\nexport type GridAreaProps = NestedArea | AreaWithChild;\r\n\r\nexport const isNestedGrid = (area: GridAreaProps): area is NestedArea => {\r\n return !!(area as NestedArea).template;\r\n};\r\n\r\nexport type GridComponentProps = {\r\n gap: number;\r\n template: string[];\r\n areaSettings: { [key: string]: string };\r\n areas: {\r\n [key: string]: GridAreaProps;\r\n };\r\n child: string;\r\n context: { [key: string]: any };\r\n};\r\n\r\nexport const GridComponent = (container: Container) => {\r\n return createReactComponent(container, 'grid', import('./grid'), (component) => {});\r\n};\r\n\r\nexport default GridComponent;\r\n","import {\r\n ComponentHandlerOptions,\r\n createChildren,\r\n NormalizedComponentReference,\r\n} from '@telia-ace/widget-core';\r\nimport { Logger } from '@telia-ace/widget-utilities';\r\n\r\nexport const gridComponentHandler = (\r\n childRef: NormalizedComponentReference,\r\n options: ComponentHandlerOptions\r\n) => {\r\n const { platform, node, references, definitions, views, branch } = options;\r\n\r\n const childDef = definitions[childRef.definitionId];\r\n if (process.env.NODE_ENV !== 'production') {\r\n if (!childDef) {\r\n Logger.error(`No definition found for component type '${childRef.definitionId}'.`);\r\n return;\r\n }\r\n }\r\n const childNode = platform.createNode(childDef.type);\r\n childNode.name = childRef.definitionId;\r\n childNode.tags = childDef.tags || [];\r\n if (childDef.properties) {\r\n childNode.writeProperties(childDef.properties);\r\n }\r\n if (childDef.context) {\r\n childNode.writeContext(childDef.context);\r\n }\r\n if (childDef.layout) {\r\n childNode.writeLayout(childDef.layout);\r\n }\r\n node.appendChild(childNode, branch);\r\n\r\n childRef.overrides.forEach((override) => {\r\n const options = { breakpoints: override.breakpoints };\r\n if (override.properties) {\r\n childNode.writeProperties(override.properties, options);\r\n }\r\n if (override.context) {\r\n childNode.writeContext(override.context, options);\r\n }\r\n if (override.layout) {\r\n childNode.writeLayout(override.layout, options);\r\n }\r\n });\r\n\r\n if (childDef.properties?.areas && !!childDef.properties?.areas) {\r\n const mergedDefinitons: any = Object.entries(childDef.properties.areas).reduce<any>(\r\n (acc, [key, value]: any) => {\r\n if (value.child) {\r\n const cssProps = Object.entries<string>(value.areaSettings || {}).reduce<{\r\n [key: string]: string;\r\n }>((acc, [key, value]) => {\r\n acc[`css-${key}`] = value;\r\n\r\n return acc;\r\n }, {});\r\n acc[key] = {\r\n type: 'area',\r\n context: value.context || {},\r\n children: [value.child],\r\n properties: {\r\n 'css-grid-area': key,\r\n ...cssProps,\r\n },\r\n };\r\n } else {\r\n const subgrid = {\r\n type: 'grid',\r\n context: {},\r\n properties: {\r\n areaSettings: {},\r\n areas: value.areas,\r\n context: value.context,\r\n gap: value.gap,\r\n gridArea: value.gridArea,\r\n template: value.template,\r\n },\r\n };\r\n acc[key] = subgrid;\r\n }\r\n return acc;\r\n },\r\n definitions\r\n );\r\n createChildren(\r\n platform,\r\n childNode,\r\n Object.keys(childDef.properties.areas),\r\n mergedDefinitons,\r\n views\r\n );\r\n } else if (childDef.properties?.child) {\r\n createChildren(platform, childNode, [childDef.properties?.child], definitions, views);\r\n }\r\n};\r\n"],"names":[],"mappings":";;;;;;;;;;;;;;AAqBa,MAAA,IAAe,CAAC,MAClB,CAAC,CAAE,EAAoB,UAcrB,IAAgB,CAAC,MACnB,EAAqB,GAAW,QAAQ,OAAO,uBAAW,CAAC,MAAc;AAAA,CAAE,GC9BzE,IAAuB,CAChC,GACA,MACC;;AACD,QAAM,EAAE,aAAU,SAAM,eAAY,gBAAa,UAAO,cAAW,GAE7D,IAAW,EAAY,EAAS;AAClC,MAAA,QAAQ,IAAI,aAAa,gBACrB,CAAC,GAAU;AACJ,MAAA,MAAM,2CAA2C,EAAS,gBAAgB;AACjF;AAAA,EACJ;AAEJ,QAAM,IAAY,EAAS,WAAW,EAAS,IAAI;AA2BnD,MA1BA,EAAU,OAAO,EAAS,cAChB,EAAA,OAAO,EAAS,QAAQ,CAAA,GAC9B,EAAS,cACC,EAAA,gBAAgB,EAAS,UAAU,GAE7C,EAAS,WACC,EAAA,aAAa,EAAS,OAAO,GAEvC,EAAS,UACC,EAAA,YAAY,EAAS,MAAM,GAEpC,EAAA,YAAY,GAAW,CAAM,GAEzB,EAAA,UAAU,QAAQ,CAAC,MAAa;AACrC,UAAM,IAAU,EAAE,aAAa,EAAS,YAAY;AACpD,IAAI,EAAS,cACC,EAAA,gBAAgB,EAAS,YAAY,CAAO,GAEtD,EAAS,WACC,EAAA,aAAa,EAAS,SAAS,CAAO,GAEhD,EAAS,UACC,EAAA,YAAY,EAAS,QAAQ,CAAO;AAAA,EAClD,CACH,GAEG,QAAS,eAAT,kBAAqB,UAAS,CAAC,CAAC,QAAS,eAAT,UAAqB,QAAO;AAC5D,UAAM,IAAwB,OAAO,QAAQ,EAAS,WAAW,KAAK,EAAE,OACpE,CAAC,GAAK,CAAC,GAAK,OAAgB;AACxB,UAAI,EAAM,OAAO;AACb,cAAM,IAAW,OAAO,QAAgB,EAAM,gBAAgB,CAAA,CAAE,EAAE,OAE/D,CAAC,GAAK,CAAC,GAAK,OACX,GAAI,OAAO,OAAS,GAEb,IACR,CAAE,CAAA;AACL,UAAI,KAAO;AAAA,UACP,MAAM;AAAA,UACN,SAAS,EAAM,WAAW,CAAC;AAAA,UAC3B,UAAU,CAAC,EAAM,KAAK;AAAA,UACtB,YAAY;AAAA,YACR,iBAAiB;AAAA,aACd;AAAA,QACP;AAAA,MACJ,OACG;AACH,cAAM,IAAU;AAAA,UACZ,MAAM;AAAA,UACN,SAAS,CAAC;AAAA,UACV,YAAY;AAAA,YACR,cAAc,CAAC;AAAA,YACf,OAAO,EAAM;AAAA,YACb,SAAS,EAAM;AAAA,YACf,KAAK,EAAM;AAAA,YACX,UAAU,EAAM;AAAA,YAChB,UAAU,EAAM;AAAA,UACpB;AAAA,QAAA;AAEJ,UAAI,KAAO;AAAA,MACf;AACO,aAAA;AAAA,OAEX,CACJ;AAEI,MAAA,GACA,GACA,OAAO,KAAK,EAAS,WAAW,KAAK,GACrC,GACA,CACJ;AAAA,EAAA;AACJ,IAAW,OAAS,eAAT,UAAqB,SACb,EAAA,GAAU,GAAW,CAAC,OAAS,eAAT,kBAAqB,KAAK,GAAG,GAAa,CAAK;AAE5F;"}
1
+ {"version":3,"file":"index.bce2e13c.js","sources":["../src/grid-component.ts","../src/handler.ts"],"sourcesContent":["import { createReactComponent } from '@telia-ace/widget-ui';\r\nimport { Container } from '@webprovisions/platform';\r\n\r\ntype AreaWithChild = {\r\n child: string;\r\n areaSettings: { [key: string]: string };\r\n context: { [key: string]: any };\r\n};\r\n\r\nexport type NestedArea = {\r\n context: { [key: string]: any };\r\n template: string[];\r\n areaSettings: { [key: string]: string };\r\n gap: number;\r\n areas: {\r\n [key: string]: GridAreaProps;\r\n };\r\n};\r\n\r\nexport type GridAreaProps = NestedArea | AreaWithChild;\r\n\r\nexport const isNestedGrid = (area: GridAreaProps): area is NestedArea => {\r\n return !!(area as NestedArea).template;\r\n};\r\n\r\nexport type GridComponentProps = {\r\n gap: number;\r\n template: string[];\r\n areaSettings: { [key: string]: string };\r\n areas: {\r\n [key: string]: GridAreaProps;\r\n };\r\n child: string;\r\n context: { [key: string]: any };\r\n};\r\n\r\nexport const GridComponent = (container: Container) => {\r\n return createReactComponent(container, 'grid', import('./grid'), (component) => {});\r\n};\r\n\r\nexport default GridComponent;\r\n","import {\r\n ComponentHandlerOptions,\r\n createChildren,\r\n NormalizedComponentReference,\r\n} from '@telia-ace/widget-core';\r\nimport { Logger } from '@telia-ace/widget-utilities';\r\n\r\nexport const gridComponentHandler = (\r\n childRef: NormalizedComponentReference,\r\n options: ComponentHandlerOptions\r\n) => {\r\n const { platform, node, references, definitions, views, branch } = options;\r\n\r\n const childDef = definitions[childRef.definitionId];\r\n if (process.env.NODE_ENV !== 'production') {\r\n if (!childDef) {\r\n Logger.error(`No definition found for component type '${childRef.definitionId}'.`);\r\n return;\r\n }\r\n }\r\n const childNode = platform.createNode(childDef.type);\r\n childNode.name = childRef.definitionId;\r\n childNode.tags = childDef.tags || [];\r\n if (childDef.properties) {\r\n childNode.writeProperties(childDef.properties);\r\n }\r\n if (childDef.context) {\r\n childNode.writeContext(childDef.context);\r\n }\r\n if (childDef.layout) {\r\n childNode.writeLayout(childDef.layout);\r\n }\r\n node.appendChild(childNode, branch);\r\n\r\n childRef.overrides.forEach((override) => {\r\n const options = { breakpoints: override.breakpoints };\r\n if (override.properties) {\r\n childNode.writeProperties(override.properties, options);\r\n }\r\n if (override.context) {\r\n childNode.writeContext(override.context, options);\r\n }\r\n if (override.layout) {\r\n childNode.writeLayout(override.layout, options);\r\n }\r\n });\r\n\r\n if (childDef.properties?.areas && !!childDef.properties?.areas) {\r\n const mergedDefinitons: any = Object.entries(childDef.properties.areas).reduce<any>(\r\n (acc, [key, value]: any) => {\r\n if (value.child) {\r\n const cssProps = Object.entries<string>(value.areaSettings || {}).reduce<{\r\n [key: string]: string;\r\n }>((acc, [key, value]) => {\r\n acc[`css-${key}`] = value;\r\n\r\n return acc;\r\n }, {});\r\n acc[key] = {\r\n type: 'area',\r\n context: value.context || {},\r\n children: [value.child],\r\n properties: {\r\n 'css-grid-area': key,\r\n ...cssProps,\r\n },\r\n };\r\n } else {\r\n const subgrid = {\r\n type: 'grid',\r\n context: {},\r\n properties: {\r\n areaSettings: {},\r\n areas: value.areas,\r\n context: value.context,\r\n gap: value.gap,\r\n gridArea: value.gridArea,\r\n template: value.template,\r\n },\r\n };\r\n acc[key] = subgrid;\r\n }\r\n return acc;\r\n },\r\n definitions\r\n );\r\n createChildren(\r\n platform,\r\n childNode,\r\n Object.keys(childDef.properties.areas),\r\n mergedDefinitons,\r\n views\r\n );\r\n } else if (childDef.properties?.child) {\r\n createChildren(platform, childNode, [childDef.properties?.child], definitions, views);\r\n }\r\n};\r\n"],"names":["isNestedGrid","area","GridComponent","container","createReactComponent","component","gridComponentHandler","childRef","options","platform","node","references","definitions","views","branch","childDef","Logger","childNode","override","_a","_b","mergedDefinitons","acc","key","value","cssProps","__spreadValues","subgrid","createChildren","_c","_d"],"mappings":";;;;;;;;;;;;;;AAqBa,MAAAA,IAAe,CAACC,MAClB,CAAC,CAAEA,EAAoB,UAcrBC,IAAgB,CAACC,MACnBC,EAAqBD,GAAW,QAAQ,OAAO,uBAAW,CAACE,MAAc;AAAA,CAAE,GC9BzEC,IAAuB,CAChCC,GACAC,MACC;;AACD,QAAM,EAAE,UAAAC,GAAU,MAAAC,GAAM,YAAAC,GAAY,aAAAC,GAAa,OAAAC,GAAO,QAAAC,EAAW,IAAAN,GAE7DO,IAAWH,EAAYL,EAAS;AAClC,MAAA,QAAQ,IAAI,aAAa,gBACrB,CAACQ,GAAU;AACJ,IAAAC,EAAA,MAAM,2CAA2CT,EAAS,gBAAgB;AACjF;AAAA,EACJ;AAEJ,QAAMU,IAAYR,EAAS,WAAWM,EAAS,IAAI;AA2BnD,MA1BAE,EAAU,OAAOV,EAAS,cAChBU,EAAA,OAAOF,EAAS,QAAQ,CAAA,GAC9BA,EAAS,cACCE,EAAA,gBAAgBF,EAAS,UAAU,GAE7CA,EAAS,WACCE,EAAA,aAAaF,EAAS,OAAO,GAEvCA,EAAS,UACCE,EAAA,YAAYF,EAAS,MAAM,GAEpCL,EAAA,YAAYO,GAAWH,CAAM,GAEzBP,EAAA,UAAU,QAAQ,CAACW,MAAa;AACrC,UAAMV,IAAU,EAAE,aAAaU,EAAS,YAAY;AACpD,IAAIA,EAAS,cACCD,EAAA,gBAAgBC,EAAS,YAAYV,CAAO,GAEtDU,EAAS,WACCD,EAAA,aAAaC,EAAS,SAASV,CAAO,GAEhDU,EAAS,UACCD,EAAA,YAAYC,EAAS,QAAQV,CAAO;AAAA,EAClD,CACH,KAEGW,IAAAJ,EAAS,eAAT,gBAAAI,EAAqB,UAAS,CAAC,GAACC,IAAAL,EAAS,eAAT,QAAAK,EAAqB,QAAO;AAC5D,UAAMC,IAAwB,OAAO,QAAQN,EAAS,WAAW,KAAK,EAAE;AAAA,MACpE,CAACO,GAAK,CAACC,GAAKC,CAAK,MAAW;AACxB,YAAIA,EAAM,OAAO;AACb,gBAAMC,IAAW,OAAO,QAAgBD,EAAM,gBAAgB,CAAA,CAAE,EAAE,OAE/D,CAACF,GAAK,CAACC,GAAKC,CAAK,OAChBF,EAAI,OAAOC,OAASC,GAEbF,IACR,CAAE,CAAA;AACL,UAAAA,EAAIC,KAAO;AAAA,YACP,MAAM;AAAA,YACN,SAASC,EAAM,WAAW,CAAC;AAAA,YAC3B,UAAU,CAACA,EAAM,KAAK;AAAA,YACtB,YAAYE,EAAA;AAAA,cACR,iBAAiBH;AAAA,eACdE;AAAA,UACP;AAAA,QACJ,OACG;AACH,gBAAME,IAAU;AAAA,YACZ,MAAM;AAAA,YACN,SAAS,CAAC;AAAA,YACV,YAAY;AAAA,cACR,cAAc,CAAC;AAAA,cACf,OAAOH,EAAM;AAAA,cACb,SAASA,EAAM;AAAA,cACf,KAAKA,EAAM;AAAA,cACX,UAAUA,EAAM;AAAA,cAChB,UAAUA,EAAM;AAAA,YACpB;AAAA,UAAA;AAEJ,UAAAF,EAAIC,KAAOI;AAAA,QACf;AACO,eAAAL;AAAA,MACX;AAAA,MACAV;AAAA,IAAA;AAEJ,IAAAgB;AAAA,MACInB;AAAA,MACAQ;AAAA,MACA,OAAO,KAAKF,EAAS,WAAW,KAAK;AAAA,MACrCM;AAAA,MACAR;AAAA,IAAA;AAAA,EACJ;AACJ,KAAWgB,IAAAd,EAAS,eAAT,QAAAc,EAAqB,SACbD,EAAAnB,GAAUQ,GAAW,EAACa,IAAAf,EAAS,eAAT,gBAAAe,EAAqB,KAAK,GAAGlB,GAAaC,CAAK;AAE5F;"}
package/dist/index.js CHANGED
@@ -1,4 +1,4 @@
1
- import { G as a, g as e } from "./index.cfc936fb.js";
1
+ import { G as a, g as e } from "./index.bce2e13c.js";
2
2
  import "@telia-ace/widget-ui";
3
3
  import "@telia-ace/widget-core";
4
4
  import "@telia-ace/widget-utilities";
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "@telia-ace/widget-components-grid",
3
- "version": "1.0.19",
3
+ "version": "1.0.20",
4
4
  "description": "Grid component for ACE Widgets.",
5
5
  "license": "SEE LICENSE IN LICENSE.txt",
6
6
  "author": "Telia Company AB",
@@ -8,6 +8,7 @@
8
8
  "telia"
9
9
  ],
10
10
  "main": "dist/index.js",
11
+ "sourceMain": "src/index.ts",
11
12
  "type": "module",
12
13
  "types": "dist/index.d.ts",
13
14
  "files": [
@@ -25,10 +26,10 @@
25
26
  },
26
27
  "sideEffects": false,
27
28
  "dependencies": {
28
- "@telia-ace/widget-core": "^1.0.14",
29
- "@telia-ace/widget-types-grid": "^1.0.23",
30
- "@telia-ace/widget-ui": "^1.0.21",
31
- "@telia-ace/widget-utilities": "^1.0.3",
29
+ "@telia-ace/widget-core": "^1.0.15",
30
+ "@telia-ace/widget-types-grid": "^1.0.24",
31
+ "@telia-ace/widget-ui": "^1.0.22",
32
+ "@telia-ace/widget-utilities": "^1.0.4",
32
33
  "@webprovisions/platform": "^1.1.2"
33
34
  },
34
35
  "peerDependencies": {
@@ -41,5 +42,5 @@
41
42
  "@types/react-dom": "^16.8.0",
42
43
  "@types/styled-components": "^5.1.7"
43
44
  },
44
- "gitHead": "187396559955650eb5545c4fc4540b16658bcff0"
45
+ "gitHead": "c3045eebac4251ae8ba27333abd9b6aa3ccd5b38"
45
46
  }