@uxland/primary-shell 7.48.0 → 7.49.1

package/dist/primary/shell/src/locales.d.ts

@@ -47,6 +47,7 @@ export declare const locales: {
                 title: string;
                 actions: {
                     cancel: string;
+                    close: string;
                     import: string;
                 };
             };

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@uxland/primary-shell",
-  "version": "7.48.0",
+  "version": "7.49.1",
   "description": "Primaria Shell",
   "author": "UXLand <dev@uxland.es>",
   "homepage": "https://github.com/uxland/harmonix/tree/app#readme",

package/src/api/import-data-manager/component/styles.css

@@ -9,28 +9,31 @@
   overflow: hidden;
 }
 
-/* .header {
-  display: flex;
-  flex-direction: row;
+/* Three columns so the title is centred on the modal, not on the space left
+   over by the close button. */
+.header {
+  display: grid;
+  grid-template-columns: 1fr auto 1fr;
   align-items: center;
-  justify-content: space-between;
-  text-align: center;
   color: black;
   padding: var(--dss-spacing-sm);
+}
+
+.header__title {
+  grid-column: 2;
+  text-align: center;
+}
 
-  .title {
-    display: flex;
-    flex-direction: row;
-    gap: 8px;
-  }
-} */
+.header__close {
+  grid-column: 3;
+  justify-self: end;
+}
 
 .content{
   display: grid;
   flex: 1;
   min-height: 0;
   grid-template-columns: 50% 50%;
-  gap: 16px;
   padding: 16px;
 }
 
@@ -43,28 +46,23 @@
 .content primaria-region > div {
   width: 100%;
   height: 100%;
-  border: 1px solid var(--color-neutral-200);
   border-radius: 8px;
-  padding: 16px;
+  padding: 0 16px;
   box-sizing: border-box;
 }
 
-/* Right column: stacks plugin cards and scrolls as a whole. */
-.content > primaria-region[name="import-data-region"] > div {
-  overflow-y: auto;
-}
-
-/* Left column: vertical stack of accordion widgets. Each one keeps its natural
-   height and bounds its own inner scroll, so the column scrolls as a whole —
-   same as the right column. */
-.content > primaria-region[name="import-data-activity-history-region"] > div {
+/* Both columns are a vertical stack of injected views, 16px apart, that scrolls
+   as a whole. Each view keeps its natural height and bounds its own inner
+   scroll, and must not shrink — otherwise the column squeezes the views instead
+   of scrolling. */
+.content > primaria-region > div {
   display: flex;
   flex-direction: column;
   gap: 16px;
   overflow-y: auto;
 }
 
-.content > primaria-region[name="import-data-activity-history-region"] > div > * {
+.content > primaria-region > div > * {
   flex-shrink: 0;
 }
 

package/src/api/import-data-manager/component/template.ts

@@ -6,6 +6,21 @@ import { ImportDataManagerModal } from "./component";
 export const template = (props: ImportDataManagerModal) => {
   return html`
     <div class="container">
+      <div class="header">
+        <dss-typography class="header__title" tag="h2" variant="headline-4">
+          ${translate("importDataManager.title")}
+        </dss-typography>
+        <dss-icon-button
+          class="header__close"
+          icon="close"
+          size="lg"
+          variant="neutral"
+          label="${translate("importDataManager.actions.close")}"
+          @onClick="${() => {
+            props.cancel();
+          }}"
+        ></dss-icon-button>
+      </div>
       <div class="content">
         <primaria-region name="${shellApi.regionManager.regions.shell.importDataActivityHistory}"></primaria-region>
         <primaria-region name="${shellApi.regionManager.regions.shell.importData}"></primaria-region>

package/src/locales.ts

@@ -65,6 +65,7 @@ export const locales = {
         title: "Importar dades",
         actions: {
           cancel: "Cancel·lar",
+          close: "Tancar",
           import: "Importar dades",
         },
       },

package/dist/component-DvhXFXbi.js

@@ -1,53 +0,0 @@
-import { s, u as d, k as c, h as p, r as g, b as m, t as h } from "./index-Pwqfd9a_.js";
-const v = ".container{background-color:#fff;display:flex;flex-direction:column;min-width:500px;width:95vw;height:95vh;border-radius:var(--dss-radius-sm);overflow:hidden}.content{display:grid;flex:1;min-height:0;grid-template-columns:50% 50%;gap:16px;padding:16px}.content>primaria-region{width:100%;height:100%;min-height:0}.content primaria-region>div{width:100%;height:100%;border:1px solid var(--color-neutral-200);border-radius:8px;padding:16px;box-sizing:border-box}.content>primaria-region[name=import-data-region]>div{overflow-y:auto}.content>primaria-region[name=import-data-activity-history-region]>div{display:flex;flex-direction:column;gap:16px;overflow-y:auto}.content>primaria-region[name=import-data-activity-history-region]>div>*{flex-shrink:0}.footer{display:flex;flex-direction:row;align-items:center;background:#fff;justify-content:center;gap:12px;height:56px;border-top:1px solid var(--color-neutral-100);padding:var(--dss-spacing-sm)}", u = (r) => c`
-    <div class="container">
-      <div class="content">
-        <primaria-region name="${s.regionManager.regions.shell.importDataActivityHistory}"></primaria-region>
-        <primaria-region name="${s.regionManager.regions.shell.importData}"></primaria-region>
-      </div>
-      <div class="footer">
-        <dss-button
-          label="${d("importDataManager.actions.cancel")}"
-          @click="${() => {
-  r.cancel();
-}}"
-          size="md"
-          variant="secondary"
-        ></dss-button>
-        <dss-button
-          icon="add_circle"
-          label="${d("importDataManager.actions.import")}"
-          @click="${() => {
-  r._accept();
-}}"
-          size="md"
-          variant="primary"
-        ></dss-button>
-      </div>
-    </div>
-  `;
-var f = Object.getOwnPropertyDescriptor, x = (r, e, l, n) => {
-  for (var i = n > 1 ? void 0 : n ? f(e, l) : e, a = r.length - 1, o; a >= 0; a--)
-    (o = r[a]) && (i = o(i) || i);
-  return i;
-};
-let t = class extends p {
-  constructor() {
-    super(...arguments), this._accept = () => {
-      this.confirm();
-    };
-  }
-  render() {
-    return c`${u(this)}`;
-  }
-};
-t.styles = m`
-    ${g(v)}
-  `;
-t = x([
-  h("import-data-manager-modal")
-], t);
-export {
-  t as ImportDataManagerModal
-};
-//# sourceMappingURL=component-DvhXFXbi.js.map

package/dist/component-DvhXFXbi.js.map

@@ -1 +0,0 @@
-{"version":3,"file":"component-DvhXFXbi.js","sources":["../src/api/import-data-manager/component/template.ts","../src/api/import-data-manager/component/component.ts"],"sourcesContent":["import { html } from \"lit\";\nimport { translate } from \"../../../locales\";\nimport { shellApi } from \"../../api\";\nimport { ImportDataManagerModal } from \"./component\";\n\nexport const template = (props: ImportDataManagerModal) => {\n  return html`\n    <div class=\"container\">\n      <div class=\"content\">\n        <primaria-region name=\"${shellApi.regionManager.regions.shell.importDataActivityHistory}\"></primaria-region>\n        <primaria-region name=\"${shellApi.regionManager.regions.shell.importData}\"></primaria-region>\n      </div>\n      <div class=\"footer\">\n        <dss-button\n          label=\"${translate(\"importDataManager.actions.cancel\")}\"\n          @click=\"${() => {\n            props.cancel();\n          }}\"\n          size=\"md\"\n          variant=\"secondary\"\n        ></dss-button>\n        <dss-button\n          icon=\"add_circle\"\n          label=\"${translate(\"importDataManager.actions.import\")}\"\n          @click=\"${() => {\n            props._accept();\n          }}\"\n          size=\"md\"\n          variant=\"primary\"\n        ></dss-button>\n      </div>\n    </div>\n  `;\n};\n","import { LitElement, css, html, unsafeCSS } from \"lit\";\nimport { customElement } from \"lit/decorators.js\";\nimport { ConfirmationContentProps } from \"../../interaction-service\";\nimport styles from \"./styles.css?inline\";\nimport { template } from \"./template\";\n\n@customElement(\"import-data-manager-modal\")\nexport class ImportDataManagerModal extends LitElement implements ConfirmationContentProps<undefined, undefined> {\n  data: undefined;\n  setResult: (result: undefined) => void;\n  setIsValid: (isValid: boolean) => void;\n  confirm: () => void;\n  // Injectat pel servei d'interacció igual que la resta; faltava des que es va afegir a la\n  // interfície.\n  confirmResult: (result: undefined) => void;\n  cancel: () => void;\n\n  render() {\n    return html`${template(this)}`;\n  }\n\n  static styles = css`\n    ${unsafeCSS(styles)}\n  `;\n\n  _accept = () => {\n    this.confirm();\n  };\n}\n"],"names":["template","props","html","shellApi","translate","ImportDataManagerModal","LitElement","css","unsafeCSS","styles","__decorateClass","customElement"],"mappings":";67BAKaA,IAAW,CAACC,MAChBC;AAAAA;AAAAA;AAAAA,iCAGwBC,EAAS,cAAc,QAAQ,MAAM,yBAAyB;AAAA,iCAC9DA,EAAS,cAAc,QAAQ,MAAM,UAAU;AAAA;AAAA;AAAA;AAAA,mBAI7DC,EAAU,kCAAkC,CAAC;AAAA,oBAC5C,MAAM;AACd,EAAAH,EAAM,OAAA;AACR,CAAC;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA,mBAMQG,EAAU,kCAAkC,CAAC;AAAA,oBAC5C,MAAM;AACd,EAAAH,EAAM,QAAA;AACR,CAAC;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;;;;;;ACnBJ,IAAMI,IAAN,cAAqCC,EAAqE;AAAA,EAA1G,cAAA;AAAA,UAAA,GAAA,SAAA,GAkBL,KAAA,UAAU,MAAM;AACd,WAAK,QAAA;AAAA,IACP;AAAA,EAAA;AAAA,EAVA,SAAS;AACP,WAAOJ,IAAOF,EAAS,IAAI,CAAC;AAAA,EAC9B;AASF;AArBaK,EAcJ,SAASE;AAAAA,MACZC,EAAUC,CAAM,CAAC;AAAA;AAfVJ,IAANK,EAAA;AAAA,EADNC,EAAc,2BAA2B;AAAA,GAC7BN,CAAA;"}