kmaterialize 2.0.0 → 2.3.3-1.0.1

package/package.json

@@ -1,62 +1,97 @@
 {
   "name": "kmaterialize",
-  "description": "Kevin's Materialize (fork): A modern responsive front-end framework based on Material Design",
-  "author": "Kévin Zarshenas",
-  "version": "2.0.0",
-  "main": "dist/js/materialize.js",
+  "description": "The responsive front-end library based on Material Design from Google.",
+  "author": "The Materialize Team",
+  "homepage": "https://materialize.kevinzarshenas.com",
+  "version": "2.3.3-1.0.1",
   "style": "dist/css/materialize.css",
+  "sass": "sass/materialize.scss",
+  "typings": "dist/js/materialize.d.ts",
   "license": "MIT",
+  "main": "dist/js/materialize.js",
+  "module": "./dist/js/materialize.mjs",
+  "exports": {
+    ".": {
+      "types": "./dist/js/materialize.d.ts",
+      "import": "./dist/js/materialize.mjs",
+      "require": "./dist/js/materialize.cjs.js"
+    },
+    "./dist/css/*": "./dist/css/*",
+    "./sass/*": "./sass/*",
+    "./components/*": "./components/*"
+  },
   "repository": {
     "type": "git",
-    "url": "git://github.com/kekefreedog/Kmaterialize.git"
+    "url": "git://github.com/materializecss/materialize.git"
+  },
+  "bugs": {
+    "url": "https://github.com/materializecss/materialize/issues"
+  },
+  "scripts": {
+    "lint": "eslint .",
+    "test": "jasmine-browser-runner runSpecs --config=jasmine.json",
+    "build": "rollup --config rollup.config.ts --configPlugin @rollup/plugin-typescript",
+    "release": "npm run lint && npm run build -- --environment BUILD:release && node compress.mjs",
+    "preversion": "npm run lint && npm test",
+    "version": "npm run build -- --environment BUILD:release && node compress.mjs && git add .",
+    "prepublishOnly": "npm run build -- --environment BUILD:release",
+    "storybook": "storybook dev -p 6006",
+    "build-storybook": "storybook build",
+    "demo": "live-server",
+    "vitest": "vitest"
   },
+  "lint-staged": {
+    "js/*.js": [
+      "prettier --write",
+      "git add"
+    ]
+  },
+  "browserslist": [
+    "last 2 versions",
+    "Chrome >= 30",
+    "Firefox >= 30",
+    "Safari >= 8"
+  ],
   "engine": "node >= 6",
+  "dependencies": {
+    "normalize.css": "^8.0.1"
+  },
   "devDependencies": {
-    "autoprefixer": "^7.1.1",
-    "babel-preset-es2015": "^6.24.1",
-    "grunt": "^1.0.1",
-    "grunt-babel": "^6.0.0",
-    "grunt-banner": "^0.6.0",
-    "grunt-browser-sync": "^2.2.0",
-    "grunt-concurrent": "^2.3.1",
-    "grunt-contrib-clean": "^1.1.0",
-    "grunt-contrib-compress": "^1.4.1",
-    "grunt-contrib-concat": "^1.0.1",
-    "grunt-contrib-jade": "^1.0.0",
-    "grunt-contrib-jasmine": "^1.1.0",
-    "grunt-contrib-uglify": "^3.0.1",
-    "grunt-contrib-watch": "^1.0.0",
-    "grunt-notify": "^0.4.5",
-    "grunt-postcss": "^0.8.0",
-    "grunt-remove-logging": "^0.2.0",
-    "grunt-rename-util": "^1.0.0",
-    "grunt-sass": "^2.0.0",
-    "grunt-text-replace": "^0.4.0",
-    "husky": "^0.14.3",
-    "jasmine": "^2.6.0",
-    "jasmine-jquery": "^2.1.1",
-    "jquery": "^3.2.1",
-    "lint-staged": "^7.0.4",
-    "node-archiver": "^0.3.0",
-    "node-sass": "^4.7.2",
-    "phantomjs-prebuilt": "^2.1.14",
-    "prettier": "^1.12.1"
+    "@fontsource/material-icons": "^5.2.5",
+    "@rollup/plugin-terser": "^1.0.0",
+    "@rollup/plugin-typescript": "^11.1.6",
+    "@storybook/addon-docs": "^9.0.12",
+    "@storybook/addon-themes": "^9.0.12",
+    "@storybook/html": "^9.0.12",
+    "@storybook/html-vite": "^9.0.12",
+    "@types/node": "^20.5.2",
+    "archiver": "^7.0.1",
+    "autoprefixer": "^10.4.21",
+    "eslint": "^9.10.0",
+    "eslint-plugin-storybook": "^9.0.12",
+    "jasmine": "^5.1.0",
+    "jasmine-browser-runner": "^2.5.0",
+    "jasmine-core": "^5.2.0",
+    "postcss": "^8.4.49",
+    "rollup": "^4.59.0",
+    "rollup-plugin-copy": "^3.5.0",
+    "rollup-plugin-dts": "^6.1.1",
+    "rollup-plugin-scss": "^4.0.0",
+    "sass": "^1.77.8",
+    "storybook": "^9.0.12",
+    "tslib": "^2.6.3",
+    "typescript": "^5.4.3",
+    "typescript-eslint": "^8.6.0",
+    "vitest": "^4.0.18"
   },
   "files": [
-    "dist",
-    "extras",
-    "js/**/*.js",
+    "dist/css",
+    "dist/js",
+    "sass",
+    "components",
     "LICENSE"
   ],
-  "bugs": {
-    "url": "https://github.com/kekefreedog/Kmaterialize/issues"
-  },
-  "homepage": "https://github.com/kekefreedog/Kmaterialize#readme",
-  "directories": {
-    "doc": "docs",
-    "test": "tests"
-  },
-  "scripts": {
-    "test": "echo \"Error: no test specified\" && exit 1"
+  "overrides": {
+    "storybook": "$storybook"
   }
 }

package/sass/_colors.scss

@@ -0,0 +1,417 @@
+@charset "UTF-8";
+// Google Color Palette defined: http://www.google.com/design/spec/style/color.html
+
+$materialize-red: (
+  "base":       #e51c23,
+  "lighten-5":  #fdeaeb,
+  "lighten-4":  #f8c1c3,
+  "lighten-3":  #f3989b,
+  "lighten-2":  #ee6e73,
+  "lighten-1":  #ea454b,
+  "darken-1":   #d0181e,
+  "darken-2":   #b9151b,
+  "darken-3":   #a21318,
+  "darken-4":   #8b1014,
+);
+
+$red: (
+  "base":       #F44336,
+  "lighten-5":  #FFEBEE,
+  "lighten-4":  #FFCDD2,
+  "lighten-3":  #EF9A9A,
+  "lighten-2":  #E57373,
+  "lighten-1":  #EF5350,
+  "darken-1":   #E53935,
+  "darken-2":   #D32F2F,
+  "darken-3":   #C62828,
+  "darken-4":   #B71C1C,
+  "accent-1":    #FF8A80,
+  "accent-2":    #FF5252,
+  "accent-3":    #FF1744,
+  "accent-4":    #D50000
+);
+
+$pink: (
+  "base":       #e91e63,
+  "lighten-5":  #fce4ec,
+  "lighten-4":  #f8bbd0,
+  "lighten-3":  #f48fb1,
+  "lighten-2":  #f06292,
+  "lighten-1":  #ec407a,
+  "darken-1":   #d81b60,
+  "darken-2":   #c2185b,
+  "darken-3":   #ad1457,
+  "darken-4":   #880e4f,
+  "accent-1":    #ff80ab,
+  "accent-2":    #ff4081,
+  "accent-3":    #f50057,
+  "accent-4":    #c51162
+);
+
+$purple: (
+  "base":       #9c27b0,
+  "lighten-5":  #f3e5f5,
+  "lighten-4":  #e1bee7,
+  "lighten-3":  #ce93d8,
+  "lighten-2":  #ba68c8,
+  "lighten-1":  #ab47bc,
+  "darken-1":   #8e24aa,
+  "darken-2":   #7b1fa2,
+  "darken-3":   #6a1b9a,
+  "darken-4":   #4a148c,
+  "accent-1":    #ea80fc,
+  "accent-2":    #e040fb,
+  "accent-3":    #d500f9,
+  "accent-4":    #aa00ff
+);
+
+$deep-purple: (
+  "base":       #673ab7,
+  "lighten-5":  #ede7f6,
+  "lighten-4":  #d1c4e9,
+  "lighten-3":  #b39ddb,
+  "lighten-2":  #9575cd,
+  "lighten-1":  #7e57c2,
+  "darken-1":   #5e35b1,
+  "darken-2":   #512da8,
+  "darken-3":   #4527a0,
+  "darken-4":   #311b92,
+  "accent-1":    #b388ff,
+  "accent-2":    #7c4dff,
+  "accent-3":    #651fff,
+  "accent-4":    #6200ea
+);
+
+$indigo: (
+  "base":       #3f51b5,
+  "lighten-5":  #e8eaf6,
+  "lighten-4":  #c5cae9,
+  "lighten-3":  #9fa8da,
+  "lighten-2":  #7986cb,
+  "lighten-1":  #5c6bc0,
+  "darken-1":   #3949ab,
+  "darken-2":   #303f9f,
+  "darken-3":   #283593,
+  "darken-4":   #1a237e,
+  "accent-1":    #8c9eff,
+  "accent-2":    #536dfe,
+  "accent-3":    #3d5afe,
+  "accent-4":    #304ffe
+);
+
+$blue: (
+  "base":       #2196F3,
+  "lighten-5":  #E3F2FD,
+  "lighten-4":  #BBDEFB,
+  "lighten-3":  #90CAF9,
+  "lighten-2":  #64B5F6,
+  "lighten-1":  #42A5F5,
+  "darken-1":   #1E88E5,
+  "darken-2":   #1976D2,
+  "darken-3":   #1565C0,
+  "darken-4":   #0D47A1,
+  "accent-1":    #82B1FF,
+  "accent-2":    #448AFF,
+  "accent-3":    #2979FF,
+  "accent-4":    #2962FF
+);
+
+$light-blue: (
+  "base":       #03a9f4,
+  "lighten-5":  #e1f5fe,
+  "lighten-4":  #b3e5fc,
+  "lighten-3":  #81d4fa,
+  "lighten-2":  #4fc3f7,
+  "lighten-1":  #29b6f6,
+  "darken-1":   #039be5,
+  "darken-2":   #0288d1,
+  "darken-3":   #0277bd,
+  "darken-4":   #01579b,
+  "accent-1":    #80d8ff,
+  "accent-2":    #40c4ff,
+  "accent-3":    #00b0ff,
+  "accent-4":    #0091ea
+);
+
+$cyan: (
+  "base":       #00bcd4,
+  "lighten-5":  #e0f7fa,
+  "lighten-4":  #b2ebf2,
+  "lighten-3":  #80deea,
+  "lighten-2":  #4dd0e1,
+  "lighten-1":  #26c6da,
+  "darken-1":   #00acc1,
+  "darken-2":   #0097a7,
+  "darken-3":   #00838f,
+  "darken-4":   #006064,
+  "accent-1":    #84ffff,
+  "accent-2":    #18ffff,
+  "accent-3":    #00e5ff,
+  "accent-4":    #00b8d4
+);
+
+$teal: (
+  "base":       #009688,
+  "lighten-5":  #e0f2f1,
+  "lighten-4":  #b2dfdb,
+  "lighten-3":  #80cbc4,
+  "lighten-2":  #4db6ac,
+  "lighten-1":  #26a69a,
+  "darken-1":   #00897b,
+  "darken-2":   #00796b,
+  "darken-3":   #00695c,
+  "darken-4":   #004d40,
+  "accent-1":    #a7ffeb,
+  "accent-2":    #64ffda,
+  "accent-3":    #1de9b6,
+  "accent-4":    #00bfa5
+);
+
+$green: (
+  "base":       #4CAF50,
+  "lighten-5":  #E8F5E9,
+  "lighten-4":  #C8E6C9,
+  "lighten-3":  #A5D6A7,
+  "lighten-2":  #81C784,
+  "lighten-1":  #66BB6A,
+  "darken-1":   #43A047,
+  "darken-2":   #388E3C,
+  "darken-3":   #2E7D32,
+  "darken-4":   #1B5E20,
+  "accent-1":    #B9F6CA,
+  "accent-2":    #69F0AE,
+  "accent-3":    #00E676,
+  "accent-4":    #00C853
+);
+
+$light-green: (
+  "base":       #8bc34a,
+  "lighten-5":  #f1f8e9,
+  "lighten-4":  #dcedc8,
+  "lighten-3":  #c5e1a5,
+  "lighten-2":  #aed581,
+  "lighten-1":  #9ccc65,
+  "darken-1":   #7cb342,
+  "darken-2":   #689f38,
+  "darken-3":   #558b2f,
+  "darken-4":   #33691e,
+  "accent-1":    #ccff90,
+  "accent-2":    #b2ff59,
+  "accent-3":    #76ff03,
+  "accent-4":    #64dd17
+);
+
+$lime: (
+  "base":       #cddc39,
+  "lighten-5":  #f9fbe7,
+  "lighten-4":  #f0f4c3,
+  "lighten-3":  #e6ee9c,
+  "lighten-2":  #dce775,
+  "lighten-1":  #d4e157,
+  "darken-1":   #c0ca33,
+  "darken-2":   #afb42b,
+  "darken-3":   #9e9d24,
+  "darken-4":   #827717,
+  "accent-1":    #f4ff81,
+  "accent-2":    #eeff41,
+  "accent-3":    #c6ff00,
+  "accent-4":    #aeea00
+);
+
+$yellow: (
+  "base":       #ffeb3b,
+  "lighten-5":  #fffde7,
+  "lighten-4":  #fff9c4,
+  "lighten-3":  #fff59d,
+  "lighten-2":  #fff176,
+  "lighten-1":  #ffee58,
+  "darken-1":   #fdd835,
+  "darken-2":   #fbc02d,
+  "darken-3":   #f9a825,
+  "darken-4":   #f57f17,
+  "accent-1":    #ffff8d,
+  "accent-2":    #ffff00,
+  "accent-3":    #ffea00,
+  "accent-4":    #ffd600
+);
+
+$amber: (
+  "base":       #ffc107,
+  "lighten-5":  #fff8e1,
+  "lighten-4":  #ffecb3,
+  "lighten-3":  #ffe082,
+  "lighten-2":  #ffd54f,
+  "lighten-1":  #ffca28,
+  "darken-1":   #ffb300,
+  "darken-2":   #ffa000,
+  "darken-3":   #ff8f00,
+  "darken-4":   #ff6f00,
+  "accent-1":    #ffe57f,
+  "accent-2":    #ffd740,
+  "accent-3":    #ffc400,
+  "accent-4":    #ffab00
+);
+
+$orange: (
+  "base":       #ff9800,
+  "lighten-5":  #fff3e0,
+  "lighten-4":  #ffe0b2,
+  "lighten-3":  #ffcc80,
+  "lighten-2":  #ffb74d,
+  "lighten-1":  #ffa726,
+  "darken-1":   #fb8c00,
+  "darken-2":   #f57c00,
+  "darken-3":   #ef6c00,
+  "darken-4":   #e65100,
+  "accent-1":    #ffd180,
+  "accent-2":    #ffab40,
+  "accent-3":    #ff9100,
+  "accent-4":    #ff6d00
+);
+
+$deep-orange: (
+  "base":       #ff5722,
+  "lighten-5":  #fbe9e7,
+  "lighten-4":  #ffccbc,
+  "lighten-3":  #ffab91,
+  "lighten-2":  #ff8a65,
+  "lighten-1":  #ff7043,
+  "darken-1":   #f4511e,
+  "darken-2":   #e64a19,
+  "darken-3":   #d84315,
+  "darken-4":   #bf360c,
+  "accent-1":    #ff9e80,
+  "accent-2":    #ff6e40,
+  "accent-3":    #ff3d00,
+  "accent-4":    #dd2c00
+);
+
+$brown: (
+  "base":       #795548,
+  "lighten-5":  #efebe9,
+  "lighten-4":  #d7ccc8,
+  "lighten-3":  #bcaaa4,
+  "lighten-2":  #a1887f,
+  "lighten-1":  #8d6e63,
+  "darken-1":   #6d4c41,
+  "darken-2":   #5d4037,
+  "darken-3":   #4e342e,
+  "darken-4":   #3e2723
+);
+
+$blue-grey: (
+  "base":       #607d8b,
+  "lighten-5":  #eceff1,
+  "lighten-4":  #cfd8dc,
+  "lighten-3":  #b0bec5,
+  "lighten-2":  #90a4ae,
+  "lighten-1":  #78909c,
+  "darken-1":   #546e7a,
+  "darken-2":   #455a64,
+  "darken-3":   #37474f,
+  "darken-4":   #263238
+);
+
+$grey: (
+  "base":       #9e9e9e,
+  "lighten-5":  #fafafa,
+  "lighten-4":  #f5f5f5,
+  "lighten-3":  #eeeeee,
+  "lighten-2":  #e0e0e0,
+  "lighten-1":  #bdbdbd,
+  "darken-1":   #757575,
+  "darken-2":   #616161,
+  "darken-3":   #424242,
+  "darken-4":   #212121
+);
+
+$shades: (
+  "black":        #000000,
+  "white":        #FFFFFF,
+  "transparent":  transparent
+);
+
+$gold: (
+  "base":       #a68b4d,
+  "lighten-5":  #f4f1ea,
+  "lighten-4":  #e4dcca,
+  "lighten-3":  #d2c5a6,
+  "lighten-2":  #c1ae82,
+  "lighten-1":  #b29a64,
+  "darken-1":   #907943,
+  "darken-2":   #746136,
+  "darken-3":   #534626,
+  "darken-4":   #322a17
+);
+
+$colors: (
+  "materialize-red": $materialize-red,
+  "red": $red,
+  "pink": $pink,
+  "purple": $purple,
+  "deep-purple": $deep-purple,
+  "indigo": $indigo,
+  "blue": $blue,
+  "light-blue": $light-blue,
+  "cyan": $cyan,
+  "teal": $teal,
+  "green": $green,
+  "light-green": $light-green,
+  "lime": $lime,
+  "yellow": $yellow,
+  "amber": $amber,
+  "orange": $orange,
+  "deep-orange": $deep-orange,
+  "brown": $brown,
+  "blue-grey": $blue-grey,
+  "grey": $grey,
+  "gold": $gold,
+  "shades": $shades
+) !default;
+
+
+// usage: colorFunc("name_of_color", "type_of_color")
+// to avoid to repeating map-get($colors, ...)
+@function colorFunc($color, $type) {
+  @if map-has-key($colors, $color) {
+    $curr_color: map-get($colors, $color);
+    @if map-has-key($curr_color, $type) {
+      @return map-get($curr_color, $type);
+    }
+  }
+  @warn "Unknown `#{$color}` - `#{$type}` in $colors.";
+  @return null;
+}
+
+
+// Color Classes
+@each $color_name, $color in $colors {
+  @each $color_type, $color_value in $color {
+    @if $color_type == "base" {
+      .#{$color_name} {
+        background-color: $color_value !important;
+      }
+      .#{$color_name}-text {
+        color: $color_value !important;
+      }
+    }
+    @else if $color_name != "shades" {
+      .#{$color_name}.#{$color_type} {
+        background-color: $color_value !important;
+      }
+      .#{$color_name}-text.text-#{$color_type} {
+        color: $color_value !important;
+      }
+    }
+  }
+}
+
+// Shade classes
+@each $color, $color_value in $shades {
+  .#{$color} {
+    background-color: $color_value !important;
+  }
+  .#{$color}-text {
+    color: $color_value !important;
+  }
+}