@achs/webkit
Version:
Conjunto de componentes de UI con el estilo del Sistema de Diseño ACHS (Asociación Chilena de Seguridad), para reutilizar de forma transversal en las aplicaciones web de ACHS. Construido con **React 19**, **TypeScript** y **Vite**, con soporte para las
61 lines (60 loc) • 1.9 kB
JavaScript
import { jsxs as f, jsx as i } from "react/jsx-runtime";
import { forwardRef as N } from "react";
import s from "./Search.module.scss.mjs";
import '../../../assets/node_modules/.pnpm/bootstrap-icons@1.13.1/node_modules/bootstrap-icons/font/bootstrap-icons.css';/* empty css */
const x = N(({
color: m = "primary",
onSearch: t,
onClear: o,
placeholder: c = "Buscar aquí...",
disabled: r,
value: a,
className: u,
...e
}, d) => {
const b = a !== void 0 && a !== "", y = (l) => {
var n;
(n = e.onKeyDown) == null || n.call(e, l), l.key === "Enter" && (t == null || t(String(a ?? l.currentTarget.value)));
};
return /* @__PURE__ */ f(
"div",
{
"data-color": m,
"data-disabled": r || void 0,
className: `${s.search} ${u ?? ""}`.trim(),
children: [
/* @__PURE__ */ i(
"input",
{
...e,
ref: d,
type: "text",
role: "searchbox",
value: a,
disabled: r,
placeholder: c,
className: s.input,
onKeyDown: y
}
),
b && !r && /* @__PURE__ */ i("button", { type: "button", className: s.clear, "aria-label": "Limpiar búsqueda", onClick: o, children: /* @__PURE__ */ i("i", { className: "bi bi-x-lg", "aria-hidden": "true" }) }),
/* @__PURE__ */ i(
"button",
{
type: "button",
className: s.button,
"aria-label": "Buscar",
disabled: r,
onClick: () => t == null ? void 0 : t(String(a ?? "")),
children: /* @__PURE__ */ i("i", { className: "bi bi-search", "aria-hidden": "true" })
}
)
]
}
);
});
x.displayName = "Search";
export {
x as Search,
x as default
};