@coko/client/dist/ui/common/Input.js

Client side common code for coko apps

import { th as e } from "../../toolkit/themeHelper.js";
import "../../toolkit/index.js";
import { inputShadow as t } from "./_reusableStyles.js";
import "react";
import n from "styled-components";
import { jsx as r, jsxs as i } from "react/jsx-runtime";
import { Input as a } from "antd";
import { EyeInvisibleOutlined as o, EyeOutlined as s } from "@ant-design/icons";
//#region src/ui/common/Input.tsx
var c = n.div``, l = n(a)`
  ${t}
`, u = n.button`
  background: none;
  border: none;
`, d = n(a.Password)`
  transition: outline 0s;

  :has(input:focus) {
    box-shadow: 0 0 2px ${e("colorPrimary")};
    outline: ${(e) => `${e.theme.lineWidth * 4}`}px solid
      ${e("colorPrimaryBorder")};
    outline-offset: 1px;
  }
`, f = (e) => {
	let { className: t, onChange: n = null, type: a = "text", passwordIconRender: f = null, ...p } = e, m = (e) => n?.(e.target.value), h = (e) => /* @__PURE__ */ r(u, {
		"aria-checked": e,
		"aria-label": e ? "Hide password" : "Show password",
		onClick: (e) => e.preventDefault(),
		role: "switch",
		type: "button",
		children: r(e ? s : o, {})
	});
	return /* @__PURE__ */ i(c, {
		className: t,
		children: [a !== "password" && /* @__PURE__ */ r(l, {
			onChange: m,
			...p
		}), a === "password" && /* @__PURE__ */ r(d, {
			iconRender: f || h,
			onChange: m,
			...p
		})]
	});
};
//#endregion
export { f as default };