@bouko/react 1.7.8 → 1.7.9

package/dist/components/badge.d.ts

@@ -2,4 +2,4 @@ import type { ReactNode } from "react";
 export default function Badge({ style, children }: {
     style?: string;
     children: ReactNode;
-}): Promise<import("react/jsx-runtime").JSX.Element>;
+}): import("react/jsx-runtime").JSX.Element;

package/dist/components/badge.js

@@ -1,4 +1,4 @@
 import { jsx as _jsx } from "react/jsx-runtime";
-export default async function Badge({ style, children }) {
+export default function Badge({ style, children }) {
     return (_jsx("span", { className: "w-min px-3 py-1 bg-accent/20 border border-accent-dark rounded-full text-xs text-accent-dark font-semibold", children: children }));
 }

package/dist/components/index.d.ts

@@ -1,4 +1,5 @@
 export { default as Heading, HeadingProps } from "./layout/heading";
 export { default as Separator } from "./layout/separator";
+export { default as Badge } from "./text/badge";
 export * from "./list";
 export * from "./form";

package/dist/components/index.js

@@ -1,4 +1,5 @@
 export { default as Heading } from "./layout/heading";
 export { default as Separator } from "./layout/separator";
+export { default as Badge } from "./text/badge";
 export * from "./list";
 export * from "./form";

package/dist/components/layout/heading.js

@@ -1,7 +1,7 @@
 import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
 import { RowBox, ColumnBox } from "../flex";
 import { cn } from "@bouko/style";
-import Badge from "../badge";
+import Badge from "../text/badge";
 export default function Heading({ styles = {}, container, badge, icon, title, align = "left", subtitle, reverse }) {
     return (_jsxs(RowBox, { style: cn(base.container, styles.container, container), children: [icon, _jsxs(ColumnBox, { style: cn(base.subcontainer, align === "center" && "items-center", reverse && "flex-col-reverse"), children: [badge && _jsx(Badge, { style: base.badge, children: badge }), _jsx("span", { className: cn(base.title, styles.title), children: title }), subtitle && _jsx("span", { className: cn(base.subtitle, styles.subtitle), children: subtitle })] })] }));
 }

package/dist/components/search/index.d.ts

@@ -0,0 +1,6 @@
+type Props = {
+    placeholder?: string;
+    action: (query: string) => void;
+};
+export default function SearchBar({ placeholder, action }: Props): import("react/jsx-runtime").JSX.Element;
+export {};

package/dist/components/search/index.js

@@ -0,0 +1,12 @@
+"use client";
+import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
+import { useState } from "react";
+import { RowBox } from "../flex";
+import { Button } from "../button";
+export default function SearchBar({ placeholder, action }) {
+    const [query, search] = useState("");
+    return (_jsxs(RowBox, { style: styles.container, children: [_jsxs("div", { className: "relative grow", children: [_jsx("input", { className: "w-full outline-none lowercase text-lg placeholder-slate-500 tracking-wide", placeholder: placeholder, value: query, onChange: (e) => search(e.target.value), onKeyUp: (e) => e.key === "Enter" ? action(query) : null }), _jsx("div", { className: "absolute top-0 right-0 w-12 h-full bg-gradient-to-l from-slate-950" })] }), _jsx(Button, { size: "sm", style: "gap-[0.4rem] font-extrabold py-1 px-3 font-mono", onClick: () => action(query), children: "GO" })] }));
+}
+const styles = {
+    container: "items-center gap-6 w-xl pl-5 pr-4 py-3 bg-slate-950 border border-border rounded-md"
+};

package/dist/components/text/badge.d.ts

@@ -0,0 +1,5 @@
+import type { ReactNode } from "react";
+export default function Badge({ style, children }: {
+    style?: string;
+    children: ReactNode;
+}): import("react/jsx-runtime").JSX.Element;

package/dist/components/text/badge.js

@@ -0,0 +1,4 @@
+import { jsx as _jsx } from "react/jsx-runtime";
+export default function Badge({ style, children }) {
+    return (_jsx("span", { className: "w-min px-3 py-1 bg-accent/20 border border-accent-dark rounded-full text-xs text-accent-dark font-semibold", children: children }));
+}

package/dist/index.d.ts

@@ -4,7 +4,6 @@ export { default as Select } from "./components/select";
 export { default as MultipleChoice } from "./components/multiple-choice";
 export { default as Attachment } from "./components/attachment";
 export { default as CheckBox } from "./components/checkbox";
-export { default as Badge } from "./components/badge";
 export { default as FadeCarousel } from "./components/fade-carousel";
 export * from "./components";
 export * from "./components/flex";

package/dist/index.js

@@ -4,7 +4,6 @@ export { default as Select } from "./components/select";
 export { default as MultipleChoice } from "./components/multiple-choice";
 export { default as Attachment } from "./components/attachment";
 export { default as CheckBox } from "./components/checkbox";
-export { default as Badge } from "./components/badge";
 export { default as FadeCarousel } from "./components/fade-carousel";
 export * from "./components";
 export * from "./components/flex";

package/package.json

@@ -1,7 +1,7 @@
 {
 
   "name": "@bouko/react",
-  "version": "1.7.8",
+  "version": "1.7.9",
   "main": "./dist/index.js",
   "types": "./dist/index.d.ts",
   "license": "MIT",

package/dist/assets/icons/check-circle.svg

@@ -1,6 +0,0 @@
-<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 512 512" width="1em" height="1em">
-    <path 
-        d="M256 48a208 208 0 1 1 0 416 208 208 0 1 1 0-416zm0 464A256 256 0 1 0 256 0a256 256 0 1 0 0 512zM369 209c9.4-9.4 9.4-24.6 0-33.9s-24.6-9.4-33.9 0l-111 111-47-47c-9.4-9.4-24.6-9.4-33.9 0s-9.4 24.6 0 33.9l64 64c9.4 9.4 24.6 9.4 33.9 0L369 209z" 
-        fill="currentColor" 
-    />
-</svg>

package/dist/assets/icons/spinner.svg

@@ -1,6 +0,0 @@
-<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 512 512" width="1em" height="1em">
-    <path 
-        d="M304 48a48 48 0 1 0 -96 0 48 48 0 1 0 96 0zm0 416a48 48 0 1 0 -96 0 48 48 0 1 0 96 0zM48 304a48 48 0 1 0 0-96 48 48 0 1 0 0 96zm464-48a48 48 0 1 0 -96 0 48 48 0 1 0 96 0zM142.9 437A48 48 0 1 0 75 369.1 48 48 0 1 0 142.9 437zm0-294.2A48 48 0 1 0 75 75a48 48 0 1 0 67.9 67.9zM369.1 437A48 48 0 1 0 437 369.1 48 48 0 1 0 369.1 437z" 
-        fill="currentColor" 
-    />
-</svg>

package/dist/assets/icons/x-circle.svg

@@ -1,6 +0,0 @@
-<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 512 512" width="1em" height="1em">
-    <path 
-        d="M256 512A256 256 0 1 0 256 0a256 256 0 1 0 0 512zM175 175c9.4-9.4 24.6-9.4 33.9 0l47 47 47-47c9.4-9.4 24.6-9.4 33.9 0s9.4 24.6 0 33.9l-47 47 47 47c9.4 9.4 9.4 24.6 0 33.9s-24.6 9.4-33.9 0l-47-47-47 47c-9.4 9.4-24.6 9.4-33.9 0s-9.4-24.6 0-33.9l47-47-47-47c-9.4-9.4-9.4-24.6 0-33.9z" 
-        fill="currentColor" 
-    />
-</svg>