@kubetail/ui 2.0.0-rc4 → 2.0.0-rc5
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
- package/dist/elements/search-box.cjs +2 -0
- package/dist/elements/search-box.cjs.map +1 -0
- package/dist/elements/search-box.d.ts +11 -0
- package/dist/elements/search-box.js +28 -0
- package/dist/elements/search-box.js.map +1 -0
- package/dist/elements/search-box.stories.d.ts +34 -0
- package/dist/elements/search-box.test.d.ts +0 -0
- package/package.json +4 -56
|
@@ -0,0 +1,2 @@
|
|
|
1
|
+
"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const e=require("react/jsx-runtime"),u=require("react"),l=require("lucide-react"),d=require("./input.cjs"),t=require("../lib/utils.cjs"),a=u.forwardRef(({className:s,containerClassName:c,placeholder:n="",...r},i)=>{const{disabled:o}=r;return e.jsxs("div",{className:t.cn("relative w-full max-w-sm",c),children:[e.jsx(l.Search,{"aria-hidden":!0,className:t.cn("pointer-events-none absolute left-3 top-1/2 h-4 w-4 -translate-y-1/2 text-muted-foreground",o&&"opacity-50")}),e.jsx(d.Input,{ref:i,type:"search",placeholder:n,className:t.cn("pl-9",s),...r})]})});a.displayName="SearchBox";exports.SearchBox=a;
|
|
2
|
+
//# sourceMappingURL=search-box.cjs.map
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"file":"search-box.cjs","sources":["../../src/elements/search-box.tsx"],"sourcesContent":["import { forwardRef } from 'react';\nimport { Search } from 'lucide-react';\n\nimport { Input } from '@/elements/input';\nimport { cn } from '@/lib/utils';\n\nexport type SearchBoxProps = React.ComponentProps<typeof Input> & {\n containerClassName?: string;\n};\n\n/**\n * A compact search box.\n * - Uses shadcn <Input/>\n * - Leading search icon\n */\nconst SearchBox = forwardRef<HTMLInputElement, SearchBoxProps>(\n ({ className, containerClassName, placeholder = '', ...props }, ref) => {\n const { disabled } = props;\n\n return (\n <div className={cn('relative w-full max-w-sm', containerClassName)}>\n <Search\n aria-hidden\n className={cn(\n 'pointer-events-none absolute left-3 top-1/2 h-4 w-4 -translate-y-1/2 text-muted-foreground',\n disabled && 'opacity-50',\n )}\n />\n <Input ref={ref} type=\"search\" placeholder={placeholder} className={cn('pl-9', className)} {...props} />\n </div>\n );\n },\n);\n\nSearchBox.displayName = 'SearchBox';\n\nexport { SearchBox };\n"],"names":["SearchBox","forwardRef","className","containerClassName","placeholder","props","ref","disabled","cn","jsx","Search","Input"],"mappings":"yNAeMA,EAAYC,EAAAA,WAChB,CAAC,CAAE,UAAAC,EAAW,mBAAAC,EAAoB,YAAAC,EAAc,GAAI,GAAGC,CAAA,EAASC,IAAQ,CACtE,KAAM,CAAE,SAAAC,GAAaF,EAErB,cACG,MAAA,CAAI,UAAWG,EAAAA,GAAG,2BAA4BL,CAAkB,EAC/D,SAAA,CAAAM,EAAAA,IAACC,EAAAA,OAAA,CACC,cAAW,GACX,UAAWF,EAAAA,GACT,6FACAD,GAAY,YAAA,CACd,CAAA,EAEFE,EAAAA,IAACE,EAAAA,MAAA,CAAM,IAAAL,EAAU,KAAK,SAAS,YAAAF,EAA0B,UAAWI,EAAAA,GAAG,OAAQN,CAAS,EAAI,GAAGG,CAAA,CAAO,CAAA,EACxG,CAEJ,CACF,EAEAL,EAAU,YAAc"}
|
|
@@ -0,0 +1,11 @@
|
|
|
1
|
+
import { Input } from './input';
|
|
2
|
+
export type SearchBoxProps = React.ComponentProps<typeof Input> & {
|
|
3
|
+
containerClassName?: string;
|
|
4
|
+
};
|
|
5
|
+
/**
|
|
6
|
+
* A compact search box.
|
|
7
|
+
* - Uses shadcn <Input/>
|
|
8
|
+
* - Leading search icon
|
|
9
|
+
*/
|
|
10
|
+
declare const SearchBox: import('react').ForwardRefExoticComponent<Omit<SearchBoxProps, "ref"> & import('react').RefAttributes<HTMLInputElement>>;
|
|
11
|
+
export { SearchBox };
|
|
@@ -0,0 +1,28 @@
|
|
|
1
|
+
import { jsxs as l, jsx as t } from "react/jsx-runtime";
|
|
2
|
+
import { forwardRef as n } from "react";
|
|
3
|
+
import { Search as c } from "lucide-react";
|
|
4
|
+
import { Input as p } from "./input.js";
|
|
5
|
+
import { cn as e } from "../lib/utils.js";
|
|
6
|
+
const d = n(
|
|
7
|
+
({ className: a, containerClassName: o, placeholder: m = "", ...r }, s) => {
|
|
8
|
+
const { disabled: i } = r;
|
|
9
|
+
return /* @__PURE__ */ l("div", { className: e("relative w-full max-w-sm", o), children: [
|
|
10
|
+
/* @__PURE__ */ t(
|
|
11
|
+
c,
|
|
12
|
+
{
|
|
13
|
+
"aria-hidden": !0,
|
|
14
|
+
className: e(
|
|
15
|
+
"pointer-events-none absolute left-3 top-1/2 h-4 w-4 -translate-y-1/2 text-muted-foreground",
|
|
16
|
+
i && "opacity-50"
|
|
17
|
+
)
|
|
18
|
+
}
|
|
19
|
+
),
|
|
20
|
+
/* @__PURE__ */ t(p, { ref: s, type: "search", placeholder: m, className: e("pl-9", a), ...r })
|
|
21
|
+
] });
|
|
22
|
+
}
|
|
23
|
+
);
|
|
24
|
+
d.displayName = "SearchBox";
|
|
25
|
+
export {
|
|
26
|
+
d as SearchBox
|
|
27
|
+
};
|
|
28
|
+
//# sourceMappingURL=search-box.js.map
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"file":"search-box.js","sources":["../../src/elements/search-box.tsx"],"sourcesContent":["import { forwardRef } from 'react';\nimport { Search } from 'lucide-react';\n\nimport { Input } from '@/elements/input';\nimport { cn } from '@/lib/utils';\n\nexport type SearchBoxProps = React.ComponentProps<typeof Input> & {\n containerClassName?: string;\n};\n\n/**\n * A compact search box.\n * - Uses shadcn <Input/>\n * - Leading search icon\n */\nconst SearchBox = forwardRef<HTMLInputElement, SearchBoxProps>(\n ({ className, containerClassName, placeholder = '', ...props }, ref) => {\n const { disabled } = props;\n\n return (\n <div className={cn('relative w-full max-w-sm', containerClassName)}>\n <Search\n aria-hidden\n className={cn(\n 'pointer-events-none absolute left-3 top-1/2 h-4 w-4 -translate-y-1/2 text-muted-foreground',\n disabled && 'opacity-50',\n )}\n />\n <Input ref={ref} type=\"search\" placeholder={placeholder} className={cn('pl-9', className)} {...props} />\n </div>\n );\n },\n);\n\nSearchBox.displayName = 'SearchBox';\n\nexport { SearchBox };\n"],"names":["SearchBox","forwardRef","className","containerClassName","placeholder","props","ref","disabled","cn","jsx","Search","Input"],"mappings":";;;;;AAeA,MAAMA,IAAYC;AAAA,EAChB,CAAC,EAAE,WAAAC,GAAW,oBAAAC,GAAoB,aAAAC,IAAc,IAAI,GAAGC,EAAA,GAASC,MAAQ;AACtE,UAAM,EAAE,UAAAC,MAAaF;AAErB,6BACG,OAAA,EAAI,WAAWG,EAAG,4BAA4BL,CAAkB,GAC/D,UAAA;AAAA,MAAA,gBAAAM;AAAA,QAACC;AAAA,QAAA;AAAA,UACC,eAAW;AAAA,UACX,WAAWF;AAAA,YACT;AAAA,YACAD,KAAY;AAAA,UAAA;AAAA,QACd;AAAA,MAAA;AAAA,MAEF,gBAAAE,EAACE,GAAA,EAAM,KAAAL,GAAU,MAAK,UAAS,aAAAF,GAA0B,WAAWI,EAAG,QAAQN,CAAS,GAAI,GAAGG,EAAA,CAAO;AAAA,IAAA,GACxG;AAAA,EAEJ;AACF;AAEAL,EAAU,cAAc;"}
|
|
@@ -0,0 +1,34 @@
|
|
|
1
|
+
import { StoryObj } from '@storybook/react-vite';
|
|
2
|
+
declare const meta: {
|
|
3
|
+
title: string;
|
|
4
|
+
tags: string[];
|
|
5
|
+
component: import('react').ForwardRefExoticComponent<Omit<import('./search-box').SearchBoxProps, "ref"> & import('react').RefAttributes<HTMLInputElement>>;
|
|
6
|
+
parameters: {
|
|
7
|
+
docs: {
|
|
8
|
+
description: {
|
|
9
|
+
component: string;
|
|
10
|
+
};
|
|
11
|
+
};
|
|
12
|
+
};
|
|
13
|
+
args: {
|
|
14
|
+
defaultValue: string;
|
|
15
|
+
disabled: false;
|
|
16
|
+
placeholder: string;
|
|
17
|
+
};
|
|
18
|
+
argTypes: {
|
|
19
|
+
defaultValue: {
|
|
20
|
+
control: "text";
|
|
21
|
+
};
|
|
22
|
+
disabled: {
|
|
23
|
+
control: "boolean";
|
|
24
|
+
};
|
|
25
|
+
placeholder: {
|
|
26
|
+
control: "text";
|
|
27
|
+
};
|
|
28
|
+
};
|
|
29
|
+
};
|
|
30
|
+
export default meta;
|
|
31
|
+
type Story = StoryObj<typeof meta>;
|
|
32
|
+
export declare const Default: Story;
|
|
33
|
+
export declare const Filled: Story;
|
|
34
|
+
export declare const Disabled: Story;
|
|
File without changes
|
package/package.json
CHANGED
|
@@ -1,6 +1,6 @@
|
|
|
1
1
|
{
|
|
2
2
|
"name": "@kubetail/ui",
|
|
3
|
-
"version": "v2.0.0-
|
|
3
|
+
"version": "v2.0.0-rc5",
|
|
4
4
|
"type": "module",
|
|
5
5
|
"sideEffects": false,
|
|
6
6
|
"module": "./dist/index.js",
|
|
@@ -15,61 +15,9 @@
|
|
|
15
15
|
"import": "./dist/elements/index.js",
|
|
16
16
|
"require": "./dist/elements/index.cjs"
|
|
17
17
|
},
|
|
18
|
-
"./elements
|
|
19
|
-
"import": "./dist/elements
|
|
20
|
-
"require": "./dist/elements
|
|
21
|
-
},
|
|
22
|
-
"./elements/button": {
|
|
23
|
-
"import": "./dist/elements/button.js",
|
|
24
|
-
"require": "./dist/elements/button.cjs"
|
|
25
|
-
},
|
|
26
|
-
"./elements/calendar": {
|
|
27
|
-
"import": "./dist/elements/calendar.js",
|
|
28
|
-
"require": "./dist/elements/calendar.cjs"
|
|
29
|
-
},
|
|
30
|
-
"./elements/card": {
|
|
31
|
-
"import": "./dist/elements/card.js",
|
|
32
|
-
"require": "./dist/elements/card.cjs"
|
|
33
|
-
},
|
|
34
|
-
"./elements/checkbox": {
|
|
35
|
-
"import": "./dist/elements/checkbox.js",
|
|
36
|
-
"require": "./dist/elements/checkbox.cjs"
|
|
37
|
-
},
|
|
38
|
-
"./elements/dropdown-menu": {
|
|
39
|
-
"import": "./dist/elements/dropdown-menu.js",
|
|
40
|
-
"require": "./dist/elements/dropdown-menu.cjs"
|
|
41
|
-
},
|
|
42
|
-
"./elements/form": {
|
|
43
|
-
"import": "./dist/elements/form.js",
|
|
44
|
-
"require": "./dist/elements/form.cjs"
|
|
45
|
-
},
|
|
46
|
-
"./elements/input": {
|
|
47
|
-
"import": "./dist/elements/input.js",
|
|
48
|
-
"require": "./dist/elements/input.cjs"
|
|
49
|
-
},
|
|
50
|
-
"./elements/label": {
|
|
51
|
-
"import": "./dist/elements/label.js",
|
|
52
|
-
"require": "./dist/elements/label.cjs"
|
|
53
|
-
},
|
|
54
|
-
"./elements/popover": {
|
|
55
|
-
"import": "./dist/elements/popover.js",
|
|
56
|
-
"require": "./dist/elements/popover.cjs"
|
|
57
|
-
},
|
|
58
|
-
"./elements/select": {
|
|
59
|
-
"import": "./dist/elements/select.js",
|
|
60
|
-
"require": "./dist/elements/select.cjs"
|
|
61
|
-
},
|
|
62
|
-
"./elements/spinner": {
|
|
63
|
-
"import": "./dist/elements/spinner.js",
|
|
64
|
-
"require": "./dist/elements/spinner.cjs"
|
|
65
|
-
},
|
|
66
|
-
"./elements/table": {
|
|
67
|
-
"import": "./dist/elements/table.js",
|
|
68
|
-
"require": "./dist/elements/table.cjs"
|
|
69
|
-
},
|
|
70
|
-
"./elements/tabs": {
|
|
71
|
-
"import": "./dist/elements/tabs.js",
|
|
72
|
-
"require": "./dist/elements/tabs.cjs"
|
|
18
|
+
"./elements/*": {
|
|
19
|
+
"import": "./dist/elements/*.js",
|
|
20
|
+
"require": "./dist/elements/*.cjs"
|
|
73
21
|
},
|
|
74
22
|
"./package.json": "./package.json"
|
|
75
23
|
},
|