@timus-networks/theme 2.4.11 → 2.4.15

package/dist/module.json

@@ -1,7 +1,7 @@
 {
   "name": "@timus-networks/theme",
   "configKey": "themeOptions",
-  "version": "2.4.11",
+  "version": "2.4.15",
   "builder": {
     "@nuxt/module-builder": "0.8.4",
     "unbuild": "2.0.0"

package/dist/module.mjs

@@ -12,7 +12,7 @@ const __filename = __cjs_url__.fileURLToPath(import.meta.url);
 const __dirname = __cjs_path__.dirname(__filename);
 const require = __cjs_mod__.createRequire(import.meta.url);
 const name = "@timus-networks/theme";
-const version = "2.4.11";
+const version = "2.4.15";
 const description = "A comprehensive Nuxt.js module providing a tailored theme experience with integrated TailwindCSS support for applications.";
 const type = "module";
 const exports = {

package/dist/runtime/plugins/disable-warnings-plugin.js

@@ -5,9 +5,32 @@ export default defineNuxtPlugin((nuxtApp) => {
     "Invalid prop: custom validator"
     // Add other warnings to ignore here
   ];
-  nuxtApp.vueApp.config.warnHandler = (msg, instance, trace) => {
-    if (!ignoredWarnings.some((warning) => msg.includes(warning))) {
-      console.warn(`[Vue warn]: ${msg}${trace}`);
-    }
-  };
+  if (process.env.NODE_ENV === "development") {
+    const originalWarn = console.warn;
+    const safeStringify = (obj, maxDepth = 3) => {
+      const seen = /* @__PURE__ */ new WeakSet();
+      return JSON.stringify(obj, (key, value) => {
+        if (typeof value === "object" && value !== null) {
+          if (seen.has(value)) {
+            return "[Circular]";
+          }
+          seen.add(value);
+          if (maxDepth < 1) {
+            return "[Object]";
+          }
+          return Object.fromEntries(Object.entries(value).map(([k, v]) => [k, safeStringify(v, maxDepth - 1)]));
+        }
+        return value;
+      });
+    };
+    console.warn = (...args) => {
+      const stringArgs = args.map((arg) => typeof arg === "string" ? arg : arg instanceof Error ? arg.toString() : safeStringify(arg, 2));
+      const warningMessage = stringArgs.join(" ");
+      if (!ignoredWarnings.some((warning) => warningMessage.includes(warning))) {
+        console.group("Vue Warning");
+        originalWarn(...args);
+        console.groupEnd();
+      }
+    };
+  }
 });

package/dist/runtime/plugins/disable-warnings-plugin.mjs

@@ -5,9 +5,32 @@ export default defineNuxtPlugin((nuxtApp) => {
     "Invalid prop: custom validator"
     // Add other warnings to ignore here
   ];
-  nuxtApp.vueApp.config.warnHandler = (msg, instance, trace) => {
-    if (!ignoredWarnings.some((warning) => msg.includes(warning))) {
-      console.warn(`[Vue warn]: ${msg}${trace}`);
-    }
-  };
+  if (process.env.NODE_ENV === "development") {
+    const originalWarn = console.warn;
+    const safeStringify = (obj, maxDepth = 3) => {
+      const seen = /* @__PURE__ */ new WeakSet();
+      return JSON.stringify(obj, (key, value) => {
+        if (typeof value === "object" && value !== null) {
+          if (seen.has(value)) {
+            return "[Circular]";
+          }
+          seen.add(value);
+          if (maxDepth < 1) {
+            return "[Object]";
+          }
+          return Object.fromEntries(Object.entries(value).map(([k, v]) => [k, safeStringify(v, maxDepth - 1)]));
+        }
+        return value;
+      });
+    };
+    console.warn = (...args) => {
+      const stringArgs = args.map((arg) => typeof arg === "string" ? arg : arg instanceof Error ? arg.toString() : safeStringify(arg, 2));
+      const warningMessage = stringArgs.join(" ");
+      if (!ignoredWarnings.some((warning) => warningMessage.includes(warning))) {
+        console.group("Vue Warning");
+        originalWarn(...args);
+        console.groupEnd();
+      }
+    };
+  }
 });

package/dist/runtime/public/scss/_buttons.scss

@@ -1,3 +1,6 @@
+@use 'colors' as *;
+@use 'icons' as *;
+
 $btn-config: (
   'xs': (
     min-width: 24px,
@@ -90,7 +93,8 @@ $btn-active-bg: 700;
       }
     }
 
-    &-outline, &-ghost {
+    &-outline,
+    &-ghost {
       --button-background-color: var(--#{$name}-#{500}); // #{map.get($item, #{$btn-bg})};
       --button-border-color: var(--#{$name}-#{500});
       --button-hover-color: var(--button-hover-font-color);

package/dist/runtime/public/scss/_inputs.scss

@@ -1,3 +1,5 @@
+@use 'icons' as *;
+
 $input-config: (
   'xs': (
     min-height: 24px,

package/dist/runtime/public/scss/element-plus/color/index.scss

@@ -1,17 +1,18 @@
 @use 'sass:color';
 @use 'sass:string';
+@use 'sass:math';
 
 @function rgb2hex($color) {
-  @return unquote('#' + #{string.slice(color.ie-hex-str($color), 4)});
+  @return string.unquote('#' + #{string.slice(color.ie-hex-str($color), 4)});
 }
 
 // rgba color above solid color
 @function mix-overlay-color($upper, $lower) {
-  $opacity: color.alpha($upper);
+  $opacity: color.channel($upper, 'alpha');
 
-  $red: color.red($upper) * $opacity + color.red($lower) * (1 - $opacity);
-  $green: color.green($upper) * $opacity + color.green($lower) * (1 - $opacity);
-  $blue: color.blue($upper) * $opacity + color.blue($lower) * (1 - $opacity);
+  $red: math.round(color.channel($upper, 'red') * $opacity + color.channel($lower, 'red') * (1 - $opacity));
+  $green: math.round(color.channel($upper, 'green') * $opacity + color.channel($lower, 'green') * (1 - $opacity));
+  $blue: math.round(color.channel($upper, 'blue') * $opacity + color.channel($lower, 'blue') * (1 - $opacity));
 
   @return rgb2hex(rgb($red, $green, $blue));
 }

package/dist/runtime/public/scss/element-plus/dark/var.scss

@@ -1,3 +1,4 @@
+@use 'sass:color';
 @use 'sass:map';
 @use 'sass:math';
 
@@ -30,7 +31,7 @@ $colors: () !default;
     (
       $type: (
         '#{$mode}-#{$number}':
-          mix(
+          color.mix(
             $mix-color,
             map.get($colors, $type, 'base'),
             math.percentage(math.div($number, 10))

package/dist/runtime/public/scss/element-plus/mixins/_var.scss

@@ -1,4 +1,5 @@
 @use 'sass:map';
+@use 'sass:color';
 
 @use 'config';
 @use 'function' as *;
@@ -44,7 +45,12 @@
 
 @mixin set-css-color-rgb($type) {
   $color: map.get($colors, $type, 'base');
-  @include set-css-var-value(('color', $type, 'rgb'), #{red($color), green($color), blue($color)});
+  @include set-css-var-value(
+    ('color', $type, 'rgb'),
+    #{color.channel($color, 'red', $space: rgb),
+    color.channel($color, 'green', $space: rgb),
+    color.channel($color, 'blue', $space: rgb)}
+  );
 }
 
 // generate css var from existing css var

package/dist/runtime/public/scss/element-plus/mixins/function.scss

@@ -1,16 +1,18 @@
 @use 'config';
+@use 'sass:meta';
+@use 'sass:string';
 
 // BEM support Func
 @function selectorToString($selector) {
-  $selector: inspect($selector);
-  $selector: str-slice($selector, 2, -2);
+  $selector: meta.inspect($selector);
+  $selector: string.slice($selector, 2, -2);
   @return $selector;
 }
 
 @function containsModifier($selector) {
   $selector: selectorToString($selector);
 
-  @if str-index($selector, config.$modifier-separator) {
+  @if string.index($selector, config.$modifier-separator) {
     @return true;
   } @else {
     @return false;
@@ -20,7 +22,7 @@
 @function containWhenFlag($selector) {
   $selector: selectorToString($selector);
 
-  @if str-index($selector, '.' + config.$state-prefix) {
+  @if string.index($selector, '.' + config.$state-prefix) {
     @return true;
   } @else {
     @return false;
@@ -30,7 +32,7 @@
 @function containPseudoClass($selector) {
   $selector: selectorToString($selector);
 
-  @if str-index($selector, ':') {
+  @if string.index($selector, ':') {
     @return true;
   } @else {
     @return false;

package/dist/runtime/public/scss/element-plus/mixins/mixins.scss

@@ -1,3 +1,5 @@
+@use 'sass:map';
+@use 'sass:string';
 @use 'function' as *;
 @use '../common/var' as *;
 // forward mixins
@@ -9,8 +11,8 @@
 // Break-points
 @mixin res($key, $map: $breakpoints) {
   // loop breakpoint Map, return if present
-  @if map-has-key($map, $key) {
-    @media only screen and #{unquote(map-get($map, $key))} {
+  @if map.has-key($map, $key) {
+    @media only screen and #{string.unquote(map.get($map, $key))} {
       @content;
     }
   } @else {

package/dist/runtime/public/scss/theme.css

@@ -301,6 +301,107 @@
 :root {
   --el-color-warning-light-9: #3b3212;
 }
+[class^=icon],
+[class*=" icon"] {
+  align-items: center;
+  display: flex;
+  gap: 4px;
+  position: relative;
+}
+[class^=icon-xxs]::before,
+[class*=" icon-xxs"]::before, [class^=icon-xxs]::after,
+[class*=" icon-xxs"]::after {
+  --icon-xxs-min-width: 0.75rem;
+  min-width: var(--icon-xxs-min-width);
+  --icon-xxs-min-height: 0.75rem;
+  min-height: var(--icon-xxs-min-height);
+  --icon-xxs-font-size: 0.75rem;
+  font-size: var(--icon-xxs-font-size);
+}
+.form-control-xs::before, .btn-xs::before, [class^=icon-xs]::before,
+[class*=" icon-xs"]::before, .form-control-xs::after, .btn-xs::after, [class^=icon-xs]::after,
+[class*=" icon-xs"]::after {
+  --icon-xs-min-width: 1rem;
+  min-width: var(--icon-xs-min-width);
+  --icon-xs-min-height: 1rem;
+  min-height: var(--icon-xs-min-height);
+  --icon-xs-font-size: 1rem;
+  font-size: var(--icon-xs-font-size);
+}
+.form-control-sm::before, .btn-sm::before, [class^=icon-sm]::before,
+[class*=" icon-sm"]::before, .form-control-sm::after, .btn-sm::after, [class^=icon-sm]::after,
+[class*=" icon-sm"]::after {
+  --icon-sm-min-width: 1.25rem;
+  min-width: var(--icon-sm-min-width);
+  --icon-sm-min-height: 1.25rem;
+  min-height: var(--icon-sm-min-height);
+  --icon-sm-font-size: 1.25rem;
+  font-size: var(--icon-sm-font-size);
+}
+.form-control-md::before, .btn-md::before, [class^=icon-md]::before,
+[class*=" icon-md"]::before, .form-control-md::after, .btn-md::after, [class^=icon-md]::after,
+[class*=" icon-md"]::after {
+  --icon-md-min-width: 1.25rem;
+  min-width: var(--icon-md-min-width);
+  --icon-md-min-height: 1.25rem;
+  min-height: var(--icon-md-min-height);
+  --icon-md-font-size: 1.25rem;
+  font-size: var(--icon-md-font-size);
+}
+.form-control-lg::before, .btn-lg::before, [class^=icon-lg]::before,
+[class*=" icon-lg"]::before, .form-control-lg::after, .btn-lg::after, [class^=icon-lg]::after,
+[class*=" icon-lg"]::after {
+  --icon-lg-min-width: 1.5rem;
+  min-width: var(--icon-lg-min-width);
+  --icon-lg-min-height: 1.5rem;
+  min-height: var(--icon-lg-min-height);
+  --icon-lg-font-size: 1.5rem;
+  font-size: var(--icon-lg-font-size);
+}
+.form-control-xl::before, .btn-xl::before, [class^=icon-xl]::before,
+[class*=" icon-xl"]::before, .form-control-xl::after, .btn-xl::after, [class^=icon-xl]::after,
+[class*=" icon-xl"]::after {
+  --icon-xl-min-width: 1.75rem;
+  min-width: var(--icon-xl-min-width);
+  --icon-xl-min-height: 1.75rem;
+  min-height: var(--icon-xl-min-height);
+  --icon-xl-font-size: 1.75rem;
+  font-size: var(--icon-xl-font-size);
+}
+[class^=icon-xxl]::before,
+[class*=" icon-xxl"]::before, [class^=icon-xxl]::after,
+[class*=" icon-xxl"]::after {
+  --icon-xxl-min-width: 2em;
+  min-width: var(--icon-xxl-min-width);
+  --icon-xxl-min-height: 2rem;
+  min-height: var(--icon-xxl-min-height);
+  --icon-xxl-font-size: 2rem;
+  font-size: var(--icon-xxl-font-size);
+}
+[class^=icon-left]::before,
+[class*=" icon-left"]::before {
+  content: "";
+}
+[class^=icon-left]::after,
+[class*=" icon-left"]::after {
+  content: none;
+}
+[class^=icon-right]::before,
+[class*=" icon-right"]::before {
+  content: none;
+}
+[class^=icon]:empty,
+[class*=" icon"]:empty {
+  justify-content: center;
+  margin: 0;
+  padding: 0;
+}
+[class^=icon]:empty::before, [class^=icon]:empty::after,
+[class*=" icon"]:empty::before,
+[class*=" icon"]:empty::after {
+  margin: 0;
+}
+
 .btn {
   text-overflow: ellipsis;
   white-space: nowrap;
@@ -984,107 +1085,6 @@ h6,
   line-height: var(---p-tiny-line-height);
 }
 
-[class^=icon],
-[class*=" icon"] {
-  align-items: center;
-  display: flex;
-  gap: 4px;
-  position: relative;
-}
-[class^=icon-xxs]::before,
-[class*=" icon-xxs"]::before, [class^=icon-xxs]::after,
-[class*=" icon-xxs"]::after {
-  --icon-xxs-min-width: 0.75rem;
-  min-width: var(--icon-xxs-min-width);
-  --icon-xxs-min-height: 0.75rem;
-  min-height: var(--icon-xxs-min-height);
-  --icon-xxs-font-size: 0.75rem;
-  font-size: var(--icon-xxs-font-size);
-}
-.form-control-xs::before, [class^=icon-xs]::before,
-[class*=" icon-xs"]::before, .btn-xs::before, .form-control-xs::after, [class^=icon-xs]::after,
-[class*=" icon-xs"]::after, .btn-xs::after {
-  --icon-xs-min-width: 1rem;
-  min-width: var(--icon-xs-min-width);
-  --icon-xs-min-height: 1rem;
-  min-height: var(--icon-xs-min-height);
-  --icon-xs-font-size: 1rem;
-  font-size: var(--icon-xs-font-size);
-}
-.form-control-sm::before, [class^=icon-sm]::before,
-[class*=" icon-sm"]::before, .btn-sm::before, .form-control-sm::after, [class^=icon-sm]::after,
-[class*=" icon-sm"]::after, .btn-sm::after {
-  --icon-sm-min-width: 1.25rem;
-  min-width: var(--icon-sm-min-width);
-  --icon-sm-min-height: 1.25rem;
-  min-height: var(--icon-sm-min-height);
-  --icon-sm-font-size: 1.25rem;
-  font-size: var(--icon-sm-font-size);
-}
-.form-control-md::before, [class^=icon-md]::before,
-[class*=" icon-md"]::before, .btn-md::before, .form-control-md::after, [class^=icon-md]::after,
-[class*=" icon-md"]::after, .btn-md::after {
-  --icon-md-min-width: 1.25rem;
-  min-width: var(--icon-md-min-width);
-  --icon-md-min-height: 1.25rem;
-  min-height: var(--icon-md-min-height);
-  --icon-md-font-size: 1.25rem;
-  font-size: var(--icon-md-font-size);
-}
-.form-control-lg::before, [class^=icon-lg]::before,
-[class*=" icon-lg"]::before, .btn-lg::before, .form-control-lg::after, [class^=icon-lg]::after,
-[class*=" icon-lg"]::after, .btn-lg::after {
-  --icon-lg-min-width: 1.5rem;
-  min-width: var(--icon-lg-min-width);
-  --icon-lg-min-height: 1.5rem;
-  min-height: var(--icon-lg-min-height);
-  --icon-lg-font-size: 1.5rem;
-  font-size: var(--icon-lg-font-size);
-}
-.form-control-xl::before, [class^=icon-xl]::before,
-[class*=" icon-xl"]::before, .btn-xl::before, .form-control-xl::after, [class^=icon-xl]::after,
-[class*=" icon-xl"]::after, .btn-xl::after {
-  --icon-xl-min-width: 1.75rem;
-  min-width: var(--icon-xl-min-width);
-  --icon-xl-min-height: 1.75rem;
-  min-height: var(--icon-xl-min-height);
-  --icon-xl-font-size: 1.75rem;
-  font-size: var(--icon-xl-font-size);
-}
-[class^=icon-xxl]::before,
-[class*=" icon-xxl"]::before, [class^=icon-xxl]::after,
-[class*=" icon-xxl"]::after {
-  --icon-xxl-min-width: 2em;
-  min-width: var(--icon-xxl-min-width);
-  --icon-xxl-min-height: 2rem;
-  min-height: var(--icon-xxl-min-height);
-  --icon-xxl-font-size: 2rem;
-  font-size: var(--icon-xxl-font-size);
-}
-[class^=icon-left]::before,
-[class*=" icon-left"]::before {
-  content: "";
-}
-[class^=icon-left]::after,
-[class*=" icon-left"]::after {
-  content: none;
-}
-[class^=icon-right]::before,
-[class*=" icon-right"]::before {
-  content: none;
-}
-[class^=icon]:empty,
-[class*=" icon"]:empty {
-  justify-content: center;
-  margin: 0;
-  padding: 0;
-}
-[class^=icon]:empty::before, [class^=icon]:empty::after,
-[class*=" icon"]:empty::before,
-[class*=" icon"]:empty::after {
-  margin: 0;
-}
-
 .form-control {
   border: 1px solid var(--brand-100);
   border-radius: 4px;

package/dist/runtime/public/scss/theme.scss

@@ -1,13 +1,18 @@
-@import 'variables';
-@import 'colors';
-@import 'buttons.scss';
-@import 'containers';
-@import 'fonts';
-@import 'icons';
-@import 'inputs.scss';
-@import 'logo.scss';
-@import 'selectbox.scss';
-// @import 'layers.scss';
+@use 'variables' as *;
+@use 'colors' as *;
+@use 'buttons' as *;
+@use 'containers' as *;
+@use 'fonts' as *;
+@use 'icons' as *;
+@use 'inputs' as *;
+@use 'logo' as *;
+@use 'selectbox' as *;
+// @use 'layers' as *;
+
+// variables.scss dosyasını forward edelim, böylece diğer dosyalar da kullanabilir
+
+@forward 'variables';
+
 html,
 body,
 #main {

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@timus-networks/theme",
-  "version": "2.4.11",
+  "version": "2.4.15",
   "description": "A comprehensive Nuxt.js module providing a tailored theme experience with integrated TailwindCSS support for applications.",
   "type": "module",
   "exports": {