@nr1e/qwik-ui 0.0.6 → 0.0.8

package/README.md

@@ -2,12 +2,39 @@
     <img width="200" src="https://nr1e.com/images/logo-tagline.svg" />
 </div>
 
-# Qwik Icons Library ⚡️
+# Qwik UI Library ⚡️
 
-This library contains approved icons for use in NR1E projects.
+This library contains approved UI components for use in NR1E projects.
 
-## Prefixes
+## Installation
 
-Each icon has a prefix identifying where it came from.
+```bash
+pnpm i @nr1e/qwik-ui
+```
 
-- **Mdi** = [Material Design Icons](https://icon-sets.iconify.design/mdi/)
+## Usage with Tailwind CSS 4.x
+
+This library uses Tailwind CSS classes (with DaisyUI components). To ensure the classes are properly scanned and generated in your project, you need to import the library's styles configuration.
+
+In your main CSS file (e.g., `src/global.css`):
+
+```css
+@import 'tailwindcss';
+@import '@nr1e/qwik-ui/styles.css' source;
+
+/* Your other styles */
+```
+
+This tells Tailwind v4 to scan the `@nr1e/qwik-ui` library files for class names and include DaisyUI plugin.
+
+### Alternative: Manual Configuration
+
+If you prefer more control, you can manually add the source path in your CSS:
+
+```css
+@import 'tailwindcss';
+
+@source '../src';
+@source '../../node_modules/@nr1e/qwik-ui/lib';
+@plugin 'daisyui';
+```

package/lib/components/alert-info.qwik.cjs

@@ -0,0 +1,20 @@
+"use strict";
+Object.defineProperty(exports, Symbol.toStringTag, { value: "Module" });
+const jsxRuntime = require("@builder.io/qwik/jsx-runtime");
+const qwik = require("@builder.io/qwik");
+const mdiInformationOutline_qwik = require("../qwik-icons/lib/components/icons/mdi-information-outline.qwik.qwik.cjs");
+const AlertInfo = qwik.component$((props) => {
+  return /* @__PURE__ */ jsxRuntime.jsxs("div", {
+    role: "alert",
+    class: "alert alert-info",
+    children: [
+      /* @__PURE__ */ jsxRuntime.jsx(mdiInformationOutline_qwik.MdiInformationOutline, {
+        size: 24
+      }),
+      /* @__PURE__ */ jsxRuntime.jsx("span", {
+        children: props.message
+      })
+    ]
+  });
+});
+exports.AlertInfo = AlertInfo;

package/lib/components/alert-info.qwik.mjs

@@ -0,0 +1,20 @@
+import { jsxs, jsx } from "@builder.io/qwik/jsx-runtime";
+import { component$ } from "@builder.io/qwik";
+import { MdiInformationOutline } from "../qwik-icons/lib/components/icons/mdi-information-outline.qwik.qwik.mjs";
+const AlertInfo = component$((props) => {
+  return /* @__PURE__ */ jsxs("div", {
+    role: "alert",
+    class: "alert alert-info",
+    children: [
+      /* @__PURE__ */ jsx(MdiInformationOutline, {
+        size: 24
+      }),
+      /* @__PURE__ */ jsx("span", {
+        children: props.message
+      })
+    ]
+  });
+});
+export {
+  AlertInfo
+};

package/lib/index.qwik.cjs

@@ -1,11 +1,13 @@
 "use strict";
 Object.defineProperty(exports, Symbol.toStringTag, { value: "Module" });
 const alertError = require("./components/alert-error.qwik.cjs");
+const alertInfo = require("./components/alert-info.qwik.cjs");
 const alertSuccess = require("./components/alert-success.qwik.cjs");
 const alertWarning = require("./components/alert-warning.qwik.cjs");
 const paceBar = require("./components/pace-bar.qwik.cjs");
 const universalLayout = require("./components/universal-layout.qwik.cjs");
 exports.AlertError = alertError.AlertError;
+exports.AlertInfo = alertInfo.AlertInfo;
 exports.AlertSuccess = alertSuccess.AlertSuccess;
 exports.AlertWarning = alertWarning.AlertWarning;
 exports.PaceBar = paceBar.PaceBar;

package/lib/index.qwik.mjs

@@ -1,10 +1,12 @@
 import { AlertError } from "./components/alert-error.qwik.mjs";
+import { AlertInfo } from "./components/alert-info.qwik.mjs";
 import { AlertSuccess } from "./components/alert-success.qwik.mjs";
 import { AlertWarning } from "./components/alert-warning.qwik.mjs";
 import { PaceBar } from "./components/pace-bar.qwik.mjs";
 import { UniversalLayout } from "./components/universal-layout.qwik.mjs";
 export {
   AlertError,
+  AlertInfo,
   AlertSuccess,
   AlertWarning,
   PaceBar,

package/lib/qwik-icons/lib/components/icons/mdi-information-outline.qwik.qwik.cjs

@@ -0,0 +1,16 @@
+"use strict";
+Object.defineProperty(exports, Symbol.toStringTag, { value: "Module" });
+const jsxRuntime = require("@builder.io/qwik/jsx-runtime");
+const qwik = require("@builder.io/qwik");
+const svg_qwik = require("../svg.qwik.qwik.cjs");
+const MdiInformationOutline = qwik.component$((props) => {
+  return /* @__PURE__ */ jsxRuntime.jsx(svg_qwik.Svg, {
+    ...props,
+    viewBox: "0 0 24 24",
+    children: /* @__PURE__ */ jsxRuntime.jsx("path", {
+      fill: "currentColor",
+      d: "M11 9h2V7h-2m1 13c-4.41 0-8-3.59-8-8s3.59-8 8-8s8 3.59 8 8s-3.59 8-8 8m0-18A10 10 0 0 0 2 12a10 10 0 0 0 10 10a10 10 0 0 0 10-10A10 10 0 0 0 12 2m-1 15h2v-6h-2z"
+    })
+  });
+});
+exports.MdiInformationOutline = MdiInformationOutline;

package/lib/qwik-icons/lib/components/icons/mdi-information-outline.qwik.qwik.mjs

@@ -0,0 +1,16 @@
+import { jsx } from "@builder.io/qwik/jsx-runtime";
+import { component$ } from "@builder.io/qwik";
+import { Svg } from "../svg.qwik.qwik.mjs";
+const MdiInformationOutline = component$((props) => {
+  return /* @__PURE__ */ jsx(Svg, {
+    ...props,
+    viewBox: "0 0 24 24",
+    children: /* @__PURE__ */ jsx("path", {
+      fill: "currentColor",
+      d: "M11 9h2V7h-2m1 13c-4.41 0-8-3.59-8-8s3.59-8 8-8s8 3.59 8 8s-3.59 8-8 8m0-18A10 10 0 0 0 2 12a10 10 0 0 0 10 10a10 10 0 0 0 10-10A10 10 0 0 0 12 2m-1 15h2v-6h-2z"
+    })
+  });
+});
+export {
+  MdiInformationOutline
+};

package/lib-types/index.d.ts

@@ -1,4 +1,5 @@
 export * from './components/alert-error';
+export * from './components/alert-info';
 export * from './components/alert-success';
 export * from './components/alert-warning';
 export * from './components/pace-bar';

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@nr1e/qwik-ui",
-  "version": "0.0.6",
+  "version": "0.0.8",
   "description": "NR1E Qwik UI Library",
   "author": "NR1E, Inc.",
   "publishConfig": {
@@ -19,11 +19,13 @@
       "import": "./lib/index.qwik.mjs",
       "require": "./lib/index.qwik.cjs",
       "types": "./lib-types/index.d.ts"
-    }
+    },
+    "./styles.css": "./styles.css"
   },
   "files": [
     "lib",
-    "lib-types"
+    "lib-types",
+    "styles.css"
   ],
   "engines": {
     "node": "^18.17.0 || ^20.3.0 || >=21.0.0"

package/styles.css

@@ -0,0 +1 @@
+@source './lib';