@luminescent/ui 0.19.2 → 1.0.5

package/package.json

@@ -1,22 +1,19 @@
 {
   "name": "@luminescent/ui",
-  "version": "0.19.2",
+  "version": "1.0.5",
   "description": "Luminescent UI library",
-  "main": "./lib/index.qwik.mjs",
-  "qwik": "./lib/index.qwik.mjs",
+  "main": "./lib/index.js",
+  "qwik": "./lib/index.js",
   "types": "./lib-types/index.d.ts",
   "exports": {
     ".": {
-      "import": "./lib/index.qwik.mjs",
-      "require": "./lib/index.qwik.cjs",
+      "import": "./lib/index.js",
+      "require": "./lib/index.js",
       "types": "./lib-types/index.d.ts"
-    },
-    "./config": "./src/tailwind.config.js"
+    }
   },
   "files": [
-    "lib",
-    "lib-types",
-    "src/tailwind.config.js"
+    "src"
   ],
   "engines": {
     "node": ">=15.0.0"
@@ -28,35 +25,21 @@
     "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",
+    "build": "tsc",
+    "dev": "echo \"No dev script specified\" && exit 0",
     "lint": "eslint \"src/**/*.ts*\"",
     "release": "np",
-    "start": "vite --open --mode ssr",
-    "test": "echo \"No test specified\" && exit 0",
-    "qwik": "qwik"
+    "test": "echo \"No test specified\" && exit 0"
   },
   "devDependencies": {
-    "@anuragroy/tailwindcss-animate": "^1.0.6",
-    "@builder.io/qwik": "1.5.6",
-    "@builder.io/qwik-city": "^1.5.6",
     "@types/eslint": "^8.56.10",
-    "@types/node": "^20.14.2",
-    "@typescript-eslint/eslint-plugin": "^7.13.0",
-    "@typescript-eslint/parser": "^7.13.0",
-    "autoprefixer": "^10.4.19",
-    "chart.js": "^4.4.3",
+    "@types/node": "^20.14.9",
+    "@typescript-eslint/eslint-plugin": "^7.14.1",
+    "@typescript-eslint/parser": "^7.14.1",
     "eslint": "^8.57.0",
-    "eslint-plugin-qwik": "latest",
-    "np": "^10.0.5",
+    "fs": "0.0.1-security",
+    "np": "^10.0.6",
     "postcss": "^8.4.38",
-    "tailwindcss": "3.4.4",
-    "typescript": "5.4.5",
-    "undici": "*",
-    "vite": "^5.2.13",
-    "vite-tsconfig-paths": "^4.3.2"
+    "tailwindcss": "3.4.4"
   }
 }

package/src/components/bg.ts

@@ -0,0 +1,38 @@
+import type { PluginAPI } from 'tailwindcss/types/config';
+
+export default function ({ matchUtilities, theme }: PluginAPI) {
+  const colors: { [key: string]: string } = {};
+  Object.entries(theme('colors')!).forEach(([color, value]) => {
+    if (typeof value == 'string') {
+      colors[color] = color;
+    }
+    else {
+      Object.keys(value).forEach((shade) => {
+        colors[`${color}-${shade}`] = `${color}.${shade}`;
+      });
+    }
+  });
+  matchUtilities({
+    'lum-bg': (value) => {
+      const color = value.split('.')[0];
+      const shades = Object.values(colors).filter((c) => {
+        return c.startsWith(color);
+      });
+      const index = shades.indexOf(value);
+      const borderColor = shades[index - 1 < 0 ? shades.length - 1 : index - 1] || shades[index + 1 > shades.length - 1 ? 0 : index + 1];
+      const textColor = shades[index - 5 < 0 ? shades.length - 1 : index - 5] || shades[index + 5 > shades.length - 1 ? 0 : index + 5];
+
+      return {
+        background: theme(`colors.${value}`) ?? value,
+        color: theme(`colors.${textColor}`) ?? 'inherit',
+        border: `1px solid ${theme(`colors.${borderColor ?? value}`) ?? borderColor ?? value}`,
+        outline: 'none',
+        '&:focus': {
+          border: `1px solid ${theme(`colors.${textColor}`) ?? 'inherit'}`,
+        },
+      };
+    },
+  }, {
+    values: colors,
+  });
+}

package/src/components/btn.ts

@@ -0,0 +1,9 @@
+import type { PluginAPI } from 'tailwindcss/types/config';
+
+export default function ({ addComponents }: PluginAPI) {
+  addComponents({
+    '.lum-btn': {
+      '@apply flex items-center gap-3 motion-safe:transition ease-in-out disabled:opacity-50 hover:drop-shadow-lg motion-safe:active:scale-95 whitespace-nowrap touch-manipulation select-none text-center': {},
+    },
+  });
+}

package/src/components/card.ts

@@ -0,0 +1,9 @@
+import type { PluginAPI } from 'tailwindcss/types/config';
+
+export default function ({ addComponents }: PluginAPI) {
+  addComponents({
+    '.lum-card': {
+      '@apply flex flex-col gap-3 motion-safe:transition ease-in-out whitespace-nowrap': {},
+    },
+  });
+}

package/src/components/input.ts

@@ -0,0 +1,9 @@
+import type { PluginAPI } from 'tailwindcss/types/config';
+
+export default function ({ addComponents }: PluginAPI) {
+  addComponents({
+    '.lum-input': {
+      '@apply flex motion-safe:transition ease-in-out disabled:opacity-50 hover:drop-shadow-lg whitespace-nowrap touch-manipulation select-none': {},
+    },
+  });
+}

package/src/components/loading.ts

@@ -0,0 +1,9 @@
+import type { PluginAPI } from 'tailwindcss/types/config';
+
+export default function ({ addComponents }: PluginAPI) {
+  addComponents({
+    '.lum-loading': {
+      '@apply animate-spin rounded-full border-transparent border-l-current border-t-current border-4': {},
+    },
+  });
+}

package/src/components/pad.ts

@@ -0,0 +1,60 @@
+import type { PluginAPI } from 'tailwindcss/types/config';
+
+export default function ({ addComponents }: PluginAPI) {
+  addComponents({
+    '.lum-pad-xs': {
+      '@apply px-2.5 py-1.5': {},
+      '&.lum-pad-equal': {
+        '@apply p-1.5': {},
+      },
+    },
+    '.lum-pad-sm': {
+      '@apply px-3 py-2': {},
+      '&.lum-pad-equal': {
+        '@apply p-2': {},
+      },
+    },
+    '.lum-pad-md': {
+      '@apply px-4 py-2': {},
+      '&.lum-pad-equal': {
+        '@apply p-2': {},
+      },
+    },
+    '.lum-pad-lg': {
+      '@apply px-7 py-4': {},
+      '&.lum-pad-equal': {
+        '@apply p-4': {},
+      },
+    },
+    '.lum-pad-xl': {
+      '@apply px-8 py-4': {},
+      '&.lum-pad-equal': {
+        '@apply p-4': {},
+      },
+    },
+    '.lum-pad-2xl': {
+      '@apply px-10 py-5': {},
+      '&.lum-pad-equal': {
+        '@apply p-5': {},
+      },
+    },
+    '.lum-pad-3xl': {
+      '@apply px-12 py-6': {},
+      '&.lum-pad-equal': {
+        '@apply p-6': {},
+      },
+    },
+    '.lum-pad-4xl': {
+      '@apply px-14 py-7': {},
+      '&.lum-pad-equal': {
+        '@apply p-7': {},
+      },
+    },
+    '.lum-pad-5xl': {
+      '@apply px-16 py-8': {},
+      '&.lum-pad-equal': {
+        '@apply p-8': {},
+      },
+    },
+  });
+}

package/src/index.ts

@@ -0,0 +1,9 @@
+import plugin from 'tailwindcss/plugin';
+import { readdirSync } from 'fs';
+
+export default plugin(function (plugin) {
+  const components = readdirSync(__dirname + '/components').map((file: string) => file.split('.')[0]) as string[];
+  components.forEach((component) => {
+    import(`./components/${component}`).then((module) => module.default(plugin));
+  });
+});