@ngx-smz/core 21.8.0 → 21.9.0-next.10

package/package.json

@@ -1,7 +1,9 @@
 {
   "name": "@ngx-smz/core",
-  "version": "21.8.0",
+  "version": "21.9.0-next.10",
   "peerDependencies": {
+    "@ngx-smz/ui-kit": ">=21.9.0-0",
+    "@angular/cdk": ">=21.0.0 <22.0.0",
     "@angular/animations": ">=21.0.0 <22.0.0",
     "@angular/common": ">=21.0.0 <22.0.0",
     "@angular/core": ">=21.0.0 <22.0.0",
@@ -10,15 +12,11 @@
     "@angular/router": ">=21.0.0 <22.0.0",
     "@ngxs/store": ">=21.0.0 <22.0.0",
     "@ngxs/router-plugin": ">=21.0.0 <22.0.0",
-    "@primeuix/themes": ">=2.0.3",
     "html2pdf.js": ">=0.14.0",
     "jspdf": ">=4.0.0",
     "moment": ">=2.30.1",
-    "primeflex": ">=4.0.0",
-    "primeicons": ">=7.0.0",
-    "primeng": ">=21.0.0 <22.0.0",
-    "tailwindcss": ">=3.4.17",
-    "tailwindcss-primeui": ">=0.6.1"
+    "@fortawesome/fontawesome-free": ">=6.5.2",
+    "tailwindcss": ">=3.4.17"
   },
   "dependencies": {
     "tslib": "^2.3.0"
@@ -27,15 +25,17 @@
   "publishConfig": {
     "access": "public"
   },
-  "module": "fesm2022/ngx-smz-core.mjs",
-  "typings": "types/ngx-smz-core.d.ts",
   "exports": {
     "./package.json": {
       "default": "./package.json"
     },
+    "./tailwind.preset": "./tailwind.preset.js",
+    "./tailwind.preset.js": "./tailwind.preset.js",
     ".": {
       "types": "./types/ngx-smz-core.d.ts",
       "default": "./fesm2022/ngx-smz-core.mjs"
     }
-  }
+  },
+  "module": "fesm2022/ngx-smz-core.mjs",
+  "typings": "types/ngx-smz-core.d.ts"
 }

package/resources/assets/scss/dialogs/smz-general-styles.scss

@@ -362,14 +362,14 @@
 .file_upload__drag-container {
   border-radius: 5px;
   width: 100%;
-  background: var(--p-inputtext-background);
-  border: 1px solid var(--p-inputtext-border-color);
+  background: rgb(var(--smz-color-surface-1));
+  border: 1px solid rgb(var(--smz-color-line-strong));
 }
 
 .file_upload-container {
   border-radius: 5px;
-  background: var(--p-inputtext-background);
-  border: 1px solid var(--p-inputtext-border-color);
+  background: rgb(var(--smz-color-surface-1));
+  border: 1px solid rgb(var(--smz-color-line-strong));
   width: 100%;
   padding: 10px;
 }

package/resources/assets/scss/smz-contents.scss

@@ -1,111 +1,111 @@
-body {
-  font-family: var(
-    --font-family,
-    -apple-system,
-    BlinkMacSystemFont,
-    "Segoe UI",
-    Roboto,
-    Helvetica,
-    Arial,
-    sans-serif,
-    "Apple Color Emoji",
-    "Segoe UI Emoji",
-    "Segoe UI Symbol"
-  );
-  background-color: var(--surface-b);
-  color: var(--text-color);
-}
-
-.layout-wrapper {
-  .layout-topbar {
-    & {
-      background-color: var(--surface-a);
-      color: var(--text-color);
-    }
-
-    .action-icon {
-      & {
-        color: var(--text-secondary-color);
-      }
-
-      &:hover {
-        background: var(--surface-c);
-      }
-    }
-
-    .route-link {
-      & {
-        color: var(--text-secondary-color);
-      }
-
-      &:hover {
-        background: var(--surface-c);
-      }
-    }
-  }
-
-  .layout-editor {
-    & {
-      background-color: var(--surface-a);
-      color: var(--text-color);
-      border-right: 1px solid var(--surface-d);
-    }
-
-    p {
-      background-color: var(--surface-b);
-      border: 2px dashed var(--surface-d);
-      color: var(--text-color-secondary);
-    }
-
-    .editor-field {
-      input {
-        background-color: var(--surface-d);
-      }
-
-      input[type="text"] {
-        color: var(--text-color);
-      }
-    }
-
-    .config-scale {
-      i {
-        color: var(--text-color-secondary);
-      }
-    }
-  }
-
-  .layout-content {
-    background-color: var(--surface-b);
-  }
-
-  .layout-footer {
-    background: var(--surface-a);
-    border-top: 1px solid var(--surface-d);
-    color: var(--text-secondary-color);
-  }
-}
-
-.card {
-  background: var(--surface-e);
-  color: var(--text-color);
-}
-
-i:not([class~="pi"]) {
-  background-color: var(--surface-b);
-}
-
-pre[class*="language-"] {
-  code {
-    & {
-      border-left: 10px solid var(--surface-d) !important;
-      background: var(--surface-b) !important;
-      color: var(--text-color);
-    }
-
-    .token {
-      &.punctuation {
-        color: var(--text-color);
-      }
-    }
-  }
-}
+body {
+  font-family: var(
+    --font-family,
+    -apple-system,
+    BlinkMacSystemFont,
+    "Segoe UI",
+    Roboto,
+    Helvetica,
+    Arial,
+    sans-serif,
+    "Apple Color Emoji",
+    "Segoe UI Emoji",
+    "Segoe UI Symbol"
+  );
+  background-color: var(--surface-b);
+  color: var(--text-color);
+}
+
+.layout-wrapper {
+  .layout-topbar {
+    & {
+      background-color: var(--surface-a);
+      color: var(--text-color);
+    }
+
+    .action-icon {
+      & {
+        color: var(--text-secondary-color);
+      }
+
+      &:hover {
+        background: var(--surface-c);
+      }
+    }
+
+    .route-link {
+      & {
+        color: var(--text-secondary-color);
+      }
+
+      &:hover {
+        background: var(--surface-c);
+      }
+    }
+  }
+
+  .layout-editor {
+    & {
+      background-color: var(--surface-a);
+      color: var(--text-color);
+      border-right: 1px solid var(--surface-d);
+    }
+
+    p {
+      background-color: var(--surface-b);
+      border: 2px dashed var(--surface-d);
+      color: var(--text-color-secondary);
+    }
+
+    .editor-field {
+      input {
+        background-color: var(--surface-d);
+      }
+
+      input[type="text"] {
+        color: var(--text-color);
+      }
+    }
+
+    .config-scale {
+      i {
+        color: var(--text-color-secondary);
+      }
+    }
+  }
+
+  .layout-content {
+    background-color: var(--surface-b);
+  }
+
+  .layout-footer {
+    background: var(--surface-a);
+    border-top: 1px solid var(--surface-d);
+    color: var(--text-secondary-color);
+  }
+}
+
+.card {
+  background: var(--surface-e);
+  color: var(--text-color);
+}
+
+i:not([class*="fa-"]) {
+  background-color: var(--surface-b);
+}
+
+pre[class*="language-"] {
+  code {
+    & {
+      border-left: 10px solid var(--surface-d) !important;
+      background: var(--surface-b) !important;
+      color: var(--text-color);
+    }
+
+    .token {
+      &.punctuation {
+        color: var(--text-color);
+      }
+    }
+  }
+}

package/resources/assets/scss/smz-dialogs.scss

@@ -1,5 +1 @@
-@use "./dialogs/smz-general-styles" as *;
-// @import "./dialogs/prime10.scss";
-// @import "./dialogs/theme10.scss";
-@use "./dialogs/dialog-ng19" as *;
-@use "./dialogs/menu-ng19" as *;
+@use "./dialogs/smz-general-styles" as *;

package/resources/assets/scss/smz-skin.scss

@@ -0,0 +1,128 @@
+/*
+ * Aparencia dos elementos da core que ainda usam marcacao `p-*` (antes pintados pelo tema do PrimeNG).
+ * Usa somente os tokens do kit (--smz-*): qualquer tema do kit restila tudo.
+ */
+
+/* Campo de texto (diretiva pInputText) */
+.p-inputtext {
+  height: var(--smz-control-h);
+  padding: 0 var(--smz-control-px);
+  border: 1px solid rgb(var(--smz-color-line-strong));
+  border-radius: var(--smz-radius-control);
+  background: rgb(var(--smz-color-surface-1));
+  color: rgb(var(--smz-color-fg));
+  font-family: var(--smz-font-sans);
+  font-size: var(--smz-text-md);
+  transition: border-color var(--smz-duration), box-shadow var(--smz-duration);
+
+  &:focus {
+    outline: none;
+    box-shadow: 0 0 0 2px rgb(var(--smz-color-focus) / 0.45);
+    border-color: rgb(var(--smz-color-focus));
+  }
+
+  &:disabled {
+    opacity: 0.5;
+    cursor: not-allowed;
+  }
+}
+
+/* Grupo de input com addon */
+.p-inputgroup {
+  display: flex;
+  align-items: stretch;
+  width: 100%;
+
+  > .p-inputtext,
+  > * .p-inputtext {
+    flex: 1 1 auto;
+    min-width: 0;
+  }
+
+  > :not(:first-child) {
+    border-top-left-radius: 0;
+    border-bottom-left-radius: 0;
+  }
+
+  > :not(:last-child) {
+    border-top-right-radius: 0;
+    border-bottom-right-radius: 0;
+  }
+}
+
+.p-inputgroup-addon {
+  display: inline-flex;
+  align-items: center;
+  justify-content: center;
+  padding: 0 var(--smz-control-px);
+  border: 1px solid rgb(var(--smz-color-line-strong));
+  border-right: 0;
+  border-radius: var(--smz-radius-control) 0 0 var(--smz-radius-control);
+  background: rgb(var(--smz-color-surface-3));
+  color: rgb(var(--smz-color-fg-muted));
+}
+
+/* Mensagem inline (smz-tag-message) */
+.p-inline-message {
+  gap: 0.5rem;
+  padding: 0.5rem 0.75rem;
+  border-radius: var(--smz-radius-control);
+  background: rgb(var(--smz-color-primary) / 0.12);
+  color: rgb(var(--smz-color-primary));
+  font-family: var(--smz-font-sans);
+  font-size: var(--smz-text-md);
+}
+
+.p-inline-message-success {
+  background: rgb(var(--smz-color-success) / 0.12);
+  color: rgb(var(--smz-color-success-active));
+}
+
+.p-inline-message-warn,
+.p-inline-message-warning {
+  background: rgb(var(--smz-color-warning) / 0.16);
+  color: rgb(var(--smz-color-warning-active));
+}
+
+.p-inline-message-error,
+.p-inline-message-danger {
+  background: rgb(var(--smz-color-danger) / 0.12);
+  color: rgb(var(--smz-color-danger-active));
+}
+
+.p-inline-message-secondary,
+.p-inline-message-contrast {
+  background: rgb(var(--smz-color-surface-3));
+  color: rgb(var(--smz-color-fg));
+}
+
+/* Painel ancorado (overlay do dialog-overlay-panel) */
+.p-overlaypanel {
+  background: rgb(var(--smz-color-surface-2));
+  color: rgb(var(--smz-color-fg));
+  border: 1px solid rgb(var(--smz-color-line));
+  border-radius: var(--smz-radius-overlay);
+  font-family: var(--smz-font-sans);
+
+  &:after,
+  &:before {
+    border-color: transparent;
+    border-bottom-color: rgb(var(--smz-color-surface-2));
+  }
+
+  &:before {
+    border-bottom-color: rgb(var(--smz-color-line));
+  }
+}
+
+.p-overlaypanel-content {
+  padding: 1rem;
+}
+
+/* Rodape de dialog do core: toolbar sem borda/fundo (o rodape do dialog ja tem o seu). */
+ui-toolbar.smz-dialog-footer {
+  border: 0;
+  background: transparent;
+  padding: 0;
+  box-shadow: none;
+}

package/resources/assets/scss/styles.scss

@@ -1,50 +1,49 @@
-/* EXTRAS */
-@use "./extras/extras" as *;
-
-/* PRETTY JSON */
-@use "./extras/pretty-json" as *;
-
-/* SMZ-TABLES */
-@use "./smz-tables" as *;
-
-/* SMZ-TREES */
-@use "./smz-trees" as *;
-
-/* COLORS */
-@use "./extras/colors" as *;
-
-/* DIVIDERS */
-@use "./extras/dividers" as *;
-
-/* PÁGINAS DE ERRO E NOTFOUND */
-@use "./pages/app-exceptions" as *;
-
-/* DIALOGS */
-@use "./smz-dialogs" as *;
-
-/* DOCKS */
-@use "./smz-dock" as *;
-
-/* FORMS */
-@use "./smz-forms" as *;
-
-/* DOCUMENTS */
-@use "./documents/documents" as *;
-
-/* BROWSER STUFFS */
-@use "./extras/browser" as *;
-
-@use "./smz-prime-fix" as *;
-
-/* OVERLAY DO PRIME */
-@use "./overlay-panel/overlay-panel" as *;
-
-/* FOI FEITO UM OVERRIDE DO PRIME GRID ORIGINAL PARA ADICIONAR !IMPORTANT */
-@use './prime-grid/grid' as *;
-
-/* PRIME ICONS */
-@use "primeicons/primeicons.css" as *;
-
-/* ANIMATIONS */
-// @import "hover.css/css/hover-min.css";
-@use "animate.css/animate.min.css" as *;
+/* EXTRAS */
+@use "./extras/extras" as *;
+
+/* PRETTY JSON */
+@use "./extras/pretty-json" as *;
+
+/* SMZ-TABLES */
+@use "./smz-tables" as *;
+
+/* SMZ-TREES */
+@use "./smz-trees" as *;
+
+/* COLORS */
+@use "./extras/colors" as *;
+
+/* DIVIDERS */
+@use "./extras/dividers" as *;
+
+/* PÁGINAS DE ERRO E NOTFOUND */
+@use "./pages/app-exceptions" as *;
+
+/* DIALOGS */
+@use "./smz-dialogs" as *;
+
+/* DOCKS */
+@use "./smz-dock" as *;
+
+/* FORMS */
+@use "./smz-forms" as *;
+
+/* DOCUMENTS */
+@use "./documents/documents" as *;
+
+/* BROWSER STUFFS */
+@use "./extras/browser" as *;
+
+/* APARENCIA DE ELEMENTOS p-* (tokens do kit) */
+@use "./smz-skin" as *;
+
+/* OVERLAY DO PRIME */
+@use "./overlay-panel/overlay-panel" as *;
+
+/* FOI FEITO UM OVERRIDE DO PRIME GRID ORIGINAL PARA ADICIONAR !IMPORTANT */
+@use './prime-grid/grid' as *;
+
+
+/* ANIMATIONS */
+// @import "hover.css/css/hover-min.css";
+@use "animate.css/animate.min.css" as *;