@zeedhi/common 3.0.6 → 3.0.7

package/src/styles/_functions.scss

@@ -1,3 +1,6 @@
+@use "sass:map";
+@use "sass:meta";
+
 /**
  * The MIT License (MIT)
  *
@@ -29,29 +32,29 @@
     $result: $parent-map;
   
     @each $key, $child in $child-map {
-      $parent-has-key: map-has-key($result, $key);
-      $parent-value: map-get($result, $key);
-      $parent-type: type-of($parent-value);
-      $child-type: type-of($child);
+      $parent-has-key: map.has-key($result, $key);
+      $parent-value: map.get($result, $key);
+      $parent-type: meta.type-of($parent-value);
+      $child-type: meta.type-of($child);
       $parent-is-map: $parent-type == map;
       $child-is-map: $child-type == map;
   
       @if (not $parent-has-key) or ($parent-type != $child-type) or (not ($parent-is-map and $child-is-map)){
-        $result: map-merge($result, ( $key: $child ));
+        $result: map.merge($result, ( $key: $child ));
       }
       @else {
-        $result: map-merge($result, ( $key: map-deep-merge($parent-value, $child) ));
+        $result: map.merge($result, ( $key: map-deep-merge($parent-value, $child) ));
       }
     }
   
     @return $result;
   }
   
-  @function breakpoint-min($name, $breakpoints: $grid-breakpoints) {
-    $min: map-get($breakpoints, $name);
-    @return if($min != 0, $min, null);
+  @function breakpoint-min($name, $breakpoints: variables.$grid-breakpoints) {
+    $min: map.get($breakpoints, $name);
+    @return if(sass($min != 0): $min);
   }
   
-  @function breakpoint-infix($name, $breakpoints: $grid-breakpoints) {
-    @return if(breakpoint-min($name, $breakpoints) == null, "", "-#{$name}");
+  @function breakpoint-infix($name, $breakpoints: variables.$grid-breakpoints) {
+    @return if(sass(breakpoint-min($name, $breakpoints) == null): ""; else: "-#{$name}");
   }  

package/src/styles/_utilities.scss

@@ -25,10 +25,15 @@
  * (https://github.com/vuetifyjs/vuetify/blob/v1.5.16/packages/vuetify/src/styles/tools/_utilities.sass)
  */
  
- @import '_functions';
+ @use "sass:list";
+@use "sass:map";
+@use "sass:math";
+@use "sass:meta";
+@use '_functions';
+@use "variables";
 
  $utilities: () !default;
- $utilities: map-deep-merge(
+ $utilities: functions.map-deep-merge(
    (
      "display": (
        responsive: true,
@@ -160,55 +165,55 @@
        responsive: true,
        property: margin,
        class: zd-ma,
-       values: map-merge($spacers, (auto: auto))
+       values: map.merge(variables.$spacers, (auto: auto))
      ),
      "margin-x": (
        responsive: true,
        property: margin-right margin-left,
        class: zd-mx,
-       values: map-merge($spacers, (auto: auto))
+       values: map.merge(variables.$spacers, (auto: auto))
      ),
      "margin-y": (
        responsive: true,
        property: margin-top margin-bottom,
        class: zd-my,
-       values: map-merge($spacers, (auto: auto))
+       values: map.merge(variables.$spacers, (auto: auto))
      ),
      "margin-top": (
        responsive: true,
        property: margin-top,
        class: zd-mt,
-       values: map-merge($spacers, (auto: auto))
+       values: map.merge(variables.$spacers, (auto: auto))
      ),
      "margin-right": (
        responsive: true,
        property: margin-right,
        class: zd-mr,
-       values: map-merge($spacers, (auto: auto))
+       values: map.merge(variables.$spacers, (auto: auto))
      ),
      "margin-bottom": (
        responsive: true,
        property: margin-bottom,
        class: zd-mb,
-       values: map-merge($spacers, (auto: auto))
+       values: map.merge(variables.$spacers, (auto: auto))
      ),
      "margin-left": (
        responsive: true,
        property: margin-left,
        class: zd-ml,
-       values: map-merge($spacers, (auto: auto))
+       values: map.merge(variables.$spacers, (auto: auto))
      ),
      "margin-start": (
        responsive: true,
        property: margin-left,
        class: zd-ms,
-       values: map-merge($spacers, (auto: auto))
+       values: map.merge(variables.$spacers, (auto: auto))
      ),
      "margin-end": (
        responsive: true,
        property: margin-right,
        class: zd-me,
-       values: map-merge($spacers, (auto: auto))
+       values: map.merge(variables.$spacers, (auto: auto))
      ),
  
      // Negative margin utilities
@@ -216,55 +221,55 @@
        responsive: true,
        property: margin,
        class: zd-ma,
-       values: $negative-spacers
+       values: variables.$negative-spacers
      ),
      "negative-margin-x": (
        responsive: true,
        property: margin-right margin-left,
        class: zd-mx,
-       values: $negative-spacers
+       values: variables.$negative-spacers
      ),
      "negative-margin-y": (
        responsive: true,
        property: margin-top margin-bottom,
        class: zd-my,
-       values: $negative-spacers
+       values: variables.$negative-spacers
      ),
      "negative-margin-top": (
        responsive: true,
        property: margin-top,
        class: zd-mt,
-       values: $negative-spacers
+       values: variables.$negative-spacers
      ),
      "negative-margin-right": (
        responsive: true,
        property: margin-right,
        class: zd-mr,
-       values: $negative-spacers
+       values: variables.$negative-spacers
      ),
      "negative-margin-bottom": (
        responsive: true,
        property: margin-bottom,
        class: zd-mb,
-       values: $negative-spacers
+       values: variables.$negative-spacers
      ),
      "negative-margin-left": (
        responsive: true,
        property: margin-left,
        class: zd-ml,
-       values: $negative-spacers
+       values: variables.$negative-spacers
      ),
      "negative-margin-start": (
        responsive: true,
        property: margin-left,
        class: zd-ms,
-       values: $negative-spacers
+       values: variables.$negative-spacers
      ),
      "negative-margin-end": (
        responsive: true,
        property: margin-right,
        class: zd-me,
-       values: $negative-spacers
+       values: variables.$negative-spacers
      ),
  
      // Padding utilities
@@ -272,55 +277,55 @@
        responsive: true,
        property: padding,
        class: zd-pa,
-       values: $spacers
+       values: variables.$spacers
      ),
      "padding-x": (
        responsive: true,
        property: padding-right padding-left,
        class: zd-px,
-       values: $spacers
+       values: variables.$spacers
      ),
      "padding-y": (
        responsive: true,
        property: padding-top padding-bottom,
        class: zd-py,
-       values: $spacers
+       values: variables.$spacers
      ),
      "padding-top": (
        responsive: true,
        property: padding-top,
        class: zd-pt,
-       values: $spacers
+       values: variables.$spacers
      ),
      "padding-right": (
        responsive: true,
        property: padding-right,
        class: zd-pr,
-       values: $spacers
+       values: variables.$spacers
      ),
      "padding-bottom": (
        responsive: true,
        property: padding-bottom,
        class: zd-pb,
-       values: $spacers
+       values: variables.$spacers
      ),
      "padding-left": (
        responsive: true,
        property: padding-left,
        class: zd-pl,
-       values: $spacers
+       values: variables.$spacers
      ),
      "padding-start": (
        responsive: true,
        property: padding-left,
        class: zd-ps,
-       values: $spacers
+       values: variables.$spacers
      ),
      "padding-end": (
        responsive: true,
        property: padding-right,
        class: zd-pe,
-       values: $spacers
+       values: variables.$spacers
      ),
  
      // Gap utilities
@@ -328,19 +333,19 @@
        responsive: true,
        property: gap,
        class: zd-gap-a,
-       values: $spacers
+       values: variables.$spacers
      ),
      "gap-x": (
        responsive: true,
        property: column-gap,
        class: zd-gap-x,
-       values: $spacers
+       values: variables.$spacers
      ),
      "gap-y": (
        responsive: true,
        property: row-gap,
        class: zd-gap-y,
-       values: $spacers
+       values: variables.$spacers
      ),
  
      // Text
@@ -354,8 +359,8 @@
    $utilities
  );
  
- @mixin media-breakpoint-up($name, $breakpoints: $grid-breakpoints) {
-   $min: breakpoint-min($name, $breakpoints);
+ @mixin media-breakpoint-up($name, $breakpoints: variables.$grid-breakpoints) {
+   $min: functions.breakpoint-min($name, $breakpoints);
    @if $min {
      @media (min-width: $min) {
        @content;
@@ -367,32 +372,32 @@
  }
  
  @mixin generate-utility($utility, $infix) {
-   $values: map-get($utility, values);
+   $values: map.get($utility, values);
  
    // If the values are a list or string, convert it into a map
-   @if type-of($values) == "string" or type-of(nth($values, 1)) != "list" {
-     $values: zip($values, $values);
+   @if meta.type-of($values) == "string" or meta.type-of(list.nth($values, 1)) != "list" {
+     $values: list.zip($values, $values);
    }
  
    @each $value in $values {
-     $properties: map-get($utility, property);
+     $properties: map.get($utility, property);
  
      // Multiple properties are possible, for example with vertical or horizontal margins or paddings
-     @if type-of($properties) == 'string' {
-       $properties: append((), $properties);
+     @if meta.type-of($properties) == 'string' {
+       $properties: list.append((), $properties);
      }
  
      // Property can be a map, where the key is a mixin to include
-     @if type-of($properties) == 'map' {
+     @if meta.type-of($properties) == 'map' {
        @each $dir in $properties {
-         $mixin: nth($dir, 1);
+         $mixin: list.nth($dir, 1);
          // SASS doesn't support dynamic mixin invocation
          // https://github.com/sass/sass/issues/626
          @if $mixin == 'ltr' {
-           @include generate-utility-body($utility, nth($dir, 2), $value, $infix);
+           @include generate-utility-body($utility, list.nth($dir, 2), $value, $infix);
          }
          @else if $mixin == 'rtl' {
-           @include generate-utility-body($utility, nth($dir, 2), $value, $infix);
+           @include generate-utility-body($utility, list.nth($dir, 2), $value, $infix);
          }
          @else {
            @error 'Only RTL and LTR are supported';
@@ -407,20 +412,20 @@
  
  @mixin generate-utility-body($utility, $properties, $value, $infix) {
    // Use custom class if present
-   $property-class: map-get($utility, class);
-   $property-class: if($property-class, $property-class, nth($properties, 1));
+   $property-class: map.get($utility, class);
+   $property-class: if(sass($property-class): $property-class; else: list.nth($properties, 1));
  
    // Don't prefix if value key is null (eg. with shadow class)
-   $property-class-modifier: if(nth($value, 1), "-" + nth($value, 1), "");
+   $property-class-modifier: if(sass(list.nth($value, 1)): "-" + list.nth($value, 1); else: "");
  
-   $value: nth($value, 2);
+   $value: list.nth($value, 2);
  
    .#{$property-class + $infix + $property-class-modifier} {
-     @for $i from 1 through length($properties) {
-       $property: nth($properties, $i);
+     @for $i from 1 through list.length($properties) {
+       $property: list.nth($properties, $i);
        $val: $value;
-       @if type-of($value) == 'list' and length($properties) == length($value) {
-         $val: nth($value, $i);
+       @if meta.type-of($value) == 'list' and list.length($properties) == list.length($value) {
+         $val: list.nth($value, $i);
        }
        #{$property}: $val !important;
      }
@@ -428,16 +433,16 @@
  }
  
  // Utilities
- @each $breakpoint in map-keys($grid-breakpoints) {
+ @each $breakpoint in map.keys(variables.$grid-breakpoints) {
    // Generate media query if needed
    @include media-breakpoint-up($breakpoint) {
-     $infix: breakpoint-infix($breakpoint, $grid-breakpoints);
+     $infix: functions.breakpoint-infix($breakpoint, variables.$grid-breakpoints);
  
      // Loop over each utility property
      @each $key, $utility in $utilities {
        // The utility can be disabled with `false`, thus check if the utility is a map first
        // Only proceed if responsive media queries are enabled or if it's the base media query
-       @if type-of($utility) == "map" and (map-get($utility, responsive) or $infix == "") {
+       @if meta.type-of($utility) == "map" and (map.get($utility, responsive) or $infix == "") {
          @include generate-utility($utility, $infix);
        }
      }
@@ -449,7 +454,7 @@
    @each $key, $utility in $utilities {
      // The utility can be disabled with `false`, thus check if the utility is a map first
      // Then check if the utility needs print styles
-     @if type-of($utility) == "map" and map-get($utility, print) == true {
+     @if meta.type-of($utility) == "map" and map.get($utility, print) == true {
        @include generate-utility($utility, "-print");
      }
    }
@@ -465,14 +470,14 @@
    max-width: 100%;
  }
  
- @each $breakpoint in map-keys($grid-breakpoints) {
+ @each $breakpoint in map.keys(variables.$grid-breakpoints) {
    // Generate media query if needed
    @include media-breakpoint-up($breakpoint) {
-     $infix: breakpoint-infix($breakpoint, $grid-breakpoints);
+     $infix: functions.breakpoint-infix($breakpoint, variables.$grid-breakpoints);
  
      // Loop over each column
      @for $n from 1 through $grid-columns {
-       $val: percentage($n / $grid-columns);
+       $val: math.percentage(math.div($n, $grid-columns) or calc($n / $grid-columns));
        #{$grid-class + $infix + "-" + $n} {
          max-width: $val;
          flex: 0 0 $val;
@@ -495,14 +500,14 @@
    margin-left: auto;
  }
  
- @each $breakpoint in map-keys($grid-breakpoints) {
+ @each $breakpoint in map.keys(variables.$grid-breakpoints) {
    // Generate media query if needed
    @include media-breakpoint-up($breakpoint) {
-     $infix: breakpoint-infix($breakpoint, $grid-breakpoints);
+     $infix: functions.breakpoint-infix($breakpoint, variables.$grid-breakpoints);
  
      // Loop over each column
      @for $n from 1 through $column-offset {
-       $val: percentage($n / $column-offset);
+       $val: math.percentage(math.div($n, $column-offset) or calc($n / $column-offset));
        #{$column-offset-class + $infix + "-" + $n} {        
          margin-left: $val;
        } 

package/src/styles/_variables.scss

@@ -25,20 +25,21 @@
  * (https://github.com/vuetifyjs/vuetify/blob/v1.5.16/packages/vuetify/src/styles/settings/_variables.sass)
  */
  
- @import '_functions';
+ @use "sass:map";
+@use '_functions';
 
  $spacer: 4px !default;
  $spacers: ();
  @for $i from 0 through 12 {
-   $spacers: map-merge($spacers, ($i: $spacer * $i))
+   $spacers: map.merge($spacers, ($i: $spacer * $i))
  }
  $negative-spacers: ();
  @for $i from 1 through 12 {
-   $negative-spacers: map-merge($negative-spacers, ("n" + $i: -$spacer * $i))
+   $negative-spacers: map.merge($negative-spacers, ("n" + $i: -$spacer * $i))
  }
  
  $grid-breakpoints: () !default;
- $grid-breakpoints: map-deep-merge(
+ $grid-breakpoints: functions.map-deep-merge(
    (
      'xs': 0,
      'sm': 600px,
@@ -50,21 +51,21 @@
  );
  
  $display-breakpoints: () !default;
- $display-breakpoints: map-deep-merge(
+ $display-breakpoints: functions.map-deep-merge(
    (
      'print-only': 'only print',
      'screen-only': 'only screen',
-     'xs-only': 'only screen and (max-width: #{map-get($grid-breakpoints, 'sm') - 1})',
-     'sm-only': 'only screen and (min-width: #{map-get($grid-breakpoints, 'sm')}) and (max-width: #{map-get($grid-breakpoints, 'md') - 1})',
-     'sm-and-down': 'only screen and (max-width: #{map-get($grid-breakpoints, 'md') - 1})',
-     'sm-and-up': 'only screen and (min-width: #{map-get($grid-breakpoints, 'sm')})',
-     'md-only': 'only screen and (min-width: #{map-get($grid-breakpoints, 'md')}) and (max-width: #{map-get($grid-breakpoints, 'lg') - 1})',
-     'md-and-down': 'only screen and (max-width: #{map-get($grid-breakpoints, 'lg') - 1})',
-     'md-and-up': 'only screen and (min-width: #{map-get($grid-breakpoints, 'md')})',
-     'lg-only': 'only screen and (min-width: #{map-get($grid-breakpoints, 'lg')}) and (max-width: #{map-get($grid-breakpoints, 'xl') - 1})',
-     'lg-and-down': 'only screen and (max-width: #{map-get($grid-breakpoints, 'xl') - 1})',
-     'lg-and-up': 'only screen and (min-width: #{map-get($grid-breakpoints, 'lg')})',
-     'xl-only': 'only screen and (min-width: #{map-get($grid-breakpoints, 'xl')})'
+     'xs-only': 'only screen and (max-width: #{map.get($grid-breakpoints, 'sm') - 1})',
+     'sm-only': 'only screen and (min-width: #{map.get($grid-breakpoints, 'sm')}) and (max-width: #{map.get($grid-breakpoints, 'md') - 1})',
+     'sm-and-down': 'only screen and (max-width: #{map.get($grid-breakpoints, 'md') - 1})',
+     'sm-and-up': 'only screen and (min-width: #{map.get($grid-breakpoints, 'sm')})',
+     'md-only': 'only screen and (min-width: #{map.get($grid-breakpoints, 'md')}) and (max-width: #{map.get($grid-breakpoints, 'lg') - 1})',
+     'md-and-down': 'only screen and (max-width: #{map.get($grid-breakpoints, 'lg') - 1})',
+     'md-and-up': 'only screen and (min-width: #{map.get($grid-breakpoints, 'md')})',
+     'lg-only': 'only screen and (min-width: #{map.get($grid-breakpoints, 'lg')}) and (max-width: #{map.get($grid-breakpoints, 'xl') - 1})',
+     'lg-and-down': 'only screen and (max-width: #{map.get($grid-breakpoints, 'xl') - 1})',
+     'lg-and-up': 'only screen and (min-width: #{map.get($grid-breakpoints, 'lg')})',
+     'xl-only': 'only screen and (min-width: #{map.get($grid-breakpoints, 'xl')})'
    ), 
    $display-breakpoints
  ); 

package/src/styles/index.scss

@@ -1,5 +1,5 @@
-@import 'variables';
-@import 'display';
-@import 'elevation';
-@import 'text';
-@import 'utilities';
+@use 'variables';
+@use 'display';
+@use 'elevation';
+@use 'text';
+@use 'utilities';

package/src/utils/date-utils/date-utils.ts

@@ -16,3 +16,12 @@ export function isDateAllowed(
 	}
 	return allowedDates.indexOf(dateString) !== -1;
 }
+
+/**
+ * Translates a date format into a mask format
+ * @param format The format to be translated
+ * @returns The mask format
+ */
+export function toMask(format: string): string {
+	return format.replace(/[A-Za-z]/gi, '#');
+}

package/src/utils/tree-data-structure/tree-data-structure.ts

@@ -279,7 +279,7 @@ export class TreeDataStructure implements ITreeDataStructure {
 
 		if (row[columns[index]] === nextRow[columns[index]]) {
 			const nextIndex = index + 1;
-			if (Object.prototype.hasOwnProperty.call(columns, nextIndex)) {
+			if (Object.hasOwn(columns, nextIndex)) {
 				return this.sort(row, nextRow, columns, types, nextIndex);
 			}
 			return orderTypes.same;