@purr-react-styled-components/components.post-adornment 0.0.1

package/dist/_components.d.ts

@@ -0,0 +1,4 @@
+import { default as React } from 'react';
+import { IPostAdornmentProps } from './_types';
+
+export declare const PostAdornment: React.MemoExoticComponent<({ className, children, variant, clearIcon, hasLabel, htmlAttributes, clear, }: IPostAdornmentProps) => React.JSX.Element | null>;

package/dist/_style.d.ts

@@ -0,0 +1,6 @@
+import { IStyledContainerProps } from './_types';
+
+export declare const Styled: {
+    Container: import('styled-components/dist/types').IStyledComponentBase<"web", import('styled-components/dist/types').Substitute<import('react').DetailedHTMLProps<import('react').HTMLAttributes<HTMLSpanElement>, HTMLSpanElement>, IStyledContainerProps>> & string;
+    ButtonContainer: import('styled-components/dist/types').IStyledComponentBase<"web", import('styled-components/dist/types').Substitute<import('react').DetailedHTMLProps<import('react').ButtonHTMLAttributes<HTMLButtonElement>, HTMLButtonElement>, IStyledContainerProps>> & string;
+};

package/dist/_types.d.ts

@@ -0,0 +1,17 @@
+import { HTMLAttributes, ReactNode } from 'react';
+import { IExtendable } from '@purr-core/utils.definitions';
+
+export type TPostAdornmentVariant = "outlined" | "filled" | "standard";
+export interface IPostAdornmentProps {
+    className?: string;
+    variant?: TPostAdornmentVariant;
+    children?: ReactNode;
+    clearIcon?: ReactNode;
+    hasLabel?: boolean;
+    htmlAttributes?: HTMLAttributes<HTMLSpanElement & HTMLButtonElement> & IExtendable;
+    clear?: () => void;
+}
+export interface IStyledContainerProps {
+    $adornmentVariant: TPostAdornmentVariant;
+    $hasLabel: boolean;
+}

package/dist/index.cjs

@@ -0,0 +1 @@
+"use strict";var y=Object.create;var c=Object.defineProperty;var x=Object.getOwnPropertyDescriptor;var C=Object.getOwnPropertyNames;var b=Object.getPrototypeOf,h=Object.prototype.hasOwnProperty;var _=(n,t,e,r)=>{if(t&&typeof t=="object"||typeof t=="function")for(let o of C(t))!h.call(n,o)&&o!==e&&c(n,o,{get:()=>t[o],enumerable:!(r=x(t,o))||r.enumerable});return n};var g=(n,t,e)=>(e=n!=null?y(b(n)):{},_(t||!n||!n.__esModule?c(e,"default",{value:n,enumerable:!0}):e,n));Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const s=require("react/jsx-runtime"),j=require("clsx"),u=require("react"),a=require("styled-components"),q=require("@purr-react-styled-components/utils.helpers"),d=n=>a.css(["display:flex;position:absolute;transform:translateY(-50%);color:#ffffff;top:",";right:",";"],n.$hasLabel?"calc(50% + 6px)":"50%",n.$adornmentVariant==="standard"?"0px":"14px"),m={Container:a.span.withConfig({displayName:"_style__Container",componentId:"sc-1nzmnwy-0"})(["",";"],d),ButtonContainer:a.button.withConfig({displayName:"_style__ButtonContainer",componentId:"sc-1nzmnwy-1"})(["",";",";"],q.getInvisibleButton,d)},I=u.lazy(()=>import("@purr-react-styled-components/components.icon").then(n=>({default:n.Icon}))),p=u.memo(({className:n,children:t=null,variant:e="standard",clearIcon:r=null,hasLabel:o=!1,htmlAttributes:f,clear:i})=>{const l={...f,$adornmentVariant:e,$hasLabel:o,className:j("post-adornment",`post-adornment--variant-${e}`,o&&"post-adornment--hasLabel",n)};return i?s.jsx(m.ButtonContainer,{...l,onClick:i,children:r??s.jsx(I,{name:"x"})}):t?s.jsx(m.Container,{...l,children:t}):null});p.displayName="PostAdornment";exports.PostAdornment=p;

package/dist/index.d.ts

@@ -0,0 +1,2 @@
+export * from './_components';
+export * from './_types';

package/dist/index.js

@@ -0,0 +1,37 @@
+import { jsx as t } from "react/jsx-runtime";
+import f from "clsx";
+import { lazy as c, memo as u } from "react";
+import i, { css as y } from "styled-components";
+import { getInvisibleButton as C } from "@purr-react-styled-components/utils.helpers";
+const m = (n) => y(["display:flex;position:absolute;transform:translateY(-50%);color:#ffffff;top:", ";right:", ";"], n.$hasLabel ? "calc(50% + 6px)" : "50%", n.$adornmentVariant === "standard" ? "0px" : "14px"), l = {
+  Container: i.span.withConfig({
+    displayName: "_style__Container",
+    componentId: "sc-1nzmnwy-0"
+  })(["", ";"], m),
+  ButtonContainer: i.button.withConfig({
+    displayName: "_style__ButtonContainer",
+    componentId: "sc-1nzmnwy-1"
+  })(["", ";", ";"], C, m)
+}, x = c(() => import("@purr-react-styled-components/components.icon").then((n) => ({
+  default: n.Icon
+}))), h = u(({
+  className: n,
+  children: o = null,
+  variant: a = "standard",
+  clearIcon: d = null,
+  hasLabel: r = !1,
+  htmlAttributes: p,
+  clear: e
+}) => {
+  const s = {
+    ...p,
+    $adornmentVariant: a,
+    $hasLabel: r,
+    className: f("post-adornment", `post-adornment--variant-${a}`, r && "post-adornment--hasLabel", n)
+  };
+  return e ? /* @__PURE__ */ t(l.ButtonContainer, { ...s, onClick: e, children: d ?? /* @__PURE__ */ t(x, { name: "x" }) }) : o ? /* @__PURE__ */ t(l.Container, { ...s, children: o }) : null;
+});
+h.displayName = "PostAdornment";
+export {
+  h as PostAdornment
+};

package/package.json

@@ -0,0 +1,41 @@
+{
+  "name": "@purr-react-styled-components/components.post-adornment",
+  "version": "0.0.1",
+  "type": "module",
+  "main": "dist/index.cjs",
+  "module": "dist/index.js",
+  "types": "dist/index.d.ts",
+  "exports": {
+    ".": {
+      "import": {
+        "types": "./dist/index.d.ts",
+        "default": "./dist/index.js"
+      },
+      "require": {
+        "types": "./dist/index.d.ts",
+        "default": "./dist/index.cjs"
+      }
+    }
+  },
+  "files": [
+    "dist"
+  ],
+  "peerDependencies": {
+    "typescript": "*",
+    "react": "*",
+    "styled-components": "*",
+    "clsx": "*",
+    "@purr-core/utils.definitions": "0.0.4",
+    "@purr-react-styled-components/utils.helpers": "0.0.1",
+    "@purr-react-styled-components/components.icon": "0.0.1"
+  },
+  "author": "@DinhThienPhuc",
+  "license": "ISC",
+  "description": "",
+  "sideEffects": false,
+  "scripts": {
+    "dev": "vite build --watch",
+    "build": "tsc && vite build",
+    "lint": "eslint . --ext ts,tsx --max-warnings 0"
+  }
+}