@luminescent/ui 0.7.2 → 0.7.4

package/README.md

@@ -1,48 +1,48 @@
-<img src="./branding.png" width="400">
-
-To use the Luminescent UI Qwik Library, you need to install the package from npm.
-
-```bash
-npm install @anuragroy/tailwindcss-animate @luminescent/ui
-```
-
-Once installed, since this is a tailwind based library, you need to include the following to your tailwind config
-
-The theme and plugins properties are optional if you don't want to use blobs in the Card component
-
-```javascript
-/** @type {import('tailwindcss').Config} */
-
-import tailwindConfig from '@luminescent/ui/config';
-
-export default {
-  // required
-  content: [
-    // ...
-    ...tailwindConfig.content,
-  ],
-  // only for blobs in the Card component
-  theme: {
-    extend: {
-      animation: {
-        // ...
-        ...tailwindConfig.theme.extend.animation,
-      },
-      keyframes: {
-        // ...
-        ...tailwindConfig.theme.extend.keyframes,
-      },
-    },
-  },
-  plugins: [
-    // ...
-    require('@anuragroy/tailwindcss-animate'),
-  ],
-};
-```
-
-Once finished, you can import the components you need from the package.
-
-```javascript
-import { Button } from '@luminescent/ui';
-```
+<img src="./branding.png" width="400">
+
+To use the Luminescent UI Qwik Library, you need to install the package from npm.
+
+```bash
+npm install @anuragroy/tailwindcss-animate @luminescent/ui
+```
+
+Once installed, since this is a tailwind based library, you need to include the following to your tailwind config
+
+The theme and plugins properties are optional if you don't want to use blobs in the Card component
+
+```javascript
+/** @type {import('tailwindcss').Config} */
+
+import tailwindConfig from '@luminescent/ui/config';
+
+export default {
+  // required
+  content: [
+    // ...
+    ...tailwindConfig.content,
+  ],
+  // only for blobs in the Card component
+  theme: {
+    extend: {
+      animation: {
+        // ...
+        ...tailwindConfig.theme.extend.animation,
+      },
+      keyframes: {
+        // ...
+        ...tailwindConfig.theme.extend.keyframes,
+      },
+    },
+  },
+  plugins: [
+    // ...
+    require('@anuragroy/tailwindcss-animate'),
+  ],
+};
+```
+
+Once finished, you can import the components you need from the package.
+
+```javascript
+import { Button } from '@luminescent/ui';
+```

package/package.json

@@ -1,62 +1,62 @@
-{
-  "name": "@luminescent/ui",
-  "version": "0.7.2",
-  "description": "Luminescent UI library",
-  "main": "./lib/index.qwik.mjs",
-  "qwik": "./lib/index.qwik.mjs",
-  "types": "./lib-types/index.d.ts",
-  "exports": {
-    ".": {
-      "import": "./lib/index.qwik.mjs",
-      "require": "./lib/index.qwik.cjs",
-      "types": "./lib-types/index.d.ts"
-    },
-    "./config": "./src/tailwind.config.js"
-  },
-  "files": [
-    "lib",
-    "lib-types",
-    "src/tailwind.config.js"
-  ],
-  "engines": {
-    "node": ">=15.0.0"
-  },
-  "license": "AGPL-3.0-or-later",
-  "private": false,
-  "type": "module",
-  "publishConfig": {
-    "access": "public"
-  },
-  "scripts": {
-    "build": "qwik build",
-    "build.lib": "vite build --mode lib",
-    "build.types": "tsc --emitDeclarationOnly",
-    "dev": "vite --mode ssr",
-    "dev.debug": "node --inspect-brk ./node_modules/vite/bin/vite.js --mode ssr --force",
-    "lint": "eslint \"src/**/*.ts*\"",
-    "release": "np",
-    "start": "vite --open --mode ssr",
-    "test": "echo \"No test specified\" && exit 0",
-    "qwik": "qwik"
-  },
-  "devDependencies": {
-    "@anuragroy/tailwindcss-animate": "^1.0.6",
-    "@builder.io/qwik": "1.4.5",
-    "@builder.io/qwik-city": "^1.4.5",
-    "@types/eslint": "^8.56.2",
-    "@types/node": "^20.11.19",
-    "@typescript-eslint/eslint-plugin": "^7.0.2",
-    "@typescript-eslint/parser": "^7.0.2",
-    "autoprefixer": "^10.4.17",
-    "chart.js": "^4.4.1",
-    "eslint": "^8.56.0",
-    "eslint-plugin-qwik": "latest",
-    "np": "^9.2.0",
-    "postcss": "^8.4.35",
-    "tailwindcss": "3.4.1",
-    "typescript": "5.3.3",
-    "undici": "*",
-    "vite": "^5.1.3",
-    "vite-tsconfig-paths": "^4.3.1"
-  }
-}
+{
+  "name": "@luminescent/ui",
+  "version": "0.7.4",
+  "description": "Luminescent UI library",
+  "main": "./lib/index.qwik.mjs",
+  "qwik": "./lib/index.qwik.mjs",
+  "types": "./lib-types/index.d.ts",
+  "exports": {
+    ".": {
+      "import": "./lib/index.qwik.mjs",
+      "require": "./lib/index.qwik.cjs",
+      "types": "./lib-types/index.d.ts"
+    },
+    "./config": "./src/tailwind.config.js"
+  },
+  "files": [
+    "lib",
+    "lib-types",
+    "src/tailwind.config.js"
+  ],
+  "engines": {
+    "node": ">=15.0.0"
+  },
+  "license": "AGPL-3.0-or-later",
+  "private": false,
+  "type": "module",
+  "publishConfig": {
+    "access": "public"
+  },
+  "scripts": {
+    "build": "qwik build",
+    "build.lib": "vite build --mode lib",
+    "build.types": "tsc --emitDeclarationOnly",
+    "dev": "vite --mode ssr",
+    "dev.debug": "node --inspect-brk ./node_modules/vite/bin/vite.js --mode ssr --force",
+    "lint": "eslint \"src/**/*.ts*\"",
+    "release": "np",
+    "start": "vite --open --mode ssr",
+    "test": "echo \"No test specified\" && exit 0",
+    "qwik": "qwik"
+  },
+  "devDependencies": {
+    "@anuragroy/tailwindcss-animate": "^1.0.6",
+    "@builder.io/qwik": "1.4.5",
+    "@builder.io/qwik-city": "^1.4.5",
+    "@types/eslint": "^8.56.2",
+    "@types/node": "^20.11.19",
+    "@typescript-eslint/eslint-plugin": "^7.0.2",
+    "@typescript-eslint/parser": "^7.0.2",
+    "autoprefixer": "^10.4.17",
+    "chart.js": "^4.4.1",
+    "eslint": "^8.56.0",
+    "eslint-plugin-qwik": "latest",
+    "np": "^9.2.0",
+    "postcss": "^8.4.35",
+    "tailwindcss": "3.4.1",
+    "typescript": "5.3.3",
+    "undici": "*",
+    "vite": "^5.1.3",
+    "vite-tsconfig-paths": "^4.3.1"
+  }
+}

package/src/tailwind.config.js

@@ -1,72 +1,72 @@
-function getBlobKeyFrame() {
-  const translateXPercentages = [0, 19, 38, 57, 76];
-  const translateYPercentages = [0, 12, 25, 38, 50];
-  const scaleValues = [0.8, 1, 1.2, 1.4];
-
-  const translateX0Key = Math.floor(Math.random() * 70);
-  const translateX0 = Math.floor(Math.random() * 70);
-  translateXPercentages.splice(translateX0Key, 1);
-  const translateX1Key = Math.floor(Math.random() * translateXPercentages.length);
-  const translateX1 = translateXPercentages[translateX1Key];
-  translateXPercentages.splice(translateX1Key, 1);
-  const translateX2Key = Math.floor(Math.random() * translateXPercentages.length);
-  const translateX2 = translateXPercentages[translateX2Key];
-  translateXPercentages.splice(translateX2Key, 1);
-  const translateX3Key = Math.floor(Math.random() * translateXPercentages.length);
-  const translateX3 = translateXPercentages[translateX3Key];
-  translateXPercentages.splice(translateX3Key, 1);
-
-  const translateY0Key = Math.floor(Math.random() * translateYPercentages.length);
-  const translateY0 = translateYPercentages[translateY0Key];
-  translateYPercentages.splice(translateY0Key, 1);
-  const translateY1Key = Math.floor(Math.random() * translateYPercentages.length);
-  const translateY1 = translateYPercentages[translateY1Key];
-  translateYPercentages.splice(translateY1Key, 1);
-  const translateY2Key = Math.floor(Math.random() * translateYPercentages.length);
-  const translateY2 = translateYPercentages[translateY2Key];
-  translateYPercentages.splice(translateY2Key, 1);
-  const translateY3Key = Math.floor(Math.random() * translateYPercentages.length);
-  const translateY3 = translateYPercentages[translateY3Key];
-  translateYPercentages.splice(translateY3Key, 1);
-
-  const scale0 = scaleValues[Math.floor(Math.random() * scaleValues.length)];
-  const scale1 = scaleValues[Math.floor(Math.random() * scaleValues.length)];
-  const scale2 = scaleValues[Math.floor(Math.random() * scaleValues.length)];
-  const scale3 = scaleValues[Math.floor(Math.random() * scaleValues.length)];
-
-  const keyframe = {
-    '0%, 100%': { transform: `translate(${translateX0}cqw, ${translateY0}cqh) scale(${scale0})` },
-    '25%': { transform: `translate(${translateX1}cqw, ${translateY1}cqh) scale(${scale1})` },
-    '50%': { transform: `translate(${translateX2}cqw, ${translateY2}cqh) scale(${scale2})` },
-    '75%': { transform: `translate(${translateX3}cqw, ${translateY3}cqh) scale(${scale3})` },
-  };
-
-  return keyframe;
-}
-
-module.exports = {
-  content: ['./node_modules/@luminescent/ui/**/*.{mjs,cjs}'],
-  theme: {
-    extend: {
-      animation: {
-        blob: 'blob 15s infinite',
-        blob1: 'blob1 15s infinite',
-        blob2: 'blob2 15s infinite',
-        blob3: 'blob3 15s infinite',
-        blob4: 'blob4 15s infinite',
-        blob5: 'blob5 15s infinite',
-        blob6: 'blob6 15s infinite',
-        float: 'float 6s infinite',
-      },
-      keyframes: {
-        blob: getBlobKeyFrame(),
-        blob1: getBlobKeyFrame(),
-        blob2: getBlobKeyFrame(),
-        blob3: getBlobKeyFrame(),
-        blob4: getBlobKeyFrame(),
-        blob5: getBlobKeyFrame(),
-        blob6: getBlobKeyFrame(),
-      },
-    },
-  },
+function getBlobKeyFrame() {
+  const translateXPercentages = [0, 19, 38, 57, 76];
+  const translateYPercentages = [0, 12, 25, 38, 50];
+  const scaleValues = [0.8, 1, 1.2, 1.4];
+
+  const translateX0Key = Math.floor(Math.random() * 70);
+  const translateX0 = Math.floor(Math.random() * 70);
+  translateXPercentages.splice(translateX0Key, 1);
+  const translateX1Key = Math.floor(Math.random() * translateXPercentages.length);
+  const translateX1 = translateXPercentages[translateX1Key];
+  translateXPercentages.splice(translateX1Key, 1);
+  const translateX2Key = Math.floor(Math.random() * translateXPercentages.length);
+  const translateX2 = translateXPercentages[translateX2Key];
+  translateXPercentages.splice(translateX2Key, 1);
+  const translateX3Key = Math.floor(Math.random() * translateXPercentages.length);
+  const translateX3 = translateXPercentages[translateX3Key];
+  translateXPercentages.splice(translateX3Key, 1);
+
+  const translateY0Key = Math.floor(Math.random() * translateYPercentages.length);
+  const translateY0 = translateYPercentages[translateY0Key];
+  translateYPercentages.splice(translateY0Key, 1);
+  const translateY1Key = Math.floor(Math.random() * translateYPercentages.length);
+  const translateY1 = translateYPercentages[translateY1Key];
+  translateYPercentages.splice(translateY1Key, 1);
+  const translateY2Key = Math.floor(Math.random() * translateYPercentages.length);
+  const translateY2 = translateYPercentages[translateY2Key];
+  translateYPercentages.splice(translateY2Key, 1);
+  const translateY3Key = Math.floor(Math.random() * translateYPercentages.length);
+  const translateY3 = translateYPercentages[translateY3Key];
+  translateYPercentages.splice(translateY3Key, 1);
+
+  const scale0 = scaleValues[Math.floor(Math.random() * scaleValues.length)];
+  const scale1 = scaleValues[Math.floor(Math.random() * scaleValues.length)];
+  const scale2 = scaleValues[Math.floor(Math.random() * scaleValues.length)];
+  const scale3 = scaleValues[Math.floor(Math.random() * scaleValues.length)];
+
+  const keyframe = {
+    '0%, 100%': { transform: `translate(${translateX0}cqw, ${translateY0}cqh) scale(${scale0})` },
+    '25%': { transform: `translate(${translateX1}cqw, ${translateY1}cqh) scale(${scale1})` },
+    '50%': { transform: `translate(${translateX2}cqw, ${translateY2}cqh) scale(${scale2})` },
+    '75%': { transform: `translate(${translateX3}cqw, ${translateY3}cqh) scale(${scale3})` },
+  };
+
+  return keyframe;
+}
+
+module.exports = {
+  content: ['./node_modules/@luminescent/ui/**/*.{mjs,cjs}'],
+  theme: {
+    extend: {
+      animation: {
+        blob: 'blob 15s infinite',
+        blob1: 'blob1 15s infinite',
+        blob2: 'blob2 15s infinite',
+        blob3: 'blob3 15s infinite',
+        blob4: 'blob4 15s infinite',
+        blob5: 'blob5 15s infinite',
+        blob6: 'blob6 15s infinite',
+        float: 'float 6s infinite',
+      },
+      keyframes: {
+        blob: getBlobKeyFrame(),
+        blob1: getBlobKeyFrame(),
+        blob2: getBlobKeyFrame(),
+        blob3: getBlobKeyFrame(),
+        blob4: getBlobKeyFrame(),
+        blob5: getBlobKeyFrame(),
+        blob6: getBlobKeyFrame(),
+      },
+    },
+  },
 };