@digital-realty/ix-widget 1.0.1 → 1.0.2

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.
Files changed (15) hide show
  1. package/dist/assets/columns.d.ts +1 -0
  2. package/dist/assets/columns.js +4 -0
  3. package/dist/assets/columns.js.map +1 -1
  4. package/dist/assets/iconset.js +5 -1
  5. package/dist/assets/iconset.js.map +1 -1
  6. package/dist/ix-launchpad.js +92 -105
  7. package/dist/ix-launchpad.js.map +1 -1
  8. package/dist/ix-status-counter-group.js +2 -1
  9. package/dist/ix-status-counter-group.js.map +1 -1
  10. package/dist/ix-status-counter.d.ts +0 -1
  11. package/dist/ix-status-counter.js +38 -14
  12. package/dist/ix-status-counter.js.map +1 -1
  13. package/dist/styles/launchpad-styles.js +5 -30
  14. package/dist/styles/launchpad-styles.js.map +1 -1
  15. package/package.json +4 -2
package/dist/assets/columns.d.ts CHANGED
@@ -2,4 +2,5 @@ export declare const columns: {
2
2
  name: string;
3
3
  header: string;
4
4
  bodyRenderer: (row: any) => import("lit").TemplateResult<1>;
5
+ width: string;
5
6
  }[];
package/dist/assets/columns.js CHANGED
@@ -5,10 +5,12 @@ export const columns = [
5
5
  name: 'title',
6
6
  header: 'Subject',
7
7
  bodyRenderer: row => html ` <span>${row.title}</span>`,
8
+ width: '40%',
8
9
  },
9
10
  {
10
11
  name: 'status',
11
12
  header: 'Status',
13
+ width: '30%',
12
14
  bodyRenderer: row => html ` <span
13
15
  style="display: flex;
14
16
  flex-direction: row;
@@ -35,11 +37,13 @@ export const columns = [
35
37
  name: 'type',
36
38
  header: 'Ticket Type',
37
39
  bodyRenderer: row => html ` <span>${row.ticketType}</span>`,
40
+ width: '15%',
38
41
  },
39
42
  {
40
43
  name: 'updated',
41
44
  header: 'Updated On',
42
45
  bodyRenderer: row => html ` <span>${row.updatedOn.split(' ')[0]}</span>`,
46
+ width: '15%',
43
47
  },
44
48
  ];
45
49
  //# sourceMappingURL=columns.js.map
package/dist/assets/columns.js.map CHANGED
@@ -1 +1 @@
1
- {"version":3,"file":"columns.js","sourceRoot":"","sources":["../../src/assets/columns.ts"],"names":[],"mappings":"AAAA,cAAc;AACd,OAAO,EAAE,IAAI,EAAE,MAAM,KAAK,CAAC;AAE3B,MAAM,CAAC,MAAM,OAAO,GAAG;IACrB;QACE,IAAI,EAAE,OAAO;QACb,MAAM,EAAE,SAAS;QACjB,YAAY,EAAE,GAAG,CAAC,EAAE,CAAC,IAAI,CAAA,UAAU,GAAG,CAAC,KAAK,SAAS;KACtD;IACD;QACE,IAAI,EAAE,QAAQ;QACd,MAAM,EAAE,QAAQ;QAChB,YAAY,EAAE,GAAG,CAAC,EAAE,CAAC,IAAI,CAAA;;;;;;;;;;;;;;;;;;;SAmBpB,GAAG,CAAC,MAAM;MACb;KACH;IACD;QACE,IAAI,EAAE,MAAM;QACZ,MAAM,EAAE,aAAa;QACrB,YAAY,EAAE,GAAG,CAAC,EAAE,CAAC,IAAI,CAAA,UAAU,GAAG,CAAC,UAAU,SAAS;KAC3D;IACD;QACE,IAAI,EAAE,SAAS;QACf,MAAM,EAAE,YAAY;QACpB,YAAY,EAAE,GAAG,CAAC,EAAE,CAAC,IAAI,CAAA,UAAU,GAAG,CAAC,SAAS,CAAC,KAAK,CAAC,GAAG,CAAC,CAAC,CAAC,CAAC,SAAS;KACxE;CACF,CAAC","sourcesContent":["// @ts-nocheck\nimport { html } from 'lit';\n\nexport const columns = [\n {\n name: 'title',\n header: 'Subject',\n bodyRenderer: row => html` <span>${row.title}</span>`,\n },\n {\n name: 'status',\n header: 'Status',\n bodyRenderer: row => html` <span\n style=\"display: flex;\n flex-direction: row;\n -webkit-box-align: center;\n align-items: center;\n padding: 2px 12px;\n width: 185px;\n height: 28px;\n left: 0px;\n top: 0px;\n border-radius: 68px;\n flex: 0 0 auto;\n order: 0;\n -webkit-box-flex: 0;\n color: white;\n -webkit-box-pack: center;\n justify-content: center;\n background: rgb(76, 175, 80);\n margin: -6px 0;\"\n >${row.status}</span\n >`,\n },\n {\n name: 'type',\n header: 'Ticket Type',\n bodyRenderer: row => html` <span>${row.ticketType}</span>`,\n },\n {\n name: 'updated',\n header: 'Updated On',\n bodyRenderer: row => html` <span>${row.updatedOn.split(' ')[0]}</span>`,\n },\n];\n"]}
1
+ {"version":3,"file":"columns.js","sourceRoot":"","sources":["../../src/assets/columns.ts"],"names":[],"mappings":"AAAA,cAAc;AACd,OAAO,EAAE,IAAI,EAAE,MAAM,KAAK,CAAC;AAE3B,MAAM,CAAC,MAAM,OAAO,GAAG;IACrB;QACE,IAAI,EAAE,OAAO;QACb,MAAM,EAAE,SAAS;QACjB,YAAY,EAAE,GAAG,CAAC,EAAE,CAAC,IAAI,CAAA,UAAU,GAAG,CAAC,KAAK,SAAS;QACrD,KAAK,EAAE,KAAK;KACb;IACD;QACE,IAAI,EAAE,QAAQ;QACd,MAAM,EAAE,QAAQ;QAChB,KAAK,EAAE,KAAK;QACZ,YAAY,EAAE,GAAG,CAAC,EAAE,CAAC,IAAI,CAAA;;;;;;;;;;;;;;;;;;;SAmBpB,GAAG,CAAC,MAAM;MACb;KACH;IACD;QACE,IAAI,EAAE,MAAM;QACZ,MAAM,EAAE,aAAa;QACrB,YAAY,EAAE,GAAG,CAAC,EAAE,CAAC,IAAI,CAAA,UAAU,GAAG,CAAC,UAAU,SAAS;QAC1D,KAAK,EAAE,KAAK;KACb;IACD;QACE,IAAI,EAAE,SAAS;QACf,MAAM,EAAE,YAAY;QACpB,YAAY,EAAE,GAAG,CAAC,EAAE,CAAC,IAAI,CAAA,UAAU,GAAG,CAAC,SAAS,CAAC,KAAK,CAAC,GAAG,CAAC,CAAC,CAAC,CAAC,SAAS;QACvE,KAAK,EAAE,KAAK;KACb;CACF,CAAC","sourcesContent":["// @ts-nocheck\nimport { html } from 'lit';\n\nexport const columns = [\n {\n name: 'title',\n header: 'Subject',\n bodyRenderer: row => html` <span>${row.title}</span>`,\n width: '40%',\n },\n {\n name: 'status',\n header: 'Status',\n width: '30%',\n bodyRenderer: row => html` <span\n style=\"display: flex;\n flex-direction: row;\n -webkit-box-align: center;\n align-items: center;\n padding: 2px 12px;\n width: 185px;\n height: 28px;\n left: 0px;\n top: 0px;\n border-radius: 68px;\n flex: 0 0 auto;\n order: 0;\n -webkit-box-flex: 0;\n color: white;\n -webkit-box-pack: center;\n justify-content: center;\n background: rgb(76, 175, 80);\n margin: -6px 0;\"\n >${row.status}</span\n >`,\n },\n {\n name: 'type',\n header: 'Ticket Type',\n bodyRenderer: row => html` <span>${row.ticketType}</span>`,\n width: '15%',\n },\n {\n name: 'updated',\n header: 'Updated On',\n bodyRenderer: row => html` <span>${row.updatedOn.split(' ')[0]}</span>`,\n width: '15%',\n },\n];\n"]}
package/dist/assets/iconset.js CHANGED
@@ -1,7 +1,11 @@
1
1
  import { svg } from 'lit';
2
2
  export const ticket = svg `<svg focusable="false" aria-hidden="true" viewBox="0 0 20 20"><path d="M8.64453 0.5L0.657878 8.48828C0.342044 8.80245 0.167969 9.22083 0.167969 9.66667C0.167969 10.1125 0.34125 10.5317 0.65625 10.8451L5.65788 15.8451C5.97288 16.1592 6.39047 16.3333 6.83464 16.3333C7.28047 16.3333 7.69969 16.1601 8.01302 15.8451L16.0013 7.85677V0.5H8.64453ZM9.33464 2.16667H14.3346V7.16667L6.83464 14.6667L1.83464 9.66667L9.33464 2.16667ZM11.8346 3.83333C11.6136 3.83333 11.4017 3.92113 11.2454 4.07741C11.0891 4.23369 11.0013 4.44565 11.0013 4.66667C11.0013 4.88768 11.0891 5.09964 11.2454 5.25592C11.4017 5.4122 11.6136 5.5 11.8346 5.5C12.0556 5.5 12.2676 5.4122 12.4239 5.25592C12.5802 5.09964 12.668 4.88768 12.668 4.66667C12.668 4.44565 12.5802 4.23369 12.4239 4.07741C12.2676 3.92113 12.0556 3.83333 11.8346 3.83333ZM14.3346 11.3333V13.8333H11.8346V15.5H14.3346V18H16.0013V15.5H18.5013V13.8333H16.0013V11.3333H14.3346Z"></path></svg>`;
3
3
  export const laptop = svg `<svg focusable="false" aria-hidden="true" viewBox="0 0 24 24"><path d="M4 4C2.897 4 2 4.897 2 6V16C2 17.103 2.897 18 4 18H0V20H24V18H20C21.103 18 22 17.103 22 16V6C22 4.897 21.103 4 20 4H4ZM4 6H20L20.002 16H4V6ZM14.2852 8.00781L11 11.293L9.20703 9.5L7.79297 10.9141L11 14.1211L15.6992 9.42188L14.2852 8.00781Z" fill="url(#paint0_linear_10193_72020)"></path><defs><linearGradient id="paint0_linear_10193_72020" x1="12" y1="4" x2="12" y2="20" gradientUnits="userSpaceOnUse"><stop stop-color="#1459E4"></stop><stop offset="1" stop-color="#0C2295"></stop></linearGradient></defs></svg>`;
4
- export const loader = svg `<svg viewBox="22 22 44 44"><circle class="MuiCircularProgress-circle MuiCircularProgress-circleIndeterminate css-14891ef" cx="44" cy="44" r="20.2" fill="none" stroke-width="3.6"></circle></svg>`;
4
+ export const loader = svg `
5
+ <svg width="200" height="200" viewBox="-25 -25 250 250" version="1.1" xmlns="http://www.w3.org/2000/svg" style="transform:rotate(-90deg)">
6
+ <circle r="90" cx="100" cy="100" fill="transparent" stroke="transparent" stroke-width="16px" stroke-dasharray="565.48px" stroke-dashoffset="0"></circle>
7
+ <circle r="90" cx="100" cy="100" stroke="#1456e0" stroke-width="16px" stroke-linecap="round" stroke-dashoffset="118.692px" fill="transparent" stroke-dasharray="565.48px"></circle>
8
+ </svg>`;
5
9
  export const phone = svg `<svg focusable="false" aria-hidden="true" viewBox="0 0 24 24" data-testid="PhoneIcon"><path d="M6.62 10.79c1.44 2.83 3.76 5.14 6.59 6.59l2.2-2.2c.27-.27.67-.36 1.02-.24 1.12.37 2.33.57 3.57.57.55 0 1 .45 1 1V20c0 .55-.45 1-1 1-9.39 0-17-7.61-17-17 0-.55.45-1 1-1h3.5c.55 0 1 .45 1 1 0 1.25.2 2.45.57 3.57.11.35.03.74-.25 1.02l-2.2 2.2z"></path></svg>`;
6
10
  export const question = svg `<svg focusable="false" aria-hidden="true" viewBox="0 0 24 24" data-testid="ContactSupportSharpIcon"><path d="M11.5 2C6.81 2 3 5.81 3 10.5S6.81 19 11.5 19h.5v3c4.86-2.34 8-7 8-11.5C20 5.81 16.19 2 11.5 2zm1 14.5h-2v-2h2v2zm0-3.5h-2c0-3.25 3-3 3-5 0-1.1-.9-2-2-2s-2 .9-2 2h-2c0-2.21 1.79-4 4-4s4 1.79 4 4c0 2.5-3 2.75-3 5z"></path></svg>`;
7
11
  export const email = svg `<svg focusable="false" aria-hidden="true" viewBox="0 0 24 24" data-testid="EmailIcon"><path d="M20 4H4c-1.1 0-1.99.9-1.99 2L2 18c0 1.1.9 2 2 2h16c1.1 0 2-.9 2-2V6c0-1.1-.9-2-2-2zm0 4-8 5-8-5V6l8 5 8-5v2z"></path></svg>`;
package/dist/assets/iconset.js.map CHANGED
@@ -1 +1 @@
1
- {"version":3,"file":"iconset.js","sourceRoot":"","sources":["../../src/assets/iconset.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,GAAG,EAAE,MAAM,KAAK,CAAC;AAE1B,MAAM,CAAC,MAAM,MAAM,GAAG,GAAG,CAAA,65BAA65B,CAAC;AAEv7B,MAAM,CAAC,MAAM,MAAM,GAAG,GAAG,CAAA,ukBAAukB,CAAC;AAEjmB,MAAM,CAAC,MAAM,MAAM,GAAG,GAAG,CAAA,mMAAmM,CAAC;AAE7N,MAAM,CAAC,MAAM,KAAK,GAAG,GAAG,CAAA,gWAAgW,CAAC;AAEzX,MAAM,CAAC,MAAM,QAAQ,GAAG,GAAG,CAAA,iVAAiV,CAAC;AAE7W,MAAM,CAAC,MAAM,KAAK,GAAG,GAAG,CAAA,4NAA4N,CAAC;AAErP,MAAM,CAAC,MAAM,cAAc,GAAG,GAAG,CAAA,0sEAA0sE,CAAC;AAE5uE,MAAM,CAAC,MAAM,KAAK,GAAG,GAAG,CAAA,s5BAAs5B,CAAC;AAE/6B,MAAM,CAAC,MAAM,OAAO,GAAG,GAAG,CAAA,81DAA81D,CAAC;AAEz3D,MAAM,CAAC,MAAM,IAAI,GAAG,GAAG,CAAA,4qCAA4qC,CAAC;AAEpsC,MAAM,CAAC,MAAM,SAAS,GAAG,GAAG,CAAA,04CAA04C,CAAC;AAEv6C,MAAM,CAAC,MAAM,IAAI,GAAG,GAAG,CAAA,ghBAAghB,CAAC;AAExiB,MAAM,CAAC,MAAM,WAAW,GAAG,GAAG,CAAA,yrEAAyrE,CAAC;AAExtE,MAAM,CAAC,MAAM,QAAQ,GAAG,GAAG,CAAA,w2BAAw2B,CAAC;AAEp4B,MAAM,CAAC,MAAM,OAAO,GAAG,GAAG,CAAA,8TAA8T,CAAC;AAEzV,MAAM,CAAC,MAAM,WAAW,GAAG,GAAG,CAAA,ktBAAktB,CAAC","sourcesContent":["import { svg } from 'lit';\n\nexport const ticket = svg`<svg focusable=\"false\" aria-hidden=\"true\" viewBox=\"0 0 20 20\"><path d=\"M8.64453 0.5L0.657878 8.48828C0.342044 8.80245 0.167969 9.22083 0.167969 9.66667C0.167969 10.1125 0.34125 10.5317 0.65625 10.8451L5.65788 15.8451C5.97288 16.1592 6.39047 16.3333 6.83464 16.3333C7.28047 16.3333 7.69969 16.1601 8.01302 15.8451L16.0013 7.85677V0.5H8.64453ZM9.33464 2.16667H14.3346V7.16667L6.83464 14.6667L1.83464 9.66667L9.33464 2.16667ZM11.8346 3.83333C11.6136 3.83333 11.4017 3.92113 11.2454 4.07741C11.0891 4.23369 11.0013 4.44565 11.0013 4.66667C11.0013 4.88768 11.0891 5.09964 11.2454 5.25592C11.4017 5.4122 11.6136 5.5 11.8346 5.5C12.0556 5.5 12.2676 5.4122 12.4239 5.25592C12.5802 5.09964 12.668 4.88768 12.668 4.66667C12.668 4.44565 12.5802 4.23369 12.4239 4.07741C12.2676 3.92113 12.0556 3.83333 11.8346 3.83333ZM14.3346 11.3333V13.8333H11.8346V15.5H14.3346V18H16.0013V15.5H18.5013V13.8333H16.0013V11.3333H14.3346Z\"></path></svg>`;\n\nexport const laptop = svg`<svg focusable=\"false\" aria-hidden=\"true\" viewBox=\"0 0 24 24\"><path d=\"M4 4C2.897 4 2 4.897 2 6V16C2 17.103 2.897 18 4 18H0V20H24V18H20C21.103 18 22 17.103 22 16V6C22 4.897 21.103 4 20 4H4ZM4 6H20L20.002 16H4V6ZM14.2852 8.00781L11 11.293L9.20703 9.5L7.79297 10.9141L11 14.1211L15.6992 9.42188L14.2852 8.00781Z\" fill=\"url(#paint0_linear_10193_72020)\"></path><defs><linearGradient id=\"paint0_linear_10193_72020\" x1=\"12\" y1=\"4\" x2=\"12\" y2=\"20\" gradientUnits=\"userSpaceOnUse\"><stop stop-color=\"#1459E4\"></stop><stop offset=\"1\" stop-color=\"#0C2295\"></stop></linearGradient></defs></svg>`;\n\nexport const loader = svg`<svg viewBox=\"22 22 44 44\"><circle class=\"MuiCircularProgress-circle MuiCircularProgress-circleIndeterminate css-14891ef\" cx=\"44\" cy=\"44\" r=\"20.2\" fill=\"none\" stroke-width=\"3.6\"></circle></svg>`;\n\nexport const phone = svg`<svg focusable=\"false\" aria-hidden=\"true\" viewBox=\"0 0 24 24\" data-testid=\"PhoneIcon\"><path d=\"M6.62 10.79c1.44 2.83 3.76 5.14 6.59 6.59l2.2-2.2c.27-.27.67-.36 1.02-.24 1.12.37 2.33.57 3.57.57.55 0 1 .45 1 1V20c0 .55-.45 1-1 1-9.39 0-17-7.61-17-17 0-.55.45-1 1-1h3.5c.55 0 1 .45 1 1 0 1.25.2 2.45.57 3.57.11.35.03.74-.25 1.02l-2.2 2.2z\"></path></svg>`;\n\nexport const question = svg`<svg focusable=\"false\" aria-hidden=\"true\" viewBox=\"0 0 24 24\" data-testid=\"ContactSupportSharpIcon\"><path d=\"M11.5 2C6.81 2 3 5.81 3 10.5S6.81 19 11.5 19h.5v3c4.86-2.34 8-7 8-11.5C20 5.81 16.19 2 11.5 2zm1 14.5h-2v-2h2v2zm0-3.5h-2c0-3.25 3-3 3-5 0-1.1-.9-2-2-2s-2 .9-2 2h-2c0-2.21 1.79-4 4-4s4 1.79 4 4c0 2.5-3 2.75-3 5z\"></path></svg>`;\n\nexport const email = svg`<svg focusable=\"false\" aria-hidden=\"true\" viewBox=\"0 0 24 24\" data-testid=\"EmailIcon\"><path d=\"M20 4H4c-1.1 0-1.99.9-1.99 2L2 18c0 1.1.9 2 2 2h16c1.1 0 2-.9 2-2V6c0-1.1-.9-2-2-2zm0 4-8 5-8-5V6l8 5 8-5v2z\"></path></svg>`;\n\nexport const cutomerSupport = svg`<svg focusable=\"false\" aria-hidden=\"true\" viewBox=\"0 0 24 24\"><path d=\"M22.83 12.45L20.83 9.45C20.8139 9.424 20.788 9.404 20.768 9.38C20.74 9.345 20.7129 9.311 20.681 9.281C20.596 9.2 20.503 9.128 20.4 9.08L16.7099 7.48C16.2599 7.83 15.48 8.33 14.38 8.66L17.327 9.934L12 11.932L6.69395 9.942L9.66995 8.68C8.56995 8.35 7.77995 7.86 7.31995 7.5L3.60995 9.08C3.60495 9.082 3.60095 9.086 3.59595 9.088C3.57895 9.096 3.56595 9.108 3.54895 9.117C3.46595 9.161 3.38995 9.215 3.32195 9.279C3.28795 9.31 3.26095 9.344 3.23195 9.38C3.21195 9.405 3.18795 9.423 3.16995 9.45L1.16995 12.45C0.99995 12.7 0.94995 13.02 1.04995 13.31C1.13995 13.6 1.35995 13.83 1.64995 13.94L2.99995 14.446V19C2.99995 19.417 3.25895 19.79 3.64895 19.937L11.649 22.937C11.762 22.979 11.8809 23 12 23C12.119 23 12.238 22.979 12.351 22.937L20.351 19.937C20.7409 19.79 21 19.417 21 19V14.516L22.3899 13.92C22.67 13.8 22.8699 13.57 22.9599 13.29C23.0399 13 23 12.69 22.83 12.45ZM3.52995 12.51L4.39295 11.216L10.4729 13.496L9.60995 14.79L3.52995 12.51ZM20.5 12.55L15.2299 14.81L13.81 13.39L19.608 11.216L20.5 12.55ZM19 18.307L12 20.932L4.99995 18.307V15.196L9.64995 16.94C9.75995 16.98 9.87995 17 9.99995 17C10.33 17 10.64 16.84 10.83 16.55L12.16 14.57L14.29 16.71C14.58 17 15.02 17.08 15.39 16.92L19 15.373V18.307ZM12 7.004C9.65195 7.004 8.42395 5.838 8.29195 5.705C7.90195 5.313 7.90295 4.681 8.29495 4.291C8.68295 3.905 9.30895 3.902 9.69895 4.284C9.74895 4.33 10.503 5.004 12 5.004C13.518 5.004 14.271 4.312 14.303 4.283C14.7 3.909 15.331 3.918 15.711 4.309C16.091 4.701 16.094 5.319 15.709 5.705C15.5759 5.838 14.3479 7.004 12 7.004ZM9.99995 1C9.73473 1 9.48038 1.10536 9.29284 1.29289C9.10531 1.48043 8.99995 1.73478 8.99995 2C8.99995 2.26522 9.10531 2.51957 9.29284 2.70711C9.48038 2.89464 9.73473 3 9.99995 3C10.2652 3 10.5195 2.89464 10.7071 2.70711C10.8946 2.51957 11 2.26522 11 2C11 1.73478 10.8946 1.48043 10.7071 1.29289C10.5195 1.10536 10.2652 1 9.99995 1ZM14 1C13.7347 1 13.4804 1.10536 13.2928 1.29289C13.1053 1.48043 13 1.73478 13 2C13 2.26522 13.1053 2.51957 13.2928 2.70711C13.4804 2.89464 13.7347 3 14 3C14.2652 3 14.5195 2.89464 14.7071 2.70711C14.8946 2.51957 15 2.26522 15 2C15 1.73478 14.8946 1.48043 14.7071 1.29289C14.5195 1.10536 14.2652 1 14 1Z\"></path></svg>`;\n\nexport const users = svg`<svg focusable=\"false\" aria-hidden=\"true\" viewBox=\"0 0 24 24\"><path d=\"M3 3C1.897 3 1 3.897 1 5V21H11V19H3V5H13V12C13 10.37 13.792 8.93544 15 8.02344V5C15 3.897 14.103 3 13 3H3ZM5 7V9H7V7H5ZM9 7V9H11V7H9ZM18 9C16.318 9 15 10.317 15 12C15 13.683 16.318 15 18 15C19.682 15 21 13.683 21 12C21 10.317 19.682 9 18 9ZM5 11V13H7V11H5ZM9 11V13H11V11H9ZM18 11C18.58 11 19 11.421 19 12C19 12.579 18.58 13 18 13C17.42 13 17 12.579 17 12C17 11.421 17.42 11 18 11ZM5 15V17H7V15H5ZM9 15V17H11V15H9ZM18 16C15.149 16 13 17.4558 13 19.3848V21H23V19.3848C23 17.4558 20.851 16 18 16ZM18 18C19.47 18 20.4895 18.504 20.8535 19H15.1465C15.5095 18.504 16.53 18 18 18Z\" fill=\"url(#paint0_linear_10193_72013)\"></path><defs><linearGradient id=\"paint0_linear_10193_72013\" x1=\"12\" y1=\"3\" x2=\"12\" y2=\"21\" gradientUnits=\"userSpaceOnUse\"><stop stop-color=\"#1459E4\"></stop><stop offset=\"1\" stop-color=\"#0C2295\"></stop></linearGradient></defs></svg>`;\n\nexport const mySites = svg`<svg class=\"MuiSvgIcon-root MuiSvgIcon-fontSizeMedium css-vubbuv\" focusable=\"false\" aria-hidden=\"true\" viewBox=\"0 0 24 24\"><g clip-path=\"url(#clip0_10193_72029)\"><path d=\"M20.5 0C18.291 0 16.5 1.791 16.5 4C16.5 6.857 20.5 11 20.5 11C20.5 11 24.5 6.857 24.5 4C24.5 1.791 22.709 0 20.5 0ZM12.5 2C6.986 2 2.5 6.486 2.5 12C2.5 17.514 6.986 22 12.5 22C18.014 22 22.5 17.514 22.5 12C22.5 11.93 22.4912 11.862 22.4902 11.793C22.2532 12.059 22.0575 12.2677 21.9395 12.3887L20.1504 14.3047C19.9484 14.9657 19.6695 15.5919 19.3145 16.1699C18.9985 15.4819 18.306 15 17.5 15H16.5V13C16.5 12.447 16.052 12 15.5 12H9.5V10H10.5C11.052 10 11.5 9.553 11.5 9V7.02344L13.5156 7.00781C14.0986 7.00381 14.6175 6.74289 14.9805 6.33789C14.8145 5.89389 14.6875 5.445 14.6035 5L10.4922 5.03125C9.94319 5.03525 9.5 5.48225 9.5 6.03125V8H8.5C7.948 8 7.5 8.447 7.5 9V10.1855L5.48047 8.16797C6.84047 5.68697 9.477 4 12.5 4H14.5C14.5 3.397 14.5908 2.81658 14.7578 2.26758C14.0308 2.09858 13.277 2 12.5 2ZM20.5 2.57031C21.289 2.57031 21.9297 3.211 21.9297 4C21.9297 4.789 21.289 5.42969 20.5 5.42969C19.711 5.42969 19.0703 4.789 19.0703 4C19.0703 3.211 19.711 2.57031 20.5 2.57031ZM4.70703 10.2207L9.5 15.0137V16C9.5 17.103 10.397 18 11.5 18V19.9316C7.56 19.4366 4.5 16.072 4.5 12C4.5 11.388 4.57603 10.7947 4.70703 10.2207ZM11.2793 14H14.5V16C14.5 16.553 14.948 17 15.5 17H17.5V18.2344C16.375 19.1384 15.002 19.7417 13.5 19.9297V17C13.5 16.447 13.052 16 12.5 16H11.5V14.5996C11.5 14.3776 11.4123 14.174 11.2793 14Z\" fill=\"url(#paint0_linear_10193_72029)\"></path></g><defs><linearGradient id=\"paint0_linear_10193_72029\" x1=\"13.5\" y1=\"0\" x2=\"13.5\" y2=\"22\" gradientUnits=\"userSpaceOnUse\"><stop stop-color=\"#1459E4\"></stop><stop offset=\"1\" stop-color=\"#0C2295\"></stop></linearGradient><clipPath id=\"clip0_10193_72029\"><rect width=\"24\" height=\"24\" fill=\"white\" transform=\"translate(0.5)\"></rect></clipPath></defs></svg>`;\n\nexport const dcim = svg`<svg class=\"MuiSvgIcon-root MuiSvgIcon-fontSizeMedium css-vubbuv\" focusable=\"false\" aria-hidden=\"true\" viewBox=\"0 0 24 24\"><g clip-path=\"url(#clip0_10193_72036)\"><path d=\"M6.5 2C5.395 2 4.5 2.895 4.5 4V20C4.5 21.105 5.395 22 6.5 22H14.8438C14.1128 21.487 13.5155 20.8 13.1055 20H6.5V16H12.7129C12.9229 15.258 13.2798 14.578 13.7578 14H6.5V10H18.5V12.0254C19.216 12.0904 19.89 12.2935 20.5 12.6055V4C20.5 2.895 19.605 2 18.5 2H6.5ZM6.5 4H18.5V8H6.5V4ZM18 14C16.067 14 14.5 15.567 14.5 17.5C14.5 19.433 16.067 21 18 21C18.465 21 18.9065 20.9052 19.3125 20.7402L22.5723 24H24.5V22.0723L21.2402 18.8125C21.4042 18.4065 21.5 17.965 21.5 17.5C21.5 15.567 19.933 14 18 14ZM17.5 16C18.052 16 18.5 16.448 18.5 17C18.5 17.552 18.052 18 17.5 18C16.948 18 16.5 17.552 16.5 17C16.5 16.448 16.948 16 17.5 16Z\" fill=\"url(#paint0_linear_10193_72036)\"></path></g><defs><linearGradient id=\"paint0_linear_10193_72036\" x1=\"14.5\" y1=\"2\" x2=\"14.5\" y2=\"24\" gradientUnits=\"userSpaceOnUse\"><stop stop-color=\"#1459E4\"></stop><stop offset=\"1\" stop-color=\"#0C2295\"></stop></linearGradient><clipPath id=\"clip0_10193_72036\"><rect width=\"24\" height=\"24\" fill=\"white\" transform=\"translate(0.5)\"></rect></clipPath></defs></svg>`;\n\nexport const locations = svg`<svg class=\"MuiSvgIcon-root MuiSvgIcon-fontSizeMedium css-vubbuv\" focusable=\"false\" aria-hidden=\"true\" viewBox=\"0 0 24 24\"><g clip-path=\"url(#clip0_10193_72043)\"><path d=\"M11.7222 1.00195C6.94623 0.939955 2.64861 3.82933 0.581605 8.61133C0.473605 8.86233 0.472652 9.14644 0.579652 9.39844C2.48665 13.8934 6.16157 16.6777 10.4996 16.9707V14.9434C7.11557 14.6564 4.21428 12.5067 2.59528 9.01172C4.39028 5.22372 7.85307 2.95295 11.6871 3.00195C15.3911 3.06895 18.4997 5.28789 20.0777 8.96289C19.9057 9.32689 19.7093 9.664 19.5093 10H21.7925C21.8925 9.795 21.9926 9.59091 22.0836 9.37891C22.1876 9.13791 22.1922 8.86414 22.0972 8.61914C20.2972 4.00414 16.3232 1.08595 11.7222 1.00195ZM11.4996 5C9.29057 5 7.49957 6.791 7.49957 9C7.49957 10.862 8.77757 12.4124 10.4996 12.8594V10H15.3589C15.4419 9.679 15.4996 9.347 15.4996 9C15.4996 6.791 13.7086 5 11.4996 5ZM12.4996 12V13V24H24.4996V12H12.4996ZM14.4996 14H22.0855L18.4996 17.5859L17.2066 16.293L15.7925 17.707L18.4996 20.4141L22.4996 16.4141V22H14.4996V14Z\" fill=\"url(#paint0_linear_10193_72043)\"></path></g><defs><linearGradient id=\"paint0_linear_10193_72043\" x1=\"12.4998\" y1=\"1.00098\" x2=\"12.4998\" y2=\"24\" gradientUnits=\"userSpaceOnUse\"><stop stop-color=\"#1459E4\"></stop><stop offset=\"1\" stop-color=\"#0C2295\"></stop></linearGradient><clipPath id=\"clip0_10193_72043\"><rect width=\"24\" height=\"24\" fill=\"white\" transform=\"translate(0.5)\"></rect></clipPath></defs></svg>`;\n\nexport const lock = svg`<svg class=\"MuiSvgIcon-root MuiSvgIcon-fontSizeMedium css-vubbuv\" focusable=\"false\" aria-hidden=\"true\" viewBox=\"0 0 24 24\"><path d=\"M12 1C9.12778 1 6.71891 3.04615 6.12305 5.78711L8.07812 6.21289C8.48226 4.35385 10.0722 3 12 3C14.2762 3 16 4.72381 16 7V8H6C4.90694 8 4 8.90694 4 10V20C4 21.0931 4.90694 22 6 22H18C19.0931 22 20 21.0931 20 20V10C20 8.90694 19.0931 8 18 8V7C18 3.67619 15.3238 1 12 1ZM6 10H18V20H6V10ZM12 13C10.9 13 10 13.9 10 15C10 16.1 10.9 17 12 17C13.1 17 14 16.1 14 15C14 13.9 13.1 13 12 13Z\"></path></svg>`;\n\nexport const remoteHands = svg`<svg class=\"MuiSvgIcon-root MuiSvgIcon-fontSizeMedium css-vubbuv\" focusable=\"false\" aria-hidden=\"true\" viewBox=\"0 0 24 24\"><path d=\"M13 2C12.529 2 12.1357 2.36008 12.0977 2.83008L12.082 3.01953C12.0793 3.05251 12.093 3.08098 12.0938 3.11328C11.3101 3.29551 10.6196 3.70573 10.0879 4.27344C10.06 4.2564 10.0421 4.22909 10.0117 4.21484L9.8418 4.13477C9.4158 3.93377 8.90592 4.092 8.66992 4.5C8.43392 4.908 8.5505 5.42731 8.9375 5.69531L9.09375 5.80469C9.12369 5.82543 9.15813 5.82904 9.18945 5.8457C9.07799 6.21341 9 6.59591 9 7C9 7.40409 9.07799 7.78659 9.18945 8.1543C9.15813 8.17095 9.12369 8.17457 9.09375 8.19531L8.9375 8.30273C8.5505 8.57173 8.43392 9.092 8.66992 9.5C8.90592 9.908 9.4158 10.0662 9.8418 9.86523L10.0117 9.78516C10.042 9.77089 10.06 9.74359 10.0879 9.72656C10.6191 10.2938 11.3089 10.7043 12.0918 10.8867C12.091 10.919 12.0774 10.9475 12.0801 10.9805L12.0977 11.1699C12.1367 11.6399 12.529 12 13 12C13.471 12 13.8643 11.6399 13.9023 11.1699L13.918 10.9805C13.9207 10.9475 13.907 10.919 13.9062 10.8867C14.6899 10.7045 15.3804 10.2943 15.9121 9.72656C15.94 9.74366 15.9579 9.77084 15.9883 9.78516L16.1582 9.86719C16.5842 10.0682 17.0941 9.90995 17.3301 9.50195C17.5661 9.09395 17.4495 8.57369 17.0625 8.30469L16.9062 8.19531C16.8763 8.17457 16.8419 8.17096 16.8105 8.1543C16.922 7.78659 17 7.40409 17 7C17 6.59591 16.922 6.21341 16.8105 5.8457C16.8419 5.82905 16.8763 5.82543 16.9062 5.80469L17.0625 5.69727C17.4495 5.42827 17.5661 4.908 17.3301 4.5C17.0941 4.092 16.5842 3.93377 16.1582 4.13477L15.9883 4.21484C15.958 4.22911 15.94 4.25641 15.9121 4.27344C15.3809 3.70617 14.6911 3.29573 13.9082 3.11328C13.909 3.08098 13.9226 3.05251 13.9199 3.01953L13.9023 2.83008C13.8633 2.36008 13.471 2 13 2ZM13 5.5C13.828 5.5 14.5 6.172 14.5 7C14.5 7.828 13.828 8.5 13 8.5C12.172 8.5 11.5 7.828 11.5 7C11.5 6.172 12.172 5.5 13 5.5ZM20.5859 12C20.2239 12 19.8619 12.1381 19.5859 12.4141L15 17H11C10.724 17 10.5 16.776 10.5 16.5C10.5 16.224 10.724 16 11 16H13C14.105 16 15 15.105 15 14V13H8.65625C7.59525 13 6.57812 13.4209 5.82812 14.1719L2 18L6 22L8 20H15.1719C15.7019 20 16.2109 19.7891 16.5859 19.4141L21.5859 14.4141C22.1379 13.8621 22.1379 12.9661 21.5859 12.4141C21.3099 12.1381 20.9479 12 20.5859 12Z\"></path></svg>`;\n\nexport const shipping = svg`<svg class=\"MuiSvgIcon-root MuiSvgIcon-fontSizeMedium css-vubbuv\" focusable=\"false\" aria-hidden=\"true\" viewBox=\"0 0 24 24\"><path d=\"M0 5V7H14V11V13V16H8.2207C7.67163 15.3907 6.88492 15 6 15C5.11508 15 4.32837 15.3907 3.7793 16H3V15L5 13H1V18H3C3 19.657 4.343 21 6 21C7.657 21 9 19.657 9 18H15C15 19.657 16.343 21 18 21C19.657 21 21 19.657 21 18H22H23V13L20.2754 7.55273C20.1064 7.21373 19.7618 7 19.3828 7H16V5H0ZM1 9V11H8V9H1ZM16 9H18.7637L19.7637 11H16V9ZM16 13H20.7637L21 13.4727V16H20.2207C19.6716 15.3907 18.8849 15 18 15C17.2279 15 16.5316 15.3002 16 15.7793V13ZM6 16.75C6.689 16.75 7.25 17.311 7.25 18C7.25 18.689 6.689 19.25 6 19.25C5.311 19.25 4.75 18.689 4.75 18C4.75 17.311 5.311 16.75 6 16.75ZM18 16.75C18.689 16.75 19.25 17.311 19.25 18C19.25 18.689 18.689 19.25 18 19.25C17.311 19.25 16.75 18.689 16.75 18C16.75 17.311 17.311 16.75 18 16.75Z\"></path></svg>`;\n\nexport const addUser = svg`<svg class=\"MuiSvgIcon-root MuiSvgIcon-fontSizeMedium css-vubbuv\" focusable=\"false\" aria-hidden=\"true\" viewBox=\"0 0 24 24\" data-testid=\"PersonAddIcon\"><path d=\"M15 12c2.21 0 4-1.79 4-4s-1.79-4-4-4-4 1.79-4 4 1.79 4 4 4zm-9-2V7H4v3H1v2h3v3h2v-3h3v-2H6zm9 4c-2.67 0-8 1.34-8 4v2h16v-2c0-2.66-5.33-4-8-4z\"></path></svg>`;\n\nexport const manageUsers = svg`<svg class=\"MuiSvgIcon-root MuiSvgIcon-fontSizeMedium css-vubbuv\" focusable=\"false\" aria-hidden=\"true\" viewBox=\"0 0 24 24\"><path d=\"M3 3C1.897 3 1 3.897 1 5V21H11V19H3V5H13V12C13 10.37 13.792 8.93544 15 8.02344V5C15 3.897 14.103 3 13 3H3ZM5 7V9H7V7H5ZM9 7V9H11V7H9ZM18 9C16.318 9 15 10.317 15 12C15 13.683 16.318 15 18 15C19.682 15 21 13.683 21 12C21 10.317 19.682 9 18 9ZM5 11V13H7V11H5ZM9 11V13H11V11H9ZM18 11C18.58 11 19 11.421 19 12C19 12.579 18.58 13 18 13C17.42 13 17 12.579 17 12C17 11.421 17.42 11 18 11ZM5 15V17H7V15H5ZM9 15V17H11V15H9ZM18 16C15.149 16 13 17.4558 13 19.3848V21H23V19.3848C23 17.4558 20.851 16 18 16ZM18 18C19.47 18 20.4895 18.504 20.8535 19H15.1465C15.5095 18.504 16.53 18 18 18Z\"></path></svg>`;\n"]}
1
+ {"version":3,"file":"iconset.js","sourceRoot":"","sources":["../../src/assets/iconset.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,GAAG,EAAE,MAAM,KAAK,CAAC;AAE1B,MAAM,CAAC,MAAM,MAAM,GAAG,GAAG,CAAA,65BAA65B,CAAC;AAEv7B,MAAM,CAAC,MAAM,MAAM,GAAG,GAAG,CAAA,ukBAAukB,CAAC;AAEjmB,MAAM,CAAC,MAAM,MAAM,GAAG,GAAG,CAAA;;;;OAIlB,CAAC;AAER,MAAM,CAAC,MAAM,KAAK,GAAG,GAAG,CAAA,gWAAgW,CAAC;AAEzX,MAAM,CAAC,MAAM,QAAQ,GAAG,GAAG,CAAA,iVAAiV,CAAC;AAE7W,MAAM,CAAC,MAAM,KAAK,GAAG,GAAG,CAAA,4NAA4N,CAAC;AAErP,MAAM,CAAC,MAAM,cAAc,GAAG,GAAG,CAAA,0sEAA0sE,CAAC;AAE5uE,MAAM,CAAC,MAAM,KAAK,GAAG,GAAG,CAAA,s5BAAs5B,CAAC;AAE/6B,MAAM,CAAC,MAAM,OAAO,GAAG,GAAG,CAAA,81DAA81D,CAAC;AAEz3D,MAAM,CAAC,MAAM,IAAI,GAAG,GAAG,CAAA,4qCAA4qC,CAAC;AAEpsC,MAAM,CAAC,MAAM,SAAS,GAAG,GAAG,CAAA,04CAA04C,CAAC;AAEv6C,MAAM,CAAC,MAAM,IAAI,GAAG,GAAG,CAAA,ghBAAghB,CAAC;AAExiB,MAAM,CAAC,MAAM,WAAW,GAAG,GAAG,CAAA,yrEAAyrE,CAAC;AAExtE,MAAM,CAAC,MAAM,QAAQ,GAAG,GAAG,CAAA,w2BAAw2B,CAAC;AAEp4B,MAAM,CAAC,MAAM,OAAO,GAAG,GAAG,CAAA,8TAA8T,CAAC;AAEzV,MAAM,CAAC,MAAM,WAAW,GAAG,GAAG,CAAA,ktBAAktB,CAAC","sourcesContent":["import { svg } from 'lit';\n\nexport const ticket = svg`<svg focusable=\"false\" aria-hidden=\"true\" viewBox=\"0 0 20 20\"><path d=\"M8.64453 0.5L0.657878 8.48828C0.342044 8.80245 0.167969 9.22083 0.167969 9.66667C0.167969 10.1125 0.34125 10.5317 0.65625 10.8451L5.65788 15.8451C5.97288 16.1592 6.39047 16.3333 6.83464 16.3333C7.28047 16.3333 7.69969 16.1601 8.01302 15.8451L16.0013 7.85677V0.5H8.64453ZM9.33464 2.16667H14.3346V7.16667L6.83464 14.6667L1.83464 9.66667L9.33464 2.16667ZM11.8346 3.83333C11.6136 3.83333 11.4017 3.92113 11.2454 4.07741C11.0891 4.23369 11.0013 4.44565 11.0013 4.66667C11.0013 4.88768 11.0891 5.09964 11.2454 5.25592C11.4017 5.4122 11.6136 5.5 11.8346 5.5C12.0556 5.5 12.2676 5.4122 12.4239 5.25592C12.5802 5.09964 12.668 4.88768 12.668 4.66667C12.668 4.44565 12.5802 4.23369 12.4239 4.07741C12.2676 3.92113 12.0556 3.83333 11.8346 3.83333ZM14.3346 11.3333V13.8333H11.8346V15.5H14.3346V18H16.0013V15.5H18.5013V13.8333H16.0013V11.3333H14.3346Z\"></path></svg>`;\n\nexport const laptop = svg`<svg focusable=\"false\" aria-hidden=\"true\" viewBox=\"0 0 24 24\"><path d=\"M4 4C2.897 4 2 4.897 2 6V16C2 17.103 2.897 18 4 18H0V20H24V18H20C21.103 18 22 17.103 22 16V6C22 4.897 21.103 4 20 4H4ZM4 6H20L20.002 16H4V6ZM14.2852 8.00781L11 11.293L9.20703 9.5L7.79297 10.9141L11 14.1211L15.6992 9.42188L14.2852 8.00781Z\" fill=\"url(#paint0_linear_10193_72020)\"></path><defs><linearGradient id=\"paint0_linear_10193_72020\" x1=\"12\" y1=\"4\" x2=\"12\" y2=\"20\" gradientUnits=\"userSpaceOnUse\"><stop stop-color=\"#1459E4\"></stop><stop offset=\"1\" stop-color=\"#0C2295\"></stop></linearGradient></defs></svg>`;\n\nexport const loader = svg`\n<svg width=\"200\" height=\"200\" viewBox=\"-25 -25 250 250\" version=\"1.1\" xmlns=\"http://www.w3.org/2000/svg\" style=\"transform:rotate(-90deg)\">\n <circle r=\"90\" cx=\"100\" cy=\"100\" fill=\"transparent\" stroke=\"transparent\" stroke-width=\"16px\" stroke-dasharray=\"565.48px\" stroke-dashoffset=\"0\"></circle>\n <circle r=\"90\" cx=\"100\" cy=\"100\" stroke=\"#1456e0\" stroke-width=\"16px\" stroke-linecap=\"round\" stroke-dashoffset=\"118.692px\" fill=\"transparent\" stroke-dasharray=\"565.48px\"></circle>\n</svg>`;\n\nexport const phone = svg`<svg focusable=\"false\" aria-hidden=\"true\" viewBox=\"0 0 24 24\" data-testid=\"PhoneIcon\"><path d=\"M6.62 10.79c1.44 2.83 3.76 5.14 6.59 6.59l2.2-2.2c.27-.27.67-.36 1.02-.24 1.12.37 2.33.57 3.57.57.55 0 1 .45 1 1V20c0 .55-.45 1-1 1-9.39 0-17-7.61-17-17 0-.55.45-1 1-1h3.5c.55 0 1 .45 1 1 0 1.25.2 2.45.57 3.57.11.35.03.74-.25 1.02l-2.2 2.2z\"></path></svg>`;\n\nexport const question = svg`<svg focusable=\"false\" aria-hidden=\"true\" viewBox=\"0 0 24 24\" data-testid=\"ContactSupportSharpIcon\"><path d=\"M11.5 2C6.81 2 3 5.81 3 10.5S6.81 19 11.5 19h.5v3c4.86-2.34 8-7 8-11.5C20 5.81 16.19 2 11.5 2zm1 14.5h-2v-2h2v2zm0-3.5h-2c0-3.25 3-3 3-5 0-1.1-.9-2-2-2s-2 .9-2 2h-2c0-2.21 1.79-4 4-4s4 1.79 4 4c0 2.5-3 2.75-3 5z\"></path></svg>`;\n\nexport const email = svg`<svg focusable=\"false\" aria-hidden=\"true\" viewBox=\"0 0 24 24\" data-testid=\"EmailIcon\"><path d=\"M20 4H4c-1.1 0-1.99.9-1.99 2L2 18c0 1.1.9 2 2 2h16c1.1 0 2-.9 2-2V6c0-1.1-.9-2-2-2zm0 4-8 5-8-5V6l8 5 8-5v2z\"></path></svg>`;\n\nexport const cutomerSupport = svg`<svg focusable=\"false\" aria-hidden=\"true\" viewBox=\"0 0 24 24\"><path d=\"M22.83 12.45L20.83 9.45C20.8139 9.424 20.788 9.404 20.768 9.38C20.74 9.345 20.7129 9.311 20.681 9.281C20.596 9.2 20.503 9.128 20.4 9.08L16.7099 7.48C16.2599 7.83 15.48 8.33 14.38 8.66L17.327 9.934L12 11.932L6.69395 9.942L9.66995 8.68C8.56995 8.35 7.77995 7.86 7.31995 7.5L3.60995 9.08C3.60495 9.082 3.60095 9.086 3.59595 9.088C3.57895 9.096 3.56595 9.108 3.54895 9.117C3.46595 9.161 3.38995 9.215 3.32195 9.279C3.28795 9.31 3.26095 9.344 3.23195 9.38C3.21195 9.405 3.18795 9.423 3.16995 9.45L1.16995 12.45C0.99995 12.7 0.94995 13.02 1.04995 13.31C1.13995 13.6 1.35995 13.83 1.64995 13.94L2.99995 14.446V19C2.99995 19.417 3.25895 19.79 3.64895 19.937L11.649 22.937C11.762 22.979 11.8809 23 12 23C12.119 23 12.238 22.979 12.351 22.937L20.351 19.937C20.7409 19.79 21 19.417 21 19V14.516L22.3899 13.92C22.67 13.8 22.8699 13.57 22.9599 13.29C23.0399 13 23 12.69 22.83 12.45ZM3.52995 12.51L4.39295 11.216L10.4729 13.496L9.60995 14.79L3.52995 12.51ZM20.5 12.55L15.2299 14.81L13.81 13.39L19.608 11.216L20.5 12.55ZM19 18.307L12 20.932L4.99995 18.307V15.196L9.64995 16.94C9.75995 16.98 9.87995 17 9.99995 17C10.33 17 10.64 16.84 10.83 16.55L12.16 14.57L14.29 16.71C14.58 17 15.02 17.08 15.39 16.92L19 15.373V18.307ZM12 7.004C9.65195 7.004 8.42395 5.838 8.29195 5.705C7.90195 5.313 7.90295 4.681 8.29495 4.291C8.68295 3.905 9.30895 3.902 9.69895 4.284C9.74895 4.33 10.503 5.004 12 5.004C13.518 5.004 14.271 4.312 14.303 4.283C14.7 3.909 15.331 3.918 15.711 4.309C16.091 4.701 16.094 5.319 15.709 5.705C15.5759 5.838 14.3479 7.004 12 7.004ZM9.99995 1C9.73473 1 9.48038 1.10536 9.29284 1.29289C9.10531 1.48043 8.99995 1.73478 8.99995 2C8.99995 2.26522 9.10531 2.51957 9.29284 2.70711C9.48038 2.89464 9.73473 3 9.99995 3C10.2652 3 10.5195 2.89464 10.7071 2.70711C10.8946 2.51957 11 2.26522 11 2C11 1.73478 10.8946 1.48043 10.7071 1.29289C10.5195 1.10536 10.2652 1 9.99995 1ZM14 1C13.7347 1 13.4804 1.10536 13.2928 1.29289C13.1053 1.48043 13 1.73478 13 2C13 2.26522 13.1053 2.51957 13.2928 2.70711C13.4804 2.89464 13.7347 3 14 3C14.2652 3 14.5195 2.89464 14.7071 2.70711C14.8946 2.51957 15 2.26522 15 2C15 1.73478 14.8946 1.48043 14.7071 1.29289C14.5195 1.10536 14.2652 1 14 1Z\"></path></svg>`;\n\nexport const users = svg`<svg focusable=\"false\" aria-hidden=\"true\" viewBox=\"0 0 24 24\"><path d=\"M3 3C1.897 3 1 3.897 1 5V21H11V19H3V5H13V12C13 10.37 13.792 8.93544 15 8.02344V5C15 3.897 14.103 3 13 3H3ZM5 7V9H7V7H5ZM9 7V9H11V7H9ZM18 9C16.318 9 15 10.317 15 12C15 13.683 16.318 15 18 15C19.682 15 21 13.683 21 12C21 10.317 19.682 9 18 9ZM5 11V13H7V11H5ZM9 11V13H11V11H9ZM18 11C18.58 11 19 11.421 19 12C19 12.579 18.58 13 18 13C17.42 13 17 12.579 17 12C17 11.421 17.42 11 18 11ZM5 15V17H7V15H5ZM9 15V17H11V15H9ZM18 16C15.149 16 13 17.4558 13 19.3848V21H23V19.3848C23 17.4558 20.851 16 18 16ZM18 18C19.47 18 20.4895 18.504 20.8535 19H15.1465C15.5095 18.504 16.53 18 18 18Z\" fill=\"url(#paint0_linear_10193_72013)\"></path><defs><linearGradient id=\"paint0_linear_10193_72013\" x1=\"12\" y1=\"3\" x2=\"12\" y2=\"21\" gradientUnits=\"userSpaceOnUse\"><stop stop-color=\"#1459E4\"></stop><stop offset=\"1\" stop-color=\"#0C2295\"></stop></linearGradient></defs></svg>`;\n\nexport const mySites = svg`<svg class=\"MuiSvgIcon-root MuiSvgIcon-fontSizeMedium css-vubbuv\" focusable=\"false\" aria-hidden=\"true\" viewBox=\"0 0 24 24\"><g clip-path=\"url(#clip0_10193_72029)\"><path d=\"M20.5 0C18.291 0 16.5 1.791 16.5 4C16.5 6.857 20.5 11 20.5 11C20.5 11 24.5 6.857 24.5 4C24.5 1.791 22.709 0 20.5 0ZM12.5 2C6.986 2 2.5 6.486 2.5 12C2.5 17.514 6.986 22 12.5 22C18.014 22 22.5 17.514 22.5 12C22.5 11.93 22.4912 11.862 22.4902 11.793C22.2532 12.059 22.0575 12.2677 21.9395 12.3887L20.1504 14.3047C19.9484 14.9657 19.6695 15.5919 19.3145 16.1699C18.9985 15.4819 18.306 15 17.5 15H16.5V13C16.5 12.447 16.052 12 15.5 12H9.5V10H10.5C11.052 10 11.5 9.553 11.5 9V7.02344L13.5156 7.00781C14.0986 7.00381 14.6175 6.74289 14.9805 6.33789C14.8145 5.89389 14.6875 5.445 14.6035 5L10.4922 5.03125C9.94319 5.03525 9.5 5.48225 9.5 6.03125V8H8.5C7.948 8 7.5 8.447 7.5 9V10.1855L5.48047 8.16797C6.84047 5.68697 9.477 4 12.5 4H14.5C14.5 3.397 14.5908 2.81658 14.7578 2.26758C14.0308 2.09858 13.277 2 12.5 2ZM20.5 2.57031C21.289 2.57031 21.9297 3.211 21.9297 4C21.9297 4.789 21.289 5.42969 20.5 5.42969C19.711 5.42969 19.0703 4.789 19.0703 4C19.0703 3.211 19.711 2.57031 20.5 2.57031ZM4.70703 10.2207L9.5 15.0137V16C9.5 17.103 10.397 18 11.5 18V19.9316C7.56 19.4366 4.5 16.072 4.5 12C4.5 11.388 4.57603 10.7947 4.70703 10.2207ZM11.2793 14H14.5V16C14.5 16.553 14.948 17 15.5 17H17.5V18.2344C16.375 19.1384 15.002 19.7417 13.5 19.9297V17C13.5 16.447 13.052 16 12.5 16H11.5V14.5996C11.5 14.3776 11.4123 14.174 11.2793 14Z\" fill=\"url(#paint0_linear_10193_72029)\"></path></g><defs><linearGradient id=\"paint0_linear_10193_72029\" x1=\"13.5\" y1=\"0\" x2=\"13.5\" y2=\"22\" gradientUnits=\"userSpaceOnUse\"><stop stop-color=\"#1459E4\"></stop><stop offset=\"1\" stop-color=\"#0C2295\"></stop></linearGradient><clipPath id=\"clip0_10193_72029\"><rect width=\"24\" height=\"24\" fill=\"white\" transform=\"translate(0.5)\"></rect></clipPath></defs></svg>`;\n\nexport const dcim = svg`<svg class=\"MuiSvgIcon-root MuiSvgIcon-fontSizeMedium css-vubbuv\" focusable=\"false\" aria-hidden=\"true\" viewBox=\"0 0 24 24\"><g clip-path=\"url(#clip0_10193_72036)\"><path d=\"M6.5 2C5.395 2 4.5 2.895 4.5 4V20C4.5 21.105 5.395 22 6.5 22H14.8438C14.1128 21.487 13.5155 20.8 13.1055 20H6.5V16H12.7129C12.9229 15.258 13.2798 14.578 13.7578 14H6.5V10H18.5V12.0254C19.216 12.0904 19.89 12.2935 20.5 12.6055V4C20.5 2.895 19.605 2 18.5 2H6.5ZM6.5 4H18.5V8H6.5V4ZM18 14C16.067 14 14.5 15.567 14.5 17.5C14.5 19.433 16.067 21 18 21C18.465 21 18.9065 20.9052 19.3125 20.7402L22.5723 24H24.5V22.0723L21.2402 18.8125C21.4042 18.4065 21.5 17.965 21.5 17.5C21.5 15.567 19.933 14 18 14ZM17.5 16C18.052 16 18.5 16.448 18.5 17C18.5 17.552 18.052 18 17.5 18C16.948 18 16.5 17.552 16.5 17C16.5 16.448 16.948 16 17.5 16Z\" fill=\"url(#paint0_linear_10193_72036)\"></path></g><defs><linearGradient id=\"paint0_linear_10193_72036\" x1=\"14.5\" y1=\"2\" x2=\"14.5\" y2=\"24\" gradientUnits=\"userSpaceOnUse\"><stop stop-color=\"#1459E4\"></stop><stop offset=\"1\" stop-color=\"#0C2295\"></stop></linearGradient><clipPath id=\"clip0_10193_72036\"><rect width=\"24\" height=\"24\" fill=\"white\" transform=\"translate(0.5)\"></rect></clipPath></defs></svg>`;\n\nexport const locations = svg`<svg class=\"MuiSvgIcon-root MuiSvgIcon-fontSizeMedium css-vubbuv\" focusable=\"false\" aria-hidden=\"true\" viewBox=\"0 0 24 24\"><g clip-path=\"url(#clip0_10193_72043)\"><path d=\"M11.7222 1.00195C6.94623 0.939955 2.64861 3.82933 0.581605 8.61133C0.473605 8.86233 0.472652 9.14644 0.579652 9.39844C2.48665 13.8934 6.16157 16.6777 10.4996 16.9707V14.9434C7.11557 14.6564 4.21428 12.5067 2.59528 9.01172C4.39028 5.22372 7.85307 2.95295 11.6871 3.00195C15.3911 3.06895 18.4997 5.28789 20.0777 8.96289C19.9057 9.32689 19.7093 9.664 19.5093 10H21.7925C21.8925 9.795 21.9926 9.59091 22.0836 9.37891C22.1876 9.13791 22.1922 8.86414 22.0972 8.61914C20.2972 4.00414 16.3232 1.08595 11.7222 1.00195ZM11.4996 5C9.29057 5 7.49957 6.791 7.49957 9C7.49957 10.862 8.77757 12.4124 10.4996 12.8594V10H15.3589C15.4419 9.679 15.4996 9.347 15.4996 9C15.4996 6.791 13.7086 5 11.4996 5ZM12.4996 12V13V24H24.4996V12H12.4996ZM14.4996 14H22.0855L18.4996 17.5859L17.2066 16.293L15.7925 17.707L18.4996 20.4141L22.4996 16.4141V22H14.4996V14Z\" fill=\"url(#paint0_linear_10193_72043)\"></path></g><defs><linearGradient id=\"paint0_linear_10193_72043\" x1=\"12.4998\" y1=\"1.00098\" x2=\"12.4998\" y2=\"24\" gradientUnits=\"userSpaceOnUse\"><stop stop-color=\"#1459E4\"></stop><stop offset=\"1\" stop-color=\"#0C2295\"></stop></linearGradient><clipPath id=\"clip0_10193_72043\"><rect width=\"24\" height=\"24\" fill=\"white\" transform=\"translate(0.5)\"></rect></clipPath></defs></svg>`;\n\nexport const lock = svg`<svg class=\"MuiSvgIcon-root MuiSvgIcon-fontSizeMedium css-vubbuv\" focusable=\"false\" aria-hidden=\"true\" viewBox=\"0 0 24 24\"><path d=\"M12 1C9.12778 1 6.71891 3.04615 6.12305 5.78711L8.07812 6.21289C8.48226 4.35385 10.0722 3 12 3C14.2762 3 16 4.72381 16 7V8H6C4.90694 8 4 8.90694 4 10V20C4 21.0931 4.90694 22 6 22H18C19.0931 22 20 21.0931 20 20V10C20 8.90694 19.0931 8 18 8V7C18 3.67619 15.3238 1 12 1ZM6 10H18V20H6V10ZM12 13C10.9 13 10 13.9 10 15C10 16.1 10.9 17 12 17C13.1 17 14 16.1 14 15C14 13.9 13.1 13 12 13Z\"></path></svg>`;\n\nexport const remoteHands = svg`<svg class=\"MuiSvgIcon-root MuiSvgIcon-fontSizeMedium css-vubbuv\" focusable=\"false\" aria-hidden=\"true\" viewBox=\"0 0 24 24\"><path d=\"M13 2C12.529 2 12.1357 2.36008 12.0977 2.83008L12.082 3.01953C12.0793 3.05251 12.093 3.08098 12.0938 3.11328C11.3101 3.29551 10.6196 3.70573 10.0879 4.27344C10.06 4.2564 10.0421 4.22909 10.0117 4.21484L9.8418 4.13477C9.4158 3.93377 8.90592 4.092 8.66992 4.5C8.43392 4.908 8.5505 5.42731 8.9375 5.69531L9.09375 5.80469C9.12369 5.82543 9.15813 5.82904 9.18945 5.8457C9.07799 6.21341 9 6.59591 9 7C9 7.40409 9.07799 7.78659 9.18945 8.1543C9.15813 8.17095 9.12369 8.17457 9.09375 8.19531L8.9375 8.30273C8.5505 8.57173 8.43392 9.092 8.66992 9.5C8.90592 9.908 9.4158 10.0662 9.8418 9.86523L10.0117 9.78516C10.042 9.77089 10.06 9.74359 10.0879 9.72656C10.6191 10.2938 11.3089 10.7043 12.0918 10.8867C12.091 10.919 12.0774 10.9475 12.0801 10.9805L12.0977 11.1699C12.1367 11.6399 12.529 12 13 12C13.471 12 13.8643 11.6399 13.9023 11.1699L13.918 10.9805C13.9207 10.9475 13.907 10.919 13.9062 10.8867C14.6899 10.7045 15.3804 10.2943 15.9121 9.72656C15.94 9.74366 15.9579 9.77084 15.9883 9.78516L16.1582 9.86719C16.5842 10.0682 17.0941 9.90995 17.3301 9.50195C17.5661 9.09395 17.4495 8.57369 17.0625 8.30469L16.9062 8.19531C16.8763 8.17457 16.8419 8.17096 16.8105 8.1543C16.922 7.78659 17 7.40409 17 7C17 6.59591 16.922 6.21341 16.8105 5.8457C16.8419 5.82905 16.8763 5.82543 16.9062 5.80469L17.0625 5.69727C17.4495 5.42827 17.5661 4.908 17.3301 4.5C17.0941 4.092 16.5842 3.93377 16.1582 4.13477L15.9883 4.21484C15.958 4.22911 15.94 4.25641 15.9121 4.27344C15.3809 3.70617 14.6911 3.29573 13.9082 3.11328C13.909 3.08098 13.9226 3.05251 13.9199 3.01953L13.9023 2.83008C13.8633 2.36008 13.471 2 13 2ZM13 5.5C13.828 5.5 14.5 6.172 14.5 7C14.5 7.828 13.828 8.5 13 8.5C12.172 8.5 11.5 7.828 11.5 7C11.5 6.172 12.172 5.5 13 5.5ZM20.5859 12C20.2239 12 19.8619 12.1381 19.5859 12.4141L15 17H11C10.724 17 10.5 16.776 10.5 16.5C10.5 16.224 10.724 16 11 16H13C14.105 16 15 15.105 15 14V13H8.65625C7.59525 13 6.57812 13.4209 5.82812 14.1719L2 18L6 22L8 20H15.1719C15.7019 20 16.2109 19.7891 16.5859 19.4141L21.5859 14.4141C22.1379 13.8621 22.1379 12.9661 21.5859 12.4141C21.3099 12.1381 20.9479 12 20.5859 12Z\"></path></svg>`;\n\nexport const shipping = svg`<svg class=\"MuiSvgIcon-root MuiSvgIcon-fontSizeMedium css-vubbuv\" focusable=\"false\" aria-hidden=\"true\" viewBox=\"0 0 24 24\"><path d=\"M0 5V7H14V11V13V16H8.2207C7.67163 15.3907 6.88492 15 6 15C5.11508 15 4.32837 15.3907 3.7793 16H3V15L5 13H1V18H3C3 19.657 4.343 21 6 21C7.657 21 9 19.657 9 18H15C15 19.657 16.343 21 18 21C19.657 21 21 19.657 21 18H22H23V13L20.2754 7.55273C20.1064 7.21373 19.7618 7 19.3828 7H16V5H0ZM1 9V11H8V9H1ZM16 9H18.7637L19.7637 11H16V9ZM16 13H20.7637L21 13.4727V16H20.2207C19.6716 15.3907 18.8849 15 18 15C17.2279 15 16.5316 15.3002 16 15.7793V13ZM6 16.75C6.689 16.75 7.25 17.311 7.25 18C7.25 18.689 6.689 19.25 6 19.25C5.311 19.25 4.75 18.689 4.75 18C4.75 17.311 5.311 16.75 6 16.75ZM18 16.75C18.689 16.75 19.25 17.311 19.25 18C19.25 18.689 18.689 19.25 18 19.25C17.311 19.25 16.75 18.689 16.75 18C16.75 17.311 17.311 16.75 18 16.75Z\"></path></svg>`;\n\nexport const addUser = svg`<svg class=\"MuiSvgIcon-root MuiSvgIcon-fontSizeMedium css-vubbuv\" focusable=\"false\" aria-hidden=\"true\" viewBox=\"0 0 24 24\" data-testid=\"PersonAddIcon\"><path d=\"M15 12c2.21 0 4-1.79 4-4s-1.79-4-4-4-4 1.79-4 4 1.79 4 4 4zm-9-2V7H4v3H1v2h3v3h2v-3h3v-2H6zm9 4c-2.67 0-8 1.34-8 4v2h16v-2c0-2.66-5.33-4-8-4z\"></path></svg>`;\n\nexport const manageUsers = svg`<svg class=\"MuiSvgIcon-root MuiSvgIcon-fontSizeMedium css-vubbuv\" focusable=\"false\" aria-hidden=\"true\" viewBox=\"0 0 24 24\"><path d=\"M3 3C1.897 3 1 3.897 1 5V21H11V19H3V5H13V12C13 10.37 13.792 8.93544 15 8.02344V5C15 3.897 14.103 3 13 3H3ZM5 7V9H7V7H5ZM9 7V9H11V7H9ZM18 9C16.318 9 15 10.317 15 12C15 13.683 16.318 15 18 15C19.682 15 21 13.683 21 12C21 10.317 19.682 9 18 9ZM5 11V13H7V11H5ZM9 11V13H11V11H9ZM18 11C18.58 11 19 11.421 19 12C19 12.579 18.58 13 18 13C17.42 13 17 12.579 17 12C17 11.421 17.42 11 18 11ZM5 15V17H7V15H5ZM9 15V17H11V15H9ZM18 16C15.149 16 13 17.4558 13 19.3848V21H23V19.3848C23 17.4558 20.851 16 18 16ZM18 18C19.47 18 20.4895 18.504 20.8535 19H15.1465C15.5095 18.504 16.53 18 18 18Z\"></path></svg>`;\n"]}
package/dist/ix-launchpad.js CHANGED
@@ -57,123 +57,110 @@ let IxLaunchpad = class IxLaunchpad extends LitElement {
57
57
  render() {
58
58
  var _a, _b, _c, _d;
59
59
  return html `
60
- <div class="outer">
61
- <main>
62
- <div class="inner">
63
- <header>
64
- <div>
65
- <h1>Launchpad</h1>
66
- </div>
67
- </header>
68
- <section>
69
- <div class="container">
70
- <div class="content">
71
- <ix-status-counter-group
72
- .data=${this.data.statusData}
73
- ></ix-status-counter-group>
60
+ <main class="wrapper">
61
+ <section>
62
+ <div class="container">
63
+ <div class="content">
64
+ <ix-status-counter-group
65
+ .data=${this.data.statusData}
66
+ ></ix-status-counter-group>
74
67
 
75
- <ix-table-data
76
- .columns=${this.data.columns}
77
- .rows=${this.data.contacts}
78
- header="Ticket Updates"
79
- >
80
- </ix-table-data>
68
+ <ix-table-data
69
+ .columns=${this.data.columns}
70
+ .rows=${this.data.contacts}
71
+ header="Ticket Updates"
72
+ >
73
+ </ix-table-data>
81
74
 
82
- <ix-action-list></ix-action-list>
75
+ <ix-action-list></ix-action-list>
83
76
 
84
- <nav>
85
- <ix-nav-list .header="${this.data.nav.header}">
86
- ${this.data.nav.items.map((i) => html `<ix-nav-item .icon=${i === null || i === void 0 ? void 0 : i.icon}
87
- >${i.name}</ix-nav-item
88
- >`)}
89
- </ix-nav-list>
90
- <ix-nav-list .header="${(_a = this.data.nav2) === null || _a === void 0 ? void 0 : _a.header}">
91
- ${(_b = this.data.nav2) === null || _b === void 0 ? void 0 : _b.items.map((i) => html `<ix-nav-item .icon=${i === null || i === void 0 ? void 0 : i.icon}
92
- >${i.name}</ix-nav-item
93
- >`)}
94
- </ix-nav-list>
95
- </nav>
77
+ <nav>
78
+ <ix-nav-list .header="${this.data.nav.header}">
79
+ ${this.data.nav.items.map((i) => html `<ix-nav-item .icon=${i === null || i === void 0 ? void 0 : i.icon}
80
+ >${i.name}</ix-nav-item
81
+ >`)}
82
+ </ix-nav-list>
83
+ <ix-nav-list .header="${(_a = this.data.nav2) === null || _a === void 0 ? void 0 : _a.header}">
84
+ ${(_b = this.data.nav2) === null || _b === void 0 ? void 0 : _b.items.map((i) => html `<ix-nav-item .icon=${i === null || i === void 0 ? void 0 : i.icon}
85
+ >${i.name}</ix-nav-item
86
+ >`)}
87
+ </ix-nav-list>
88
+ </nav>
96
89
 
97
- <ix-news-feed
98
- header="What's New"
99
- .data=${this.data.pageProps.pageProps.whatsNews}
100
- ></ix-news-feed>
90
+ <ix-news-feed
91
+ header="What's New"
92
+ .data=${this.data.pageProps.pageProps.whatsNews}
93
+ ></ix-news-feed>
101
94
 
102
- <div class="news-info">
103
- <h2>Resources</h2>
104
- <div class="resources">
105
- ${this.data.pageProps.pageProps.resources.map((item) => {
95
+ <div class="news-info">
96
+ <h2>Resources</h2>
97
+ <div class="resources">
98
+ ${this.data.pageProps.pageProps.resources.map((item) => {
106
99
  var _a, _b;
107
100
  return html ` <ix-info-card type="info-card-2"
108
- ><img
109
- slot="image"
110
- name="image"
111
- alt="${item.thumbnail.alternativeText}"
112
- src="${`${imgServer}${encodeURIComponent(item.thumbnail.url)}&w=3840&q=75`}"
113
- />
114
- <div slot="label">${(_b = (_a = item.topics) === null || _a === void 0 ? void 0 : _a[0]) === null || _b === void 0 ? void 0 : _b.name}</div>
115
- <div slot="title">${item.title}</div>
116
- <ix-button
117
- slot="cta"
118
- type="button"
119
- has-icon
120
- trailing-icon
121
- appearance="text"
122
- >
123
- <ix-icon slot="icon">chevron_right</ix-icon>
124
- Learn more
125
- </ix-button>
126
- </ix-info-card>`;
101
+ ><img
102
+ slot="image"
103
+ name="image"
104
+ alt="${item.thumbnail.alternativeText}"
105
+ src="${`${imgServer}${encodeURIComponent(item.thumbnail.url)}&w=3840&q=75`}"
106
+ />
107
+ <div slot="label">${(_b = (_a = item.topics) === null || _a === void 0 ? void 0 : _a[0]) === null || _b === void 0 ? void 0 : _b.name}</div>
108
+ <div slot="title">${item.title}</div>
109
+ <ix-button
110
+ slot="cta"
111
+ type="button"
112
+ has-icon
113
+ trailing-icon
114
+ appearance="text"
115
+ >
116
+ <ix-icon slot="icon">chevron_right</ix-icon>
117
+ Learn more
118
+ </ix-button>
119
+ </ix-info-card>`;
127
120
  })}
128
- </div>
129
-
130
- <h2 class="">News &amp; Promotions</h2>
131
- <div class="newsAndPromotions">
132
- ${this.data.pageProps.pageProps.newsAndPromotions.map((item) => html ` <ix-info-card type="info-card">
133
- <img
134
- slot="image"
135
- name="image"
136
- alt="${item.thumbnail.alternativeText}"
137
- src="${`${imgServer}${encodeURIComponent(item.thumbnail.url)}&w=3840&q=75`}"
138
- />
139
- <div slot="title">${item.title}</div>
140
- <div slot="description">${item.abstract}</div>
141
- <ix-button
142
- slot="cta"
143
- type="button"
144
- has-icon
145
- trailing-icon
146
- appearance="text"
147
- >
148
- <ix-icon slot="icon">chevron_right</ix-icon>
149
- Learn more
150
- </ix-button>
151
- </ix-info-card>`)}
152
- </div>
153
- </div>
121
+ </div>
154
122
 
155
- <ix-contacts
156
- phonenumbers=${this.data.pageProps.pageProps.contactInfo
157
- .attributes.phoneNumbers}
158
- ></ix-contacts>
123
+ <h2 class="">News &amp; Promotions</h2>
124
+ <div class="newsAndPromotions">
125
+ ${this.data.pageProps.pageProps.newsAndPromotions.map((item) => html ` <ix-info-card type="info-card">
126
+ <img
127
+ slot="image"
128
+ name="image"
129
+ alt="${item.thumbnail.alternativeText}"
130
+ src="${`${imgServer}${encodeURIComponent(item.thumbnail.url)}&w=3840&q=75`}"
131
+ />
132
+ <div slot="title">${item.title}</div>
133
+ <div slot="description">${item.abstract}</div>
134
+ <ix-button
135
+ slot="cta"
136
+ type="button"
137
+ has-icon
138
+ trailing-icon
139
+ appearance="text"
140
+ >
141
+ <ix-icon slot="icon">chevron_right</ix-icon>
142
+ Learn more
143
+ </ix-button>
144
+ </ix-info-card>`)}
159
145
  </div>
160
- <nav>
161
- <ix-nav-list .header="${this.data.nav.header}">
162
- ${this.data.nav.items.map((i) => html `<ix-nav-item .icon=${i === null || i === void 0 ? void 0 : i.icon}
163
- >${i.name}</ix-nav-item
164
- >`)}
165
- </ix-nav-list>
166
- <ix-nav-list .header="${(_c = this.data.nav2) === null || _c === void 0 ? void 0 : _c.header}">
167
- ${(_d = this.data.nav2) === null || _d === void 0 ? void 0 : _d.items.map((i) => html `<ix-nav-item .icon=${i === null || i === void 0 ? void 0 : i.icon}
168
- >${i.name}</ix-nav-item
169
- >`)}
170
- </ix-nav-list>
171
- </nav>
172
146
  </div>
173
- </section>
147
+
148
+ <ix-contacts
149
+ phonenumbers=${this.data.pageProps.pageProps.contactInfo
150
+ .attributes.phoneNumbers}
151
+ ></ix-contacts>
152
+ </div>
153
+ <nav class="side-nav">
154
+ <ix-nav-list .header="${this.data.nav.header}">
155
+ ${this.data.nav.items.map((i) => html `<ix-nav-item .icon=${i === null || i === void 0 ? void 0 : i.icon}>${i.name}</ix-nav-item>`)}
156
+ </ix-nav-list>
157
+ <ix-nav-list .header="${(_c = this.data.nav2) === null || _c === void 0 ? void 0 : _c.header}">
158
+ ${(_d = this.data.nav2) === null || _d === void 0 ? void 0 : _d.items.map((i) => html `<ix-nav-item .icon=${i === null || i === void 0 ? void 0 : i.icon}>${i.name}</ix-nav-item>`)}
159
+ </ix-nav-list>
160
+ </nav>
174
161
  </div>
175
- </main>
176
- </div>
162
+ </section>
163
+ </main>
177
164
  `;
178
165
  }
179
166
  };
package/dist/ix-launchpad.js.map CHANGED
@@ -1 +1 @@
1
- {"version":3,"file":"ix-launchpad.js","sourceRoot":"","sources":["../src/ix-launchpad.ts"],"names":[],"mappings":"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","sourcesContent":["import { html, LitElement } from 'lit';\nimport { customElement, property } from 'lit/decorators.js';\nimport './ix-status-counter-group.js';\nimport './ix-action-list.js';\nimport './ix-contacts.js';\nimport './ix-info-card.js';\nimport './ix-news-feed.js';\nimport './ix-table-data.js';\nimport './ix-nav-item.js';\nimport './ix-nav-list.js';\nimport { IxLaunchpadStyles } from './styles/launchpad-styles.js';\nimport { statusData, pageProps } from './assets/data.js';\nimport { columns } from './assets/columns.js';\nimport { contacts } from './assets/contacts.js';\n\nconst imgServer =\n 'https://gp-tst.digitalrealty.com/_next/image?url=https%3A%2F%2Ftst-cms-strapi.digitalrealtytrust.com';\n\n@customElement('ix-launchpad')\nexport class IxLaunchpad extends LitElement {\n static styles = [IxLaunchpadStyles];\n\n @property({ type: Object }) data: any = {\n statusData,\n columns,\n contacts,\n nav: {\n header: 'Service tickets',\n items: [\n { name: 'Customer Support', icon: 'cutomerSupport' },\n { name: 'Facility Access', icon: 'lock' },\n { name: 'Remote Hands', icon: 'remoteHands' },\n { name: 'Shipping and Receiving', icon: 'shipping' },\n ],\n },\n nav2: {\n header: 'USER MANAGEMENT',\n items: [\n { name: 'Add user', icon: 'addUser' },\n { name: 'Manage users', icon: 'manageUsers' },\n ],\n },\n pageProps,\n };\n\n /* fetchData() {\n fetch('./data.json')\n .then(response => response.json())\n .then(data => {\n setTimeout(() => {\n console.log(data);\n }, 2000);\n });\n }\n\n connectedCallback() {\n super.connectedCallback();\n this.fetchData();\n } */\n\n protected override render() {\n return html`\n <div class=\"outer\">\n <main>\n <div class=\"inner\">\n <header>\n <div>\n <h1>Launchpad</h1>\n </div>\n </header>\n <section>\n <div class=\"container\">\n <div class=\"content\">\n <ix-status-counter-group\n .data=${this.data.statusData}\n ></ix-status-counter-group>\n\n <ix-table-data\n .columns=${this.data.columns}\n .rows=${this.data.contacts}\n header=\"Ticket Updates\"\n >\n </ix-table-data>\n\n <ix-action-list></ix-action-list>\n\n <nav>\n <ix-nav-list .header=\"${this.data.nav.header}\">\n ${this.data.nav.items.map(\n (i: any) =>\n html`<ix-nav-item .icon=${i?.icon}\n >${i.name}</ix-nav-item\n >`\n )}\n </ix-nav-list>\n <ix-nav-list .header=\"${this.data.nav2?.header}\">\n ${this.data.nav2?.items.map(\n (i: any) =>\n html`<ix-nav-item .icon=${i?.icon}\n >${i.name}</ix-nav-item\n >`\n )}\n </ix-nav-list>\n </nav>\n\n <ix-news-feed\n header=\"What's New\"\n .data=${this.data.pageProps.pageProps.whatsNews}\n ></ix-news-feed>\n\n <div class=\"news-info\">\n <h2>Resources</h2>\n <div class=\"resources\">\n ${this.data.pageProps.pageProps.resources.map(\n (item: any) => html` <ix-info-card type=\"info-card-2\"\n ><img\n slot=\"image\"\n name=\"image\"\n alt=\"${item.thumbnail.alternativeText}\"\n src=\"${`${imgServer}${encodeURIComponent(\n item.thumbnail.url\n )}&w=3840&q=75`}\"\n />\n <div slot=\"label\">${item.topics?.[0]?.name}</div>\n <div slot=\"title\">${item.title}</div>\n <ix-button\n slot=\"cta\"\n type=\"button\"\n has-icon\n trailing-icon\n appearance=\"text\"\n >\n <ix-icon slot=\"icon\">chevron_right</ix-icon>\n Learn more\n </ix-button>\n </ix-info-card>`\n )}\n </div>\n\n <h2 class=\"\">News &amp; Promotions</h2>\n <div class=\"newsAndPromotions\">\n ${this.data.pageProps.pageProps.newsAndPromotions.map(\n (item: any) => html` <ix-info-card type=\"info-card\">\n <img\n slot=\"image\"\n name=\"image\"\n alt=\"${item.thumbnail.alternativeText}\"\n src=\"${`${imgServer}${encodeURIComponent(\n item.thumbnail.url\n )}&w=3840&q=75`}\"\n />\n <div slot=\"title\">${item.title}</div>\n <div slot=\"description\">${item.abstract}</div>\n <ix-button\n slot=\"cta\"\n type=\"button\"\n has-icon\n trailing-icon\n appearance=\"text\"\n >\n <ix-icon slot=\"icon\">chevron_right</ix-icon>\n Learn more\n </ix-button>\n </ix-info-card>`\n )}\n </div>\n </div>\n\n <ix-contacts\n phonenumbers=${this.data.pageProps.pageProps.contactInfo\n .attributes.phoneNumbers}\n ></ix-contacts>\n </div>\n <nav>\n <ix-nav-list .header=\"${this.data.nav.header}\">\n ${this.data.nav.items.map(\n (i: any) =>\n html`<ix-nav-item .icon=${i?.icon}\n >${i.name}</ix-nav-item\n >`\n )}\n </ix-nav-list>\n <ix-nav-list .header=\"${this.data.nav2?.header}\">\n ${this.data.nav2?.items.map(\n (i: any) =>\n html`<ix-nav-item .icon=${i?.icon}\n >${i.name}</ix-nav-item\n >`\n )}\n </ix-nav-list>\n </nav>\n </div>\n </section>\n </div>\n </main>\n </div>\n `;\n }\n}\n"]}
1
+ {"version":3,"file":"ix-launchpad.js","sourceRoot":"","sources":["../src/ix-launchpad.ts"],"names":[],"mappings":"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","sourcesContent":["import { html, LitElement } from 'lit';\nimport { customElement, property } from 'lit/decorators.js';\nimport './ix-status-counter-group.js';\nimport './ix-action-list.js';\nimport './ix-contacts.js';\nimport './ix-info-card.js';\nimport './ix-news-feed.js';\nimport './ix-table-data.js';\nimport './ix-nav-item.js';\nimport './ix-nav-list.js';\nimport { IxLaunchpadStyles } from './styles/launchpad-styles.js';\nimport { statusData, pageProps } from './assets/data.js';\nimport { columns } from './assets/columns.js';\nimport { contacts } from './assets/contacts.js';\n\nconst imgServer =\n 'https://gp-tst.digitalrealty.com/_next/image?url=https%3A%2F%2Ftst-cms-strapi.digitalrealtytrust.com';\n\n@customElement('ix-launchpad')\nexport class IxLaunchpad extends LitElement {\n static styles = [IxLaunchpadStyles];\n\n @property({ type: Object }) data: any = {\n statusData,\n columns,\n contacts,\n nav: {\n header: 'Service tickets',\n items: [\n { name: 'Customer Support', icon: 'cutomerSupport' },\n { name: 'Facility Access', icon: 'lock' },\n { name: 'Remote Hands', icon: 'remoteHands' },\n { name: 'Shipping and Receiving', icon: 'shipping' },\n ],\n },\n nav2: {\n header: 'USER MANAGEMENT',\n items: [\n { name: 'Add user', icon: 'addUser' },\n { name: 'Manage users', icon: 'manageUsers' },\n ],\n },\n pageProps,\n };\n\n /* fetchData() {\n fetch('./data.json')\n .then(response => response.json())\n .then(data => {\n setTimeout(() => {\n console.log(data);\n }, 2000);\n });\n }\n\n connectedCallback() {\n super.connectedCallback();\n this.fetchData();\n } */\n\n protected override render() {\n return html`\n <main class=\"wrapper\">\n <section>\n <div class=\"container\">\n <div class=\"content\">\n <ix-status-counter-group\n .data=${this.data.statusData}\n ></ix-status-counter-group>\n\n <ix-table-data\n .columns=${this.data.columns}\n .rows=${this.data.contacts}\n header=\"Ticket Updates\"\n >\n </ix-table-data>\n\n <ix-action-list></ix-action-list>\n\n <nav>\n <ix-nav-list .header=\"${this.data.nav.header}\">\n ${this.data.nav.items.map(\n (i: any) =>\n html`<ix-nav-item .icon=${i?.icon}\n >${i.name}</ix-nav-item\n >`\n )}\n </ix-nav-list>\n <ix-nav-list .header=\"${this.data.nav2?.header}\">\n ${this.data.nav2?.items.map(\n (i: any) =>\n html`<ix-nav-item .icon=${i?.icon}\n >${i.name}</ix-nav-item\n >`\n )}\n </ix-nav-list>\n </nav>\n\n <ix-news-feed\n header=\"What's New\"\n .data=${this.data.pageProps.pageProps.whatsNews}\n ></ix-news-feed>\n\n <div class=\"news-info\">\n <h2>Resources</h2>\n <div class=\"resources\">\n ${this.data.pageProps.pageProps.resources.map(\n (item: any) => html` <ix-info-card type=\"info-card-2\"\n ><img\n slot=\"image\"\n name=\"image\"\n alt=\"${item.thumbnail.alternativeText}\"\n src=\"${`${imgServer}${encodeURIComponent(\n item.thumbnail.url\n )}&w=3840&q=75`}\"\n />\n <div slot=\"label\">${item.topics?.[0]?.name}</div>\n <div slot=\"title\">${item.title}</div>\n <ix-button\n slot=\"cta\"\n type=\"button\"\n has-icon\n trailing-icon\n appearance=\"text\"\n >\n <ix-icon slot=\"icon\">chevron_right</ix-icon>\n Learn more\n </ix-button>\n </ix-info-card>`\n )}\n </div>\n\n <h2 class=\"\">News &amp; Promotions</h2>\n <div class=\"newsAndPromotions\">\n ${this.data.pageProps.pageProps.newsAndPromotions.map(\n (item: any) => html` <ix-info-card type=\"info-card\">\n <img\n slot=\"image\"\n name=\"image\"\n alt=\"${item.thumbnail.alternativeText}\"\n src=\"${`${imgServer}${encodeURIComponent(\n item.thumbnail.url\n )}&w=3840&q=75`}\"\n />\n <div slot=\"title\">${item.title}</div>\n <div slot=\"description\">${item.abstract}</div>\n <ix-button\n slot=\"cta\"\n type=\"button\"\n has-icon\n trailing-icon\n appearance=\"text\"\n >\n <ix-icon slot=\"icon\">chevron_right</ix-icon>\n Learn more\n </ix-button>\n </ix-info-card>`\n )}\n </div>\n </div>\n\n <ix-contacts\n phonenumbers=${this.data.pageProps.pageProps.contactInfo\n .attributes.phoneNumbers}\n ></ix-contacts>\n </div>\n <nav class=\"side-nav\">\n <ix-nav-list .header=\"${this.data.nav.header}\">\n ${this.data.nav.items.map(\n (i: any) =>\n html`<ix-nav-item .icon=${i?.icon}>${i.name}</ix-nav-item>`\n )}\n </ix-nav-list>\n <ix-nav-list .header=\"${this.data.nav2?.header}\">\n ${this.data.nav2?.items.map(\n (i: any) =>\n html`<ix-nav-item .icon=${i?.icon}>${i.name}</ix-nav-item>`\n )}\n </ix-nav-list>\n </nav>\n </div>\n </section>\n </main>\n `;\n }\n}\n"]}
package/dist/ix-status-counter-group.js CHANGED
@@ -21,12 +21,13 @@ let IxStatusCounterGroup = class IxStatusCounterGroup extends LitElement {
21
21
  <div class="content">
22
22
  <div class="layout">
23
23
  ${this.data.map((item, index) => {
24
- const { value = 0, header = 'status', icon } = item;
24
+ const { value, header, icon, apiUrl } = item;
25
25
  return html `<ix-status-counter
26
26
  class="b${index + 1}"
27
27
  value=${value}
28
28
  header=${header}
29
29
  .icon=${iconMap[icon]}
30
+ .apiUrl=${apiUrl}
30
31
  >
31
32
  </ix-status-counter>`;
32
33
  })}
package/dist/ix-status-counter-group.js.map CHANGED
@@ -1 +1 @@
1
- {"version":3,"file":"ix-status-counter-group.js","sourceRoot":"","sources":["../src/ix-status-counter-group.ts"],"names":[],"mappings":";AAAA,OAAO,EAAE,IAAI,EAAE,UAAU,EAAE,GAAG,EAAE,MAAM,KAAK,CAAC;AAC5C,OAAO,EAAE,aAAa,EAAE,QAAQ,EAAE,MAAM,mBAAmB,CAAC;AAC5D,OAAO,eAAe,CAAC;AACvB,OAAO,wBAAwB,CAAC;AAChC,OAAO,EAAE,MAAM,EAAE,KAAK,EAAE,OAAO,EAAE,IAAI,EAAE,SAAS,EAAE,MAAM,qBAAqB,CAAC;AAE9E,MAAM,OAAO,GAAG;IACd,MAAM;IACN,KAAK;IACL,OAAO;IACP,IAAI;IACJ,SAAS;CACV,CAAC;AAGK,IAAM,oBAAoB,GAA1B,MAAM,oBAAqB,SAAQ,UAAU;IAA7C;;QAwEsB,SAAI,GAAG,EAAE,CAAC;IAoBvC,CAAC;IAlBoB,MAAM;QACvB,OAAO,IAAI,CAAA;;;YAGH,IAAI,CAAC,IAAI,CAAC,GAAG,CAAC,CAAC,IAAI,EAAE,KAAK,EAAE,EAAE;YAC9B,MAAM,EAAE,KAAK,GAAG,CAAC,EAAE,MAAM,GAAG,QAAQ,EAAE,IAAI,EAAE,GAAG,IAAI,CAAC;YACpD,OAAO,IAAI,CAAA;wBACC,KAAK,GAAG,CAAC;sBACX,KAAK;uBACJ,MAAM;sBACP,OAAO,CAAC,IAAI,CAAC;;iCAEF,CAAC;QACxB,CAAC,CAAC;;;iBAGK,CAAC;IAChB,CAAC;;AA1FM,2BAAM,GAAG,GAAG,CAAA;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;GAqElB,AArEY,CAqEX;AAEyB;IAA1B,QAAQ,CAAC,EAAE,IAAI,EAAE,KAAK,EAAE,CAAC;kDAAW;AAxE1B,oBAAoB;IADhC,aAAa,CAAC,yBAAyB,CAAC;GAC5B,oBAAoB,CA4FhC","sourcesContent":["import { html, LitElement, css } from 'lit';\nimport { customElement, property } from 'lit/decorators.js';\nimport './IxWidget.js';\nimport './ix-status-counter.js';\nimport { laptop, users, mySites, dcim, locations } from './assets/iconset.js';\n\nconst iconMap = {\n laptop,\n users,\n mySites,\n dcim,\n locations,\n};\n\n@customElement('ix-status-counter-group')\nexport class IxStatusCounterGroup extends LitElement {\n static styles = css`\n .layout {\n display: grid;\n }\n @media (min-width: 1350px) {\n .layout {\n grid-gap: 44px 32px;\n }\n .layout .b1 {\n grid-column-start: 1;\n grid-column-end: 2;\n }\n .layout .b2 {\n grid-column-start: 2;\n grid-column-end: 4;\n }\n .layout .b3 {\n grid-column-start: 4;\n grid-column-end: 6;\n }\n .layout .b4 {\n grid-column-start: 1;\n grid-column-end: 3;\n }\n .layout .b5 {\n grid-column-start: 3;\n grid-column-end: 6;\n }\n ix-status-counter {\n --ix-widget-padding: 1rem;\n }\n }\n\n @media (max-width: 1349px) {\n .layout {\n grid-gap: 0 24px;\n background: linear-gradient(\n 90deg,\n rgba(0, 0, 0, 0) calc(50% - 1px),\n rgba(9, 34, 65, 0.12) calc(50%),\n rgba(0, 0, 0, 0) calc(50% + 1px)\n );\n }\n .layout .b1 {\n grid-column-start: 1;\n grid-column-end: 2;\n grid-row-start: 1;\n }\n .layout .b2 {\n grid-column-start: 1;\n grid-column-end: 2;\n grid-row-start: 2;\n }\n .layout .b3 {\n grid-column-start: 1;\n grid-column-end: 2;\n grid-row-start: 3;\n }\n .layout .b4 {\n grid-column-start: 2;\n grid-column-end: 3;\n grid-row-start: 1;\n }\n .layout .b5 {\n grid-column-start: 2;\n grid-column-end: 3;\n grid-row-start: 2;\n }\n }\n `;\n\n @property({ type: Array }) data = [];\n\n protected override render() {\n return html`<ix-widget type=\"status-counter-group\">\n <div class=\"content\">\n <div class=\"layout\">\n ${this.data.map((item, index) => {\n const { value = 0, header = 'status', icon } = item;\n return html`<ix-status-counter\n class=\"b${index + 1}\"\n value=${value}\n header=${header}\n .icon=${iconMap[icon]}\n >\n </ix-status-counter>`;\n })}\n </div>\n </div>\n </ix-widget>`;\n }\n}\n"]}
1
+ {"version":3,"file":"ix-status-counter-group.js","sourceRoot":"","sources":["../src/ix-status-counter-group.ts"],"names":[],"mappings":";AAAA,OAAO,EAAE,IAAI,EAAE,UAAU,EAAE,GAAG,EAAE,MAAM,KAAK,CAAC;AAC5C,OAAO,EAAE,aAAa,EAAE,QAAQ,EAAE,MAAM,mBAAmB,CAAC;AAC5D,OAAO,eAAe,CAAC;AACvB,OAAO,wBAAwB,CAAC;AAChC,OAAO,EAAE,MAAM,EAAE,KAAK,EAAE,OAAO,EAAE,IAAI,EAAE,SAAS,EAAE,MAAM,qBAAqB,CAAC;AAE9E,MAAM,OAAO,GAAG;IACd,MAAM;IACN,KAAK;IACL,OAAO;IACP,IAAI;IACJ,SAAS;CACV,CAAC;AAGK,IAAM,oBAAoB,GAA1B,MAAM,oBAAqB,SAAQ,UAAU;IAA7C;;QAwEsB,SAAI,GAAG,EAAE,CAAC;IAqBvC,CAAC;IAnBoB,MAAM;QACvB,OAAO,IAAI,CAAA;;;YAGH,IAAI,CAAC,IAAI,CAAC,GAAG,CAAC,CAAC,IAAI,EAAE,KAAK,EAAE,EAAE;YAC9B,MAAM,EAAE,KAAK,EAAE,MAAM,EAAE,IAAI,EAAE,MAAM,EAAE,GAAG,IAAI,CAAC;YAC7C,OAAO,IAAI,CAAA;wBACC,KAAK,GAAG,CAAC;sBACX,KAAK;uBACJ,MAAM;sBACP,OAAO,CAAC,IAAI,CAAC;wBACX,MAAM;;iCAEG,CAAC;QACxB,CAAC,CAAC;;;iBAGK,CAAC;IAChB,CAAC;;AA3FM,2BAAM,GAAG,GAAG,CAAA;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;GAqElB,AArEY,CAqEX;AAEyB;IAA1B,QAAQ,CAAC,EAAE,IAAI,EAAE,KAAK,EAAE,CAAC;kDAAW;AAxE1B,oBAAoB;IADhC,aAAa,CAAC,yBAAyB,CAAC;GAC5B,oBAAoB,CA6FhC","sourcesContent":["import { html, LitElement, css } from 'lit';\nimport { customElement, property } from 'lit/decorators.js';\nimport './IxWidget.js';\nimport './ix-status-counter.js';\nimport { laptop, users, mySites, dcim, locations } from './assets/iconset.js';\n\nconst iconMap = {\n laptop,\n users,\n mySites,\n dcim,\n locations,\n};\n\n@customElement('ix-status-counter-group')\nexport class IxStatusCounterGroup extends LitElement {\n static styles = css`\n .layout {\n display: grid;\n }\n @media (min-width: 1350px) {\n .layout {\n grid-gap: 44px 32px;\n }\n .layout .b1 {\n grid-column-start: 1;\n grid-column-end: 2;\n }\n .layout .b2 {\n grid-column-start: 2;\n grid-column-end: 4;\n }\n .layout .b3 {\n grid-column-start: 4;\n grid-column-end: 6;\n }\n .layout .b4 {\n grid-column-start: 1;\n grid-column-end: 3;\n }\n .layout .b5 {\n grid-column-start: 3;\n grid-column-end: 6;\n }\n ix-status-counter {\n --ix-widget-padding: 1rem;\n }\n }\n\n @media (max-width: 1349px) {\n .layout {\n grid-gap: 0 24px;\n background: linear-gradient(\n 90deg,\n rgba(0, 0, 0, 0) calc(50% - 1px),\n rgba(9, 34, 65, 0.12) calc(50%),\n rgba(0, 0, 0, 0) calc(50% + 1px)\n );\n }\n .layout .b1 {\n grid-column-start: 1;\n grid-column-end: 2;\n grid-row-start: 1;\n }\n .layout .b2 {\n grid-column-start: 1;\n grid-column-end: 2;\n grid-row-start: 2;\n }\n .layout .b3 {\n grid-column-start: 1;\n grid-column-end: 2;\n grid-row-start: 3;\n }\n .layout .b4 {\n grid-column-start: 2;\n grid-column-end: 3;\n grid-row-start: 1;\n }\n .layout .b5 {\n grid-column-start: 2;\n grid-column-end: 3;\n grid-row-start: 2;\n }\n }\n `;\n\n @property({ type: Array }) data = [];\n\n protected override render() {\n return html`<ix-widget type=\"status-counter-group\">\n <div class=\"content\">\n <div class=\"layout\">\n ${this.data.map((item, index) => {\n const { value, header, icon, apiUrl } = item;\n return html`<ix-status-counter\n class=\"b${index + 1}\"\n value=${value}\n header=${header}\n .icon=${iconMap[icon]}\n .apiUrl=${apiUrl}\n >\n </ix-status-counter>`;\n })}\n </div>\n </div>\n </ix-widget>`;\n }\n}\n"]}
package/dist/ix-status-counter.d.ts CHANGED
@@ -7,6 +7,5 @@ export declare class IxStatusCounter extends LitElement {
7
7
  header: string;
8
8
  icon: import("lit").TemplateResult<2>;
9
9
  apiUrl: string | undefined;
10
- connectedCallback(): void;
11
10
  protected render(): import("lit").TemplateResult<1>;
12
11
  }
package/dist/ix-status-counter.js CHANGED
@@ -2,6 +2,7 @@ import { __decorate } from "tslib";
2
2
  import { html, LitElement, css } from 'lit';
3
3
  import { customElement, property } from 'lit/decorators.js';
4
4
  import '@digital-realty/ix-icon/ix-icon.js';
5
+ // import { MobxLitElement } from '@adobe/lit-mobx';
5
6
  import './IxWidget.js';
6
7
  import { laptop, loader } from './assets/iconset.js';
7
8
  let IxStatusCounter = class IxStatusCounter extends LitElement {
@@ -12,23 +13,23 @@ let IxStatusCounter = class IxStatusCounter extends LitElement {
12
13
  this.icon = laptop;
13
14
  this.apiUrl = undefined;
14
15
  }
15
- connectedCallback() {
16
- // super.connectedCallback();
17
- /* if (this.apiUrl) {
18
- fetch(this.apiUrl)
19
- .then((response) => response.json())
20
- .then((data) => {
21
- console.log(data);
22
- this.value = data.value;
23
- this.loading = false;
24
- });
25
- } */
26
- }
16
+ /* connectedCallback() {
17
+ super.connectedCallback();
18
+ if (this.apiUrl) {
19
+ fetch(this.apiUrl)
20
+ .then((response) => response.json())
21
+ .then((data) => {
22
+ this.value = 999;
23
+ });
24
+ }
25
+ } */
27
26
  render() {
28
27
  return html `<ix-widget type="status-counter">
29
28
  <div class="content">
30
29
  <div class="info">
31
- ${this.value ? html `<h3>${this.value.toLocaleString()}</h3>` : loader}
30
+ ${this.value
31
+ ? html `<h3>${this.value.toLocaleString()}</h3>`
32
+ : html `<span class="loader">${loader}</span>`}
32
33
  <h2>${this.header}</h2>
33
34
  </div>
34
35
  <ix-icon>${this.icon}</ix-icon>
@@ -83,9 +84,28 @@ IxStatusCounter.styles = css `
83
84
  height: 60px;
84
85
  font-size: 36px;
85
86
  }
87
+ .loader {
88
+ width: 24px;
89
+ height: 24px;
90
+ }
86
91
  .info svg {
87
- stroke: blue;
92
+ stroke: rgb(20, 86, 224);
93
+ width: 24px;
94
+ height: 24px;
95
+ animation-name: loading;
96
+ animation-duration: 1000ms;
97
+ animation-iteration-count: infinite;
98
+ animation-timing-function: linear;
88
99
  }
100
+ @keyframes loading {
101
+ from {
102
+ transform: rotate(0deg);
103
+ }
104
+ to {
105
+ transform: rotate(360deg);
106
+ }
107
+ }
108
+
89
109
  svg {
90
110
  width: 24px;
91
111
  margin: auto;
@@ -96,6 +116,10 @@ IxStatusCounter.styles = css `
96
116
  width: 36px;
97
117
  margin: auto;
98
118
  }
119
+ .info svg {
120
+ width: 36px;
121
+ height: 36px;
122
+ }
99
123
  }
100
124
 
101
125
  @media (max-width: 1349px) {
package/dist/ix-status-counter.js.map CHANGED
@@ -1 +1 @@
1
- {"version":3,"file":"ix-status-counter.js","sourceRoot":"","sources":["../src/ix-status-counter.ts"],"names":[],"mappings":";AAAA,OAAO,EAAE,IAAI,EAAE,UAAU,EAAE,GAAG,EAAE,MAAM,KAAK,CAAC;AAC5C,OAAO,EAAE,aAAa,EAAE,QAAQ,EAAE,MAAM,mBAAmB,CAAC;AAC5D,OAAO,oCAAoC,CAAC;AAC5C,OAAO,eAAe,CAAC;AACvB,OAAO,EAAE,MAAM,EAAE,MAAM,EAAE,MAAM,qBAAqB,CAAC;AAG9C,IAAM,eAAe,GAArB,MAAM,eAAgB,SAAQ,UAAU;IAAxC;;QA8GuB,UAAK,GAAuB,SAAS,CAAC;QAEtC,WAAM,GAAG,QAAQ,CAAC;QAElB,SAAI,GAAG,MAAM,CAAC;QAEd,WAAM,GAAuB,SAAS,CAAC;IA0BrE,CAAC;IAxBC,iBAAiB;QACf,6BAA6B;QAC7B;;;;;;;;YAQI;IACN,CAAC;IAEkB,MAAM;QACvB,OAAO,IAAI,CAAA;;;YAGH,IAAI,CAAC,KAAK,CAAC,CAAC,CAAC,IAAI,CAAA,OAAO,IAAI,CAAC,KAAK,CAAC,cAAc,EAAE,OAAO,CAAC,CAAC,CAAC,MAAM;gBAC/D,IAAI,CAAC,MAAM;;mBAER,IAAI,CAAC,IAAI;;iBAEX,CAAC;IAChB,CAAC;;AA5IM,sBAAM,GAAG,GAAG,CAAA;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;GA2GlB,AA3GY,CA2GX;AAE0B;IAA3B,QAAQ,CAAC,EAAE,IAAI,EAAE,MAAM,EAAE,CAAC;8CAAuC;AAEtC;IAA3B,QAAQ,CAAC,EAAE,IAAI,EAAE,MAAM,EAAE,CAAC;+CAAmB;AAElB;IAA3B,QAAQ,CAAC,EAAE,IAAI,EAAE,MAAM,EAAE,CAAC;6CAAe;AAEd;IAA3B,QAAQ,CAAC,EAAE,IAAI,EAAE,MAAM,EAAE,CAAC;+CAAwC;AApHxD,eAAe;IAD3B,aAAa,CAAC,mBAAmB,CAAC;GACtB,eAAe,CA8I3B","sourcesContent":["import { html, LitElement, css } from 'lit';\nimport { customElement, property } from 'lit/decorators.js';\nimport '@digital-realty/ix-icon/ix-icon.js';\nimport './IxWidget.js';\nimport { laptop, loader } from './assets/iconset.js';\n\n@customElement('ix-status-counter')\nexport class IxStatusCounter extends LitElement {\n static styles = css`\n ix-widget {\n --ix-widget-background: rgb(200, 223, 250);\n --ix-widget-padding: 36.5px 20px 36.5px 24px;\n --ix-icon-font-size: 5rem;\n --ix-icon-line-height: 1;\n }\n h2 {\n margin: 0px;\n font-family: 'Open Sans', sans-serif;\n font-style: normal;\n font-weight: 400;\n font-size: 16px;\n line-height: 20px;\n letter-spacing: 0.15px;\n color: rgb(9, 34, 65);\n }\n h3 {\n margin: 0px;\n font-family: 'Red Hat Display', sans-serif;\n font-style: normal;\n font-weight: bold;\n font-size: 34px;\n line-height: 40px;\n letter-spacing: 0.35px;\n color: rgb(9, 34, 65);\n }\n .content {\n display: flex;\n -webkit-box-pack: justify;\n justify-content: space-between;\n -webkit-box-align: center;\n align-items: center;\n cursor: pointer;\n }\n ix-icon {\n background-color: rgb(255, 255, 255);\n border-radius: 50%;\n display: flex;\n -webkit-box-pack: center;\n justify-content: center;\n -webkit-box-align: center;\n align-items: center;\n width: 60px;\n height: 60px;\n font-size: 36px;\n }\n .info svg {\n stroke: blue;\n }\n svg {\n width: 24px;\n margin: auto;\n }\n\n @media (min-width: 1200px) {\n svg {\n width: 36px;\n margin: auto;\n }\n }\n\n @media (max-width: 1349px) {\n .content {\n display: flex;\n flex-direction: row-reverse;\n -webkit-box-align: center;\n align-items: center;\n justify-content: left;\n }\n ix-icon {\n width: 24px;\n height: 24px;\n }\n\n ix-widget {\n --ix-widget-background: white;\n }\n .info {\n display: flex;\n align-items: center;\n justify-content: space-between;\n width: 100%;\n flex-direction: row-reverse;\n }\n h2 {\n margin: 0px;\n font-family: 'Open Sans', sans-serif;\n font-style: normal;\n font-weight: 400;\n font-size: 16px;\n line-height: 20px;\n letter-spacing: 0.15px;\n color: rgb(9, 34, 65);\n padding-left: 8px;\n }\n h3 {\n margin: 0px;\n font-family: 'Open Sans', sans-serif;\n font-style: normal;\n font-weight: 700;\n font-size: 14px;\n line-height: 24px;\n letter-spacing: 0.1px;\n color: rgb(9, 34, 65);\n }\n }\n `;\n\n @property({ type: Number }) value: number | undefined = undefined;\n\n @property({ type: String }) header = 'status';\n\n @property({ type: Object }) icon = laptop;\n\n @property({ type: String }) apiUrl: string | undefined = undefined;\n\n connectedCallback() {\n // super.connectedCallback();\n /* if (this.apiUrl) {\n fetch(this.apiUrl)\n .then((response) => response.json())\n .then((data) => {\n console.log(data);\n this.value = data.value;\n this.loading = false; \n }); \n } */\n }\n\n protected override render() {\n return html`<ix-widget type=\"status-counter\">\n <div class=\"content\">\n <div class=\"info\">\n ${this.value ? html`<h3>${this.value.toLocaleString()}</h3>` : loader}\n <h2>${this.header}</h2>\n </div>\n <ix-icon>${this.icon}</ix-icon>\n </div>\n </ix-widget>`;\n }\n}\n"]}
1
+ {"version":3,"file":"ix-status-counter.js","sourceRoot":"","sources":["../src/ix-status-counter.ts"],"names":[],"mappings":";AAAA,OAAO,EAAE,IAAI,EAAE,UAAU,EAAE,GAAG,EAAE,MAAM,KAAK,CAAC;AAC5C,OAAO,EAAE,aAAa,EAAE,QAAQ,EAAE,MAAM,mBAAmB,CAAC;AAC5D,OAAO,oCAAoC,CAAC;AAC5C,oDAAoD;AACpD,OAAO,eAAe,CAAC;AACvB,OAAO,EAAE,MAAM,EAAE,MAAM,EAAE,MAAM,qBAAqB,CAAC;AAG9C,IAAM,eAAe,GAArB,MAAM,eAAgB,SAAQ,UAAU;IAAxC;;QAqIuB,UAAK,GAAuB,SAAS,CAAC;QAEtC,WAAM,GAAG,QAAQ,CAAC;QAElB,SAAI,GAAG,MAAM,CAAC;QAEd,WAAM,GAAuB,SAAS,CAAC;IA0BrE,CAAC;IAxBC;;;;;;;;;QASI;IAEe,MAAM;QACvB,OAAO,IAAI,CAAA;;;YAGH,IAAI,CAAC,KAAK;YACV,CAAC,CAAC,IAAI,CAAA,OAAO,IAAI,CAAC,KAAK,CAAC,cAAc,EAAE,OAAO;YAC/C,CAAC,CAAC,IAAI,CAAA,wBAAwB,MAAM,SAAS;gBACzC,IAAI,CAAC,MAAM;;mBAER,IAAI,CAAC,IAAI;;iBAEX,CAAC;IAChB,CAAC;;AAnKM,sBAAM,GAAG,GAAG,CAAA;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;GAkIlB,AAlIY,CAkIX;AAE0B;IAA3B,QAAQ,CAAC,EAAE,IAAI,EAAE,MAAM,EAAE,CAAC;8CAAuC;AAEtC;IAA3B,QAAQ,CAAC,EAAE,IAAI,EAAE,MAAM,EAAE,CAAC;+CAAmB;AAElB;IAA3B,QAAQ,CAAC,EAAE,IAAI,EAAE,MAAM,EAAE,CAAC;6CAAe;AAEd;IAA3B,QAAQ,CAAC,EAAE,IAAI,EAAE,MAAM,EAAE,CAAC;+CAAwC;AA3IxD,eAAe;IAD3B,aAAa,CAAC,mBAAmB,CAAC;GACtB,eAAe,CAqK3B","sourcesContent":["import { html, LitElement, css } from 'lit';\nimport { customElement, property } from 'lit/decorators.js';\nimport '@digital-realty/ix-icon/ix-icon.js';\n// import { MobxLitElement } from '@adobe/lit-mobx';\nimport './IxWidget.js';\nimport { laptop, loader } from './assets/iconset.js';\n\n@customElement('ix-status-counter')\nexport class IxStatusCounter extends LitElement {\n static styles = css`\n ix-widget {\n --ix-widget-background: rgb(200, 223, 250);\n --ix-widget-padding: 36.5px 20px 36.5px 24px;\n --ix-icon-font-size: 5rem;\n --ix-icon-line-height: 1;\n }\n h2 {\n margin: 0px;\n font-family: 'Open Sans', sans-serif;\n font-style: normal;\n font-weight: 400;\n font-size: 16px;\n line-height: 20px;\n letter-spacing: 0.15px;\n color: rgb(9, 34, 65);\n }\n h3 {\n margin: 0px;\n font-family: 'Red Hat Display', sans-serif;\n font-style: normal;\n font-weight: bold;\n font-size: 34px;\n line-height: 40px;\n letter-spacing: 0.35px;\n color: rgb(9, 34, 65);\n }\n .content {\n display: flex;\n -webkit-box-pack: justify;\n justify-content: space-between;\n -webkit-box-align: center;\n align-items: center;\n cursor: pointer;\n }\n ix-icon {\n background-color: rgb(255, 255, 255);\n border-radius: 50%;\n display: flex;\n -webkit-box-pack: center;\n justify-content: center;\n -webkit-box-align: center;\n align-items: center;\n width: 60px;\n height: 60px;\n font-size: 36px;\n }\n .loader {\n width: 24px;\n height: 24px;\n }\n .info svg {\n stroke: rgb(20, 86, 224);\n width: 24px;\n height: 24px;\n animation-name: loading;\n animation-duration: 1000ms;\n animation-iteration-count: infinite;\n animation-timing-function: linear;\n }\n @keyframes loading {\n from {\n transform: rotate(0deg);\n }\n to {\n transform: rotate(360deg);\n }\n }\n\n svg {\n width: 24px;\n margin: auto;\n }\n\n @media (min-width: 1200px) {\n svg {\n width: 36px;\n margin: auto;\n }\n .info svg {\n width: 36px;\n height: 36px;\n }\n }\n\n @media (max-width: 1349px) {\n .content {\n display: flex;\n flex-direction: row-reverse;\n -webkit-box-align: center;\n align-items: center;\n justify-content: left;\n }\n ix-icon {\n width: 24px;\n height: 24px;\n }\n\n ix-widget {\n --ix-widget-background: white;\n }\n .info {\n display: flex;\n align-items: center;\n justify-content: space-between;\n width: 100%;\n flex-direction: row-reverse;\n }\n h2 {\n margin: 0px;\n font-family: 'Open Sans', sans-serif;\n font-style: normal;\n font-weight: 400;\n font-size: 16px;\n line-height: 20px;\n letter-spacing: 0.15px;\n color: rgb(9, 34, 65);\n padding-left: 8px;\n }\n h3 {\n margin: 0px;\n font-family: 'Open Sans', sans-serif;\n font-style: normal;\n font-weight: 700;\n font-size: 14px;\n line-height: 24px;\n letter-spacing: 0.1px;\n color: rgb(9, 34, 65);\n }\n }\n `;\n\n @property({ type: Number }) value: number | undefined = undefined;\n\n @property({ type: String }) header = 'status';\n\n @property({ type: Object }) icon = laptop;\n\n @property({ type: String }) apiUrl: string | undefined = undefined;\n\n /* connectedCallback() {\n super.connectedCallback();\n if (this.apiUrl) {\n fetch(this.apiUrl)\n .then((response) => response.json())\n .then((data) => {\n this.value = 999;\n }); \n }\n } */\n\n protected override render() {\n return html`<ix-widget type=\"status-counter\">\n <div class=\"content\">\n <div class=\"info\">\n ${this.value\n ? html`<h3>${this.value.toLocaleString()}</h3>`\n : html`<span class=\"loader\">${loader}</span>`}\n <h2>${this.header}</h2>\n </div>\n <ix-icon>${this.icon}</ix-icon>\n </div>\n </ix-widget>`;\n }\n}\n"]}
package/dist/styles/launchpad-styles.js CHANGED
@@ -1,20 +1,8 @@
1
1
  import { css } from 'lit';
2
2
  export const IxLaunchpadStyles = css `
3
- .outer {
4
- height: 100vh;
5
- background-color: rgb(245, 247, 255);
6
- }
7
- main {
8
- height: 100%;
3
+ .wrapper {
9
4
  margin-left: 0px;
10
- margin-top: 72px;
11
- margin-bottom: 72px;
12
5
  transition: margin-left 195ms cubic-bezier(0.4, 0, 0.6, 1) 0ms;
13
- }
14
- .inner {
15
- height: 100%;
16
- width: 100%;
17
- overflow-y: overlay;
18
6
  display: flex;
19
7
  flex-direction: column;
20
8
  }
@@ -134,9 +122,6 @@ export const IxLaunchpadStyles = css `
134
122
  align-items: center;
135
123
  gap: 21px;
136
124
  }
137
- main {
138
- margin-top: 88px;
139
- }
140
125
  .container {
141
126
  padding: 0px;
142
127
  }
@@ -166,7 +151,6 @@ export const IxLaunchpadStyles = css `
166
151
  padding-top: 27px;
167
152
  }
168
153
  .container {
169
- margin-top: -100px;
170
154
  background-image: url(/images/buildings-placeholder.png);
171
155
  background-repeat: no-repeat;
172
156
  background-position: right bottom;
@@ -177,25 +161,19 @@ export const IxLaunchpadStyles = css `
177
161
  }
178
162
  .content {
179
163
  gap: 44px;
180
- overflow: auto;
181
- max-height: 100vh;
182
- padding-top: 120px;
183
- padding-bottom: 32px;
184
- padding-right: 44px;
185
164
  }
186
165
  .container {
187
- margin-top: -100px;
188
166
  background-image: url(/images/buildings-placeholder.png);
189
167
  background-repeat: no-repeat;
190
168
  background-position: right bottom;
191
169
  }
192
- main {
193
- margin-top: 0px;
194
- /* margin-left: 112px; */
195
- }
196
170
  }
197
171
 
198
172
  @media (min-width: 1350px) {
173
+ .side-nav {
174
+ position: sticky;
175
+ top: 0;
176
+ }
199
177
  .container {
200
178
  display: grid;
201
179
  grid-template-columns: minmax(760px, 1176px) minmax(310px, 584px);
@@ -203,9 +181,6 @@ export const IxLaunchpadStyles = css `
203
181
  .container > nav {
204
182
  overflow: auto;
205
183
  max-height: 100vh;
206
- padding-top: 120px;
207
- padding-bottom: 32px;
208
- padding-right: 20px;
209
184
  }
210
185
  .container .content > nav {
211
186
  display: none;
package/dist/styles/launchpad-styles.js.map CHANGED
@@ -1 +1 @@
1
- {"version":3,"file":"launchpad-styles.js","sourceRoot":"","sources":["../../src/styles/launchpad-styles.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,GAAG,EAAE,MAAM,KAAK,CAAC;AAE1B,MAAM,CAAC,MAAM,iBAAiB,GAAG,GAAG,CAAA;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;CA0NnC,CAAC","sourcesContent":["import { css } from 'lit';\n\nexport const IxLaunchpadStyles = css`\n .outer {\n height: 100vh;\n background-color: rgb(245, 247, 255);\n }\n main {\n height: 100%;\n margin-left: 0px;\n margin-top: 72px;\n margin-bottom: 72px;\n transition: margin-left 195ms cubic-bezier(0.4, 0, 0.6, 1) 0ms;\n }\n .inner {\n height: 100%;\n width: 100%;\n overflow-y: overlay;\n display: flex;\n flex-direction: column;\n }\n header {\n min-height: 60px;\n background-color: rgba(245, 247, 255, 0.85);\n backdrop-filter: blur(6px);\n display: flex;\n flex-flow: column-reverse wrap;\n -webkit-box-pack: center;\n justify-content: center;\n -webkit-box-align: center;\n align-items: center;\n gap: 20px;\n padding: 16px 24px 16px 7px;\n position: sticky;\n top: 0px;\n right: 0px;\n z-index: 1000;\n }\n header > div {\n margin-right: auto;\n display: flex;\n -webkit-box-pack: start;\n justify-content: start;\n -webkit-box-align: center;\n align-items: center;\n }\n header > div > h1 {\n display: block;\n font-size: 2em;\n margin-block-start: 0.67em;\n margin-block-end: 0.67em;\n margin-inline-start: 0px;\n margin-inline-end: 0px;\n font-weight: bold;\n margin: 0px;\n font-family: 'Red Hat Display', sans-serif;\n font-style: normal;\n font-weight: bold;\n font-size: 34px;\n line-height: 40px;\n letter-spacing: 0.35px;\n color: rgb(9, 34, 65);\n }\n h2 {\n margin: 0px;\n font-family: 'Red Hat Display', sans-serif;\n font-style: normal;\n font-weight: normal;\n font-size: 24px;\n line-height: 32px;\n letter-spacing: 0em;\n color: rgb(9, 34, 65);\n margin-bottom: 24px;\n }\n .content {\n display: flex;\n flex-direction: column;\n gap: 24px;\n }\n nav {\n display: flex;\n flex-direction: column;\n gap: 24px;\n }\n section {\n flex: 1 1 0%;\n padding-right: 0px;\n padding-left: 0px;\n padding-bottom: 64px;\n }\n .container {\n display: flex;\n flex-direction: column;\n padding-top: 0px;\n padding-left: 16px;\n padding-right: 16px;\n gap: 32px;\n }\n\n .resources {\n margin-bottom: 44px;\n }\n .news-info .newsAndPromotions {\n display: flex;\n gap: 44px;\n flex-wrap: wrap;\n }\n\n @media (max-width: 1199px) {\n ix-table-data,\n ix-action-list,\n .news-info {\n display: none;\n }\n }\n\n @media (min-width: 800px) and (max-width: 1349px) {\n nav {\n display: flex;\n align-items: flex-start;\n gap: 32px;\n }\n nav > * {\n width: 100%;\n display: flex;\n flex-direction: column;\n }\n }\n\n @media (min-width: 600px) {\n header {\n min-height: 100px;\n flex-direction: row;\n -webkit-box-align: center;\n align-items: center;\n gap: 21px;\n }\n main {\n margin-top: 88px;\n }\n .container {\n padding: 0px;\n }\n }\n @media (min-width: 900px) {\n .content {\n gap: 32px;\n }\n main {\n margin-left: 0px;\n margin-bottom: 0px;\n }\n header {\n padding-top: 12px;\n min-height: 92px;\n padding-bottom: 8px;\n }\n section {\n padding-right: 32px;\n padding-bottom: 48px;\n }\n }\n @media (min-width: 1200px) {\n header {\n min-height: 100px;\n padding-bottom: 16px;\n padding-top: 27px;\n }\n .container {\n margin-top: -100px;\n background-image: url(/images/buildings-placeholder.png);\n background-repeat: no-repeat;\n background-position: right bottom;\n }\n section {\n padding-right: 0px;\n padding-bottom: 0px;\n }\n .content {\n gap: 44px;\n overflow: auto;\n max-height: 100vh;\n padding-top: 120px;\n padding-bottom: 32px;\n padding-right: 44px;\n }\n .container {\n margin-top: -100px;\n background-image: url(/images/buildings-placeholder.png);\n background-repeat: no-repeat;\n background-position: right bottom;\n }\n main {\n margin-top: 0px;\n /* margin-left: 112px; */\n }\n }\n\n @media (min-width: 1350px) {\n .container {\n display: grid;\n grid-template-columns: minmax(760px, 1176px) minmax(310px, 584px);\n }\n .container > nav {\n overflow: auto;\n max-height: 100vh;\n padding-top: 120px;\n padding-bottom: 32px;\n padding-right: 20px;\n }\n .container .content > nav {\n display: none;\n }\n }\n\n @media (max-width: 1349px) {\n .container > nav {\n display: none;\n }\n }\n`;\n"]}
1
+ {"version":3,"file":"launchpad-styles.js","sourceRoot":"","sources":["../../src/styles/launchpad-styles.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,GAAG,EAAE,MAAM,KAAK,CAAC;AAE1B,MAAM,CAAC,MAAM,iBAAiB,GAAG,GAAG,CAAA;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;CAiMnC,CAAC","sourcesContent":["import { css } from 'lit';\n\nexport const IxLaunchpadStyles = css`\n .wrapper {\n margin-left: 0px;\n transition: margin-left 195ms cubic-bezier(0.4, 0, 0.6, 1) 0ms;\n display: flex;\n flex-direction: column;\n }\n header {\n min-height: 60px;\n background-color: rgba(245, 247, 255, 0.85);\n backdrop-filter: blur(6px);\n display: flex;\n flex-flow: column-reverse wrap;\n -webkit-box-pack: center;\n justify-content: center;\n -webkit-box-align: center;\n align-items: center;\n gap: 20px;\n padding: 16px 24px 16px 7px;\n position: sticky;\n top: 0px;\n right: 0px;\n z-index: 1000;\n }\n header > div {\n margin-right: auto;\n display: flex;\n -webkit-box-pack: start;\n justify-content: start;\n -webkit-box-align: center;\n align-items: center;\n }\n header > div > h1 {\n display: block;\n font-size: 2em;\n margin-block-start: 0.67em;\n margin-block-end: 0.67em;\n margin-inline-start: 0px;\n margin-inline-end: 0px;\n font-weight: bold;\n margin: 0px;\n font-family: 'Red Hat Display', sans-serif;\n font-style: normal;\n font-weight: bold;\n font-size: 34px;\n line-height: 40px;\n letter-spacing: 0.35px;\n color: rgb(9, 34, 65);\n }\n h2 {\n margin: 0px;\n font-family: 'Red Hat Display', sans-serif;\n font-style: normal;\n font-weight: normal;\n font-size: 24px;\n line-height: 32px;\n letter-spacing: 0em;\n color: rgb(9, 34, 65);\n margin-bottom: 24px;\n }\n .content {\n display: flex;\n flex-direction: column;\n gap: 24px;\n }\n nav {\n display: flex;\n flex-direction: column;\n gap: 24px;\n }\n section {\n flex: 1 1 0%;\n padding-right: 0px;\n padding-left: 0px;\n padding-bottom: 64px;\n }\n .container {\n display: flex;\n flex-direction: column;\n padding-top: 0px;\n padding-left: 16px;\n padding-right: 16px;\n gap: 32px;\n }\n\n .resources {\n margin-bottom: 44px;\n }\n .news-info .newsAndPromotions {\n display: flex;\n gap: 44px;\n flex-wrap: wrap;\n }\n\n @media (max-width: 1199px) {\n ix-table-data,\n ix-action-list,\n .news-info {\n display: none;\n }\n }\n\n @media (min-width: 800px) and (max-width: 1349px) {\n nav {\n display: flex;\n align-items: flex-start;\n gap: 32px;\n }\n nav > * {\n width: 100%;\n display: flex;\n flex-direction: column;\n }\n }\n\n @media (min-width: 600px) {\n header {\n min-height: 100px;\n flex-direction: row;\n -webkit-box-align: center;\n align-items: center;\n gap: 21px;\n }\n .container {\n padding: 0px;\n }\n }\n @media (min-width: 900px) {\n .content {\n gap: 32px;\n }\n main {\n margin-left: 0px;\n margin-bottom: 0px;\n }\n header {\n padding-top: 12px;\n min-height: 92px;\n padding-bottom: 8px;\n }\n section {\n padding-right: 32px;\n padding-bottom: 48px;\n }\n }\n @media (min-width: 1200px) {\n header {\n min-height: 100px;\n padding-bottom: 16px;\n padding-top: 27px;\n }\n .container {\n background-image: url(/images/buildings-placeholder.png);\n background-repeat: no-repeat;\n background-position: right bottom;\n }\n section {\n padding-right: 0px;\n padding-bottom: 0px;\n }\n .content {\n gap: 44px;\n }\n .container {\n background-image: url(/images/buildings-placeholder.png);\n background-repeat: no-repeat;\n background-position: right bottom;\n }\n }\n\n @media (min-width: 1350px) {\n .side-nav {\n position: sticky;\n top: 0;\n }\n .container {\n display: grid;\n grid-template-columns: minmax(760px, 1176px) minmax(310px, 584px);\n }\n .container > nav {\n overflow: auto;\n max-height: 100vh;\n }\n .container .content > nav {\n display: none;\n }\n }\n\n @media (max-width: 1349px) {\n .container > nav {\n display: none;\n }\n }\n`;\n"]}
package/package.json CHANGED
@@ -3,7 +3,7 @@
3
3
  "description": "Webcomponent ix-widget following open-wc recommendations",
4
4
  "license": "MIT",
5
5
  "author": "Digital Realty",
6
- "version": "1.0.1",
6
+ "version": "1.0.2",
7
7
  "type": "module",
8
8
  "main": "dist/index.js",
9
9
  "module": "dist/index.js",
@@ -37,6 +37,7 @@
37
37
  "test:watch": "tsc && concurrently -k -r \"tsc --watch --preserveWatchOutput\" \"wtr --watch\""
38
38
  },
39
39
  "dependencies": {
40
+ "@adobe/lit-mobx": "^2.2.2",
40
41
  "@digital-realty/ix-button": "^3.2.31",
41
42
  "@digital-realty/ix-grid": "^1.0.29",
42
43
  "@digital-realty/ix-icon": "^1.0.36",
@@ -47,6 +48,7 @@
47
48
  "date-fns": "^3.6.0",
48
49
  "lit": "^2.0.2",
49
50
  "markdown-it": "^14.1.0",
51
+ "mobx-persist-store": "^1.1.4",
50
52
  "react": "^18.2.0"
51
53
  },
52
54
  "devDependencies": {
@@ -124,5 +126,5 @@
124
126
  "README.md",
125
127
  "LICENSE"
126
128
  ],
127
- "gitHead": "ee9b46e8efa1df8ef9dd22ec6f7235bc22c69d6d"
129
+ "gitHead": "77fd36110cb62fed24a7236e0d399eceb1b60cbf"
128
130
  }