jb-select 7.1.1 → 7.1.3
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/index.cjs.js +1 -1
- package/dist/index.cjs.js.br +0 -0
- package/dist/index.cjs.js.gz +0 -0
- package/dist/index.cjs.js.map +1 -1
- package/dist/index.js +1 -1
- package/dist/index.js.br +0 -0
- package/dist/index.js.gz +0 -0
- package/dist/index.js.map +1 -1
- package/dist/index.umd.js +1 -1
- package/dist/index.umd.js.br +0 -0
- package/dist/index.umd.js.gz +0 -0
- package/dist/index.umd.js.map +1 -1
- package/dist/jb-option-list/jb-option-list.d.ts +1 -1
- package/dist/jb-option-list/jb-option-list.d.ts.map +1 -1
- package/dist/jb-select.d.ts +9 -4
- package/dist/jb-select.d.ts.map +1 -1
- package/dist/types.d.ts +4 -0
- package/dist/types.d.ts.map +1 -1
- package/lib/jb-option-list/jb-option-list.ts +5 -3
- package/lib/jb-select.css +1 -0
- package/lib/jb-select.ts +23 -4
- package/lib/types.ts +6 -1
- package/lib/variables.css +1 -1
- package/package.json +2 -2
- package/react/dist/JBSelect.d.ts +4 -22
- package/react/dist/attributes-hook.d.ts +1 -1
- package/react/dist/events-hook.d.ts +1 -1
- package/react/dist/index.cjs.js +1 -1
- package/react/dist/index.cjs.js.map +1 -1
- package/react/dist/index.js +1 -1
- package/react/dist/index.js.map +1 -1
- package/react/dist/index.umd.js +1 -1
- package/react/dist/index.umd.js.map +1 -1
- package/react/dist/module-declaration.d.ts +12 -1
- package/react/lib/JBOption.tsx +2 -1
- package/react/lib/JBSelect.tsx +8 -25
- package/react/lib/attributes-hook.ts +1 -1
- package/react/lib/events-hook.ts +1 -1
- package/react/lib/module-declaration.ts +12 -1
- package/react/tsconfig.json +1 -1
package/lib/jb-select.ts
CHANGED
|
@@ -5,6 +5,7 @@ import VariablesCSS from "./variables.css";
|
|
|
5
5
|
import type {
|
|
6
6
|
JBSelectCallbacks,
|
|
7
7
|
JBSelectElements,
|
|
8
|
+
PopoverPosition,
|
|
8
9
|
ValidationValue,
|
|
9
10
|
} from "./types";
|
|
10
11
|
import { type ShowValidationErrorParameters, ValidationHelper, type ValidationItem, type ValidationResult, type WithValidation } from "jb-validation";
|
|
@@ -41,6 +42,17 @@ export class JBSelectWebComponent<TValue = any> extends HTMLElement implements W
|
|
|
41
42
|
#selectedOption: JBOptionWebComponent<TValue> | null = null;
|
|
42
43
|
callbacks: JBSelectCallbacks<TValue> = {}
|
|
43
44
|
elements!: JBSelectElements;
|
|
45
|
+
#popoverPosition:PopoverPosition = "absolute"
|
|
46
|
+
/**
|
|
47
|
+
* how we set popover position
|
|
48
|
+
*/
|
|
49
|
+
get popoverPosition(){
|
|
50
|
+
return this.#popoverPosition
|
|
51
|
+
}
|
|
52
|
+
set popoverPosition(value:PopoverPosition|undefined){
|
|
53
|
+
if(value === undefined) return;
|
|
54
|
+
this.#popoverPosition = value;
|
|
55
|
+
}
|
|
44
56
|
get value() {
|
|
45
57
|
if (this.#value !== null && this.#value !== undefined) {
|
|
46
58
|
return this.#value;
|
|
@@ -66,7 +78,7 @@ export class JBSelectWebComponent<TValue = any> extends HTMLElement implements W
|
|
|
66
78
|
return "";
|
|
67
79
|
}
|
|
68
80
|
}
|
|
69
|
-
get form(){
|
|
81
|
+
get form() {
|
|
70
82
|
return this.#internals.form;
|
|
71
83
|
}
|
|
72
84
|
#placeholder = "";
|
|
@@ -183,7 +195,11 @@ export class JBSelectWebComponent<TValue = any> extends HTMLElement implements W
|
|
|
183
195
|
}
|
|
184
196
|
}
|
|
185
197
|
#setupPopover() {
|
|
186
|
-
|
|
198
|
+
if(this.popoverPosition =="fixed"){
|
|
199
|
+
this.elements.optionListWrapper.bindTarget(this.elements.selectBox);
|
|
200
|
+
}else{
|
|
201
|
+
this.elements.optionListWrapper.unBindTarget();
|
|
202
|
+
}
|
|
187
203
|
}
|
|
188
204
|
#callOnInitEvent() {
|
|
189
205
|
const event = new CustomEvent("init", { bubbles: true, composed: true });
|
|
@@ -569,11 +585,14 @@ export class JBSelectWebComponent<TValue = any> extends HTMLElement implements W
|
|
|
569
585
|
showValidationError(error: ShowValidationErrorParameters | string) {
|
|
570
586
|
const message = typeof error == "string" ? error : error.message;
|
|
571
587
|
this.elements.messageBox.innerHTML = message;
|
|
572
|
-
|
|
588
|
+
//invalid state is used for ui purpose
|
|
589
|
+
this.#internals.states?.add("invalid");
|
|
590
|
+
this.#internals.ariaInvalid = "true"
|
|
573
591
|
}
|
|
574
592
|
clearValidationError() {
|
|
575
593
|
this.elements.messageBox.innerHTML = this.getAttribute("message") || "";
|
|
576
|
-
this.
|
|
594
|
+
this.#internals.states?.delete("invalid");
|
|
595
|
+
this.#internals.ariaInvalid = "false"
|
|
577
596
|
}
|
|
578
597
|
#dispatchOnChangeEvent() {
|
|
579
598
|
const event = new Event("change", { bubbles: true, cancelable: true });
|
package/lib/types.ts
CHANGED
|
@@ -32,4 +32,9 @@ export type ValidationValue<TValue> = {
|
|
|
32
32
|
export type JBSelectEventType<TEvent> = EventTypeWithTarget<TEvent,JBSelectWebComponent>
|
|
33
33
|
|
|
34
34
|
/* Variants */
|
|
35
|
-
export type SizeVariants = 'xs' | 'sm' | 'md' | 'lg' | 'xl';
|
|
35
|
+
export type SizeVariants = 'xs' | 'sm' | 'md' | 'lg' | 'xl';
|
|
36
|
+
|
|
37
|
+
/**
|
|
38
|
+
*
|
|
39
|
+
*/
|
|
40
|
+
export type PopoverPosition = 'fixed'|"absolute";
|
package/lib/variables.css
CHANGED
package/package.json
CHANGED
|
@@ -16,7 +16,7 @@
|
|
|
16
16
|
"web component",
|
|
17
17
|
"react component"
|
|
18
18
|
],
|
|
19
|
-
"version": "7.1.
|
|
19
|
+
"version": "7.1.3",
|
|
20
20
|
"bugs": "https://github.com/javadbat/jb-select/issues",
|
|
21
21
|
"homepage": "https://javadbat.github.io/design-system/?path=/story/components-form-elements-jbselect",
|
|
22
22
|
"license": "MIT",
|
|
@@ -37,7 +37,7 @@
|
|
|
37
37
|
"dependencies": {
|
|
38
38
|
"jb-validation": ">=0.4.0",
|
|
39
39
|
"jb-button": ">=3.9.1",
|
|
40
|
-
"jb-popover": ">=1.
|
|
40
|
+
"jb-popover": ">=1.7.0",
|
|
41
41
|
"jb-core":">=0.26.0"
|
|
42
42
|
},
|
|
43
43
|
"devDependencies": {
|
package/react/dist/JBSelect.d.ts
CHANGED
|
@@ -1,36 +1,18 @@
|
|
|
1
1
|
import React, { type PropsWithChildren } from 'react';
|
|
2
2
|
import 'jb-select';
|
|
3
|
-
import type { JBSelectWebComponent, SizeVariants } from 'jb-select';
|
|
3
|
+
import type { JBSelectWebComponent, PopoverPosition, SizeVariants } from 'jb-select';
|
|
4
4
|
import { type EventProps } from './events-hook.js';
|
|
5
5
|
import { type JBSelectAttributes } from './attributes-hook.js';
|
|
6
6
|
import type { JBElementStandardProps } from 'jb-core/react';
|
|
7
|
+
import './module-declaration.js';
|
|
7
8
|
export type JBSelectEventType<T> = T & {
|
|
8
9
|
target: JBSelectWebComponent;
|
|
9
10
|
};
|
|
10
|
-
declare module "react" {
|
|
11
|
-
namespace JSX {
|
|
12
|
-
interface IntrinsicElements {
|
|
13
|
-
'jb-select': JBSelectType;
|
|
14
|
-
}
|
|
15
|
-
interface JBSelectType extends React.DetailedHTMLProps<React.HTMLAttributes<JBSelectWebComponent>, JBSelectWebComponent> {
|
|
16
|
-
class?: string;
|
|
17
|
-
label?: string;
|
|
18
|
-
name?: string;
|
|
19
|
-
required?: string | boolean;
|
|
20
|
-
message?: string;
|
|
21
|
-
tabindex?: string;
|
|
22
|
-
size?: string;
|
|
23
|
-
"hide-clean"?: string;
|
|
24
|
-
}
|
|
25
|
-
}
|
|
26
|
-
}
|
|
27
11
|
export declare function JBSelect<TValue>(props: Props<TValue>): React.JSX.Element;
|
|
28
|
-
export declare namespace JBSelect {
|
|
29
|
-
var displayName: string;
|
|
30
|
-
}
|
|
31
12
|
export type Props<TValue> = PropsWithChildren<EventProps & JBSelectAttributes<TValue>> & JBElementStandardProps<JBSelectWebComponent, keyof EventProps & JBSelectAttributes<TValue>> & {
|
|
32
|
-
ref?: React.
|
|
13
|
+
ref?: React.ForwardedRef<JBSelectWebComponent | null | undefined>;
|
|
33
14
|
size?: SizeVariants;
|
|
34
15
|
name?: string;
|
|
35
16
|
disabled?: boolean;
|
|
17
|
+
popoverPosition?: PopoverPosition;
|
|
36
18
|
};
|
|
@@ -13,4 +13,4 @@ export type JBSelectAttributes<TValue> = {
|
|
|
13
13
|
hideClear?: boolean;
|
|
14
14
|
getSelectedValueDOM?: (option: any) => HTMLElement;
|
|
15
15
|
};
|
|
16
|
-
export declare function useJBSelectAttribute<TValue>(element: RefObject<JBSelectWebComponent>, props: JBSelectAttributes<TValue>): void;
|
|
16
|
+
export declare function useJBSelectAttribute<TValue>(element: RefObject<JBSelectWebComponent | null>, props: JBSelectAttributes<TValue>): void;
|
|
@@ -13,4 +13,4 @@ export type EventProps = {
|
|
|
13
13
|
onKeyUp?: (e: JBSelectEventType<KeyboardEvent>) => void;
|
|
14
14
|
onInput?: (e: JBSelectEventType<InputEvent>) => void;
|
|
15
15
|
};
|
|
16
|
-
export declare function useEvents(element: RefObject<JBSelectWebComponent>, props: EventProps): void;
|
|
16
|
+
export declare function useEvents(element: RefObject<JBSelectWebComponent | null>, props: EventProps): void;
|
package/react/dist/index.cjs.js
CHANGED
|
@@ -1,2 +1,2 @@
|
|
|
1
|
-
var e=Object.create,t=Object.defineProperty,r=Object.getOwnPropertyDescriptor,
|
|
1
|
+
var e=Object.create,t=Object.defineProperty,r=Object.getOwnPropertyDescriptor,u=Object.getOwnPropertyNames,l=Object.getPrototypeOf,n=Object.prototype.hasOwnProperty,c=(e,l,c,a)=>{if(l&&"object"==typeof l||"function"==typeof l)for(var o,i=u(l),s=0,f=i.length;s<f;s++)o=i[s],n.call(e,o)||o===c||t(e,o,{get:(e=>l[e]).bind(null,o),enumerable:!(a=r(l,o))||a.enumerable});return e},a=(r,u,n)=>(n=null!=r?e(l(r)):{},c(!u&&r&&r.__esModule?n:t(n,"default",{value:r,enumerable:!0}),r));const o=a(require("react"));require("jb-select");const i=a(require("jb-core/react")),s=o.default.forwardRef((e,t)=>{let r=(0,o.useRef)(null);return(0,o.useImperativeHandle)(t,()=>r?r.current:void 0,[r]),(0,o.useEffect)(()=>{r.current&&Array.isArray(e.optionList)&&(r.current.optionList=e.optionList)},[e.optionList,r]),(0,o.useEffect)(()=>{r.current&&"function"==typeof e.getTitle&&r.current.setCallback("getTitle",e.getTitle)},[e.getTitle,r]),(0,o.useEffect)(()=>{r.current&&"function"==typeof e.getValue&&r.current.setCallback("getValue",e.getValue)},[e.getValue,r]),(0,o.useEffect)(()=>{r.current&&"function"==typeof e.getContentDOM&&r.current.setCallback("getContentDOM",e.getContentDOM)},[e.getContentDOM,r]),o.default.createElement("jb-option-list",{ref:r})});function f(e){let t=(0,o.useRef)(null),{children:r,ref:u,className:l,...n}=e;return(0,o.useImperativeHandle)(u,()=>t.current??void 0,[t]),o.default.createElement("jb-option",{class:l,ref:t,...n},r)}s.displayName="JBOptionList",f.displayName="JBOption",exports.JBOption=f,exports.JBOptionList=s,exports.JBSelect=function(e){var t,r;let u=(0,o.useRef)(null),{onChange:l,onInit:n,onInput:c,onKeyUp:a,onLoad:s,ref:f,error:d,getSelectedValueDOM:p,label:b,required:v,message:g,placeholder:h,searchPlaceholder:m,validationList:E,value:O,hideClear:y,...A}=e;return(0,o.useImperativeHandle)(f,()=>u.current??void 0,[u]),t={onChange:l,onInit:n,onInput:c,onKeyUp:a,onLoad:s},(0,i.useEvent)(u,"load",t.onLoad,!0),(0,i.useEvent)(u,"init",t.onInit,!0),(0,i.useEvent)(u,"keyup",t.onKeyUp),(0,i.useEvent)(u,"change",t.onChange),(0,i.useEvent)(u,"input",t.onInput),r={error:d,getSelectedValueDOM:p,label:b,required:v,message:g,placeholder:h,searchPlaceholder:m,validationList:E,value:O,hideClear:y},(0,o.useEffect)(()=>{null!==r.message&&void 0!==r.message?u.current?.setAttribute("message",r.message):u.current?.removeAttribute("message")},[r.message]),(0,o.useEffect)(()=>{u?.current&&(u.current.validation.list=r.validationList||[])},[u.current,r.validationList]),(0,o.useEffect)(()=>{null!==r.label&&void 0!==r.label?u.current?.setAttribute("label",r.label):u.current?.removeAttribute("label")},[r.label,u.current]),(0,o.useEffect)(()=>{null!==r.required&&void 0!==r.required?u.current?.setAttribute("required",""):u.current?.removeAttribute("required")},[r.required,u]),(0,o.useEffect)(()=>{null!==r.hideClear&&void 0!==r.hideClear?u.current?.setAttribute("hide-clear",""):u.current?.removeAttribute("hide-clear")},[r.hideClear,u]),(0,o.useEffect)(()=>{null!==r.placeholder&&void 0!==r.placeholder&&u.current?.setAttribute("placeholder",r.placeholder)},[r.placeholder,u]),(0,o.useEffect)(()=>{null!==r.searchPlaceholder&&void 0!==r.searchPlaceholder&&u.current?.setAttribute("search-placeholder",r.searchPlaceholder)},[r.searchPlaceholder]),(0,o.useEffect)(()=>{r.error?u?.current?.setAttribute("error",r.error):u?.current?.removeAttribute("error")},[r.error]),(0,o.useEffect)(()=>{u.current&&(u.current.value=r.value)},[r.value]),(0,o.useEffect)(()=>{"function"==typeof r.getSelectedValueDOM&&u.current&&u.current&&(u.current.callbacks.getSelectedValueDOM=r.getSelectedValueDOM)},[r.getSelectedValueDOM]),o.default.createElement("jb-select",{ref:u,...A},e.children)};
|
|
2
2
|
//# sourceMappingURL=index.cjs.js.map
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"index.cjs.js","names":[],"sources":["
|
|
1
|
+
{"version":3,"file":"index.cjs.js","names":[],"sources":["../../../../../../../../../../../../Home/NeveshtAfzar/work/Azad/source/design-system/design-system/web-component/jb-select/react/lib/JBOptionList.tsx","../../../../../../../../../../../../Home/NeveshtAfzar/work/Azad/source/design-system/design-system/web-component/jb-select/react/lib/events-hook.ts","../../../../../../../../../../../../Home/NeveshtAfzar/work/Azad/source/design-system/design-system/web-component/jb-select/react/lib/attributes-hook.ts","../../../../../../../../../../../../Home/NeveshtAfzar/work/Azad/source/design-system/design-system/web-component/jb-select/react/lib/JBSelect.tsx","../../../../../../../../../../../../Home/NeveshtAfzar/work/Azad/source/design-system/design-system/web-component/jb-select/react/lib/JBOption.tsx"],"sourcesContent":[],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;AAEA,MAAY,+BAAuB,cAAA,WAAqB,CAAA,OAAM,QAAO;CAkBrE,MAAO,UAAM,kBAAY,KAAG;AAC1B,gCAAgB,KAAkD,MAAK,UAAA,QAAA,kBAAA,CACvE,OAKA,EAAA;sBACM,MAAA;MACF,QAAQ,WAAQ,MAAA,QAAa,MAAM,WAAU,CAC/C,SAAA,QAAA,aAAA,MAAA;CAEF,GAAA,CACE,MAAI;AAGN,sBAAU,MAAA;AACV,MAAA,QAAe,kBAAA,MAAA,YAAA,WACT,SAAQ,QAAO,YAAW,YAAc,MAAI,SAAU;KAGxD,MAAM,UACV;sBAEI,MAAA;AACF,MAAA,QAAA,kBAAA,MAAA,YAAA,WACE,SAAM,QAAa,YAAW,YAAA,MAAA,SAAA;CAKlC,GAAA,CAQF,MAAa;;;;;;;;;;AC1Cb,SAAgB,UAAU,SAA+C,OAAiB;AACxF,6BAAS,SAAS,QAAQ,MAAM,QAAQ,KAAK;AAC7C,6BAAS,SAAS,QAAQ,MAAM,QAAQ,KAAK;AAC7C,6BAAS,SAAS,SAAS,MAAM,QAAQ;AACzC,6BAAS,SAAS,UAAU,MAAM,SAAS;AAC3C,6BAAS,SAAS,SAAS,MAAM,QAAQ;AAC3C;;;;ACNA,SAAgB,qBAA6B,SAA+C,OAAiC;AAC3H,sBAAU,MAAG;AACX,MAAI,MAAM,YAAY,QAAQ,MAAM,mBAClC,SAAQ,SAAS,aAAa,WAAW,MAAM,QAAQ;eAClD,SAAA,gBAAA,UAAA;KAGL,MAAM,OAEV,EAAA;sBACM,MAAA;MACF,SAAQ,QACV,SAAA,QAAA,WAAA,OAAA,MAAA,kBAAA,CAAA;CAGF,GAAA,CACE,QAAI,eACF;sBACK,MAAA;MACL,MAAA,UAAe,QAAE,MAAA,iBACnB,SAAA,SAAA,aAAA,SAAA,MAAA,MAAA;MAGF,SAAe,SAAA,gBAAA,QAAA;KAGb,MAAA,eAAO;sBAEP,MAAA;AACE,MAAA,MAAM,aAAiB,QAAE,MAAA,oBAE7B,SAAe,SAAA,aAAA,YAAA,GAAA;MAEX,SAAQ,SAAS,gBAAa,WAAc;WAE5C,UACF,OACD,EAAA;AAED,sBAAU,MAAG;AACX,MAAI,MAAM,cAAW,QAAS,MAAI,qBAChC,SAAQ,SAAS,aAAa,cAAa,GAAE;MAE7C,SAAM,SAAY,gBAAS,aAAA;WAI3B,WACF,OACD,EAAA;AACD,sBAAU,MAAG;AACX,MAAI,MAAM,gBAAO,QAAA,MAAA,uBACf,SAAO,SAAS,aAAc,eAAe,MAAM,YAAC;WAEpD,aACF,OACD,EAAA;AACD,sBAAU,MAAG;AACX,MAAI,MAAA,sBAAiB,QAAA,MAAA,6BACnB,SAAQ,SAAQ,aAAc,sBAAK,MAAA,kBAAA;CAEtC,GAAE,CACH,MAAU;sBAEN,MAAA;AACF,MAAA,MAAA,MACE,UAAM,SAAA,aAAqB,SAAA,MAAA,MAAA;;;;;;;;;;;;;AC1EjC,SAAO,SAAA,OAAyB;CAIhC,MAAM,UAAU,kBAAiB,KAAoB;CACnD,MAAM,EAAA,UAAU,QAA6B,SAAK,SAAA,QAAA,KAAA,OAAA,qBAAA,OAAA,UAAA,SAAA,aAAA,mBAAA,gBAAA,OAAA,UAAA,GAAA,YAAA,GAAA;AAClD,gCAAkB,KAAM,MAAE,QAAS,mBAAsB,CACzD,OAKA,EAAA;AACA,WAAA,SAAA;EACA;EAKF;EAAC;;;;;;;;;;;;;;;;;;;;;;;;ACpBD,SAAgB,SAAkB,OAA4B;CAC5D,MAAM,UAAU,kBAAqC,KAAK;CAE1D,MAAM,EAAC,UAAU,KAAI,UAAW,GAAG,MAAK,GAAG;AAC3C,gCACE,KACA,MAAG,QAAI,mBAAiB,CAI1B,OAKF,EAAA;AAAC,wBAAA,cAAA,cAAA,aAAA;EAQO,OAAC"}
|
package/react/dist/index.js
CHANGED
|
@@ -1,2 +1,2 @@
|
|
|
1
|
-
import e,{useEffect as t,useImperativeHandle as r,useRef as l}from"react";import"jb-select";import{useEvent as n}from"jb-core/react";let u=e.forwardRef((n,u)=>{let i=l(null);return r(u,()=>i?i.current:void 0,[i]),t(()=>{i.current&&Array.isArray(n.optionList)&&(i.current.optionList=n.optionList)},[n.optionList,i]),t(()=>{i.current&&"function"==typeof n.getTitle&&i.current.setCallback("getTitle",n.getTitle)},[n.getTitle,i]),t(()=>{i.current&&"function"==typeof n.getValue&&i.current.setCallback("getValue",n.getValue)},[n.getValue,i]),t(()=>{i.current&&"function"==typeof n.getContentDOM&&i.current.setCallback("getContentDOM",n.getContentDOM)},[n.getContentDOM,i]),e.createElement("jb-option-list",{ref:i})});function i(u){var i,
|
|
1
|
+
import e,{useEffect as t,useImperativeHandle as r,useRef as l}from"react";import"jb-select";import{useEvent as n}from"jb-core/react";let u=e.forwardRef((n,u)=>{let i=l(null);return r(u,()=>i?i.current:void 0,[i]),t(()=>{i.current&&Array.isArray(n.optionList)&&(i.current.optionList=n.optionList)},[n.optionList,i]),t(()=>{i.current&&"function"==typeof n.getTitle&&i.current.setCallback("getTitle",n.getTitle)},[n.getTitle,i]),t(()=>{i.current&&"function"==typeof n.getValue&&i.current.setCallback("getValue",n.getValue)},[n.getValue,i]),t(()=>{i.current&&"function"==typeof n.getContentDOM&&i.current.setCallback("getContentDOM",n.getContentDOM)},[n.getContentDOM,i]),e.createElement("jb-option-list",{ref:i})});function i(u){var i,o;let c=l(null),{onChange:a,onInit:s,onInput:d,onKeyUp:p,onLoad:b,ref:g,error:h,getSelectedValueDOM:m,label:v,required:f,message:A,placeholder:O,searchPlaceholder:C,validationList:y,value:L,hideClear:D,...M}=u;return r(g,()=>c.current??void 0,[c]),n(c,"load",(i={onChange:a,onInit:s,onInput:d,onKeyUp:p,onLoad:b}).onLoad,!0),n(c,"init",i.onInit,!0),n(c,"keyup",i.onKeyUp),n(c,"change",i.onChange),n(c,"input",i.onInput),o={error:h,getSelectedValueDOM:m,label:v,required:f,message:A,placeholder:O,searchPlaceholder:C,validationList:y,value:L,hideClear:D},t(()=>{null!==o.message&&void 0!==o.message?c.current?.setAttribute("message",o.message):c.current?.removeAttribute("message")},[o.message]),t(()=>{c?.current&&(c.current.validation.list=o.validationList||[])},[c.current,o.validationList]),t(()=>{null!==o.label&&void 0!==o.label?c.current?.setAttribute("label",o.label):c.current?.removeAttribute("label")},[o.label,c.current]),t(()=>{null!==o.required&&void 0!==o.required?c.current?.setAttribute("required",""):c.current?.removeAttribute("required")},[o.required,c]),t(()=>{null!==o.hideClear&&void 0!==o.hideClear?c.current?.setAttribute("hide-clear",""):c.current?.removeAttribute("hide-clear")},[o.hideClear,c]),t(()=>{null!==o.placeholder&&void 0!==o.placeholder&&c.current?.setAttribute("placeholder",o.placeholder)},[o.placeholder,c]),t(()=>{null!==o.searchPlaceholder&&void 0!==o.searchPlaceholder&&c.current?.setAttribute("search-placeholder",o.searchPlaceholder)},[o.searchPlaceholder]),t(()=>{o.error?c?.current?.setAttribute("error",o.error):c?.current?.removeAttribute("error")},[o.error]),t(()=>{c.current&&(c.current.value=o.value)},[o.value]),t(()=>{"function"==typeof o.getSelectedValueDOM&&c.current&&c.current&&(c.current.callbacks.getSelectedValueDOM=o.getSelectedValueDOM)},[o.getSelectedValueDOM]),e.createElement("jb-select",{ref:c,...M},u.children)}function o(t){let n=l(null),{children:u,ref:i,className:o,...c}=t;return r(i,()=>n.current??void 0,[n]),e.createElement("jb-option",{class:o,ref:n,...c},u)}u.displayName="JBOptionList",o.displayName="JBOption";export{o as JBOption,u as JBOptionList,i as JBSelect};
|
|
2
2
|
//# sourceMappingURL=index.js.map
|
package/react/dist/index.js.map
CHANGED
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"index.js","names":[],"sources":["
|
|
1
|
+
{"version":3,"file":"index.js","names":[],"sources":["../../../../../../../../../../../../Home/NeveshtAfzar/work/Azad/source/design-system/design-system/web-component/jb-select/react/lib/JBOptionList.tsx","../../../../../../../../../../../../Home/NeveshtAfzar/work/Azad/source/design-system/design-system/web-component/jb-select/react/lib/events-hook.ts","../../../../../../../../../../../../Home/NeveshtAfzar/work/Azad/source/design-system/design-system/web-component/jb-select/react/lib/attributes-hook.ts","../../../../../../../../../../../../Home/NeveshtAfzar/work/Azad/source/design-system/design-system/web-component/jb-select/react/lib/JBSelect.tsx","../../../../../../../../../../../../Home/NeveshtAfzar/work/Azad/source/design-system/design-system/web-component/jb-select/react/lib/JBOption.tsx"],"sourcesContent":[],"mappings":";;;;;AAEA,MAAY,+BAAuB,MAAA,WAAqB,CAAA,OAAM,QAAO;CAkBrE,MAAO,UAAM,OAAY,KAAG;AAC1B,qBAAgB,KAAkD,MAAK,UAAA,QAAA,kBAAA,CACvE,OAKA,EAAA;WACM,MAAA;MACF,QAAQ,WAAQ,MAAA,QAAa,MAAM,WAAU,CAC/C,SAAA,QAAA,aAAA,MAAA;CAEF,GAAA,CACE,MAAI;AAGN,WAAU,MAAA;AACV,MAAA,QAAe,kBAAA,MAAA,YAAA,WACT,SAAQ,QAAO,YAAW,YAAc,MAAI,SAAU;KAGxD,MAAM,UACV;WAEI,MAAA;AACF,MAAA,QAAA,kBAAA,MAAA,YAAA,WACE,SAAM,QAAa,YAAW,YAAA,MAAA,SAAA;CAKlC,GAAA,CAQF,MAAa;;;;;;;;;;AC1Cb,SAAgB,UAAU,SAA+C,OAAiB;AACxF,UAAS,SAAS,QAAQ,MAAM,QAAQ,KAAK;AAC7C,UAAS,SAAS,QAAQ,MAAM,QAAQ,KAAK;AAC7C,UAAS,SAAS,SAAS,MAAM,QAAQ;AACzC,UAAS,SAAS,UAAU,MAAM,SAAS;AAC3C,UAAS,SAAS,SAAS,MAAM,QAAQ;AAC3C;;;;ACNA,SAAgB,qBAA6B,SAA+C,OAAiC;AAC3H,WAAU,MAAG;AACX,MAAI,MAAM,YAAY,QAAQ,MAAM,mBAClC,SAAQ,SAAS,aAAa,WAAW,MAAM,QAAQ;eAClD,SAAA,gBAAA,UAAA;KAGL,MAAM,OAEV,EAAA;WACM,MAAA;MACF,SAAQ,QACV,SAAA,QAAA,WAAA,OAAA,MAAA,kBAAA,CAAA;CAGF,GAAA,CACE,QAAI,eACF;WACK,MAAA;MACL,MAAA,UAAe,QAAE,MAAA,iBACnB,SAAA,SAAA,aAAA,SAAA,MAAA,MAAA;MAGF,SAAe,SAAA,gBAAA,QAAA;KAGb,MAAA,eAAO;WAEP,MAAA;AACE,MAAA,MAAM,aAAiB,QAAE,MAAA,oBAE7B,SAAe,SAAA,aAAA,YAAA,GAAA;MAEX,SAAQ,SAAS,gBAAa,WAAc;WAE5C,UACF,OACD,EAAA;AAED,WAAU,MAAG;AACX,MAAI,MAAM,cAAW,QAAS,MAAI,qBAChC,SAAQ,SAAS,aAAa,cAAa,GAAE;MAE7C,SAAM,SAAY,gBAAS,aAAA;WAI3B,WACF,OACD,EAAA;AACD,WAAU,MAAG;AACX,MAAI,MAAM,gBAAO,QAAA,MAAA,uBACf,SAAO,SAAS,aAAc,eAAe,MAAM,YAAC;WAEpD,aACF,OACD,EAAA;AACD,WAAU,MAAG;AACX,MAAI,MAAA,sBAAiB,QAAA,MAAA,6BACnB,SAAQ,SAAQ,aAAc,sBAAK,MAAA,kBAAA;CAEtC,GAAE,CACH,MAAU;WAEN,MAAA;AACF,MAAA,MAAA,MACE,UAAM,SAAA,aAAqB,SAAA,MAAA,MAAA;;;;;;;;;;;;;AC1EjC,SAAO,SAAA,OAAyB;CAIhC,MAAM,UAAU,OAAiB,KAAoB;CACnD,MAAM,EAAA,UAAU,QAA6B,SAAK,SAAA,QAAA,KAAA,OAAA,qBAAA,OAAA,UAAA,SAAA,aAAA,mBAAA,gBAAA,OAAA,UAAA,GAAA,YAAA,GAAA;AAClD,qBAAkB,KAAM,MAAE,QAAS,mBAAsB,CACzD,OAKA,EAAA;AACA,WAAA,SAAA;EACA;EAKF;EAAC;;;;;;;;;;;;;;;;;;;;;;;;ACpBD,SAAgB,SAAkB,OAA4B;CAC5D,MAAM,UAAU,OAAqC,KAAK;CAE1D,MAAM,EAAC,UAAU,KAAI,UAAW,GAAG,MAAK,GAAG;AAC3C,qBACE,KACA,MAAG,QAAI,mBAAiB,CAI1B,OAKF,EAAA;AAAC,wBAAA,MAAA,cAAA,aAAA;EAQO,OAAC"}
|
package/react/dist/index.umd.js
CHANGED
|
@@ -1,2 +1,2 @@
|
|
|
1
|
-
var e,t;e=this,t=function(e,t,r,l){var u=Object.create,n=Object.defineProperty,c=Object.getOwnPropertyDescriptor,a=Object.getOwnPropertyNames,o=Object.getPrototypeOf,i=Object.prototype.hasOwnProperty,s=(e,t,r,l)=>{if(t&&"object"==typeof t||"function"==typeof t)for(var u,o=a(t),s=0,f=o.length;s<f;s++)u=o[s],i.call(e,u)||u===r||n(e,u,{get:(e=>t[e]).bind(null,u),enumerable:!(l=c(t,u))||l.enumerable});return e},f=(e,t,r)=>(r=null!=e?u(o(e)):{},s(!t&&e&&e.__esModule?r:n(r,"default",{value:e,enumerable:!0}),e));t=f(t),l=f(l);let d=t.default.forwardRef((e,r)=>{let l=(0,t.useRef)(null);return(0,t.useImperativeHandle)(r,()=>l?l.current:void 0,[l]),(0,t.useEffect)(()=>{l.current&&Array.isArray(e.optionList)&&(l.current.optionList=e.optionList)},[e.optionList,l]),(0,t.useEffect)(()=>{l.current&&"function"==typeof e.getTitle&&l.current.setCallback("getTitle",e.getTitle)},[e.getTitle,l]),(0,t.useEffect)(()=>{l.current&&"function"==typeof e.getValue&&l.current.setCallback("getValue",e.getValue)},[e.getValue,l]),(0,t.useEffect)(()=>{l.current&&"function"==typeof e.getContentDOM&&l.current.setCallback("getContentDOM",e.getContentDOM)},[e.getContentDOM,l]),t.default.createElement("jb-option-list",{ref:l})});function p(e){
|
|
1
|
+
var e,t;e=this,t=function(e,t,r,l){var u=Object.create,n=Object.defineProperty,c=Object.getOwnPropertyDescriptor,a=Object.getOwnPropertyNames,o=Object.getPrototypeOf,i=Object.prototype.hasOwnProperty,s=(e,t,r,l)=>{if(t&&"object"==typeof t||"function"==typeof t)for(var u,o=a(t),s=0,f=o.length;s<f;s++)u=o[s],i.call(e,u)||u===r||n(e,u,{get:(e=>t[e]).bind(null,u),enumerable:!(l=c(t,u))||l.enumerable});return e},f=(e,t,r)=>(r=null!=e?u(o(e)):{},s(!t&&e&&e.__esModule?r:n(r,"default",{value:e,enumerable:!0}),e));t=f(t),l=f(l);let d=t.default.forwardRef((e,r)=>{let l=(0,t.useRef)(null);return(0,t.useImperativeHandle)(r,()=>l?l.current:void 0,[l]),(0,t.useEffect)(()=>{l.current&&Array.isArray(e.optionList)&&(l.current.optionList=e.optionList)},[e.optionList,l]),(0,t.useEffect)(()=>{l.current&&"function"==typeof e.getTitle&&l.current.setCallback("getTitle",e.getTitle)},[e.getTitle,l]),(0,t.useEffect)(()=>{l.current&&"function"==typeof e.getValue&&l.current.setCallback("getValue",e.getValue)},[e.getValue,l]),(0,t.useEffect)(()=>{l.current&&"function"==typeof e.getContentDOM&&l.current.setCallback("getContentDOM",e.getContentDOM)},[e.getContentDOM,l]),t.default.createElement("jb-option-list",{ref:l})});function p(e){let r=(0,t.useRef)(null),{children:l,ref:u,className:n,...c}=e;return(0,t.useImperativeHandle)(u,()=>r.current??void 0,[r]),t.default.createElement("jb-option",{class:n,ref:r,...c},l)}d.displayName="JBOptionList",p.displayName="JBOption",e.JBOption=p,e.JBOptionList=d,e.JBSelect=function(e){var r,u;let n=(0,t.useRef)(null),{onChange:c,onInit:a,onInput:o,onKeyUp:i,onLoad:s,ref:f,error:d,getSelectedValueDOM:p,label:b,required:v,message:g,placeholder:h,searchPlaceholder:m,validationList:y,value:E,hideClear:O,...j}=e;return(0,t.useImperativeHandle)(f,()=>n.current??void 0,[n]),r={onChange:c,onInit:a,onInput:o,onKeyUp:i,onLoad:s},(0,l.useEvent)(n,"load",r.onLoad,!0),(0,l.useEvent)(n,"init",r.onInit,!0),(0,l.useEvent)(n,"keyup",r.onKeyUp),(0,l.useEvent)(n,"change",r.onChange),(0,l.useEvent)(n,"input",r.onInput),u={error:d,getSelectedValueDOM:p,label:b,required:v,message:g,placeholder:h,searchPlaceholder:m,validationList:y,value:E,hideClear:O},(0,t.useEffect)(()=>{null!==u.message&&void 0!==u.message?n.current?.setAttribute("message",u.message):n.current?.removeAttribute("message")},[u.message]),(0,t.useEffect)(()=>{n?.current&&(n.current.validation.list=u.validationList||[])},[n.current,u.validationList]),(0,t.useEffect)(()=>{null!==u.label&&void 0!==u.label?n.current?.setAttribute("label",u.label):n.current?.removeAttribute("label")},[u.label,n.current]),(0,t.useEffect)(()=>{null!==u.required&&void 0!==u.required?n.current?.setAttribute("required",""):n.current?.removeAttribute("required")},[u.required,n]),(0,t.useEffect)(()=>{null!==u.hideClear&&void 0!==u.hideClear?n.current?.setAttribute("hide-clear",""):n.current?.removeAttribute("hide-clear")},[u.hideClear,n]),(0,t.useEffect)(()=>{null!==u.placeholder&&void 0!==u.placeholder&&n.current?.setAttribute("placeholder",u.placeholder)},[u.placeholder,n]),(0,t.useEffect)(()=>{null!==u.searchPlaceholder&&void 0!==u.searchPlaceholder&&n.current?.setAttribute("search-placeholder",u.searchPlaceholder)},[u.searchPlaceholder]),(0,t.useEffect)(()=>{u.error?n?.current?.setAttribute("error",u.error):n?.current?.removeAttribute("error")},[u.error]),(0,t.useEffect)(()=>{n.current&&(n.current.value=u.value)},[u.value]),(0,t.useEffect)(()=>{"function"==typeof u.getSelectedValueDOM&&n.current&&n.current&&(n.current.callbacks.getSelectedValueDOM=u.getSelectedValueDOM)},[u.getSelectedValueDOM]),t.default.createElement("jb-select",{ref:n,...j},e.children)}},"object"==typeof exports&&"undefined"!=typeof module?t(exports,require("react"),require("jb-select"),require("jb-core/react")):"function"==typeof define&&define.amd?define(["exports","react","jb-select","jb-core/react"],t):t((e="undefined"!=typeof globalThis?globalThis:e||self).JBSelectReact={},e.React,e.JBSelect,e.JBCoreReact);
|
|
2
2
|
//# sourceMappingURL=index.umd.js.map
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"index.umd.js","names":[],"sources":["
|
|
1
|
+
{"version":3,"file":"index.umd.js","names":[],"sources":["../../../../../../../../../../../../Home/NeveshtAfzar/work/Azad/source/design-system/design-system/web-component/jb-select/react/lib/JBOptionList.tsx","../../../../../../../../../../../../Home/NeveshtAfzar/work/Azad/source/design-system/design-system/web-component/jb-select/react/lib/events-hook.ts","../../../../../../../../../../../../Home/NeveshtAfzar/work/Azad/source/design-system/design-system/web-component/jb-select/react/lib/attributes-hook.ts","../../../../../../../../../../../../Home/NeveshtAfzar/work/Azad/source/design-system/design-system/web-component/jb-select/react/lib/JBSelect.tsx","../../../../../../../../../../../../Home/NeveshtAfzar/work/Azad/source/design-system/design-system/web-component/jb-select/react/lib/JBOption.tsx"],"sourcesContent":[],"mappings":"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"}
|
|
@@ -1,11 +1,22 @@
|
|
|
1
|
-
import type { JBOptionWebComponent } from "jb-select";
|
|
1
|
+
import type { JBOptionWebComponent, JBSelectWebComponent } from "jb-select";
|
|
2
2
|
declare module "react" {
|
|
3
3
|
namespace JSX {
|
|
4
4
|
interface IntrinsicElements {
|
|
5
5
|
'jb-option': JBOptionType;
|
|
6
|
+
'jb-select': JBSelectType;
|
|
6
7
|
}
|
|
7
8
|
interface JBOptionType extends React.DetailedHTMLProps<React.HTMLAttributes<JBOptionWebComponent<any>>, JBOptionWebComponent<any>> {
|
|
8
9
|
class?: string;
|
|
9
10
|
}
|
|
11
|
+
interface JBSelectType extends React.DetailedHTMLProps<React.HTMLAttributes<JBSelectWebComponent>, JBSelectWebComponent> {
|
|
12
|
+
class?: string;
|
|
13
|
+
label?: string;
|
|
14
|
+
name?: string;
|
|
15
|
+
required?: string | boolean;
|
|
16
|
+
message?: string;
|
|
17
|
+
tabindex?: string;
|
|
18
|
+
size?: string;
|
|
19
|
+
"hide-clean"?: string;
|
|
20
|
+
}
|
|
10
21
|
}
|
|
11
22
|
}
|
package/react/lib/JBOption.tsx
CHANGED
|
@@ -1,5 +1,6 @@
|
|
|
1
1
|
'use client'
|
|
2
|
-
|
|
2
|
+
// biome-ignore lint/style/useImportType: <explanation>
|
|
3
|
+
import React, { useRef, useImperativeHandle, PropsWithChildren } from 'react';
|
|
3
4
|
import { JBOptionWebComponent } from 'jb-select';
|
|
4
5
|
import './module-declaration.js';
|
|
5
6
|
|
package/react/lib/JBSelect.tsx
CHANGED
|
@@ -3,39 +3,22 @@
|
|
|
3
3
|
import React, { useRef, useImperativeHandle, type PropsWithChildren } from 'react';
|
|
4
4
|
import 'jb-select';
|
|
5
5
|
// eslint-disable-next-line no-duplicate-imports
|
|
6
|
-
import type { JBSelectWebComponent, SizeVariants } from 'jb-select';
|
|
6
|
+
import type { JBSelectWebComponent, PopoverPosition, SizeVariants } from 'jb-select';
|
|
7
7
|
import { type EventProps, useEvents } from './events-hook.js';
|
|
8
8
|
import { useJBSelectAttribute, type JBSelectAttributes } from './attributes-hook.js';
|
|
9
9
|
import type { JBElementStandardProps } from 'jb-core/react';
|
|
10
|
+
import './module-declaration.js';
|
|
10
11
|
export type JBSelectEventType<T> = T & {
|
|
11
12
|
target: JBSelectWebComponent
|
|
12
13
|
}
|
|
13
|
-
declare module "react" {
|
|
14
|
-
// eslint-disable-next-line @typescript-eslint/no-namespace
|
|
15
|
-
namespace JSX {
|
|
16
|
-
interface IntrinsicElements {
|
|
17
|
-
'jb-select': JBSelectType;
|
|
18
|
-
}
|
|
19
|
-
interface JBSelectType extends React.DetailedHTMLProps<React.HTMLAttributes<JBSelectWebComponent>, JBSelectWebComponent> {
|
|
20
|
-
class?: string,
|
|
21
|
-
label?: string,
|
|
22
|
-
name?: string,
|
|
23
|
-
required?: string | boolean,
|
|
24
|
-
message?: string,
|
|
25
|
-
tabindex?: string,
|
|
26
|
-
size?: string,
|
|
27
|
-
"hide-clean"?: string,
|
|
28
|
-
}
|
|
29
|
-
}
|
|
30
|
-
}
|
|
31
14
|
export function JBSelect<TValue>(props: Props<TValue>) {
|
|
32
15
|
const element = useRef<JBSelectWebComponent>(null);
|
|
16
|
+
const { onChange, onInit, onInput, onKeyUp, onLoad, ref, error, getSelectedValueDOM, label, required, message, placeholder, searchPlaceholder, validationList, value, hideClear, ...otherProps } = props;
|
|
33
17
|
useImperativeHandle(
|
|
34
|
-
|
|
35
|
-
() => (element
|
|
18
|
+
ref,
|
|
19
|
+
() => (element.current??undefined),
|
|
36
20
|
[element],
|
|
37
21
|
);
|
|
38
|
-
const { onChange, onInit, onInput, onKeyUp, onLoad, error, getSelectedValueDOM, label, required, message, placeholder, searchPlaceholder, validationList, value, hideClear, ...otherProps } = props;
|
|
39
22
|
useEvents(element, { onChange, onInit, onInput, onKeyUp, onLoad });
|
|
40
23
|
useJBSelectAttribute(element, { error, getSelectedValueDOM, label, required, message, placeholder, searchPlaceholder, validationList, value, hideClear });
|
|
41
24
|
return (
|
|
@@ -46,9 +29,9 @@ export function JBSelect<TValue>(props: Props<TValue>) {
|
|
|
46
29
|
};
|
|
47
30
|
|
|
48
31
|
export type Props<TValue> = PropsWithChildren<EventProps & JBSelectAttributes<TValue>> & JBElementStandardProps<JBSelectWebComponent, keyof EventProps & JBSelectAttributes<TValue>> & {
|
|
49
|
-
ref?: React.
|
|
32
|
+
ref?: React.ForwardedRef<JBSelectWebComponent|null|undefined>,
|
|
50
33
|
size?: SizeVariants,
|
|
51
34
|
name?: string,
|
|
52
35
|
disabled?:boolean,
|
|
53
|
-
|
|
54
|
-
|
|
36
|
+
popoverPosition?:PopoverPosition
|
|
37
|
+
}
|
|
@@ -15,7 +15,7 @@ export type JBSelectAttributes<TValue> = {
|
|
|
15
15
|
getSelectedValueDOM?: (option: any) => HTMLElement,
|
|
16
16
|
|
|
17
17
|
}
|
|
18
|
-
export function useJBSelectAttribute<TValue>(element: RefObject<JBSelectWebComponent>, props: JBSelectAttributes<TValue>) {
|
|
18
|
+
export function useJBSelectAttribute<TValue>(element: RefObject<JBSelectWebComponent|null>, props: JBSelectAttributes<TValue>) {
|
|
19
19
|
useEffect(() => {
|
|
20
20
|
if (props.message !== null && props.message !== undefined) {
|
|
21
21
|
element.current?.setAttribute("message", props.message);
|
package/react/lib/events-hook.ts
CHANGED
|
@@ -15,7 +15,7 @@ export type EventProps = {
|
|
|
15
15
|
onKeyUp?: (e: JBSelectEventType<KeyboardEvent>) => void,
|
|
16
16
|
onInput?: (e: JBSelectEventType<InputEvent>) => void,
|
|
17
17
|
}
|
|
18
|
-
export function useEvents(element: RefObject<JBSelectWebComponent>, props: EventProps) {
|
|
18
|
+
export function useEvents(element: RefObject<JBSelectWebComponent|null>, props: EventProps) {
|
|
19
19
|
useEvent(element, 'load', props.onLoad, true);
|
|
20
20
|
useEvent(element, 'init', props.onInit, true);
|
|
21
21
|
useEvent(element, 'keyup', props.onKeyUp);
|
|
@@ -1,12 +1,23 @@
|
|
|
1
|
-
import type { JBOptionWebComponent } from "jb-select";
|
|
1
|
+
import type { JBOptionWebComponent, JBSelectWebComponent } from "jb-select";
|
|
2
2
|
|
|
3
3
|
declare module "react" {
|
|
4
4
|
namespace JSX {
|
|
5
5
|
interface IntrinsicElements {
|
|
6
6
|
'jb-option': JBOptionType;
|
|
7
|
+
'jb-select': JBSelectType;
|
|
7
8
|
}
|
|
8
9
|
interface JBOptionType extends React.DetailedHTMLProps<React.HTMLAttributes<JBOptionWebComponent<any>>, JBOptionWebComponent<any>> {
|
|
9
10
|
class?: string,
|
|
10
11
|
}
|
|
12
|
+
interface JBSelectType extends React.DetailedHTMLProps<React.HTMLAttributes<JBSelectWebComponent>, JBSelectWebComponent> {
|
|
13
|
+
class?: string,
|
|
14
|
+
label?: string,
|
|
15
|
+
name?: string,
|
|
16
|
+
required?: string | boolean,
|
|
17
|
+
message?: string,
|
|
18
|
+
tabindex?: string,
|
|
19
|
+
size?: string,
|
|
20
|
+
"hide-clean"?: string,
|
|
21
|
+
}
|
|
11
22
|
}
|
|
12
23
|
}
|