inconel 0.1.22 → 0.1.24
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/cjs/components/Modal/Modal.cjs +1 -1
- package/dist/cjs/components/Modal/Modal.cjs.map +1 -1
- package/dist/cjs/components/MultiSelectCheckBox/MultiSelectCheckBox.cjs +1 -1
- package/dist/cjs/components/MultiSelectCheckBox/MultiSelectCheckBox.cjs.map +1 -1
- package/dist/components/Modal/Modal.d.ts +2 -1
- package/dist/components/Modal/Modal.d.ts.map +1 -1
- package/dist/components/Modal/Modal.js +35 -34
- package/dist/components/Modal/Modal.js.map +1 -1
- package/dist/components/MultiSelectCheckBox/MultiSelectCheckBox.d.ts.map +1 -1
- package/dist/components/MultiSelectCheckBox/MultiSelectCheckBox.js +198 -185
- package/dist/components/MultiSelectCheckBox/MultiSelectCheckBox.js.map +1 -1
- package/package.json +1 -1
|
@@ -1,2 +1,2 @@
|
|
|
1
|
-
"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const e=require("react/jsx-runtime"),n=require("react"),m=require("../shared/classNames.cjs"),
|
|
1
|
+
"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const e=require("react/jsx-runtime"),n=require("react"),m=require("../shared/classNames.cjs"),ae=require("./constants.cjs");;/* empty css */const le=require("../../adapters/context.cjs"),ne=require("../Svg/Svg.cjs"),C=require("../Button/Button.cjs");function te({id:L,open:M,show:z,title:$,modalTitle:k,modalType:a="info",children:f,footer:v,customButtons:t,closeLabel:D=ae.DEFAULT_MODAL_CLOSE_LABEL,closeButton:E=!0,closeOnBackdrop:F=!0,backdrop:_=!0,keyboard:O=!0,centered:S=!0,scrollable:w=!0,size:I="md",maximize:R=!1,maximizeIcon:U,fullSize:h=!1,hideHeader:A=!1,hideFooter:H=!1,okText:i,okAction:o,okButtonType:P="button",cancelText:r,cancelAction:c,cancelButtonType:G="button",onClose:J,onHide:K,onShow:j,onEnter:b,onEntering:x,onEntered:N,onExit:p,onExiting:y,onExited:g,onEscapeKeyDown:Q,dialogClassName:V,backdropClassName:W,bodyClassName:X,className:Y}){const q=le.useInconelAdapters(),[Z,T]=n.useState(!1),l=M??z??!1,d=()=>{J?.(),K?.()};if(n.useEffect(()=>{l?(b?.(),x?.(),j?.(),N?.()):(p?.(),y?.(),g?.())},[l,b,N,x,p,g,y,j]),n.useEffect(()=>{if(!l||!O)return;const s=se=>{se.key==="Escape"&&(Q?.(),d())};return document.addEventListener("keydown",s),()=>document.removeEventListener("keydown",s)}),!l)return null;const u=$??k??q.translate?.(`modalTitle${a[0].toUpperCase()}${a.slice(1)}`,a==="success"?"Başarılı":a==="error"||a==="danger"?"Hata":"Bilgi"),B=U??q.assets?.maximize,ee=!H&&(v!==void 0||t!==void 0||!!(r&&c)||!!(i&&o));return e.jsx("div",{className:m.classNames("inconel-modal-backdrop",W),role:"presentation",onMouseDown:s=>{_!=="static"&&_!==!1&&F&&s.target===s.currentTarget&&d()},children:e.jsxs("section",{id:L??void 0,className:m.classNames("inconel-modal",`inconel-modal--${I}`,`inconel-modal--${a}`,S&&"inconel-modal--centered",w&&"inconel-modal--scrollable",(Z||h)&&"inconel-is-maximized",h&&"inconel-is-full-size",V,Y),role:"dialog","aria-modal":"true","aria-label":typeof u=="string"?u:void 0,children:[!A&&e.jsxs("header",{className:"inconel-modal__header",children:[e.jsx("div",{className:"inconel-modal__title",children:u}),e.jsxs("div",{className:"inconel-modal__header-actions",children:[R&&e.jsx("button",{type:"button",className:"inconel-modal__maximize",onClick:()=>T(s=>!s),"aria-label":"Büyüt",children:B?e.jsx(ne.default,{src:B}):"□"}),E&&e.jsx("button",{type:"button",className:"inconel-modal__close","aria-label":D,onClick:d,children:"×"})]})]}),f&&e.jsx("div",{className:m.classNames("inconel-modal__content",X),children:f}),ee&&e.jsx("footer",{className:"inconel-modal__footer",children:v??(t!==void 0?n.Children.toArray(t):e.jsxs(e.Fragment,{children:[r&&c&&e.jsx(C.Button,{type:G,variant:"secondary",onClick:c,children:r}),i&&o&&e.jsx(C.Button,{type:P,buttonType:"success",onClick:o,children:i})]}))})]})})}exports.Modal=te;
|
|
2
2
|
//# sourceMappingURL=Modal.cjs.map
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"Modal.cjs","sources":["../../../../src/components/Modal/Modal.tsx"],"sourcesContent":["import {\n Children,\n useEffect,\n useState,\n type ButtonHTMLAttributes,\n type ReactNode,\n} from 'react'\n\nimport { useInconelAdapters } from '../../adapters'\nimport { Button } from '../Button'\nimport { classNames } from '../shared/classNames'\nimport { Svg } from '../Svg'\nimport { DEFAULT_MODAL_CLOSE_LABEL } from './constants'\nimport './styles.css'\n\nexport interface ModalProps {\n id?: string | null\n open?: boolean\n show?: boolean\n title?: ReactNode\n modalTitle?: ReactNode\n modalType?: 'info' | 'success' | 'error' | 'danger' | 'warning'\n children?: ReactNode\n footer?: ReactNode\n customButtons?: ReactNode\n closeLabel?: string\n closeButton?: boolean\n closeOnBackdrop?: boolean\n backdrop?: 'static' | boolean\n keyboard?: boolean\n centered?: boolean\n scrollable?: boolean\n size?: string\n maximize?: boolean\n maximizeIcon?: string\n fullSize?: boolean\n hideFooter?: boolean\n okText?: ReactNode\n okAction?: () => void\n okButtonType?: ButtonHTMLAttributes<HTMLButtonElement>['type']\n okButtonVariant?: string\n cancelText?: ReactNode\n cancelAction?: () => void\n cancelButtonType?: ButtonHTMLAttributes<HTMLButtonElement>['type']\n onClose?: () => void\n onHide?: () => void\n onShow?: () => void\n onEnter?: () => void\n onEntering?: () => void\n onEntered?: () => void\n onExit?: () => void\n onExiting?: () => void\n onExited?: () => void\n onEscapeKeyDown?: () => void\n dialogClassName?: string\n backdropClassName?: string\n bodyClassName?: string\n className?: string | null\n enforceFocus?: boolean\n}\n\nexport function Modal({\n id,\n open,\n show,\n title,\n modalTitle,\n modalType = 'info',\n children,\n footer,\n customButtons,\n closeLabel = DEFAULT_MODAL_CLOSE_LABEL,\n closeButton = true,\n closeOnBackdrop = true,\n backdrop = true,\n keyboard = true,\n centered = true,\n scrollable = true,\n size = 'md',\n maximize = false,\n maximizeIcon,\n fullSize = false,\n hideFooter = false,\n okText,\n okAction,\n okButtonType = 'button',\n cancelText,\n cancelAction,\n cancelButtonType = 'button',\n onClose,\n onHide,\n onShow,\n onEnter,\n onEntering,\n onEntered,\n onExit,\n onExiting,\n onExited,\n onEscapeKeyDown,\n dialogClassName,\n backdropClassName,\n bodyClassName,\n className,\n}: ModalProps) {\n const adapters = useInconelAdapters()\n const [maximized, setMaximized] = useState(false)\n const visible = open ?? show ?? false\n const close = () => {\n onClose?.()\n onHide?.()\n }\n\n useEffect(() => {\n if (visible) {\n onEnter?.()\n onEntering?.()\n onShow?.()\n onEntered?.()\n } else {\n onExit?.()\n onExiting?.()\n onExited?.()\n }\n }, [visible, onEnter, onEntered, onEntering, onExit, onExited, onExiting, onShow])\n\n useEffect(() => {\n if (!visible || !keyboard) return\n const handleEscape = (event: KeyboardEvent) => {\n if (event.key !== 'Escape') return\n onEscapeKeyDown?.()\n close()\n }\n document.addEventListener('keydown', handleEscape)\n return () => document.removeEventListener('keydown', handleEscape)\n })\n\n if (!visible) return null\n\n const resolvedTitle =\n title ??\n modalTitle ??\n adapters.translate?.(\n `modalTitle${modalType[0].toUpperCase()}${modalType.slice(1)}`,\n modalType === 'success'\n ? 'Başarılı'\n : modalType === 'error' || modalType === 'danger'\n ? 'Hata'\n : 'Bilgi',\n )\n const resolvedMaximizeIcon = maximizeIcon ?? adapters.assets?.maximize\n const hasFooter =\n !hideFooter &&\n (footer !== undefined ||\n customButtons !== undefined ||\n Boolean(cancelText && cancelAction) ||\n Boolean(okText && okAction))\n\n return (\n <div\n className={classNames('inconel-modal-backdrop', backdropClassName)}\n role=\"presentation\"\n onMouseDown={(event) => {\n if (\n backdrop !== 'static' &&\n backdrop !== false &&\n closeOnBackdrop &&\n event.target === event.currentTarget\n ) {\n close()\n }\n }}\n >\n <section\n id={id ?? undefined}\n className={classNames(\n 'inconel-modal',\n `inconel-modal--${size}`,\n `inconel-modal--${modalType}`,\n centered && 'inconel-modal--centered',\n scrollable && 'inconel-modal--scrollable',\n (maximized || fullSize) && 'inconel-is-maximized',\n fullSize && 'inconel-is-full-size',\n dialogClassName,\n className,\n )}\n role=\"dialog\"\n aria-modal=\"true\"\n aria-label={typeof resolvedTitle === 'string' ? resolvedTitle : undefined}\n >\n <header className=\"inconel-modal__header\">\n <div className=\"inconel-modal__title\">{resolvedTitle}</div>\n <div className=\"inconel-modal__header-actions\">\n {maximize && (\n <button\n type=\"button\"\n className=\"inconel-modal__maximize\"\n onClick={() => setMaximized((current) => !current)}\n aria-label=\"Büyüt\"\n >\n {resolvedMaximizeIcon ? (\n <Svg src={resolvedMaximizeIcon} />\n ) : (\n '□'\n )}\n </button>\n )}\n {closeButton && (\n <button\n type=\"button\"\n className=\"inconel-modal__close\"\n aria-label={closeLabel}\n onClick={close}\n >\n ×\n </button>\n )}\n </div>\n </header>\n {children && (\n <div className={classNames('inconel-modal__content', bodyClassName)}>\n {children}\n </div>\n )}\n {hasFooter && (\n <footer className=\"inconel-modal__footer\">\n {footer ??\n (customButtons !== undefined ? (\n Children.toArray(customButtons)\n ) : (\n <>\n {cancelText && cancelAction && (\n <Button\n type={cancelButtonType}\n variant=\"secondary\"\n onClick={cancelAction}\n >\n {cancelText}\n </Button>\n )}\n {okText && okAction && (\n <Button\n type={okButtonType}\n buttonType=\"success\"\n onClick={okAction}\n >\n {okText}\n </Button>\n )}\n </>\n ))}\n </footer>\n )}\n </section>\n </div>\n )\n}\n"],"names":["Modal","id","open","show","title","modalTitle","modalType","children","footer","customButtons","closeLabel","DEFAULT_MODAL_CLOSE_LABEL","closeButton","closeOnBackdrop","backdrop","keyboard","centered","scrollable","size","maximize","maximizeIcon","fullSize","hideFooter","okText","okAction","okButtonType","cancelText","cancelAction","cancelButtonType","onClose","onHide","onShow","onEnter","onEntering","onEntered","onExit","onExiting","onExited","onEscapeKeyDown","dialogClassName","backdropClassName","bodyClassName","className","adapters","useInconelAdapters","maximized","setMaximized","useState","visible","close","useEffect","handleEscape","event","resolvedTitle","resolvedMaximizeIcon","hasFooter","jsx","classNames","jsxs","current","Svg","Children","Fragment","Button"],"mappings":"sVA6DO,SAASA,GAAM,CACpB,GAAAC,EACA,KAAAC,EACA,KAAAC,EACA,MAAAC,EACA,WAAAC,EACA,UAAAC,EAAY,OACZ,SAAAC,EACA,OAAAC,EACA,cAAAC,EACA,WAAAC,EAAaC,GAAAA,0BACb,YAAAC,EAAc,GACd,gBAAAC,EAAkB,GAClB,SAAAC,EAAW,GACX,SAAAC,EAAW,GACX,SAAAC,EAAW,GACX,WAAAC,EAAa,GACb,KAAAC,EAAO,KACP,SAAAC,EAAW,GACX,aAAAC,EACA,SAAAC,EAAW,GACX,WAAAC,EAAa,GACb,OAAAC,EACA,SAAAC,EACA,aAAAC,EAAe,SACf,WAAAC,EACA,aAAAC,EACA,iBAAAC,EAAmB,SACnB,QAAAC,EACA,OAAAC,EACA,OAAAC,EACA,QAAAC,EACA,WAAAC,EACA,UAAAC,EACA,OAAAC,EACA,UAAAC,EACA,SAAAC,EACA,gBAAAC,EACA,gBAAAC,EACA,kBAAAC,EACA,cAAAC,EACA,UAAAC,CACF,EAAe,CACb,MAAMC,EAAWC,GAAAA,mBAAA,EACX,CAACC,EAAWC,CAAY,EAAIC,EAAAA,SAAS,EAAK,EAC1CC,EAAU9C,GAAQC,GAAQ,GAC1B8C,EAAQ,IAAM,CAClBpB,IAAA,EACAC,IAAA,CACF,EA0BA,GAxBAoB,EAAAA,UAAU,IAAM,CACVF,GACFhB,IAAA,EACAC,IAAA,EACAF,IAAA,EACAG,IAAA,IAEAC,IAAA,EACAC,IAAA,EACAC,IAAA,EAEJ,EAAG,CAACW,EAAShB,EAASE,EAAWD,EAAYE,EAAQE,EAAUD,EAAWL,CAAM,CAAC,EAEjFmB,EAAAA,UAAU,IAAM,CACd,GAAI,CAACF,GAAW,CAACjC,EAAU,OAC3B,MAAMoC,EAAgBC,IAAyB,CACzCA,GAAM,MAAQ,WAClBd,IAAA,EACAW,EAAA,EACF,EACA,gBAAS,iBAAiB,UAAWE,CAAY,EAC1C,IAAM,SAAS,oBAAoB,UAAWA,CAAY,CACnE,CAAC,EAEG,CAACH,EAAS,OAAO,KAErB,MAAMK,EACJjD,GACAC,GACAsC,EAAS,YACP,aAAarC,EAAU,CAAC,EAAE,aAAa,GAAGA,EAAU,MAAM,CAAC,CAAC,GAC5DA,IAAc,UACV,WACAA,IAAc,SAAWA,IAAc,SACrC,OACA,OAAA,EAEJgD,EAAuBlC,GAAgBuB,EAAS,QAAQ,SACxDY,EACJ,CAACjC,IACAd,IAAW,QACVC,IAAkB,QAClB,GAAQiB,GAAcC,IACtB,GAAQJ,GAAUC,IAEtB,OACEgC,EAAAA,IAAC,MAAA,CACC,UAAWC,EAAAA,WAAW,yBAA0BjB,CAAiB,EACjE,KAAK,eACL,YAAcY,GAAU,CAEpBtC,IAAa,UACbA,IAAa,IACbD,GACAuC,EAAM,SAAWA,EAAM,eAEvBH,EAAA,CAEJ,EAEA,SAAAS,EAAAA,KAAC,UAAA,CACC,GAAIzD,GAAM,OACV,UAAWwD,EAAAA,WACT,gBACA,kBAAkBvC,CAAI,GACtB,kBAAkBZ,CAAS,GAC3BU,GAAY,0BACZC,GAAc,6BACb4B,GAAaxB,IAAa,uBAC3BA,GAAY,uBACZkB,EACAG,CAAA,EAEF,KAAK,SACL,aAAW,OACX,aAAY,OAAOW,GAAkB,SAAWA,EAAgB,OAEhE,SAAA,CAAAK,EAAAA,KAAC,SAAA,CAAO,UAAU,wBAChB,SAAA,CAAAF,EAAAA,IAAC,MAAA,CAAI,UAAU,uBAAwB,SAAAH,EAAc,EACrDK,EAAAA,KAAC,MAAA,CAAI,UAAU,gCACZ,SAAA,CAAAvC,GACCqC,EAAAA,IAAC,SAAA,CACC,KAAK,SACL,UAAU,0BACV,QAAS,IAAMV,EAAca,GAAY,CAACA,CAAO,EACjD,aAAW,QAEV,SAAAL,EACCE,MAACI,GAAAA,QAAA,CAAI,IAAKN,EAAsB,EAEhC,GAAA,CAAA,EAIL1C,GACC4C,EAAAA,IAAC,SAAA,CACC,KAAK,SACL,UAAU,uBACV,aAAY9C,EACZ,QAASuC,EACV,SAAA,GAAA,CAAA,CAED,CAAA,CAEJ,CAAA,EACF,EACC1C,SACE,MAAA,CAAI,UAAWkD,EAAAA,WAAW,yBAA0BhB,CAAa,EAC/D,SAAAlC,EACH,EAEDgD,GACCC,EAAAA,IAAC,SAAA,CAAO,UAAU,wBACf,SAAAhD,IACEC,IAAkB,OACjBoD,EAAAA,SAAS,QAAQpD,CAAa,EAE9BiD,EAAAA,KAAAI,EAAAA,SAAA,CACG,SAAA,CAAApC,GAAcC,GACb6B,EAAAA,IAACO,EAAAA,OAAA,CACC,KAAMnC,EACN,QAAQ,YACR,QAASD,EAER,SAAAD,CAAA,CAAA,EAGJH,GAAUC,GACTgC,EAAAA,IAACO,EAAAA,OAAA,CACC,KAAMtC,EACN,WAAW,UACX,QAASD,EAER,SAAAD,CAAA,CAAA,CACH,CAAA,CAEJ,EAAA,CAEN,CAAA,CAAA,CAAA,CAEJ,CAAA,CAGN"}
|
|
1
|
+
{"version":3,"file":"Modal.cjs","sources":["../../../../src/components/Modal/Modal.tsx"],"sourcesContent":["import {\n Children,\n useEffect,\n useState,\n type ButtonHTMLAttributes,\n type ReactNode,\n} from 'react'\n\nimport { useInconelAdapters } from '../../adapters'\nimport { Button } from '../Button'\nimport { classNames } from '../shared/classNames'\nimport { Svg } from '../Svg'\nimport { DEFAULT_MODAL_CLOSE_LABEL } from './constants'\nimport './styles.css'\n\nexport interface ModalProps {\n id?: string | null\n open?: boolean\n show?: boolean\n title?: ReactNode\n modalTitle?: ReactNode\n modalType?: 'info' | 'success' | 'error' | 'danger' | 'warning'\n children?: ReactNode\n footer?: ReactNode\n customButtons?: ReactNode\n closeLabel?: string\n closeButton?: boolean\n closeOnBackdrop?: boolean\n backdrop?: 'static' | boolean\n keyboard?: boolean\n centered?: boolean\n scrollable?: boolean\n size?: string\n maximize?: boolean\n maximizeIcon?: string\n fullSize?: boolean\n hideHeader?: boolean\n hideFooter?: boolean\n okText?: ReactNode\n okAction?: () => void\n okButtonType?: ButtonHTMLAttributes<HTMLButtonElement>['type']\n okButtonVariant?: string\n cancelText?: ReactNode\n cancelAction?: () => void\n cancelButtonType?: ButtonHTMLAttributes<HTMLButtonElement>['type']\n onClose?: () => void\n onHide?: () => void\n onShow?: () => void\n onEnter?: () => void\n onEntering?: () => void\n onEntered?: () => void\n onExit?: () => void\n onExiting?: () => void\n onExited?: () => void\n onEscapeKeyDown?: () => void\n dialogClassName?: string\n backdropClassName?: string\n bodyClassName?: string\n className?: string | null\n enforceFocus?: boolean\n}\n\nexport function Modal({\n id,\n open,\n show,\n title,\n modalTitle,\n modalType = 'info',\n children,\n footer,\n customButtons,\n closeLabel = DEFAULT_MODAL_CLOSE_LABEL,\n closeButton = true,\n closeOnBackdrop = true,\n backdrop = true,\n keyboard = true,\n centered = true,\n scrollable = true,\n size = 'md',\n maximize = false,\n maximizeIcon,\n fullSize = false,\n hideHeader = false,\n hideFooter = false,\n okText,\n okAction,\n okButtonType = 'button',\n cancelText,\n cancelAction,\n cancelButtonType = 'button',\n onClose,\n onHide,\n onShow,\n onEnter,\n onEntering,\n onEntered,\n onExit,\n onExiting,\n onExited,\n onEscapeKeyDown,\n dialogClassName,\n backdropClassName,\n bodyClassName,\n className,\n}: ModalProps) {\n const adapters = useInconelAdapters()\n const [maximized, setMaximized] = useState(false)\n const visible = open ?? show ?? false\n const close = () => {\n onClose?.()\n onHide?.()\n }\n\n useEffect(() => {\n if (visible) {\n onEnter?.()\n onEntering?.()\n onShow?.()\n onEntered?.()\n } else {\n onExit?.()\n onExiting?.()\n onExited?.()\n }\n }, [visible, onEnter, onEntered, onEntering, onExit, onExited, onExiting, onShow])\n\n useEffect(() => {\n if (!visible || !keyboard) return\n const handleEscape = (event: KeyboardEvent) => {\n if (event.key !== 'Escape') return\n onEscapeKeyDown?.()\n close()\n }\n document.addEventListener('keydown', handleEscape)\n return () => document.removeEventListener('keydown', handleEscape)\n })\n\n if (!visible) return null\n\n const resolvedTitle =\n title ??\n modalTitle ??\n adapters.translate?.(\n `modalTitle${modalType[0].toUpperCase()}${modalType.slice(1)}`,\n modalType === 'success'\n ? 'Başarılı'\n : modalType === 'error' || modalType === 'danger'\n ? 'Hata'\n : 'Bilgi',\n )\n const resolvedMaximizeIcon = maximizeIcon ?? adapters.assets?.maximize\n const hasFooter =\n !hideFooter &&\n (footer !== undefined ||\n customButtons !== undefined ||\n Boolean(cancelText && cancelAction) ||\n Boolean(okText && okAction))\n\n return (\n <div\n className={classNames('inconel-modal-backdrop', backdropClassName)}\n role=\"presentation\"\n onMouseDown={(event) => {\n if (\n backdrop !== 'static' &&\n backdrop !== false &&\n closeOnBackdrop &&\n event.target === event.currentTarget\n ) {\n close()\n }\n }}\n >\n <section\n id={id ?? undefined}\n className={classNames(\n 'inconel-modal',\n `inconel-modal--${size}`,\n `inconel-modal--${modalType}`,\n centered && 'inconel-modal--centered',\n scrollable && 'inconel-modal--scrollable',\n (maximized || fullSize) && 'inconel-is-maximized',\n fullSize && 'inconel-is-full-size',\n dialogClassName,\n className,\n )}\n role=\"dialog\"\n aria-modal=\"true\"\n aria-label={typeof resolvedTitle === 'string' ? resolvedTitle : undefined}\n >\n {!hideHeader && (\n <header className=\"inconel-modal__header\">\n <div className=\"inconel-modal__title\">{resolvedTitle}</div>\n <div className=\"inconel-modal__header-actions\">\n {maximize && (\n <button\n type=\"button\"\n className=\"inconel-modal__maximize\"\n onClick={() => setMaximized((current) => !current)}\n aria-label=\"Büyüt\"\n >\n {resolvedMaximizeIcon ? (\n <Svg src={resolvedMaximizeIcon} />\n ) : (\n '□'\n )}\n </button>\n )}\n {closeButton && (\n <button\n type=\"button\"\n className=\"inconel-modal__close\"\n aria-label={closeLabel}\n onClick={close}\n >\n ×\n </button>\n )}\n </div>\n </header>\n )}\n {children && (\n <div className={classNames('inconel-modal__content', bodyClassName)}>\n {children}\n </div>\n )}\n {hasFooter && (\n <footer className=\"inconel-modal__footer\">\n {footer ??\n (customButtons !== undefined ? (\n Children.toArray(customButtons)\n ) : (\n <>\n {cancelText && cancelAction && (\n <Button\n type={cancelButtonType}\n variant=\"secondary\"\n onClick={cancelAction}\n >\n {cancelText}\n </Button>\n )}\n {okText && okAction && (\n <Button\n type={okButtonType}\n buttonType=\"success\"\n onClick={okAction}\n >\n {okText}\n </Button>\n )}\n </>\n ))}\n </footer>\n )}\n </section>\n </div>\n )\n}\n"],"names":["Modal","id","open","show","title","modalTitle","modalType","children","footer","customButtons","closeLabel","DEFAULT_MODAL_CLOSE_LABEL","closeButton","closeOnBackdrop","backdrop","keyboard","centered","scrollable","size","maximize","maximizeIcon","fullSize","hideHeader","hideFooter","okText","okAction","okButtonType","cancelText","cancelAction","cancelButtonType","onClose","onHide","onShow","onEnter","onEntering","onEntered","onExit","onExiting","onExited","onEscapeKeyDown","dialogClassName","backdropClassName","bodyClassName","className","adapters","useInconelAdapters","maximized","setMaximized","useState","visible","close","useEffect","handleEscape","event","resolvedTitle","resolvedMaximizeIcon","hasFooter","jsx","classNames","jsxs","current","Svg","Children","Fragment","Button"],"mappings":"sVA8DO,SAASA,GAAM,CACpB,GAAAC,EACA,KAAAC,EACA,KAAAC,EACA,MAAAC,EACA,WAAAC,EACA,UAAAC,EAAY,OACZ,SAAAC,EACA,OAAAC,EACA,cAAAC,EACA,WAAAC,EAAaC,GAAAA,0BACb,YAAAC,EAAc,GACd,gBAAAC,EAAkB,GAClB,SAAAC,EAAW,GACX,SAAAC,EAAW,GACX,SAAAC,EAAW,GACX,WAAAC,EAAa,GACb,KAAAC,EAAO,KACP,SAAAC,EAAW,GACX,aAAAC,EACA,SAAAC,EAAW,GACX,WAAAC,EAAa,GACb,WAAAC,EAAa,GACb,OAAAC,EACA,SAAAC,EACA,aAAAC,EAAe,SACf,WAAAC,EACA,aAAAC,EACA,iBAAAC,EAAmB,SACnB,QAAAC,EACA,OAAAC,EACA,OAAAC,EACA,QAAAC,EACA,WAAAC,EACA,UAAAC,EACA,OAAAC,EACA,UAAAC,EACA,SAAAC,EACA,gBAAAC,EACA,gBAAAC,EACA,kBAAAC,EACA,cAAAC,EACA,UAAAC,CACF,EAAe,CACb,MAAMC,EAAWC,GAAAA,mBAAA,EACX,CAACC,EAAWC,CAAY,EAAIC,EAAAA,SAAS,EAAK,EAC1CC,EAAU/C,GAAQC,GAAQ,GAC1B+C,EAAQ,IAAM,CAClBpB,IAAA,EACAC,IAAA,CACF,EA0BA,GAxBAoB,EAAAA,UAAU,IAAM,CACVF,GACFhB,IAAA,EACAC,IAAA,EACAF,IAAA,EACAG,IAAA,IAEAC,IAAA,EACAC,IAAA,EACAC,IAAA,EAEJ,EAAG,CAACW,EAAShB,EAASE,EAAWD,EAAYE,EAAQE,EAAUD,EAAWL,CAAM,CAAC,EAEjFmB,EAAAA,UAAU,IAAM,CACd,GAAI,CAACF,GAAW,CAAClC,EAAU,OAC3B,MAAMqC,EAAgBC,IAAyB,CACzCA,GAAM,MAAQ,WAClBd,IAAA,EACAW,EAAA,EACF,EACA,gBAAS,iBAAiB,UAAWE,CAAY,EAC1C,IAAM,SAAS,oBAAoB,UAAWA,CAAY,CACnE,CAAC,EAEG,CAACH,EAAS,OAAO,KAErB,MAAMK,EACJlD,GACAC,GACAuC,EAAS,YACP,aAAatC,EAAU,CAAC,EAAE,aAAa,GAAGA,EAAU,MAAM,CAAC,CAAC,GAC5DA,IAAc,UACV,WACAA,IAAc,SAAWA,IAAc,SACrC,OACA,OAAA,EAEJiD,EAAuBnC,GAAgBwB,EAAS,QAAQ,SACxDY,GACJ,CAACjC,IACAf,IAAW,QACVC,IAAkB,QAClB,GAAQkB,GAAcC,IACtB,GAAQJ,GAAUC,IAEtB,OACEgC,EAAAA,IAAC,MAAA,CACC,UAAWC,EAAAA,WAAW,yBAA0BjB,CAAiB,EACjE,KAAK,eACL,YAAcY,GAAU,CAEpBvC,IAAa,UACbA,IAAa,IACbD,GACAwC,EAAM,SAAWA,EAAM,eAEvBH,EAAA,CAEJ,EAEA,SAAAS,EAAAA,KAAC,UAAA,CACC,GAAI1D,GAAM,OACV,UAAWyD,EAAAA,WACT,gBACA,kBAAkBxC,CAAI,GACtB,kBAAkBZ,CAAS,GAC3BU,GAAY,0BACZC,GAAc,6BACb6B,GAAazB,IAAa,uBAC3BA,GAAY,uBACZmB,EACAG,CAAA,EAEF,KAAK,SACL,aAAW,OACX,aAAY,OAAOW,GAAkB,SAAWA,EAAgB,OAE/D,SAAA,CAAA,CAAChC,GACAqC,EAAAA,KAAC,SAAA,CAAO,UAAU,wBAChB,SAAA,CAAAF,EAAAA,IAAC,MAAA,CAAI,UAAU,uBAAwB,SAAAH,EAAc,EACrDK,EAAAA,KAAC,MAAA,CAAI,UAAU,gCACZ,SAAA,CAAAxC,GACCsC,EAAAA,IAAC,SAAA,CACC,KAAK,SACL,UAAU,0BACV,QAAS,IAAMV,EAAca,GAAY,CAACA,CAAO,EACjD,aAAW,QAEV,SAAAL,EACCE,MAACI,GAAAA,QAAA,CAAI,IAAKN,EAAsB,EAEhC,GAAA,CAAA,EAIL3C,GACC6C,EAAAA,IAAC,SAAA,CACC,KAAK,SACL,UAAU,uBACV,aAAY/C,EACZ,QAASwC,EACV,SAAA,GAAA,CAAA,CAED,CAAA,CAEJ,CAAA,EACF,EAED3C,SACE,MAAA,CAAI,UAAWmD,EAAAA,WAAW,yBAA0BhB,CAAa,EAC/D,SAAAnC,EACH,EAEDiD,IACCC,EAAAA,IAAC,SAAA,CAAO,UAAU,wBACf,SAAAjD,IACEC,IAAkB,OACjBqD,EAAAA,SAAS,QAAQrD,CAAa,EAE9BkD,EAAAA,KAAAI,EAAAA,SAAA,CACG,SAAA,CAAApC,GAAcC,GACb6B,EAAAA,IAACO,EAAAA,OAAA,CACC,KAAMnC,EACN,QAAQ,YACR,QAASD,EAER,SAAAD,CAAA,CAAA,EAGJH,GAAUC,GACTgC,EAAAA,IAACO,EAAAA,OAAA,CACC,KAAMtC,EACN,WAAW,UACX,QAASD,EAER,SAAAD,CAAA,CAAA,CACH,CAAA,CAEJ,EAAA,CAEN,CAAA,CAAA,CAAA,CAEJ,CAAA,CAGN"}
|
|
@@ -1,2 +1,2 @@
|
|
|
1
|
-
"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const n=require("react/jsx-runtime"),t=require("react"),_e=require("react-dom"),
|
|
1
|
+
"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const n=require("react/jsx-runtime"),t=require("react"),_e=require("react-dom"),d=require("../shared/classNames.cjs");;/* empty css */const Ne=require("../DotLoader/DotLoader.cjs"),ee=[];function L(k,g,_){return k.some(O=>O?.[_]===g?.[_])}function Se({id:k=null,label:g=null,className:_=null,labelClassName:O=null,inputClassName:te=null,optionsClassName:ne=null,optionItemClassName:A=null,searchableInputClassName:ce=null,options:N=ee,defaultSelectedOptions:S=ee,optionLabel:b="label",optionValue:s="value",onChange:B,placeholder:z="Seçiniz",selectedInputMessage:F,itemSelectedText:M="öğe seçili",selectAllText:le="Tümünü Seç",searchPlaceholder:se="Ara",noDataMessage:ie="Veri bulunamadı",errorMessage:j="",errorPlace:H="out",isSearchable:D=!1,isLoading:oe=!1,isDisabled:x=!1,reactPortal:i=!1,windowPosition:I=!1,windowHeight:K=800,windowClose:P,isScrollEnd:W,getOptionTooltip:re=v=>typeof v?.tooltip=="string"?v.tooltip:void 0,limit:ue=null,selectionLimit:ae=null}){const v=t.useRef(null),y=t.useRef(null),Y=t.useRef(null),[r,G]=t.useState(!1),[c,J]=t.useState(S),[w,Q]=t.useState(null),[q,U]=t.useState(""),[de,me]=t.useState(null),[he,X]=t.useState(!1),u=Number(ue??ae),m=Number.isFinite(u)&&u>0,C=t.useCallback(()=>{if(I){Q(Number(K)<800?"top":"bottom");return}const e=y.current;if(!e)return;const l=e.getBoundingClientRect(),o=window.innerHeight-l.bottom,a=l.top,f=240+(D?46:0)+40;Q(o<f&&a>o?"top":"bottom")},[D,K,I]),E=t.useCallback(()=>{if(!i||!y.current)return;const e=y.current.getBoundingClientRect();me({position:"fixed",left:e.left,top:w==="top"?e.top:e.bottom,width:e.width,zIndex:9999}),X(!0)},[i,w]);t.useEffect(()=>{const e=m?S.slice(0,u):S;J(e)},[S,m,u]),t.useEffect(()=>{r||(P?.(!0),U(""))},[r,P]),t.useEffect(()=>{if(!r)return;const e=v.current,l=Y.current,o=a=>{const f=a.target,R=e?.contains(f),ge=l?.contains(f);!R&&!ge&&G(!1)};return document.addEventListener("pointerdown",o,!0),()=>document.removeEventListener("pointerdown",o,!0)},[r]),t.useLayoutEffect(()=>{if(!r){X(!1);return}C()},[r,C]),t.useLayoutEffect(()=>{!r||!i||E()},[r,i,E]),t.useEffect(()=>{if(!r)return;const e=()=>{C(),i&&E()};return window.addEventListener("resize",e),window.addEventListener("scroll",e,!0),()=>{window.removeEventListener("resize",e),window.removeEventListener("scroll",e,!0)}},[r,i,C,E]);const p=t.useCallback(e=>{J(e),B?.(e)},[B]),fe=t.useCallback(e=>{const l=e.currentTarget;l.scrollHeight-l.scrollTop<=l.clientHeight+1&&W?.(!0)},[W]),xe=t.useCallback(e=>{if(L(c,e,s)){p(c.filter(l=>l?.[s]!==e?.[s]));return}m&&c.length>=u||p([...c,e])},[m,u,s,c,p]),h=t.useMemo(()=>{const e=q.trim().toLocaleLowerCase();return e?N.filter(l=>String(l?.[b]??"").toLocaleLowerCase().includes(e)):N},[N,b,q]),pe=t.useMemo(()=>c.length===0?"":c.length===1?String(c[0]?.[b]??""):`${c.length} ${F||M}`,[M,b,F,c]),be=H==="in"&&j||z,Z=t.useCallback(()=>{x||G(e=>!e)},[x]),ve=e=>{(e.key==="Enter"||e.key===" ")&&(e.preventDefault(),Z())},T=t.useMemo(()=>h.length>0&&h.every(e=>L(c,e,s)),[h,s,c]),ke=t.useCallback(()=>{if(T){p(c.filter(o=>!h.some(a=>o?.[s]===a?.[s])));return}const e=h.filter(o=>!L(c,o,s)),l=m?e.slice(0,Math.max(u-c.length,0)):e;p([...c,...l])},[T,h,m,u,s,c,p]),$=k||"inconel-multi-select-checkbox",V=n.jsx("div",{ref:i?Y:void 0,className:d.classNames("inconel-multi-select-checkbox__panel-wrap",i&&"inconel-multi-select-checkbox__panel-wrap--portal",w==="top"&&"inconel-is-open-top"),style:i?{...de??{},visibility:he?"visible":"hidden"}:void 0,onPointerDown:e=>e.stopPropagation(),children:n.jsxs("div",{className:d.classNames("inconel-multi-select-checkbox__options",i&&"inconel-multi-select-checkbox__options--portal",ne),onScroll:fe,children:[D&&n.jsx("div",{className:"inconel-multi-select-checkbox__search",children:n.jsx("input",{type:"text",placeholder:se,className:d.classNames("inconel-multi-select-checkbox__search-input",ce),value:q,onChange:e=>U(e.target.value),disabled:x})}),n.jsxs("div",{className:d.classNames("inconel-multi-select-checkbox__option-item",A),children:[n.jsx("input",{id:`${$}-select-all`,type:"checkbox",checked:T,onChange:ke,disabled:x}),n.jsx("label",{htmlFor:`${$}-select-all`,children:le})]}),h.map((e,l)=>{const o=e?.[s]??l,a=L(c,e,s),f=x||!a&&m&&c.length>=u,R=`${$}-${String(o)}`;return n.jsxs("div",{className:d.classNames("inconel-multi-select-checkbox__option-item",a&&"inconel-is-selected",f&&"inconel-is-disabled",A),title:re(e),children:[n.jsx("input",{id:R,type:"checkbox",checked:a,onChange:()=>xe(e),disabled:f}),n.jsx("label",{htmlFor:R,children:String(e?.[b]??"")})]},String(o))})]})});return n.jsxs("div",{ref:v,id:k??void 0,className:d.classNames("inconel-multi-select-checkbox",j&&"inconel-is-error",x&&"inconel-is-disabled",w==="top"&&!i&&"inconel-is-open-top",_),children:[g&&n.jsx("span",{className:d.classNames("inconel-multi-select-checkbox__label",O),children:g}),n.jsxs("div",{className:"inconel-multi-select-checkbox__input-wrap",children:[oe&&n.jsx("div",{className:"inconel-multi-select-checkbox__loader-cover",children:n.jsx(Ne.DotLoader,{})}),n.jsxs("div",{ref:y,role:"button",tabIndex:0,className:"inconel-multi-select-checkbox__input-container",onClick:Z,onKeyDown:ve,children:[n.jsx("input",{type:"text",className:d.classNames("inconel-multi-select-checkbox__input",te),placeholder:be,readOnly:!0,value:pe}),n.jsx("span",{className:"inconel-multi-select-checkbox__indicator","aria-hidden":"true"})]})]}),r&&(N.length>0?i?_e.createPortal(V,document.body):V:n.jsx("div",{className:"inconel-multi-select-checkbox__nodata",children:n.jsx("span",{children:ie})})),H!=="in"&&j&&n.jsx("span",{className:"inconel-multi-select-checkbox__error",children:j})]})}exports.MultiSelectCheckBox=Se;
|
|
2
2
|
//# sourceMappingURL=MultiSelectCheckBox.cjs.map
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"MultiSelectCheckBox.cjs","sources":["../../../../src/components/MultiSelectCheckBox/MultiSelectCheckBox.tsx"],"sourcesContent":["import {\n useCallback,\n useEffect,\n useLayoutEffect,\n useMemo,\n useRef,\n useState,\n type ChangeEvent,\n type CSSProperties,\n type KeyboardEvent,\n type ReactNode,\n type UIEvent,\n} from 'react'\nimport { createPortal } from 'react-dom'\n\nimport { DotLoader } from '../DotLoader'\nimport { classNames } from '../shared/classNames'\nimport './styles.css'\n\nexport interface MultiSelectCheckBoxOption {\n [key: string]: unknown\n}\n\nexport interface MultiSelectCheckBoxProps<\n T extends MultiSelectCheckBoxOption = MultiSelectCheckBoxOption,\n> {\n id?: string | null\n label?: ReactNode\n className?: string | null\n labelClassName?: string | null\n inputClassName?: string | null\n optionsClassName?: string | null\n optionItemClassName?: string | null\n searchableInputClassName?: string | null\n options?: T[]\n defaultSelectedOptions?: T[]\n optionLabel?: string\n optionValue?: string\n onChange?: (selected: T[]) => void\n placeholder?: string\n selectedInputMessage?: string\n itemSelectedText?: string\n selectAllText?: string\n searchPlaceholder?: string\n noDataMessage?: string\n errorMessage?: string\n errorPlace?: 'in' | 'out'\n isSearchable?: boolean\n isLoading?: boolean\n isDisabled?: boolean\n reactPortal?: boolean\n windowPosition?: boolean\n windowHeight?: number\n windowClose?: (closed: boolean) => void\n isScrollEnd?: (end: boolean) => void\n getOptionTooltip?: (option: T) => string | undefined\n limit?: number | null\n selectionLimit?: number | null\n}\n\nconst EMPTY_OPTIONS: never[] = []\n\nfunction isOptionSelected<T extends MultiSelectCheckBoxOption>(\n selected: T[],\n option: T,\n optionValue: string,\n) {\n return selected.some(\n (item) => item?.[optionValue] === option?.[optionValue],\n )\n}\n\nexport function MultiSelectCheckBox<\n T extends MultiSelectCheckBoxOption = MultiSelectCheckBoxOption,\n>({\n id = null,\n label = null,\n className = null,\n labelClassName = null,\n inputClassName = null,\n optionsClassName = null,\n optionItemClassName = null,\n searchableInputClassName = null,\n options = EMPTY_OPTIONS,\n defaultSelectedOptions = EMPTY_OPTIONS,\n optionLabel = 'label',\n optionValue = 'value',\n onChange,\n placeholder = 'Seçiniz',\n selectedInputMessage,\n itemSelectedText = 'öğe seçili',\n selectAllText = 'Tümünü Seç',\n searchPlaceholder = 'Ara',\n noDataMessage = 'Veri bulunamadı',\n errorMessage = '',\n errorPlace = 'out',\n isSearchable = false,\n isLoading = false,\n isDisabled = false,\n reactPortal = false,\n windowPosition = false,\n windowHeight = 800,\n windowClose,\n isScrollEnd,\n getOptionTooltip = (option: T) =>\n typeof option?.tooltip === 'string' ? option.tooltip : undefined,\n limit = null,\n selectionLimit = null,\n}: MultiSelectCheckBoxProps<T>) {\n const rootRef = useRef<HTMLDivElement>(null)\n const anchorRef = useRef<HTMLDivElement>(null)\n const portalWrapRef = useRef<HTMLDivElement>(null)\n\n const [showOptions, setShowOptions] = useState(false)\n const [selectedOptions, setSelectedOptions] = useState<T[]>(\n defaultSelectedOptions,\n )\n const [openDirection, setOpenDirection] = useState<'top' | 'bottom' | null>(\n null,\n )\n const [searchValue, setSearchValue] = useState('')\n const [portalStyle, setPortalStyle] = useState<CSSProperties | null>(null)\n const [portalReady, setPortalReady] = useState(false)\n\n const selectionLimitValue = limit ?? selectionLimit\n const maxSelectionCount = Number(selectionLimitValue)\n const hasSelectionLimit =\n Number.isFinite(maxSelectionCount) && maxSelectionCount > 0\n\n const recomputePortalPosition = useCallback(() => {\n if (!reactPortal || !anchorRef.current) return\n const rect = anchorRef.current.getBoundingClientRect()\n setPortalStyle({\n position: 'fixed',\n left: rect.left,\n top: rect.bottom,\n width: rect.width,\n zIndex: 9999,\n })\n setPortalReady(true)\n }, [reactPortal])\n\n useEffect(() => {\n const next = hasSelectionLimit\n ? defaultSelectedOptions.slice(0, maxSelectionCount)\n : defaultSelectedOptions\n setSelectedOptions(next)\n }, [defaultSelectedOptions, hasSelectionLimit, maxSelectionCount])\n\n useEffect(() => {\n if (!showOptions) {\n windowClose?.(true)\n setSearchValue('')\n }\n }, [showOptions, windowClose])\n\n useEffect(() => {\n if (!showOptions) return undefined\n\n const rootEl = rootRef.current\n const portalEl = portalWrapRef.current\n\n const handlePointerDown = (event: PointerEvent) => {\n const target = event.target as Node\n const inRoot = rootEl?.contains(target)\n const inPortal = portalEl?.contains(target)\n if (!inRoot && !inPortal) setShowOptions(false)\n }\n\n document.addEventListener('pointerdown', handlePointerDown, true)\n return () =>\n document.removeEventListener('pointerdown', handlePointerDown, true)\n }, [showOptions])\n\n useLayoutEffect(() => {\n if (!showOptions) {\n setPortalReady(false)\n return\n }\n if (!reactPortal) return\n recomputePortalPosition()\n }, [showOptions, reactPortal, recomputePortalPosition])\n\n useEffect(() => {\n if (!showOptions || !reactPortal) return undefined\n\n const handleReposition = () => recomputePortalPosition()\n window.addEventListener('resize', handleReposition)\n window.addEventListener('scroll', handleReposition, true)\n\n return () => {\n window.removeEventListener('resize', handleReposition)\n window.removeEventListener('scroll', handleReposition, true)\n }\n }, [showOptions, reactPortal, recomputePortalPosition])\n\n useEffect(() => {\n if (!windowPosition) return\n setOpenDirection(Number(windowHeight) < 800 ? 'top' : 'bottom')\n }, [windowHeight, windowPosition])\n\n const updateSelection = useCallback(\n (next: T[]) => {\n setSelectedOptions(next)\n onChange?.(next)\n },\n [onChange],\n )\n\n const handleScroll = useCallback(\n (event: UIEvent<HTMLDivElement>) => {\n const target = event.currentTarget\n if (target.scrollHeight - target.scrollTop <= target.clientHeight + 1) {\n isScrollEnd?.(true)\n }\n },\n [isScrollEnd],\n )\n\n const toggleOption = useCallback(\n (option: T) => {\n if (isOptionSelected(selectedOptions, option, optionValue)) {\n updateSelection(\n selectedOptions.filter(\n (item) => item?.[optionValue] !== option?.[optionValue],\n ),\n )\n return\n }\n if (hasSelectionLimit && selectedOptions.length >= maxSelectionCount) {\n return\n }\n updateSelection([...selectedOptions, option])\n },\n [\n hasSelectionLimit,\n maxSelectionCount,\n optionValue,\n selectedOptions,\n updateSelection,\n ],\n )\n\n const filteredOptions = useMemo(() => {\n const query = searchValue.trim().toLocaleLowerCase()\n if (!query) return options\n return options.filter((option) =>\n String(option?.[optionLabel] ?? '')\n .toLocaleLowerCase()\n .includes(query),\n )\n }, [options, optionLabel, searchValue])\n\n const inputValue = useMemo(() => {\n if (selectedOptions.length === 0) return ''\n if (selectedOptions.length === 1) {\n return String(selectedOptions[0]?.[optionLabel] ?? '')\n }\n return `${selectedOptions.length} ${selectedInputMessage || itemSelectedText}`\n }, [itemSelectedText, optionLabel, selectedInputMessage, selectedOptions])\n\n const inputPlaceholder =\n errorPlace === 'in' ? errorMessage || placeholder : placeholder\n\n const toggleDropdown = useCallback(() => {\n if (isDisabled) return\n setShowOptions((prev) => !prev)\n }, [isDisabled])\n\n const handleTriggerKeyDown = (event: KeyboardEvent<HTMLDivElement>) => {\n if (event.key === 'Enter' || event.key === ' ') {\n event.preventDefault()\n toggleDropdown()\n }\n }\n\n const allFilteredSelected = useMemo(\n () =>\n filteredOptions.length > 0 &&\n filteredOptions.every((option) =>\n isOptionSelected(selectedOptions, option, optionValue),\n ),\n [filteredOptions, optionValue, selectedOptions],\n )\n\n const handleSelectAll = useCallback(() => {\n if (allFilteredSelected) {\n updateSelection(\n selectedOptions.filter(\n (selected) =>\n !filteredOptions.some(\n (option) => selected?.[optionValue] === option?.[optionValue],\n ),\n ),\n )\n return\n }\n const toAdd = filteredOptions.filter(\n (option) => !isOptionSelected(selectedOptions, option, optionValue),\n )\n const limitedToAdd = hasSelectionLimit\n ? toAdd.slice(0, Math.max(maxSelectionCount - selectedOptions.length, 0))\n : toAdd\n updateSelection([...selectedOptions, ...limitedToAdd])\n }, [\n allFilteredSelected,\n filteredOptions,\n hasSelectionLimit,\n maxSelectionCount,\n optionValue,\n selectedOptions,\n updateSelection,\n ])\n\n const baseId = id || 'inconel-multi-select-checkbox'\n\n const optionsPanel = (\n <div\n ref={reactPortal ? portalWrapRef : undefined}\n className={classNames(\n 'inconel-multi-select-checkbox__panel-wrap',\n reactPortal && 'inconel-multi-select-checkbox__panel-wrap--portal',\n openDirection === 'top' && 'inconel-is-open-top',\n )}\n style={\n reactPortal\n ? { ...(portalStyle ?? {}), visibility: portalReady ? 'visible' : 'hidden' }\n : undefined\n }\n onPointerDown={(event) => event.stopPropagation()}\n >\n <div\n className={classNames(\n 'inconel-multi-select-checkbox__options',\n reactPortal && 'inconel-multi-select-checkbox__options--portal',\n optionsClassName,\n )}\n onScroll={handleScroll}\n >\n {isSearchable && (\n <div className=\"inconel-multi-select-checkbox__search\">\n <input\n type=\"text\"\n placeholder={searchPlaceholder}\n className={classNames(\n 'inconel-multi-select-checkbox__search-input',\n searchableInputClassName,\n )}\n value={searchValue}\n onChange={(event: ChangeEvent<HTMLInputElement>) =>\n setSearchValue(event.target.value)\n }\n disabled={isDisabled}\n />\n </div>\n )}\n\n <div\n className={classNames(\n 'inconel-multi-select-checkbox__option-item',\n optionItemClassName,\n )}\n >\n <input\n id={`${baseId}-select-all`}\n type=\"checkbox\"\n checked={allFilteredSelected}\n onChange={handleSelectAll}\n disabled={isDisabled}\n />\n <label htmlFor={`${baseId}-select-all`}>{selectAllText}</label>\n </div>\n\n {filteredOptions.map((option, index) => {\n const value = option?.[optionValue] ?? index\n const checked = isOptionSelected(selectedOptions, option, optionValue)\n const optionDisabled =\n isDisabled ||\n (!checked && hasSelectionLimit && selectedOptions.length >= maxSelectionCount)\n const inputId = `${baseId}-${String(value)}`\n\n return (\n <div\n key={String(value)}\n className={classNames(\n 'inconel-multi-select-checkbox__option-item',\n checked && 'inconel-is-selected',\n optionDisabled && 'inconel-is-disabled',\n optionItemClassName,\n )}\n title={getOptionTooltip(option)}\n >\n <input\n id={inputId}\n type=\"checkbox\"\n checked={checked}\n onChange={() => toggleOption(option)}\n disabled={optionDisabled}\n />\n <label htmlFor={inputId}>\n {String(option?.[optionLabel] ?? '')}\n </label>\n </div>\n )\n })}\n </div>\n </div>\n )\n\n return (\n <div\n ref={rootRef}\n id={id ?? undefined}\n className={classNames(\n 'inconel-multi-select-checkbox',\n errorMessage && 'inconel-is-error',\n isDisabled && 'inconel-is-disabled',\n openDirection === 'top' && !reactPortal && 'inconel-is-open-top',\n className,\n )}\n >\n {label && (\n <span\n className={classNames(\n 'inconel-multi-select-checkbox__label',\n labelClassName,\n )}\n >\n {label}\n </span>\n )}\n\n <div className=\"inconel-multi-select-checkbox__input-wrap\">\n {isLoading && (\n <div className=\"inconel-multi-select-checkbox__loader-cover\">\n <DotLoader />\n </div>\n )}\n\n <div\n ref={anchorRef}\n role=\"button\"\n tabIndex={0}\n className=\"inconel-multi-select-checkbox__input-container\"\n onClick={toggleDropdown}\n onKeyDown={handleTriggerKeyDown}\n >\n <input\n type=\"text\"\n className={classNames(\n 'inconel-multi-select-checkbox__input',\n inputClassName,\n )}\n placeholder={inputPlaceholder}\n readOnly\n value={inputValue}\n />\n <span\n className=\"inconel-multi-select-checkbox__indicator\"\n aria-hidden=\"true\"\n />\n </div>\n </div>\n\n {showOptions &&\n (options.length > 0 ? (\n reactPortal ? (\n createPortal(optionsPanel, document.body)\n ) : (\n optionsPanel\n )\n ) : (\n <div className=\"inconel-multi-select-checkbox__nodata\">\n <span>{noDataMessage}</span>\n </div>\n ))}\n\n {errorPlace !== 'in' && errorMessage && (\n <span className=\"inconel-multi-select-checkbox__error\">\n {errorMessage}\n </span>\n )}\n </div>\n )\n}\n"],"names":["EMPTY_OPTIONS","isOptionSelected","selected","option","optionValue","item","MultiSelectCheckBox","id","label","className","labelClassName","inputClassName","optionsClassName","optionItemClassName","searchableInputClassName","options","defaultSelectedOptions","optionLabel","onChange","placeholder","selectedInputMessage","itemSelectedText","selectAllText","searchPlaceholder","noDataMessage","errorMessage","errorPlace","isSearchable","isLoading","isDisabled","reactPortal","windowPosition","windowHeight","windowClose","isScrollEnd","getOptionTooltip","limit","selectionLimit","rootRef","useRef","anchorRef","portalWrapRef","showOptions","setShowOptions","useState","selectedOptions","setSelectedOptions","openDirection","setOpenDirection","searchValue","setSearchValue","portalStyle","setPortalStyle","portalReady","setPortalReady","maxSelectionCount","hasSelectionLimit","recomputePortalPosition","useCallback","rect","useEffect","next","rootEl","portalEl","handlePointerDown","event","target","inRoot","inPortal","useLayoutEffect","handleReposition","updateSelection","handleScroll","toggleOption","filteredOptions","useMemo","query","inputValue","inputPlaceholder","toggleDropdown","prev","handleTriggerKeyDown","allFilteredSelected","handleSelectAll","toAdd","limitedToAdd","baseId","optionsPanel","jsx","classNames","jsxs","index","value","checked","optionDisabled","inputId","DotLoader","createPortal"],"mappings":"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"}
|
|
1
|
+
{"version":3,"file":"MultiSelectCheckBox.cjs","sources":["../../../../src/components/MultiSelectCheckBox/MultiSelectCheckBox.tsx"],"sourcesContent":["import {\n useCallback,\n useEffect,\n useLayoutEffect,\n useMemo,\n useRef,\n useState,\n type ChangeEvent,\n type CSSProperties,\n type KeyboardEvent,\n type ReactNode,\n type UIEvent,\n} from 'react'\nimport { createPortal } from 'react-dom'\n\nimport { DotLoader } from '../DotLoader'\nimport { classNames } from '../shared/classNames'\nimport './styles.css'\n\nexport interface MultiSelectCheckBoxOption {\n [key: string]: unknown\n}\n\nexport interface MultiSelectCheckBoxProps<\n T extends MultiSelectCheckBoxOption = MultiSelectCheckBoxOption,\n> {\n id?: string | null\n label?: ReactNode\n className?: string | null\n labelClassName?: string | null\n inputClassName?: string | null\n optionsClassName?: string | null\n optionItemClassName?: string | null\n searchableInputClassName?: string | null\n options?: T[]\n defaultSelectedOptions?: T[]\n optionLabel?: string\n optionValue?: string\n onChange?: (selected: T[]) => void\n placeholder?: string\n selectedInputMessage?: string\n itemSelectedText?: string\n selectAllText?: string\n searchPlaceholder?: string\n noDataMessage?: string\n errorMessage?: string\n errorPlace?: 'in' | 'out'\n isSearchable?: boolean\n isLoading?: boolean\n isDisabled?: boolean\n reactPortal?: boolean\n windowPosition?: boolean\n windowHeight?: number\n windowClose?: (closed: boolean) => void\n isScrollEnd?: (end: boolean) => void\n getOptionTooltip?: (option: T) => string | undefined\n limit?: number | null\n selectionLimit?: number | null\n}\n\nconst EMPTY_OPTIONS: never[] = []\n\nfunction isOptionSelected<T extends MultiSelectCheckBoxOption>(\n selected: T[],\n option: T,\n optionValue: string,\n) {\n return selected.some(\n (item) => item?.[optionValue] === option?.[optionValue],\n )\n}\n\nexport function MultiSelectCheckBox<\n T extends MultiSelectCheckBoxOption = MultiSelectCheckBoxOption,\n>({\n id = null,\n label = null,\n className = null,\n labelClassName = null,\n inputClassName = null,\n optionsClassName = null,\n optionItemClassName = null,\n searchableInputClassName = null,\n options = EMPTY_OPTIONS,\n defaultSelectedOptions = EMPTY_OPTIONS,\n optionLabel = 'label',\n optionValue = 'value',\n onChange,\n placeholder = 'Seçiniz',\n selectedInputMessage,\n itemSelectedText = 'öğe seçili',\n selectAllText = 'Tümünü Seç',\n searchPlaceholder = 'Ara',\n noDataMessage = 'Veri bulunamadı',\n errorMessage = '',\n errorPlace = 'out',\n isSearchable = false,\n isLoading = false,\n isDisabled = false,\n reactPortal = false,\n windowPosition = false,\n windowHeight = 800,\n windowClose,\n isScrollEnd,\n getOptionTooltip = (option: T) =>\n typeof option?.tooltip === 'string' ? option.tooltip : undefined,\n limit = null,\n selectionLimit = null,\n}: MultiSelectCheckBoxProps<T>) {\n const rootRef = useRef<HTMLDivElement>(null)\n const anchorRef = useRef<HTMLDivElement>(null)\n const portalWrapRef = useRef<HTMLDivElement>(null)\n\n const [showOptions, setShowOptions] = useState(false)\n const [selectedOptions, setSelectedOptions] = useState<T[]>(\n defaultSelectedOptions,\n )\n const [openDirection, setOpenDirection] = useState<'top' | 'bottom' | null>(\n null,\n )\n const [searchValue, setSearchValue] = useState('')\n const [portalStyle, setPortalStyle] = useState<CSSProperties | null>(null)\n const [portalReady, setPortalReady] = useState(false)\n\n const selectionLimitValue = limit ?? selectionLimit\n const maxSelectionCount = Number(selectionLimitValue)\n const hasSelectionLimit =\n Number.isFinite(maxSelectionCount) && maxSelectionCount > 0\n\n const recomputeOpenDirection = useCallback(() => {\n if (windowPosition) {\n setOpenDirection(Number(windowHeight) < 800 ? 'top' : 'bottom')\n return\n }\n const anchor = anchorRef.current\n if (!anchor) return\n const rect = anchor.getBoundingClientRect()\n const spaceBelow = window.innerHeight - rect.bottom\n const spaceAbove = rect.top\n const estimatedPanelHeight = 240 + (isSearchable ? 46 : 0) + 40\n setOpenDirection(\n spaceBelow < estimatedPanelHeight && spaceAbove > spaceBelow\n ? 'top'\n : 'bottom',\n )\n }, [isSearchable, windowHeight, windowPosition])\n\n const recomputePortalPosition = useCallback(() => {\n if (!reactPortal || !anchorRef.current) return\n const rect = anchorRef.current.getBoundingClientRect()\n setPortalStyle({\n position: 'fixed',\n left: rect.left,\n top: openDirection === 'top' ? rect.top : rect.bottom,\n width: rect.width,\n zIndex: 9999,\n })\n setPortalReady(true)\n }, [reactPortal, openDirection])\n\n useEffect(() => {\n const next = hasSelectionLimit\n ? defaultSelectedOptions.slice(0, maxSelectionCount)\n : defaultSelectedOptions\n setSelectedOptions(next)\n }, [defaultSelectedOptions, hasSelectionLimit, maxSelectionCount])\n\n useEffect(() => {\n if (!showOptions) {\n windowClose?.(true)\n setSearchValue('')\n }\n }, [showOptions, windowClose])\n\n useEffect(() => {\n if (!showOptions) return undefined\n\n const rootEl = rootRef.current\n const portalEl = portalWrapRef.current\n\n const handlePointerDown = (event: PointerEvent) => {\n const target = event.target as Node\n const inRoot = rootEl?.contains(target)\n const inPortal = portalEl?.contains(target)\n if (!inRoot && !inPortal) setShowOptions(false)\n }\n\n document.addEventListener('pointerdown', handlePointerDown, true)\n return () =>\n document.removeEventListener('pointerdown', handlePointerDown, true)\n }, [showOptions])\n\n useLayoutEffect(() => {\n if (!showOptions) {\n setPortalReady(false)\n return\n }\n recomputeOpenDirection()\n }, [showOptions, recomputeOpenDirection])\n\n useLayoutEffect(() => {\n if (!showOptions || !reactPortal) return\n recomputePortalPosition()\n }, [showOptions, reactPortal, recomputePortalPosition])\n\n useEffect(() => {\n if (!showOptions) return undefined\n\n const handleReposition = () => {\n recomputeOpenDirection()\n if (reactPortal) recomputePortalPosition()\n }\n window.addEventListener('resize', handleReposition)\n window.addEventListener('scroll', handleReposition, true)\n\n return () => {\n window.removeEventListener('resize', handleReposition)\n window.removeEventListener('scroll', handleReposition, true)\n }\n }, [showOptions, reactPortal, recomputeOpenDirection, recomputePortalPosition])\n\n const updateSelection = useCallback(\n (next: T[]) => {\n setSelectedOptions(next)\n onChange?.(next)\n },\n [onChange],\n )\n\n const handleScroll = useCallback(\n (event: UIEvent<HTMLDivElement>) => {\n const target = event.currentTarget\n if (target.scrollHeight - target.scrollTop <= target.clientHeight + 1) {\n isScrollEnd?.(true)\n }\n },\n [isScrollEnd],\n )\n\n const toggleOption = useCallback(\n (option: T) => {\n if (isOptionSelected(selectedOptions, option, optionValue)) {\n updateSelection(\n selectedOptions.filter(\n (item) => item?.[optionValue] !== option?.[optionValue],\n ),\n )\n return\n }\n if (hasSelectionLimit && selectedOptions.length >= maxSelectionCount) {\n return\n }\n updateSelection([...selectedOptions, option])\n },\n [\n hasSelectionLimit,\n maxSelectionCount,\n optionValue,\n selectedOptions,\n updateSelection,\n ],\n )\n\n const filteredOptions = useMemo(() => {\n const query = searchValue.trim().toLocaleLowerCase()\n if (!query) return options\n return options.filter((option) =>\n String(option?.[optionLabel] ?? '')\n .toLocaleLowerCase()\n .includes(query),\n )\n }, [options, optionLabel, searchValue])\n\n const inputValue = useMemo(() => {\n if (selectedOptions.length === 0) return ''\n if (selectedOptions.length === 1) {\n return String(selectedOptions[0]?.[optionLabel] ?? '')\n }\n return `${selectedOptions.length} ${selectedInputMessage || itemSelectedText}`\n }, [itemSelectedText, optionLabel, selectedInputMessage, selectedOptions])\n\n const inputPlaceholder =\n errorPlace === 'in' ? errorMessage || placeholder : placeholder\n\n const toggleDropdown = useCallback(() => {\n if (isDisabled) return\n setShowOptions((prev) => !prev)\n }, [isDisabled])\n\n const handleTriggerKeyDown = (event: KeyboardEvent<HTMLDivElement>) => {\n if (event.key === 'Enter' || event.key === ' ') {\n event.preventDefault()\n toggleDropdown()\n }\n }\n\n const allFilteredSelected = useMemo(\n () =>\n filteredOptions.length > 0 &&\n filteredOptions.every((option) =>\n isOptionSelected(selectedOptions, option, optionValue),\n ),\n [filteredOptions, optionValue, selectedOptions],\n )\n\n const handleSelectAll = useCallback(() => {\n if (allFilteredSelected) {\n updateSelection(\n selectedOptions.filter(\n (selected) =>\n !filteredOptions.some(\n (option) => selected?.[optionValue] === option?.[optionValue],\n ),\n ),\n )\n return\n }\n const toAdd = filteredOptions.filter(\n (option) => !isOptionSelected(selectedOptions, option, optionValue),\n )\n const limitedToAdd = hasSelectionLimit\n ? toAdd.slice(0, Math.max(maxSelectionCount - selectedOptions.length, 0))\n : toAdd\n updateSelection([...selectedOptions, ...limitedToAdd])\n }, [\n allFilteredSelected,\n filteredOptions,\n hasSelectionLimit,\n maxSelectionCount,\n optionValue,\n selectedOptions,\n updateSelection,\n ])\n\n const baseId = id || 'inconel-multi-select-checkbox'\n\n const optionsPanel = (\n <div\n ref={reactPortal ? portalWrapRef : undefined}\n className={classNames(\n 'inconel-multi-select-checkbox__panel-wrap',\n reactPortal && 'inconel-multi-select-checkbox__panel-wrap--portal',\n openDirection === 'top' && 'inconel-is-open-top',\n )}\n style={\n reactPortal\n ? { ...(portalStyle ?? {}), visibility: portalReady ? 'visible' : 'hidden' }\n : undefined\n }\n onPointerDown={(event) => event.stopPropagation()}\n >\n <div\n className={classNames(\n 'inconel-multi-select-checkbox__options',\n reactPortal && 'inconel-multi-select-checkbox__options--portal',\n optionsClassName,\n )}\n onScroll={handleScroll}\n >\n {isSearchable && (\n <div className=\"inconel-multi-select-checkbox__search\">\n <input\n type=\"text\"\n placeholder={searchPlaceholder}\n className={classNames(\n 'inconel-multi-select-checkbox__search-input',\n searchableInputClassName,\n )}\n value={searchValue}\n onChange={(event: ChangeEvent<HTMLInputElement>) =>\n setSearchValue(event.target.value)\n }\n disabled={isDisabled}\n />\n </div>\n )}\n\n <div\n className={classNames(\n 'inconel-multi-select-checkbox__option-item',\n optionItemClassName,\n )}\n >\n <input\n id={`${baseId}-select-all`}\n type=\"checkbox\"\n checked={allFilteredSelected}\n onChange={handleSelectAll}\n disabled={isDisabled}\n />\n <label htmlFor={`${baseId}-select-all`}>{selectAllText}</label>\n </div>\n\n {filteredOptions.map((option, index) => {\n const value = option?.[optionValue] ?? index\n const checked = isOptionSelected(selectedOptions, option, optionValue)\n const optionDisabled =\n isDisabled ||\n (!checked && hasSelectionLimit && selectedOptions.length >= maxSelectionCount)\n const inputId = `${baseId}-${String(value)}`\n\n return (\n <div\n key={String(value)}\n className={classNames(\n 'inconel-multi-select-checkbox__option-item',\n checked && 'inconel-is-selected',\n optionDisabled && 'inconel-is-disabled',\n optionItemClassName,\n )}\n title={getOptionTooltip(option)}\n >\n <input\n id={inputId}\n type=\"checkbox\"\n checked={checked}\n onChange={() => toggleOption(option)}\n disabled={optionDisabled}\n />\n <label htmlFor={inputId}>\n {String(option?.[optionLabel] ?? '')}\n </label>\n </div>\n )\n })}\n </div>\n </div>\n )\n\n return (\n <div\n ref={rootRef}\n id={id ?? undefined}\n className={classNames(\n 'inconel-multi-select-checkbox',\n errorMessage && 'inconel-is-error',\n isDisabled && 'inconel-is-disabled',\n openDirection === 'top' && !reactPortal && 'inconel-is-open-top',\n className,\n )}\n >\n {label && (\n <span\n className={classNames(\n 'inconel-multi-select-checkbox__label',\n labelClassName,\n )}\n >\n {label}\n </span>\n )}\n\n <div className=\"inconel-multi-select-checkbox__input-wrap\">\n {isLoading && (\n <div className=\"inconel-multi-select-checkbox__loader-cover\">\n <DotLoader />\n </div>\n )}\n\n <div\n ref={anchorRef}\n role=\"button\"\n tabIndex={0}\n className=\"inconel-multi-select-checkbox__input-container\"\n onClick={toggleDropdown}\n onKeyDown={handleTriggerKeyDown}\n >\n <input\n type=\"text\"\n className={classNames(\n 'inconel-multi-select-checkbox__input',\n inputClassName,\n )}\n placeholder={inputPlaceholder}\n readOnly\n value={inputValue}\n />\n <span\n className=\"inconel-multi-select-checkbox__indicator\"\n aria-hidden=\"true\"\n />\n </div>\n </div>\n\n {showOptions &&\n (options.length > 0 ? (\n reactPortal ? (\n createPortal(optionsPanel, document.body)\n ) : (\n optionsPanel\n )\n ) : (\n <div className=\"inconel-multi-select-checkbox__nodata\">\n <span>{noDataMessage}</span>\n </div>\n ))}\n\n {errorPlace !== 'in' && errorMessage && (\n <span className=\"inconel-multi-select-checkbox__error\">\n {errorMessage}\n </span>\n )}\n </div>\n )\n}\n"],"names":["EMPTY_OPTIONS","isOptionSelected","selected","option","optionValue","item","MultiSelectCheckBox","id","label","className","labelClassName","inputClassName","optionsClassName","optionItemClassName","searchableInputClassName","options","defaultSelectedOptions","optionLabel","onChange","placeholder","selectedInputMessage","itemSelectedText","selectAllText","searchPlaceholder","noDataMessage","errorMessage","errorPlace","isSearchable","isLoading","isDisabled","reactPortal","windowPosition","windowHeight","windowClose","isScrollEnd","getOptionTooltip","limit","selectionLimit","rootRef","useRef","anchorRef","portalWrapRef","showOptions","setShowOptions","useState","selectedOptions","setSelectedOptions","openDirection","setOpenDirection","searchValue","setSearchValue","portalStyle","setPortalStyle","portalReady","setPortalReady","maxSelectionCount","hasSelectionLimit","recomputeOpenDirection","useCallback","anchor","rect","spaceBelow","spaceAbove","estimatedPanelHeight","recomputePortalPosition","useEffect","next","rootEl","portalEl","handlePointerDown","event","target","inRoot","inPortal","useLayoutEffect","handleReposition","updateSelection","handleScroll","toggleOption","filteredOptions","useMemo","query","inputValue","inputPlaceholder","toggleDropdown","prev","handleTriggerKeyDown","allFilteredSelected","handleSelectAll","toAdd","limitedToAdd","baseId","optionsPanel","jsx","classNames","jsxs","index","value","checked","optionDisabled","inputId","DotLoader","createPortal"],"mappings":"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"}
|
|
@@ -20,6 +20,7 @@ export interface ModalProps {
|
|
|
20
20
|
maximize?: boolean;
|
|
21
21
|
maximizeIcon?: string;
|
|
22
22
|
fullSize?: boolean;
|
|
23
|
+
hideHeader?: boolean;
|
|
23
24
|
hideFooter?: boolean;
|
|
24
25
|
okText?: ReactNode;
|
|
25
26
|
okAction?: () => void;
|
|
@@ -44,5 +45,5 @@ export interface ModalProps {
|
|
|
44
45
|
className?: string | null;
|
|
45
46
|
enforceFocus?: boolean;
|
|
46
47
|
}
|
|
47
|
-
export declare function Modal({ id, open, show, title, modalTitle, modalType, children, footer, customButtons, closeLabel, closeButton, closeOnBackdrop, backdrop, keyboard, centered, scrollable, size, maximize, maximizeIcon, fullSize, hideFooter, okText, okAction, okButtonType, cancelText, cancelAction, cancelButtonType, onClose, onHide, onShow, onEnter, onEntering, onEntered, onExit, onExiting, onExited, onEscapeKeyDown, dialogClassName, backdropClassName, bodyClassName, className, }: ModalProps): import("react").JSX.Element | null;
|
|
48
|
+
export declare function Modal({ id, open, show, title, modalTitle, modalType, children, footer, customButtons, closeLabel, closeButton, closeOnBackdrop, backdrop, keyboard, centered, scrollable, size, maximize, maximizeIcon, fullSize, hideHeader, hideFooter, okText, okAction, okButtonType, cancelText, cancelAction, cancelButtonType, onClose, onHide, onShow, onEnter, onEntering, onEntered, onExit, onExiting, onExited, onEscapeKeyDown, dialogClassName, backdropClassName, bodyClassName, className, }: ModalProps): import("react").JSX.Element | null;
|
|
48
49
|
//# sourceMappingURL=Modal.d.ts.map
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"Modal.d.ts","sourceRoot":"","sources":["../../../src/components/Modal/Modal.tsx"],"names":[],"mappings":"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
|
|
1
|
+
{"version":3,"file":"Modal.d.ts","sourceRoot":"","sources":["../../../src/components/Modal/Modal.tsx"],"names":[],"mappings":"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"}
|
|
@@ -1,12 +1,12 @@
|
|
|
1
|
-
import { jsx as e, jsxs as i, Fragment as
|
|
2
|
-
import { useState as
|
|
1
|
+
import { jsx as e, jsxs as i, Fragment as oe } from "react/jsx-runtime";
|
|
2
|
+
import { useState as ie, useEffect as M, Children as re } from "react";
|
|
3
3
|
import { classNames as u } from "../shared/classNames.js";
|
|
4
|
-
import { DEFAULT_MODAL_CLOSE_LABEL as
|
|
4
|
+
import { DEFAULT_MODAL_CLOSE_LABEL as ne } from "./constants.js";
|
|
5
5
|
/* empty css */
|
|
6
|
-
import { useInconelAdapters as
|
|
7
|
-
import
|
|
6
|
+
import { useInconelAdapters as se } from "../../adapters/context.js";
|
|
7
|
+
import te from "../Svg/Svg.js";
|
|
8
8
|
import { Button as $ } from "../Button/Button.js";
|
|
9
|
-
function
|
|
9
|
+
function he({
|
|
10
10
|
id: k,
|
|
11
11
|
open: D,
|
|
12
12
|
show: F,
|
|
@@ -16,7 +16,7 @@ function ve({
|
|
|
16
16
|
children: f,
|
|
17
17
|
footer: p,
|
|
18
18
|
customButtons: r,
|
|
19
|
-
closeLabel: x =
|
|
19
|
+
closeLabel: x = ne,
|
|
20
20
|
closeButton: E = !0,
|
|
21
21
|
closeOnBackdrop: I = !0,
|
|
22
22
|
backdrop: _ = !0,
|
|
@@ -27,15 +27,16 @@ function ve({
|
|
|
27
27
|
maximize: S = !1,
|
|
28
28
|
maximizeIcon: q,
|
|
29
29
|
fullSize: v = !1,
|
|
30
|
-
|
|
30
|
+
hideHeader: G = !1,
|
|
31
|
+
hideFooter: J = !1,
|
|
31
32
|
okText: n,
|
|
32
33
|
okAction: s,
|
|
33
|
-
okButtonType:
|
|
34
|
+
okButtonType: K = "button",
|
|
34
35
|
cancelText: t,
|
|
35
36
|
cancelAction: c,
|
|
36
|
-
cancelButtonType:
|
|
37
|
-
onClose:
|
|
38
|
-
onHide:
|
|
37
|
+
cancelButtonType: P = "button",
|
|
38
|
+
onClose: Q,
|
|
39
|
+
onHide: R,
|
|
39
40
|
onShow: h,
|
|
40
41
|
onEnter: b,
|
|
41
42
|
onEntering: N,
|
|
@@ -43,32 +44,32 @@ function ve({
|
|
|
43
44
|
onExit: C,
|
|
44
45
|
onExiting: L,
|
|
45
46
|
onExited: g,
|
|
46
|
-
onEscapeKeyDown:
|
|
47
|
-
dialogClassName:
|
|
48
|
-
backdropClassName:
|
|
49
|
-
bodyClassName:
|
|
50
|
-
className:
|
|
47
|
+
onEscapeKeyDown: V,
|
|
48
|
+
dialogClassName: W,
|
|
49
|
+
backdropClassName: X,
|
|
50
|
+
bodyClassName: Y,
|
|
51
|
+
className: Z
|
|
51
52
|
}) {
|
|
52
|
-
const z =
|
|
53
|
-
|
|
53
|
+
const z = se(), [T, ee] = ie(!1), o = D ?? F ?? !1, d = () => {
|
|
54
|
+
Q?.(), R?.();
|
|
54
55
|
};
|
|
55
56
|
if (M(() => {
|
|
56
57
|
o ? (b?.(), N?.(), h?.(), y?.()) : (C?.(), L?.(), g?.());
|
|
57
58
|
}, [o, b, y, N, C, g, L, h]), M(() => {
|
|
58
59
|
if (!o || !O) return;
|
|
59
|
-
const a = (
|
|
60
|
-
|
|
60
|
+
const a = (le) => {
|
|
61
|
+
le.key === "Escape" && (V?.(), d());
|
|
61
62
|
};
|
|
62
63
|
return document.addEventListener("keydown", a), () => document.removeEventListener("keydown", a);
|
|
63
64
|
}), !o) return null;
|
|
64
65
|
const m = j ?? w ?? z.translate?.(
|
|
65
66
|
`modalTitle${l[0].toUpperCase()}${l.slice(1)}`,
|
|
66
67
|
l === "success" ? "Başarılı" : l === "error" || l === "danger" ? "Hata" : "Bilgi"
|
|
67
|
-
), B = q ?? z.assets?.maximize,
|
|
68
|
+
), B = q ?? z.assets?.maximize, ae = !J && (p !== void 0 || r !== void 0 || !!(t && c) || !!(n && s));
|
|
68
69
|
return /* @__PURE__ */ e(
|
|
69
70
|
"div",
|
|
70
71
|
{
|
|
71
|
-
className: u("inconel-modal-backdrop",
|
|
72
|
+
className: u("inconel-modal-backdrop", X),
|
|
72
73
|
role: "presentation",
|
|
73
74
|
onMouseDown: (a) => {
|
|
74
75
|
_ !== "static" && _ !== !1 && I && a.target === a.currentTarget && d();
|
|
@@ -83,16 +84,16 @@ function ve({
|
|
|
83
84
|
`inconel-modal--${l}`,
|
|
84
85
|
U && "inconel-modal--centered",
|
|
85
86
|
A && "inconel-modal--scrollable",
|
|
86
|
-
(
|
|
87
|
+
(T || v) && "inconel-is-maximized",
|
|
87
88
|
v && "inconel-is-full-size",
|
|
88
|
-
|
|
89
|
-
|
|
89
|
+
W,
|
|
90
|
+
Z
|
|
90
91
|
),
|
|
91
92
|
role: "dialog",
|
|
92
93
|
"aria-modal": "true",
|
|
93
94
|
"aria-label": typeof m == "string" ? m : void 0,
|
|
94
95
|
children: [
|
|
95
|
-
/* @__PURE__ */ i("header", { className: "inconel-modal__header", children: [
|
|
96
|
+
!G && /* @__PURE__ */ i("header", { className: "inconel-modal__header", children: [
|
|
96
97
|
/* @__PURE__ */ e("div", { className: "inconel-modal__title", children: m }),
|
|
97
98
|
/* @__PURE__ */ i("div", { className: "inconel-modal__header-actions", children: [
|
|
98
99
|
S && /* @__PURE__ */ e(
|
|
@@ -100,9 +101,9 @@ function ve({
|
|
|
100
101
|
{
|
|
101
102
|
type: "button",
|
|
102
103
|
className: "inconel-modal__maximize",
|
|
103
|
-
onClick: () =>
|
|
104
|
+
onClick: () => ee((a) => !a),
|
|
104
105
|
"aria-label": "Büyüt",
|
|
105
|
-
children: B ? /* @__PURE__ */ e(
|
|
106
|
+
children: B ? /* @__PURE__ */ e(te, { src: B }) : "□"
|
|
106
107
|
}
|
|
107
108
|
),
|
|
108
109
|
E && /* @__PURE__ */ e(
|
|
@@ -117,12 +118,12 @@ function ve({
|
|
|
117
118
|
)
|
|
118
119
|
] })
|
|
119
120
|
] }),
|
|
120
|
-
f && /* @__PURE__ */ e("div", { className: u("inconel-modal__content",
|
|
121
|
-
|
|
121
|
+
f && /* @__PURE__ */ e("div", { className: u("inconel-modal__content", Y), children: f }),
|
|
122
|
+
ae && /* @__PURE__ */ e("footer", { className: "inconel-modal__footer", children: p ?? (r !== void 0 ? re.toArray(r) : /* @__PURE__ */ i(oe, { children: [
|
|
122
123
|
t && c && /* @__PURE__ */ e(
|
|
123
124
|
$,
|
|
124
125
|
{
|
|
125
|
-
type:
|
|
126
|
+
type: P,
|
|
126
127
|
variant: "secondary",
|
|
127
128
|
onClick: c,
|
|
128
129
|
children: t
|
|
@@ -131,7 +132,7 @@ function ve({
|
|
|
131
132
|
n && s && /* @__PURE__ */ e(
|
|
132
133
|
$,
|
|
133
134
|
{
|
|
134
|
-
type:
|
|
135
|
+
type: K,
|
|
135
136
|
buttonType: "success",
|
|
136
137
|
onClick: s,
|
|
137
138
|
children: n
|
|
@@ -145,6 +146,6 @@ function ve({
|
|
|
145
146
|
);
|
|
146
147
|
}
|
|
147
148
|
export {
|
|
148
|
-
|
|
149
|
+
he as Modal
|
|
149
150
|
};
|
|
150
151
|
//# sourceMappingURL=Modal.js.map
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"Modal.js","sources":["../../../src/components/Modal/Modal.tsx"],"sourcesContent":["import {\n Children,\n useEffect,\n useState,\n type ButtonHTMLAttributes,\n type ReactNode,\n} from 'react'\n\nimport { useInconelAdapters } from '../../adapters'\nimport { Button } from '../Button'\nimport { classNames } from '../shared/classNames'\nimport { Svg } from '../Svg'\nimport { DEFAULT_MODAL_CLOSE_LABEL } from './constants'\nimport './styles.css'\n\nexport interface ModalProps {\n id?: string | null\n open?: boolean\n show?: boolean\n title?: ReactNode\n modalTitle?: ReactNode\n modalType?: 'info' | 'success' | 'error' | 'danger' | 'warning'\n children?: ReactNode\n footer?: ReactNode\n customButtons?: ReactNode\n closeLabel?: string\n closeButton?: boolean\n closeOnBackdrop?: boolean\n backdrop?: 'static' | boolean\n keyboard?: boolean\n centered?: boolean\n scrollable?: boolean\n size?: string\n maximize?: boolean\n maximizeIcon?: string\n fullSize?: boolean\n hideFooter?: boolean\n okText?: ReactNode\n okAction?: () => void\n okButtonType?: ButtonHTMLAttributes<HTMLButtonElement>['type']\n okButtonVariant?: string\n cancelText?: ReactNode\n cancelAction?: () => void\n cancelButtonType?: ButtonHTMLAttributes<HTMLButtonElement>['type']\n onClose?: () => void\n onHide?: () => void\n onShow?: () => void\n onEnter?: () => void\n onEntering?: () => void\n onEntered?: () => void\n onExit?: () => void\n onExiting?: () => void\n onExited?: () => void\n onEscapeKeyDown?: () => void\n dialogClassName?: string\n backdropClassName?: string\n bodyClassName?: string\n className?: string | null\n enforceFocus?: boolean\n}\n\nexport function Modal({\n id,\n open,\n show,\n title,\n modalTitle,\n modalType = 'info',\n children,\n footer,\n customButtons,\n closeLabel = DEFAULT_MODAL_CLOSE_LABEL,\n closeButton = true,\n closeOnBackdrop = true,\n backdrop = true,\n keyboard = true,\n centered = true,\n scrollable = true,\n size = 'md',\n maximize = false,\n maximizeIcon,\n fullSize = false,\n hideFooter = false,\n okText,\n okAction,\n okButtonType = 'button',\n cancelText,\n cancelAction,\n cancelButtonType = 'button',\n onClose,\n onHide,\n onShow,\n onEnter,\n onEntering,\n onEntered,\n onExit,\n onExiting,\n onExited,\n onEscapeKeyDown,\n dialogClassName,\n backdropClassName,\n bodyClassName,\n className,\n}: ModalProps) {\n const adapters = useInconelAdapters()\n const [maximized, setMaximized] = useState(false)\n const visible = open ?? show ?? false\n const close = () => {\n onClose?.()\n onHide?.()\n }\n\n useEffect(() => {\n if (visible) {\n onEnter?.()\n onEntering?.()\n onShow?.()\n onEntered?.()\n } else {\n onExit?.()\n onExiting?.()\n onExited?.()\n }\n }, [visible, onEnter, onEntered, onEntering, onExit, onExited, onExiting, onShow])\n\n useEffect(() => {\n if (!visible || !keyboard) return\n const handleEscape = (event: KeyboardEvent) => {\n if (event.key !== 'Escape') return\n onEscapeKeyDown?.()\n close()\n }\n document.addEventListener('keydown', handleEscape)\n return () => document.removeEventListener('keydown', handleEscape)\n })\n\n if (!visible) return null\n\n const resolvedTitle =\n title ??\n modalTitle ??\n adapters.translate?.(\n `modalTitle${modalType[0].toUpperCase()}${modalType.slice(1)}`,\n modalType === 'success'\n ? 'Başarılı'\n : modalType === 'error' || modalType === 'danger'\n ? 'Hata'\n : 'Bilgi',\n )\n const resolvedMaximizeIcon = maximizeIcon ?? adapters.assets?.maximize\n const hasFooter =\n !hideFooter &&\n (footer !== undefined ||\n customButtons !== undefined ||\n Boolean(cancelText && cancelAction) ||\n Boolean(okText && okAction))\n\n return (\n <div\n className={classNames('inconel-modal-backdrop', backdropClassName)}\n role=\"presentation\"\n onMouseDown={(event) => {\n if (\n backdrop !== 'static' &&\n backdrop !== false &&\n closeOnBackdrop &&\n event.target === event.currentTarget\n ) {\n close()\n }\n }}\n >\n <section\n id={id ?? undefined}\n className={classNames(\n 'inconel-modal',\n `inconel-modal--${size}`,\n `inconel-modal--${modalType}`,\n centered && 'inconel-modal--centered',\n scrollable && 'inconel-modal--scrollable',\n (maximized || fullSize) && 'inconel-is-maximized',\n fullSize && 'inconel-is-full-size',\n dialogClassName,\n className,\n )}\n role=\"dialog\"\n aria-modal=\"true\"\n aria-label={typeof resolvedTitle === 'string' ? resolvedTitle : undefined}\n >\n <header className=\"inconel-modal__header\">\n <div className=\"inconel-modal__title\">{resolvedTitle}</div>\n <div className=\"inconel-modal__header-actions\">\n {maximize && (\n <button\n type=\"button\"\n className=\"inconel-modal__maximize\"\n onClick={() => setMaximized((current) => !current)}\n aria-label=\"Büyüt\"\n >\n {resolvedMaximizeIcon ? (\n <Svg src={resolvedMaximizeIcon} />\n ) : (\n '□'\n )}\n </button>\n )}\n {closeButton && (\n <button\n type=\"button\"\n className=\"inconel-modal__close\"\n aria-label={closeLabel}\n onClick={close}\n >\n ×\n </button>\n )}\n </div>\n </header>\n {children && (\n <div className={classNames('inconel-modal__content', bodyClassName)}>\n {children}\n </div>\n )}\n {hasFooter && (\n <footer className=\"inconel-modal__footer\">\n {footer ??\n (customButtons !== undefined ? (\n Children.toArray(customButtons)\n ) : (\n <>\n {cancelText && cancelAction && (\n <Button\n type={cancelButtonType}\n variant=\"secondary\"\n onClick={cancelAction}\n >\n {cancelText}\n </Button>\n )}\n {okText && okAction && (\n <Button\n type={okButtonType}\n buttonType=\"success\"\n onClick={okAction}\n >\n {okText}\n </Button>\n )}\n </>\n ))}\n </footer>\n )}\n </section>\n </div>\n )\n}\n"],"names":["Modal","id","open","show","title","modalTitle","modalType","children","footer","customButtons","closeLabel","DEFAULT_MODAL_CLOSE_LABEL","closeButton","closeOnBackdrop","backdrop","keyboard","centered","scrollable","size","maximize","maximizeIcon","fullSize","hideFooter","okText","okAction","okButtonType","cancelText","cancelAction","cancelButtonType","onClose","onHide","onShow","onEnter","onEntering","onEntered","onExit","onExiting","onExited","onEscapeKeyDown","dialogClassName","backdropClassName","bodyClassName","className","adapters","useInconelAdapters","maximized","setMaximized","useState","visible","close","useEffect","handleEscape","event","resolvedTitle","resolvedMaximizeIcon","hasFooter","jsx","classNames","jsxs","current","Svg","Children","Fragment","Button"],"mappings":"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"}
|
|
1
|
+
{"version":3,"file":"Modal.js","sources":["../../../src/components/Modal/Modal.tsx"],"sourcesContent":["import {\n Children,\n useEffect,\n useState,\n type ButtonHTMLAttributes,\n type ReactNode,\n} from 'react'\n\nimport { useInconelAdapters } from '../../adapters'\nimport { Button } from '../Button'\nimport { classNames } from '../shared/classNames'\nimport { Svg } from '../Svg'\nimport { DEFAULT_MODAL_CLOSE_LABEL } from './constants'\nimport './styles.css'\n\nexport interface ModalProps {\n id?: string | null\n open?: boolean\n show?: boolean\n title?: ReactNode\n modalTitle?: ReactNode\n modalType?: 'info' | 'success' | 'error' | 'danger' | 'warning'\n children?: ReactNode\n footer?: ReactNode\n customButtons?: ReactNode\n closeLabel?: string\n closeButton?: boolean\n closeOnBackdrop?: boolean\n backdrop?: 'static' | boolean\n keyboard?: boolean\n centered?: boolean\n scrollable?: boolean\n size?: string\n maximize?: boolean\n maximizeIcon?: string\n fullSize?: boolean\n hideHeader?: boolean\n hideFooter?: boolean\n okText?: ReactNode\n okAction?: () => void\n okButtonType?: ButtonHTMLAttributes<HTMLButtonElement>['type']\n okButtonVariant?: string\n cancelText?: ReactNode\n cancelAction?: () => void\n cancelButtonType?: ButtonHTMLAttributes<HTMLButtonElement>['type']\n onClose?: () => void\n onHide?: () => void\n onShow?: () => void\n onEnter?: () => void\n onEntering?: () => void\n onEntered?: () => void\n onExit?: () => void\n onExiting?: () => void\n onExited?: () => void\n onEscapeKeyDown?: () => void\n dialogClassName?: string\n backdropClassName?: string\n bodyClassName?: string\n className?: string | null\n enforceFocus?: boolean\n}\n\nexport function Modal({\n id,\n open,\n show,\n title,\n modalTitle,\n modalType = 'info',\n children,\n footer,\n customButtons,\n closeLabel = DEFAULT_MODAL_CLOSE_LABEL,\n closeButton = true,\n closeOnBackdrop = true,\n backdrop = true,\n keyboard = true,\n centered = true,\n scrollable = true,\n size = 'md',\n maximize = false,\n maximizeIcon,\n fullSize = false,\n hideHeader = false,\n hideFooter = false,\n okText,\n okAction,\n okButtonType = 'button',\n cancelText,\n cancelAction,\n cancelButtonType = 'button',\n onClose,\n onHide,\n onShow,\n onEnter,\n onEntering,\n onEntered,\n onExit,\n onExiting,\n onExited,\n onEscapeKeyDown,\n dialogClassName,\n backdropClassName,\n bodyClassName,\n className,\n}: ModalProps) {\n const adapters = useInconelAdapters()\n const [maximized, setMaximized] = useState(false)\n const visible = open ?? show ?? false\n const close = () => {\n onClose?.()\n onHide?.()\n }\n\n useEffect(() => {\n if (visible) {\n onEnter?.()\n onEntering?.()\n onShow?.()\n onEntered?.()\n } else {\n onExit?.()\n onExiting?.()\n onExited?.()\n }\n }, [visible, onEnter, onEntered, onEntering, onExit, onExited, onExiting, onShow])\n\n useEffect(() => {\n if (!visible || !keyboard) return\n const handleEscape = (event: KeyboardEvent) => {\n if (event.key !== 'Escape') return\n onEscapeKeyDown?.()\n close()\n }\n document.addEventListener('keydown', handleEscape)\n return () => document.removeEventListener('keydown', handleEscape)\n })\n\n if (!visible) return null\n\n const resolvedTitle =\n title ??\n modalTitle ??\n adapters.translate?.(\n `modalTitle${modalType[0].toUpperCase()}${modalType.slice(1)}`,\n modalType === 'success'\n ? 'Başarılı'\n : modalType === 'error' || modalType === 'danger'\n ? 'Hata'\n : 'Bilgi',\n )\n const resolvedMaximizeIcon = maximizeIcon ?? adapters.assets?.maximize\n const hasFooter =\n !hideFooter &&\n (footer !== undefined ||\n customButtons !== undefined ||\n Boolean(cancelText && cancelAction) ||\n Boolean(okText && okAction))\n\n return (\n <div\n className={classNames('inconel-modal-backdrop', backdropClassName)}\n role=\"presentation\"\n onMouseDown={(event) => {\n if (\n backdrop !== 'static' &&\n backdrop !== false &&\n closeOnBackdrop &&\n event.target === event.currentTarget\n ) {\n close()\n }\n }}\n >\n <section\n id={id ?? undefined}\n className={classNames(\n 'inconel-modal',\n `inconel-modal--${size}`,\n `inconel-modal--${modalType}`,\n centered && 'inconel-modal--centered',\n scrollable && 'inconel-modal--scrollable',\n (maximized || fullSize) && 'inconel-is-maximized',\n fullSize && 'inconel-is-full-size',\n dialogClassName,\n className,\n )}\n role=\"dialog\"\n aria-modal=\"true\"\n aria-label={typeof resolvedTitle === 'string' ? resolvedTitle : undefined}\n >\n {!hideHeader && (\n <header className=\"inconel-modal__header\">\n <div className=\"inconel-modal__title\">{resolvedTitle}</div>\n <div className=\"inconel-modal__header-actions\">\n {maximize && (\n <button\n type=\"button\"\n className=\"inconel-modal__maximize\"\n onClick={() => setMaximized((current) => !current)}\n aria-label=\"Büyüt\"\n >\n {resolvedMaximizeIcon ? (\n <Svg src={resolvedMaximizeIcon} />\n ) : (\n '□'\n )}\n </button>\n )}\n {closeButton && (\n <button\n type=\"button\"\n className=\"inconel-modal__close\"\n aria-label={closeLabel}\n onClick={close}\n >\n ×\n </button>\n )}\n </div>\n </header>\n )}\n {children && (\n <div className={classNames('inconel-modal__content', bodyClassName)}>\n {children}\n </div>\n )}\n {hasFooter && (\n <footer className=\"inconel-modal__footer\">\n {footer ??\n (customButtons !== undefined ? (\n Children.toArray(customButtons)\n ) : (\n <>\n {cancelText && cancelAction && (\n <Button\n type={cancelButtonType}\n variant=\"secondary\"\n onClick={cancelAction}\n >\n {cancelText}\n </Button>\n )}\n {okText && okAction && (\n <Button\n type={okButtonType}\n buttonType=\"success\"\n onClick={okAction}\n >\n {okText}\n </Button>\n )}\n </>\n ))}\n </footer>\n )}\n </section>\n </div>\n )\n}\n"],"names":["Modal","id","open","show","title","modalTitle","modalType","children","footer","customButtons","closeLabel","DEFAULT_MODAL_CLOSE_LABEL","closeButton","closeOnBackdrop","backdrop","keyboard","centered","scrollable","size","maximize","maximizeIcon","fullSize","hideHeader","hideFooter","okText","okAction","okButtonType","cancelText","cancelAction","cancelButtonType","onClose","onHide","onShow","onEnter","onEntering","onEntered","onExit","onExiting","onExited","onEscapeKeyDown","dialogClassName","backdropClassName","bodyClassName","className","adapters","useInconelAdapters","maximized","setMaximized","useState","visible","close","useEffect","handleEscape","event","resolvedTitle","resolvedMaximizeIcon","hasFooter","jsx","classNames","jsxs","current","Svg","Children","Fragment","Button"],"mappings":"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"}
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"MultiSelectCheckBox.d.ts","sourceRoot":"","sources":["../../../src/components/MultiSelectCheckBox/MultiSelectCheckBox.tsx"],"names":[],"mappings":"AAAA,OAAO,EAUL,KAAK,SAAS,EAEf,MAAM,OAAO,CAAA;AAKd,OAAO,cAAc,CAAA;AAErB,MAAM,WAAW,yBAAyB;IACxC,CAAC,GAAG,EAAE,MAAM,GAAG,OAAO,CAAA;CACvB;AAED,MAAM,WAAW,wBAAwB,CACvC,CAAC,SAAS,yBAAyB,GAAG,yBAAyB;IAE/D,EAAE,CAAC,EAAE,MAAM,GAAG,IAAI,CAAA;IAClB,KAAK,CAAC,EAAE,SAAS,CAAA;IACjB,SAAS,CAAC,EAAE,MAAM,GAAG,IAAI,CAAA;IACzB,cAAc,CAAC,EAAE,MAAM,GAAG,IAAI,CAAA;IAC9B,cAAc,CAAC,EAAE,MAAM,GAAG,IAAI,CAAA;IAC9B,gBAAgB,CAAC,EAAE,MAAM,GAAG,IAAI,CAAA;IAChC,mBAAmB,CAAC,EAAE,MAAM,GAAG,IAAI,CAAA;IACnC,wBAAwB,CAAC,EAAE,MAAM,GAAG,IAAI,CAAA;IACxC,OAAO,CAAC,EAAE,CAAC,EAAE,CAAA;IACb,sBAAsB,CAAC,EAAE,CAAC,EAAE,CAAA;IAC5B,WAAW,CAAC,EAAE,MAAM,CAAA;IACpB,WAAW,CAAC,EAAE,MAAM,CAAA;IACpB,QAAQ,CAAC,EAAE,CAAC,QAAQ,EAAE,CAAC,EAAE,KAAK,IAAI,CAAA;IAClC,WAAW,CAAC,EAAE,MAAM,CAAA;IACpB,oBAAoB,CAAC,EAAE,MAAM,CAAA;IAC7B,gBAAgB,CAAC,EAAE,MAAM,CAAA;IACzB,aAAa,CAAC,EAAE,MAAM,CAAA;IACtB,iBAAiB,CAAC,EAAE,MAAM,CAAA;IAC1B,aAAa,CAAC,EAAE,MAAM,CAAA;IACtB,YAAY,CAAC,EAAE,MAAM,CAAA;IACrB,UAAU,CAAC,EAAE,IAAI,GAAG,KAAK,CAAA;IACzB,YAAY,CAAC,EAAE,OAAO,CAAA;IACtB,SAAS,CAAC,EAAE,OAAO,CAAA;IACnB,UAAU,CAAC,EAAE,OAAO,CAAA;IACpB,WAAW,CAAC,EAAE,OAAO,CAAA;IACrB,cAAc,CAAC,EAAE,OAAO,CAAA;IACxB,YAAY,CAAC,EAAE,MAAM,CAAA;IACrB,WAAW,CAAC,EAAE,CAAC,MAAM,EAAE,OAAO,KAAK,IAAI,CAAA;IACvC,WAAW,CAAC,EAAE,CAAC,GAAG,EAAE,OAAO,KAAK,IAAI,CAAA;IACpC,gBAAgB,CAAC,EAAE,CAAC,MAAM,EAAE,CAAC,KAAK,MAAM,GAAG,SAAS,CAAA;IACpD,KAAK,CAAC,EAAE,MAAM,GAAG,IAAI,CAAA;IACrB,cAAc,CAAC,EAAE,MAAM,GAAG,IAAI,CAAA;CAC/B;AAcD,wBAAgB,mBAAmB,CACjC,CAAC,SAAS,yBAAyB,GAAG,yBAAyB,EAC/D,EACA,EAAS,EACT,KAAY,EACZ,SAAgB,EAChB,cAAqB,EACrB,cAAqB,EACrB,gBAAuB,EACvB,mBAA0B,EAC1B,wBAA+B,EAC/B,OAAuB,EACvB,sBAAsC,EACtC,WAAqB,EACrB,WAAqB,EACrB,QAAQ,EACR,WAAuB,EACvB,oBAAoB,EACpB,gBAA+B,EAC/B,aAA4B,EAC5B,iBAAyB,EACzB,aAAiC,EACjC,YAAiB,EACjB,UAAkB,EAClB,YAAoB,EACpB,SAAiB,EACjB,UAAkB,EAClB,WAAmB,EACnB,cAAsB,EACtB,YAAkB,EAClB,WAAW,EACX,WAAW,EACX,gBACkE,EAClE,KAAY,EACZ,cAAqB,GACtB,EAAE,wBAAwB,CAAC,CAAC,CAAC,+
|
|
1
|
+
{"version":3,"file":"MultiSelectCheckBox.d.ts","sourceRoot":"","sources":["../../../src/components/MultiSelectCheckBox/MultiSelectCheckBox.tsx"],"names":[],"mappings":"AAAA,OAAO,EAUL,KAAK,SAAS,EAEf,MAAM,OAAO,CAAA;AAKd,OAAO,cAAc,CAAA;AAErB,MAAM,WAAW,yBAAyB;IACxC,CAAC,GAAG,EAAE,MAAM,GAAG,OAAO,CAAA;CACvB;AAED,MAAM,WAAW,wBAAwB,CACvC,CAAC,SAAS,yBAAyB,GAAG,yBAAyB;IAE/D,EAAE,CAAC,EAAE,MAAM,GAAG,IAAI,CAAA;IAClB,KAAK,CAAC,EAAE,SAAS,CAAA;IACjB,SAAS,CAAC,EAAE,MAAM,GAAG,IAAI,CAAA;IACzB,cAAc,CAAC,EAAE,MAAM,GAAG,IAAI,CAAA;IAC9B,cAAc,CAAC,EAAE,MAAM,GAAG,IAAI,CAAA;IAC9B,gBAAgB,CAAC,EAAE,MAAM,GAAG,IAAI,CAAA;IAChC,mBAAmB,CAAC,EAAE,MAAM,GAAG,IAAI,CAAA;IACnC,wBAAwB,CAAC,EAAE,MAAM,GAAG,IAAI,CAAA;IACxC,OAAO,CAAC,EAAE,CAAC,EAAE,CAAA;IACb,sBAAsB,CAAC,EAAE,CAAC,EAAE,CAAA;IAC5B,WAAW,CAAC,EAAE,MAAM,CAAA;IACpB,WAAW,CAAC,EAAE,MAAM,CAAA;IACpB,QAAQ,CAAC,EAAE,CAAC,QAAQ,EAAE,CAAC,EAAE,KAAK,IAAI,CAAA;IAClC,WAAW,CAAC,EAAE,MAAM,CAAA;IACpB,oBAAoB,CAAC,EAAE,MAAM,CAAA;IAC7B,gBAAgB,CAAC,EAAE,MAAM,CAAA;IACzB,aAAa,CAAC,EAAE,MAAM,CAAA;IACtB,iBAAiB,CAAC,EAAE,MAAM,CAAA;IAC1B,aAAa,CAAC,EAAE,MAAM,CAAA;IACtB,YAAY,CAAC,EAAE,MAAM,CAAA;IACrB,UAAU,CAAC,EAAE,IAAI,GAAG,KAAK,CAAA;IACzB,YAAY,CAAC,EAAE,OAAO,CAAA;IACtB,SAAS,CAAC,EAAE,OAAO,CAAA;IACnB,UAAU,CAAC,EAAE,OAAO,CAAA;IACpB,WAAW,CAAC,EAAE,OAAO,CAAA;IACrB,cAAc,CAAC,EAAE,OAAO,CAAA;IACxB,YAAY,CAAC,EAAE,MAAM,CAAA;IACrB,WAAW,CAAC,EAAE,CAAC,MAAM,EAAE,OAAO,KAAK,IAAI,CAAA;IACvC,WAAW,CAAC,EAAE,CAAC,GAAG,EAAE,OAAO,KAAK,IAAI,CAAA;IACpC,gBAAgB,CAAC,EAAE,CAAC,MAAM,EAAE,CAAC,KAAK,MAAM,GAAG,SAAS,CAAA;IACpD,KAAK,CAAC,EAAE,MAAM,GAAG,IAAI,CAAA;IACrB,cAAc,CAAC,EAAE,MAAM,GAAG,IAAI,CAAA;CAC/B;AAcD,wBAAgB,mBAAmB,CACjC,CAAC,SAAS,yBAAyB,GAAG,yBAAyB,EAC/D,EACA,EAAS,EACT,KAAY,EACZ,SAAgB,EAChB,cAAqB,EACrB,cAAqB,EACrB,gBAAuB,EACvB,mBAA0B,EAC1B,wBAA+B,EAC/B,OAAuB,EACvB,sBAAsC,EACtC,WAAqB,EACrB,WAAqB,EACrB,QAAQ,EACR,WAAuB,EACvB,oBAAoB,EACpB,gBAA+B,EAC/B,aAA4B,EAC5B,iBAAyB,EACzB,aAAiC,EACjC,YAAiB,EACjB,UAAkB,EAClB,YAAoB,EACpB,SAAiB,EACjB,UAAkB,EAClB,WAAmB,EACnB,cAAsB,EACtB,YAAkB,EAClB,WAAW,EACX,WAAW,EACX,gBACkE,EAClE,KAAY,EACZ,cAAqB,GACtB,EAAE,wBAAwB,CAAC,CAAC,CAAC,+BA4Y7B"}
|
|
@@ -1,242 +1,255 @@
|
|
|
1
|
-
import { jsx as
|
|
2
|
-
import { useRef as
|
|
3
|
-
import { createPortal as
|
|
4
|
-
import { classNames as
|
|
1
|
+
import { jsx as c, jsxs as v } from "react/jsx-runtime";
|
|
2
|
+
import { useRef as I, useState as _, useCallback as p, useEffect as T, useLayoutEffect as ie, useMemo as j } from "react";
|
|
3
|
+
import { createPortal as Le } from "react-dom";
|
|
4
|
+
import { classNames as a } from "../shared/classNames.js";
|
|
5
5
|
/* empty css */
|
|
6
|
-
import { DotLoader as
|
|
7
|
-
const
|
|
8
|
-
function
|
|
9
|
-
return
|
|
10
|
-
(
|
|
6
|
+
import { DotLoader as Re } from "../DotLoader/DotLoader.js";
|
|
7
|
+
const oe = [];
|
|
8
|
+
function $(k, w, y) {
|
|
9
|
+
return k.some(
|
|
10
|
+
(A) => A?.[y] === w?.[y]
|
|
11
11
|
);
|
|
12
12
|
}
|
|
13
|
-
function
|
|
14
|
-
id:
|
|
15
|
-
label:
|
|
16
|
-
className:
|
|
17
|
-
labelClassName:
|
|
18
|
-
inputClassName:
|
|
19
|
-
optionsClassName:
|
|
20
|
-
optionItemClassName:
|
|
21
|
-
searchableInputClassName:
|
|
22
|
-
options:
|
|
23
|
-
defaultSelectedOptions:
|
|
24
|
-
optionLabel:
|
|
25
|
-
optionValue:
|
|
26
|
-
onChange:
|
|
27
|
-
placeholder:
|
|
28
|
-
selectedInputMessage:
|
|
29
|
-
itemSelectedText:
|
|
30
|
-
selectAllText:
|
|
31
|
-
searchPlaceholder:
|
|
32
|
-
noDataMessage:
|
|
33
|
-
errorMessage:
|
|
34
|
-
errorPlace:
|
|
35
|
-
isSearchable:
|
|
36
|
-
isLoading:
|
|
37
|
-
isDisabled:
|
|
13
|
+
function Be({
|
|
14
|
+
id: k = null,
|
|
15
|
+
label: w = null,
|
|
16
|
+
className: y = null,
|
|
17
|
+
labelClassName: A = null,
|
|
18
|
+
inputClassName: se = null,
|
|
19
|
+
optionsClassName: re = null,
|
|
20
|
+
optionItemClassName: K = null,
|
|
21
|
+
searchableInputClassName: ue = null,
|
|
22
|
+
options: N = oe,
|
|
23
|
+
defaultSelectedOptions: S = oe,
|
|
24
|
+
optionLabel: g = "label",
|
|
25
|
+
optionValue: l = "value",
|
|
26
|
+
onChange: q,
|
|
27
|
+
placeholder: P = "Seçiniz",
|
|
28
|
+
selectedInputMessage: W,
|
|
29
|
+
itemSelectedText: Y = "öğe seçili",
|
|
30
|
+
selectAllText: ae = "Tümünü Seç",
|
|
31
|
+
searchPlaceholder: de = "Ara",
|
|
32
|
+
noDataMessage: me = "Veri bulunamadı",
|
|
33
|
+
errorMessage: E = "",
|
|
34
|
+
errorPlace: G = "out",
|
|
35
|
+
isSearchable: z = !1,
|
|
36
|
+
isLoading: he = !1,
|
|
37
|
+
isDisabled: f = !1,
|
|
38
38
|
reactPortal: i = !1,
|
|
39
|
-
windowPosition:
|
|
40
|
-
windowHeight:
|
|
41
|
-
windowClose:
|
|
42
|
-
isScrollEnd:
|
|
43
|
-
getOptionTooltip:
|
|
44
|
-
limit:
|
|
45
|
-
selectionLimit:
|
|
39
|
+
windowPosition: J = !1,
|
|
40
|
+
windowHeight: M = 800,
|
|
41
|
+
windowClose: Q,
|
|
42
|
+
isScrollEnd: U,
|
|
43
|
+
getOptionTooltip: pe = (x) => typeof x?.tooltip == "string" ? x.tooltip : void 0,
|
|
44
|
+
limit: fe = null,
|
|
45
|
+
selectionLimit: be = null
|
|
46
46
|
}) {
|
|
47
|
-
const x =
|
|
48
|
-
|
|
49
|
-
), [
|
|
47
|
+
const x = I(null), L = I(null), X = I(null), [s, Z] = _(!1), [t, V] = _(
|
|
48
|
+
S
|
|
49
|
+
), [R, ee] = _(
|
|
50
50
|
null
|
|
51
|
-
), [
|
|
52
|
-
if (
|
|
53
|
-
|
|
54
|
-
|
|
51
|
+
), [B, te] = _(""), [ve, _e] = _(null), [ge, ne] = _(!1), r = Number(fe ?? be), d = Number.isFinite(r) && r > 0, O = p(() => {
|
|
52
|
+
if (J) {
|
|
53
|
+
ee(Number(M) < 800 ? "top" : "bottom");
|
|
54
|
+
return;
|
|
55
|
+
}
|
|
56
|
+
const e = L.current;
|
|
57
|
+
if (!e) return;
|
|
58
|
+
const n = e.getBoundingClientRect(), o = window.innerHeight - n.bottom, u = n.top, h = 240 + (z ? 46 : 0) + 40;
|
|
59
|
+
ee(
|
|
60
|
+
o < h && u > o ? "top" : "bottom"
|
|
61
|
+
);
|
|
62
|
+
}, [z, M, J]), C = p(() => {
|
|
63
|
+
if (!i || !L.current) return;
|
|
64
|
+
const e = L.current.getBoundingClientRect();
|
|
65
|
+
_e({
|
|
55
66
|
position: "fixed",
|
|
56
67
|
left: e.left,
|
|
57
|
-
top: e.bottom,
|
|
68
|
+
top: R === "top" ? e.top : e.bottom,
|
|
58
69
|
width: e.width,
|
|
59
70
|
zIndex: 9999
|
|
60
|
-
}),
|
|
61
|
-
}, [i]);
|
|
62
|
-
|
|
63
|
-
const e =
|
|
64
|
-
|
|
65
|
-
}, [
|
|
66
|
-
|
|
67
|
-
}, [
|
|
68
|
-
if (!
|
|
69
|
-
const e = x.current,
|
|
70
|
-
const
|
|
71
|
-
!
|
|
71
|
+
}), ne(!0);
|
|
72
|
+
}, [i, R]);
|
|
73
|
+
T(() => {
|
|
74
|
+
const e = d ? S.slice(0, r) : S;
|
|
75
|
+
V(e);
|
|
76
|
+
}, [S, d, r]), T(() => {
|
|
77
|
+
s || (Q?.(!0), te(""));
|
|
78
|
+
}, [s, Q]), T(() => {
|
|
79
|
+
if (!s) return;
|
|
80
|
+
const e = x.current, n = X.current, o = (u) => {
|
|
81
|
+
const h = u.target, D = e?.contains(h), Ee = n?.contains(h);
|
|
82
|
+
!D && !Ee && Z(!1);
|
|
72
83
|
};
|
|
73
|
-
return document.addEventListener("pointerdown",
|
|
74
|
-
}, [
|
|
75
|
-
if (!
|
|
76
|
-
|
|
84
|
+
return document.addEventListener("pointerdown", o, !0), () => document.removeEventListener("pointerdown", o, !0);
|
|
85
|
+
}, [s]), ie(() => {
|
|
86
|
+
if (!s) {
|
|
87
|
+
ne(!1);
|
|
77
88
|
return;
|
|
78
89
|
}
|
|
79
|
-
|
|
80
|
-
}, [
|
|
81
|
-
|
|
82
|
-
|
|
90
|
+
O();
|
|
91
|
+
}, [s, O]), ie(() => {
|
|
92
|
+
!s || !i || C();
|
|
93
|
+
}, [s, i, C]), T(() => {
|
|
94
|
+
if (!s) return;
|
|
95
|
+
const e = () => {
|
|
96
|
+
O(), i && C();
|
|
97
|
+
};
|
|
83
98
|
return window.addEventListener("resize", e), window.addEventListener("scroll", e, !0), () => {
|
|
84
99
|
window.removeEventListener("resize", e), window.removeEventListener("scroll", e, !0);
|
|
85
100
|
};
|
|
86
|
-
}, [
|
|
87
|
-
|
|
88
|
-
}, [G, Y]);
|
|
89
|
-
const f = v(
|
|
101
|
+
}, [s, i, O, C]);
|
|
102
|
+
const b = p(
|
|
90
103
|
(e) => {
|
|
91
|
-
|
|
104
|
+
V(e), q?.(e);
|
|
92
105
|
},
|
|
93
|
-
[
|
|
94
|
-
),
|
|
106
|
+
[q]
|
|
107
|
+
), xe = p(
|
|
95
108
|
(e) => {
|
|
96
|
-
const
|
|
97
|
-
|
|
109
|
+
const n = e.currentTarget;
|
|
110
|
+
n.scrollHeight - n.scrollTop <= n.clientHeight + 1 && U?.(!0);
|
|
98
111
|
},
|
|
99
|
-
[
|
|
100
|
-
),
|
|
112
|
+
[U]
|
|
113
|
+
), ke = p(
|
|
101
114
|
(e) => {
|
|
102
|
-
if (
|
|
103
|
-
|
|
104
|
-
|
|
105
|
-
(
|
|
115
|
+
if ($(t, e, l)) {
|
|
116
|
+
b(
|
|
117
|
+
t.filter(
|
|
118
|
+
(n) => n?.[l] !== e?.[l]
|
|
106
119
|
)
|
|
107
120
|
);
|
|
108
121
|
return;
|
|
109
122
|
}
|
|
110
|
-
|
|
123
|
+
d && t.length >= r || b([...t, e]);
|
|
111
124
|
},
|
|
112
125
|
[
|
|
113
|
-
|
|
114
|
-
|
|
115
|
-
|
|
116
|
-
|
|
117
|
-
|
|
126
|
+
d,
|
|
127
|
+
r,
|
|
128
|
+
l,
|
|
129
|
+
t,
|
|
130
|
+
b
|
|
118
131
|
]
|
|
119
|
-
),
|
|
120
|
-
const e =
|
|
121
|
-
return e ?
|
|
122
|
-
(
|
|
123
|
-
) :
|
|
124
|
-
}, [
|
|
125
|
-
|
|
126
|
-
}, [
|
|
127
|
-
(e.key === "Enter" || e.key === " ") && (e.preventDefault(),
|
|
128
|
-
},
|
|
129
|
-
() =>
|
|
130
|
-
(e) =>
|
|
132
|
+
), m = j(() => {
|
|
133
|
+
const e = B.trim().toLocaleLowerCase();
|
|
134
|
+
return e ? N.filter(
|
|
135
|
+
(n) => String(n?.[g] ?? "").toLocaleLowerCase().includes(e)
|
|
136
|
+
) : N;
|
|
137
|
+
}, [N, g, B]), we = j(() => t.length === 0 ? "" : t.length === 1 ? String(t[0]?.[g] ?? "") : `${t.length} ${W || Y}`, [Y, g, W, t]), ye = G === "in" && E || P, ce = p(() => {
|
|
138
|
+
f || Z((e) => !e);
|
|
139
|
+
}, [f]), Ne = (e) => {
|
|
140
|
+
(e.key === "Enter" || e.key === " ") && (e.preventDefault(), ce());
|
|
141
|
+
}, F = j(
|
|
142
|
+
() => m.length > 0 && m.every(
|
|
143
|
+
(e) => $(t, e, l)
|
|
131
144
|
),
|
|
132
|
-
[
|
|
133
|
-
),
|
|
134
|
-
if (
|
|
135
|
-
|
|
136
|
-
|
|
137
|
-
(
|
|
138
|
-
(
|
|
145
|
+
[m, l, t]
|
|
146
|
+
), Se = p(() => {
|
|
147
|
+
if (F) {
|
|
148
|
+
b(
|
|
149
|
+
t.filter(
|
|
150
|
+
(o) => !m.some(
|
|
151
|
+
(u) => o?.[l] === u?.[l]
|
|
139
152
|
)
|
|
140
153
|
)
|
|
141
154
|
);
|
|
142
155
|
return;
|
|
143
156
|
}
|
|
144
|
-
const e =
|
|
145
|
-
(
|
|
146
|
-
),
|
|
147
|
-
|
|
157
|
+
const e = m.filter(
|
|
158
|
+
(o) => !$(t, o, l)
|
|
159
|
+
), n = d ? e.slice(0, Math.max(r - t.length, 0)) : e;
|
|
160
|
+
b([...t, ...n]);
|
|
148
161
|
}, [
|
|
149
|
-
|
|
162
|
+
F,
|
|
163
|
+
m,
|
|
150
164
|
d,
|
|
151
|
-
|
|
152
|
-
|
|
153
|
-
|
|
154
|
-
|
|
155
|
-
|
|
156
|
-
]), A = y || "inconel-multi-select-checkbox", ne = /* @__PURE__ */ t(
|
|
165
|
+
r,
|
|
166
|
+
l,
|
|
167
|
+
t,
|
|
168
|
+
b
|
|
169
|
+
]), H = k || "inconel-multi-select-checkbox", le = /* @__PURE__ */ c(
|
|
157
170
|
"div",
|
|
158
171
|
{
|
|
159
|
-
ref: i ?
|
|
160
|
-
className:
|
|
172
|
+
ref: i ? X : void 0,
|
|
173
|
+
className: a(
|
|
161
174
|
"inconel-multi-select-checkbox__panel-wrap",
|
|
162
175
|
i && "inconel-multi-select-checkbox__panel-wrap--portal",
|
|
163
|
-
|
|
176
|
+
R === "top" && "inconel-is-open-top"
|
|
164
177
|
),
|
|
165
|
-
style: i ? { ...
|
|
178
|
+
style: i ? { ...ve ?? {}, visibility: ge ? "visible" : "hidden" } : void 0,
|
|
166
179
|
onPointerDown: (e) => e.stopPropagation(),
|
|
167
|
-
children: /* @__PURE__ */
|
|
180
|
+
children: /* @__PURE__ */ v(
|
|
168
181
|
"div",
|
|
169
182
|
{
|
|
170
|
-
className:
|
|
183
|
+
className: a(
|
|
171
184
|
"inconel-multi-select-checkbox__options",
|
|
172
185
|
i && "inconel-multi-select-checkbox__options--portal",
|
|
173
|
-
|
|
186
|
+
re
|
|
174
187
|
),
|
|
175
|
-
onScroll:
|
|
188
|
+
onScroll: xe,
|
|
176
189
|
children: [
|
|
177
|
-
|
|
190
|
+
z && /* @__PURE__ */ c("div", { className: "inconel-multi-select-checkbox__search", children: /* @__PURE__ */ c(
|
|
178
191
|
"input",
|
|
179
192
|
{
|
|
180
193
|
type: "text",
|
|
181
|
-
placeholder:
|
|
182
|
-
className:
|
|
194
|
+
placeholder: de,
|
|
195
|
+
className: a(
|
|
183
196
|
"inconel-multi-select-checkbox__search-input",
|
|
184
|
-
|
|
197
|
+
ue
|
|
185
198
|
),
|
|
186
|
-
value:
|
|
187
|
-
onChange: (e) =>
|
|
188
|
-
disabled:
|
|
199
|
+
value: B,
|
|
200
|
+
onChange: (e) => te(e.target.value),
|
|
201
|
+
disabled: f
|
|
189
202
|
}
|
|
190
203
|
) }),
|
|
191
|
-
/* @__PURE__ */
|
|
204
|
+
/* @__PURE__ */ v(
|
|
192
205
|
"div",
|
|
193
206
|
{
|
|
194
|
-
className:
|
|
207
|
+
className: a(
|
|
195
208
|
"inconel-multi-select-checkbox__option-item",
|
|
196
|
-
|
|
209
|
+
K
|
|
197
210
|
),
|
|
198
211
|
children: [
|
|
199
|
-
/* @__PURE__ */
|
|
212
|
+
/* @__PURE__ */ c(
|
|
200
213
|
"input",
|
|
201
214
|
{
|
|
202
|
-
id: `${
|
|
215
|
+
id: `${H}-select-all`,
|
|
203
216
|
type: "checkbox",
|
|
204
|
-
checked:
|
|
205
|
-
onChange:
|
|
206
|
-
disabled:
|
|
217
|
+
checked: F,
|
|
218
|
+
onChange: Se,
|
|
219
|
+
disabled: f
|
|
207
220
|
}
|
|
208
221
|
),
|
|
209
|
-
/* @__PURE__ */
|
|
222
|
+
/* @__PURE__ */ c("label", { htmlFor: `${H}-select-all`, children: ae })
|
|
210
223
|
]
|
|
211
224
|
}
|
|
212
225
|
),
|
|
213
|
-
|
|
214
|
-
const
|
|
215
|
-
return /* @__PURE__ */
|
|
226
|
+
m.map((e, n) => {
|
|
227
|
+
const o = e?.[l] ?? n, u = $(t, e, l), h = f || !u && d && t.length >= r, D = `${H}-${String(o)}`;
|
|
228
|
+
return /* @__PURE__ */ v(
|
|
216
229
|
"div",
|
|
217
230
|
{
|
|
218
|
-
className:
|
|
231
|
+
className: a(
|
|
219
232
|
"inconel-multi-select-checkbox__option-item",
|
|
220
|
-
|
|
221
|
-
|
|
222
|
-
|
|
233
|
+
u && "inconel-is-selected",
|
|
234
|
+
h && "inconel-is-disabled",
|
|
235
|
+
K
|
|
223
236
|
),
|
|
224
|
-
title:
|
|
237
|
+
title: pe(e),
|
|
225
238
|
children: [
|
|
226
|
-
/* @__PURE__ */
|
|
239
|
+
/* @__PURE__ */ c(
|
|
227
240
|
"input",
|
|
228
241
|
{
|
|
229
|
-
id:
|
|
242
|
+
id: D,
|
|
230
243
|
type: "checkbox",
|
|
231
|
-
checked:
|
|
232
|
-
onChange: () =>
|
|
233
|
-
disabled:
|
|
244
|
+
checked: u,
|
|
245
|
+
onChange: () => ke(e),
|
|
246
|
+
disabled: h
|
|
234
247
|
}
|
|
235
248
|
),
|
|
236
|
-
/* @__PURE__ */
|
|
249
|
+
/* @__PURE__ */ c("label", { htmlFor: D, children: String(e?.[g] ?? "") })
|
|
237
250
|
]
|
|
238
251
|
},
|
|
239
|
-
String(
|
|
252
|
+
String(o)
|
|
240
253
|
);
|
|
241
254
|
})
|
|
242
255
|
]
|
|
@@ -244,55 +257,55 @@ function Ae({
|
|
|
244
257
|
)
|
|
245
258
|
}
|
|
246
259
|
);
|
|
247
|
-
return /* @__PURE__ */
|
|
260
|
+
return /* @__PURE__ */ v(
|
|
248
261
|
"div",
|
|
249
262
|
{
|
|
250
263
|
ref: x,
|
|
251
|
-
id:
|
|
252
|
-
className:
|
|
264
|
+
id: k ?? void 0,
|
|
265
|
+
className: a(
|
|
253
266
|
"inconel-multi-select-checkbox",
|
|
254
|
-
|
|
255
|
-
|
|
256
|
-
|
|
257
|
-
|
|
267
|
+
E && "inconel-is-error",
|
|
268
|
+
f && "inconel-is-disabled",
|
|
269
|
+
R === "top" && !i && "inconel-is-open-top",
|
|
270
|
+
y
|
|
258
271
|
),
|
|
259
272
|
children: [
|
|
260
|
-
|
|
273
|
+
w && /* @__PURE__ */ c(
|
|
261
274
|
"span",
|
|
262
275
|
{
|
|
263
|
-
className:
|
|
276
|
+
className: a(
|
|
264
277
|
"inconel-multi-select-checkbox__label",
|
|
265
|
-
|
|
278
|
+
A
|
|
266
279
|
),
|
|
267
|
-
children:
|
|
280
|
+
children: w
|
|
268
281
|
}
|
|
269
282
|
),
|
|
270
|
-
/* @__PURE__ */
|
|
271
|
-
|
|
272
|
-
/* @__PURE__ */
|
|
283
|
+
/* @__PURE__ */ v("div", { className: "inconel-multi-select-checkbox__input-wrap", children: [
|
|
284
|
+
he && /* @__PURE__ */ c("div", { className: "inconel-multi-select-checkbox__loader-cover", children: /* @__PURE__ */ c(Re, {}) }),
|
|
285
|
+
/* @__PURE__ */ v(
|
|
273
286
|
"div",
|
|
274
287
|
{
|
|
275
|
-
ref:
|
|
288
|
+
ref: L,
|
|
276
289
|
role: "button",
|
|
277
290
|
tabIndex: 0,
|
|
278
291
|
className: "inconel-multi-select-checkbox__input-container",
|
|
279
|
-
onClick:
|
|
280
|
-
onKeyDown:
|
|
292
|
+
onClick: ce,
|
|
293
|
+
onKeyDown: Ne,
|
|
281
294
|
children: [
|
|
282
|
-
/* @__PURE__ */
|
|
295
|
+
/* @__PURE__ */ c(
|
|
283
296
|
"input",
|
|
284
297
|
{
|
|
285
298
|
type: "text",
|
|
286
|
-
className:
|
|
299
|
+
className: a(
|
|
287
300
|
"inconel-multi-select-checkbox__input",
|
|
288
|
-
|
|
301
|
+
se
|
|
289
302
|
),
|
|
290
|
-
placeholder:
|
|
303
|
+
placeholder: ye,
|
|
291
304
|
readOnly: !0,
|
|
292
|
-
value:
|
|
305
|
+
value: we
|
|
293
306
|
}
|
|
294
307
|
),
|
|
295
|
-
/* @__PURE__ */
|
|
308
|
+
/* @__PURE__ */ c(
|
|
296
309
|
"span",
|
|
297
310
|
{
|
|
298
311
|
className: "inconel-multi-select-checkbox__indicator",
|
|
@@ -303,13 +316,13 @@ function Ae({
|
|
|
303
316
|
}
|
|
304
317
|
)
|
|
305
318
|
] }),
|
|
306
|
-
|
|
307
|
-
|
|
319
|
+
s && (N.length > 0 ? i ? Le(le, document.body) : le : /* @__PURE__ */ c("div", { className: "inconel-multi-select-checkbox__nodata", children: /* @__PURE__ */ c("span", { children: me }) })),
|
|
320
|
+
G !== "in" && E && /* @__PURE__ */ c("span", { className: "inconel-multi-select-checkbox__error", children: E })
|
|
308
321
|
]
|
|
309
322
|
}
|
|
310
323
|
);
|
|
311
324
|
}
|
|
312
325
|
export {
|
|
313
|
-
|
|
326
|
+
Be as MultiSelectCheckBox
|
|
314
327
|
};
|
|
315
328
|
//# sourceMappingURL=MultiSelectCheckBox.js.map
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"MultiSelectCheckBox.js","sources":["../../../src/components/MultiSelectCheckBox/MultiSelectCheckBox.tsx"],"sourcesContent":["import {\n useCallback,\n useEffect,\n useLayoutEffect,\n useMemo,\n useRef,\n useState,\n type ChangeEvent,\n type CSSProperties,\n type KeyboardEvent,\n type ReactNode,\n type UIEvent,\n} from 'react'\nimport { createPortal } from 'react-dom'\n\nimport { DotLoader } from '../DotLoader'\nimport { classNames } from '../shared/classNames'\nimport './styles.css'\n\nexport interface MultiSelectCheckBoxOption {\n [key: string]: unknown\n}\n\nexport interface MultiSelectCheckBoxProps<\n T extends MultiSelectCheckBoxOption = MultiSelectCheckBoxOption,\n> {\n id?: string | null\n label?: ReactNode\n className?: string | null\n labelClassName?: string | null\n inputClassName?: string | null\n optionsClassName?: string | null\n optionItemClassName?: string | null\n searchableInputClassName?: string | null\n options?: T[]\n defaultSelectedOptions?: T[]\n optionLabel?: string\n optionValue?: string\n onChange?: (selected: T[]) => void\n placeholder?: string\n selectedInputMessage?: string\n itemSelectedText?: string\n selectAllText?: string\n searchPlaceholder?: string\n noDataMessage?: string\n errorMessage?: string\n errorPlace?: 'in' | 'out'\n isSearchable?: boolean\n isLoading?: boolean\n isDisabled?: boolean\n reactPortal?: boolean\n windowPosition?: boolean\n windowHeight?: number\n windowClose?: (closed: boolean) => void\n isScrollEnd?: (end: boolean) => void\n getOptionTooltip?: (option: T) => string | undefined\n limit?: number | null\n selectionLimit?: number | null\n}\n\nconst EMPTY_OPTIONS: never[] = []\n\nfunction isOptionSelected<T extends MultiSelectCheckBoxOption>(\n selected: T[],\n option: T,\n optionValue: string,\n) {\n return selected.some(\n (item) => item?.[optionValue] === option?.[optionValue],\n )\n}\n\nexport function MultiSelectCheckBox<\n T extends MultiSelectCheckBoxOption = MultiSelectCheckBoxOption,\n>({\n id = null,\n label = null,\n className = null,\n labelClassName = null,\n inputClassName = null,\n optionsClassName = null,\n optionItemClassName = null,\n searchableInputClassName = null,\n options = EMPTY_OPTIONS,\n defaultSelectedOptions = EMPTY_OPTIONS,\n optionLabel = 'label',\n optionValue = 'value',\n onChange,\n placeholder = 'Seçiniz',\n selectedInputMessage,\n itemSelectedText = 'öğe seçili',\n selectAllText = 'Tümünü Seç',\n searchPlaceholder = 'Ara',\n noDataMessage = 'Veri bulunamadı',\n errorMessage = '',\n errorPlace = 'out',\n isSearchable = false,\n isLoading = false,\n isDisabled = false,\n reactPortal = false,\n windowPosition = false,\n windowHeight = 800,\n windowClose,\n isScrollEnd,\n getOptionTooltip = (option: T) =>\n typeof option?.tooltip === 'string' ? option.tooltip : undefined,\n limit = null,\n selectionLimit = null,\n}: MultiSelectCheckBoxProps<T>) {\n const rootRef = useRef<HTMLDivElement>(null)\n const anchorRef = useRef<HTMLDivElement>(null)\n const portalWrapRef = useRef<HTMLDivElement>(null)\n\n const [showOptions, setShowOptions] = useState(false)\n const [selectedOptions, setSelectedOptions] = useState<T[]>(\n defaultSelectedOptions,\n )\n const [openDirection, setOpenDirection] = useState<'top' | 'bottom' | null>(\n null,\n )\n const [searchValue, setSearchValue] = useState('')\n const [portalStyle, setPortalStyle] = useState<CSSProperties | null>(null)\n const [portalReady, setPortalReady] = useState(false)\n\n const selectionLimitValue = limit ?? selectionLimit\n const maxSelectionCount = Number(selectionLimitValue)\n const hasSelectionLimit =\n Number.isFinite(maxSelectionCount) && maxSelectionCount > 0\n\n const recomputePortalPosition = useCallback(() => {\n if (!reactPortal || !anchorRef.current) return\n const rect = anchorRef.current.getBoundingClientRect()\n setPortalStyle({\n position: 'fixed',\n left: rect.left,\n top: rect.bottom,\n width: rect.width,\n zIndex: 9999,\n })\n setPortalReady(true)\n }, [reactPortal])\n\n useEffect(() => {\n const next = hasSelectionLimit\n ? defaultSelectedOptions.slice(0, maxSelectionCount)\n : defaultSelectedOptions\n setSelectedOptions(next)\n }, [defaultSelectedOptions, hasSelectionLimit, maxSelectionCount])\n\n useEffect(() => {\n if (!showOptions) {\n windowClose?.(true)\n setSearchValue('')\n }\n }, [showOptions, windowClose])\n\n useEffect(() => {\n if (!showOptions) return undefined\n\n const rootEl = rootRef.current\n const portalEl = portalWrapRef.current\n\n const handlePointerDown = (event: PointerEvent) => {\n const target = event.target as Node\n const inRoot = rootEl?.contains(target)\n const inPortal = portalEl?.contains(target)\n if (!inRoot && !inPortal) setShowOptions(false)\n }\n\n document.addEventListener('pointerdown', handlePointerDown, true)\n return () =>\n document.removeEventListener('pointerdown', handlePointerDown, true)\n }, [showOptions])\n\n useLayoutEffect(() => {\n if (!showOptions) {\n setPortalReady(false)\n return\n }\n if (!reactPortal) return\n recomputePortalPosition()\n }, [showOptions, reactPortal, recomputePortalPosition])\n\n useEffect(() => {\n if (!showOptions || !reactPortal) return undefined\n\n const handleReposition = () => recomputePortalPosition()\n window.addEventListener('resize', handleReposition)\n window.addEventListener('scroll', handleReposition, true)\n\n return () => {\n window.removeEventListener('resize', handleReposition)\n window.removeEventListener('scroll', handleReposition, true)\n }\n }, [showOptions, reactPortal, recomputePortalPosition])\n\n useEffect(() => {\n if (!windowPosition) return\n setOpenDirection(Number(windowHeight) < 800 ? 'top' : 'bottom')\n }, [windowHeight, windowPosition])\n\n const updateSelection = useCallback(\n (next: T[]) => {\n setSelectedOptions(next)\n onChange?.(next)\n },\n [onChange],\n )\n\n const handleScroll = useCallback(\n (event: UIEvent<HTMLDivElement>) => {\n const target = event.currentTarget\n if (target.scrollHeight - target.scrollTop <= target.clientHeight + 1) {\n isScrollEnd?.(true)\n }\n },\n [isScrollEnd],\n )\n\n const toggleOption = useCallback(\n (option: T) => {\n if (isOptionSelected(selectedOptions, option, optionValue)) {\n updateSelection(\n selectedOptions.filter(\n (item) => item?.[optionValue] !== option?.[optionValue],\n ),\n )\n return\n }\n if (hasSelectionLimit && selectedOptions.length >= maxSelectionCount) {\n return\n }\n updateSelection([...selectedOptions, option])\n },\n [\n hasSelectionLimit,\n maxSelectionCount,\n optionValue,\n selectedOptions,\n updateSelection,\n ],\n )\n\n const filteredOptions = useMemo(() => {\n const query = searchValue.trim().toLocaleLowerCase()\n if (!query) return options\n return options.filter((option) =>\n String(option?.[optionLabel] ?? '')\n .toLocaleLowerCase()\n .includes(query),\n )\n }, [options, optionLabel, searchValue])\n\n const inputValue = useMemo(() => {\n if (selectedOptions.length === 0) return ''\n if (selectedOptions.length === 1) {\n return String(selectedOptions[0]?.[optionLabel] ?? '')\n }\n return `${selectedOptions.length} ${selectedInputMessage || itemSelectedText}`\n }, [itemSelectedText, optionLabel, selectedInputMessage, selectedOptions])\n\n const inputPlaceholder =\n errorPlace === 'in' ? errorMessage || placeholder : placeholder\n\n const toggleDropdown = useCallback(() => {\n if (isDisabled) return\n setShowOptions((prev) => !prev)\n }, [isDisabled])\n\n const handleTriggerKeyDown = (event: KeyboardEvent<HTMLDivElement>) => {\n if (event.key === 'Enter' || event.key === ' ') {\n event.preventDefault()\n toggleDropdown()\n }\n }\n\n const allFilteredSelected = useMemo(\n () =>\n filteredOptions.length > 0 &&\n filteredOptions.every((option) =>\n isOptionSelected(selectedOptions, option, optionValue),\n ),\n [filteredOptions, optionValue, selectedOptions],\n )\n\n const handleSelectAll = useCallback(() => {\n if (allFilteredSelected) {\n updateSelection(\n selectedOptions.filter(\n (selected) =>\n !filteredOptions.some(\n (option) => selected?.[optionValue] === option?.[optionValue],\n ),\n ),\n )\n return\n }\n const toAdd = filteredOptions.filter(\n (option) => !isOptionSelected(selectedOptions, option, optionValue),\n )\n const limitedToAdd = hasSelectionLimit\n ? toAdd.slice(0, Math.max(maxSelectionCount - selectedOptions.length, 0))\n : toAdd\n updateSelection([...selectedOptions, ...limitedToAdd])\n }, [\n allFilteredSelected,\n filteredOptions,\n hasSelectionLimit,\n maxSelectionCount,\n optionValue,\n selectedOptions,\n updateSelection,\n ])\n\n const baseId = id || 'inconel-multi-select-checkbox'\n\n const optionsPanel = (\n <div\n ref={reactPortal ? portalWrapRef : undefined}\n className={classNames(\n 'inconel-multi-select-checkbox__panel-wrap',\n reactPortal && 'inconel-multi-select-checkbox__panel-wrap--portal',\n openDirection === 'top' && 'inconel-is-open-top',\n )}\n style={\n reactPortal\n ? { ...(portalStyle ?? {}), visibility: portalReady ? 'visible' : 'hidden' }\n : undefined\n }\n onPointerDown={(event) => event.stopPropagation()}\n >\n <div\n className={classNames(\n 'inconel-multi-select-checkbox__options',\n reactPortal && 'inconel-multi-select-checkbox__options--portal',\n optionsClassName,\n )}\n onScroll={handleScroll}\n >\n {isSearchable && (\n <div className=\"inconel-multi-select-checkbox__search\">\n <input\n type=\"text\"\n placeholder={searchPlaceholder}\n className={classNames(\n 'inconel-multi-select-checkbox__search-input',\n searchableInputClassName,\n )}\n value={searchValue}\n onChange={(event: ChangeEvent<HTMLInputElement>) =>\n setSearchValue(event.target.value)\n }\n disabled={isDisabled}\n />\n </div>\n )}\n\n <div\n className={classNames(\n 'inconel-multi-select-checkbox__option-item',\n optionItemClassName,\n )}\n >\n <input\n id={`${baseId}-select-all`}\n type=\"checkbox\"\n checked={allFilteredSelected}\n onChange={handleSelectAll}\n disabled={isDisabled}\n />\n <label htmlFor={`${baseId}-select-all`}>{selectAllText}</label>\n </div>\n\n {filteredOptions.map((option, index) => {\n const value = option?.[optionValue] ?? index\n const checked = isOptionSelected(selectedOptions, option, optionValue)\n const optionDisabled =\n isDisabled ||\n (!checked && hasSelectionLimit && selectedOptions.length >= maxSelectionCount)\n const inputId = `${baseId}-${String(value)}`\n\n return (\n <div\n key={String(value)}\n className={classNames(\n 'inconel-multi-select-checkbox__option-item',\n checked && 'inconel-is-selected',\n optionDisabled && 'inconel-is-disabled',\n optionItemClassName,\n )}\n title={getOptionTooltip(option)}\n >\n <input\n id={inputId}\n type=\"checkbox\"\n checked={checked}\n onChange={() => toggleOption(option)}\n disabled={optionDisabled}\n />\n <label htmlFor={inputId}>\n {String(option?.[optionLabel] ?? '')}\n </label>\n </div>\n )\n })}\n </div>\n </div>\n )\n\n return (\n <div\n ref={rootRef}\n id={id ?? undefined}\n className={classNames(\n 'inconel-multi-select-checkbox',\n errorMessage && 'inconel-is-error',\n isDisabled && 'inconel-is-disabled',\n openDirection === 'top' && !reactPortal && 'inconel-is-open-top',\n className,\n )}\n >\n {label && (\n <span\n className={classNames(\n 'inconel-multi-select-checkbox__label',\n labelClassName,\n )}\n >\n {label}\n </span>\n )}\n\n <div className=\"inconel-multi-select-checkbox__input-wrap\">\n {isLoading && (\n <div className=\"inconel-multi-select-checkbox__loader-cover\">\n <DotLoader />\n </div>\n )}\n\n <div\n ref={anchorRef}\n role=\"button\"\n tabIndex={0}\n className=\"inconel-multi-select-checkbox__input-container\"\n onClick={toggleDropdown}\n onKeyDown={handleTriggerKeyDown}\n >\n <input\n type=\"text\"\n className={classNames(\n 'inconel-multi-select-checkbox__input',\n inputClassName,\n )}\n placeholder={inputPlaceholder}\n readOnly\n value={inputValue}\n />\n <span\n className=\"inconel-multi-select-checkbox__indicator\"\n aria-hidden=\"true\"\n />\n </div>\n </div>\n\n {showOptions &&\n (options.length > 0 ? (\n reactPortal ? (\n createPortal(optionsPanel, document.body)\n ) : (\n optionsPanel\n )\n ) : (\n <div className=\"inconel-multi-select-checkbox__nodata\">\n <span>{noDataMessage}</span>\n </div>\n ))}\n\n {errorPlace !== 'in' && errorMessage && (\n <span className=\"inconel-multi-select-checkbox__error\">\n {errorMessage}\n </span>\n )}\n </div>\n )\n}\n"],"names":["EMPTY_OPTIONS","isOptionSelected","selected","option","optionValue","item","MultiSelectCheckBox","id","label","className","labelClassName","inputClassName","optionsClassName","optionItemClassName","searchableInputClassName","options","defaultSelectedOptions","optionLabel","onChange","placeholder","selectedInputMessage","itemSelectedText","selectAllText","searchPlaceholder","noDataMessage","errorMessage","errorPlace","isSearchable","isLoading","isDisabled","reactPortal","windowPosition","windowHeight","windowClose","isScrollEnd","getOptionTooltip","limit","selectionLimit","rootRef","useRef","anchorRef","portalWrapRef","showOptions","setShowOptions","useState","selectedOptions","setSelectedOptions","openDirection","setOpenDirection","searchValue","setSearchValue","portalStyle","setPortalStyle","portalReady","setPortalReady","maxSelectionCount","hasSelectionLimit","recomputePortalPosition","useCallback","rect","useEffect","next","rootEl","portalEl","handlePointerDown","event","target","inRoot","inPortal","useLayoutEffect","handleReposition","updateSelection","handleScroll","toggleOption","filteredOptions","useMemo","query","inputValue","inputPlaceholder","toggleDropdown","prev","handleTriggerKeyDown","allFilteredSelected","handleSelectAll","toAdd","limitedToAdd","baseId","optionsPanel","jsx","classNames","jsxs","index","value","checked","optionDisabled","inputId","DotLoader","createPortal"],"mappings":"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"}
|
|
1
|
+
{"version":3,"file":"MultiSelectCheckBox.js","sources":["../../../src/components/MultiSelectCheckBox/MultiSelectCheckBox.tsx"],"sourcesContent":["import {\n useCallback,\n useEffect,\n useLayoutEffect,\n useMemo,\n useRef,\n useState,\n type ChangeEvent,\n type CSSProperties,\n type KeyboardEvent,\n type ReactNode,\n type UIEvent,\n} from 'react'\nimport { createPortal } from 'react-dom'\n\nimport { DotLoader } from '../DotLoader'\nimport { classNames } from '../shared/classNames'\nimport './styles.css'\n\nexport interface MultiSelectCheckBoxOption {\n [key: string]: unknown\n}\n\nexport interface MultiSelectCheckBoxProps<\n T extends MultiSelectCheckBoxOption = MultiSelectCheckBoxOption,\n> {\n id?: string | null\n label?: ReactNode\n className?: string | null\n labelClassName?: string | null\n inputClassName?: string | null\n optionsClassName?: string | null\n optionItemClassName?: string | null\n searchableInputClassName?: string | null\n options?: T[]\n defaultSelectedOptions?: T[]\n optionLabel?: string\n optionValue?: string\n onChange?: (selected: T[]) => void\n placeholder?: string\n selectedInputMessage?: string\n itemSelectedText?: string\n selectAllText?: string\n searchPlaceholder?: string\n noDataMessage?: string\n errorMessage?: string\n errorPlace?: 'in' | 'out'\n isSearchable?: boolean\n isLoading?: boolean\n isDisabled?: boolean\n reactPortal?: boolean\n windowPosition?: boolean\n windowHeight?: number\n windowClose?: (closed: boolean) => void\n isScrollEnd?: (end: boolean) => void\n getOptionTooltip?: (option: T) => string | undefined\n limit?: number | null\n selectionLimit?: number | null\n}\n\nconst EMPTY_OPTIONS: never[] = []\n\nfunction isOptionSelected<T extends MultiSelectCheckBoxOption>(\n selected: T[],\n option: T,\n optionValue: string,\n) {\n return selected.some(\n (item) => item?.[optionValue] === option?.[optionValue],\n )\n}\n\nexport function MultiSelectCheckBox<\n T extends MultiSelectCheckBoxOption = MultiSelectCheckBoxOption,\n>({\n id = null,\n label = null,\n className = null,\n labelClassName = null,\n inputClassName = null,\n optionsClassName = null,\n optionItemClassName = null,\n searchableInputClassName = null,\n options = EMPTY_OPTIONS,\n defaultSelectedOptions = EMPTY_OPTIONS,\n optionLabel = 'label',\n optionValue = 'value',\n onChange,\n placeholder = 'Seçiniz',\n selectedInputMessage,\n itemSelectedText = 'öğe seçili',\n selectAllText = 'Tümünü Seç',\n searchPlaceholder = 'Ara',\n noDataMessage = 'Veri bulunamadı',\n errorMessage = '',\n errorPlace = 'out',\n isSearchable = false,\n isLoading = false,\n isDisabled = false,\n reactPortal = false,\n windowPosition = false,\n windowHeight = 800,\n windowClose,\n isScrollEnd,\n getOptionTooltip = (option: T) =>\n typeof option?.tooltip === 'string' ? option.tooltip : undefined,\n limit = null,\n selectionLimit = null,\n}: MultiSelectCheckBoxProps<T>) {\n const rootRef = useRef<HTMLDivElement>(null)\n const anchorRef = useRef<HTMLDivElement>(null)\n const portalWrapRef = useRef<HTMLDivElement>(null)\n\n const [showOptions, setShowOptions] = useState(false)\n const [selectedOptions, setSelectedOptions] = useState<T[]>(\n defaultSelectedOptions,\n )\n const [openDirection, setOpenDirection] = useState<'top' | 'bottom' | null>(\n null,\n )\n const [searchValue, setSearchValue] = useState('')\n const [portalStyle, setPortalStyle] = useState<CSSProperties | null>(null)\n const [portalReady, setPortalReady] = useState(false)\n\n const selectionLimitValue = limit ?? selectionLimit\n const maxSelectionCount = Number(selectionLimitValue)\n const hasSelectionLimit =\n Number.isFinite(maxSelectionCount) && maxSelectionCount > 0\n\n const recomputeOpenDirection = useCallback(() => {\n if (windowPosition) {\n setOpenDirection(Number(windowHeight) < 800 ? 'top' : 'bottom')\n return\n }\n const anchor = anchorRef.current\n if (!anchor) return\n const rect = anchor.getBoundingClientRect()\n const spaceBelow = window.innerHeight - rect.bottom\n const spaceAbove = rect.top\n const estimatedPanelHeight = 240 + (isSearchable ? 46 : 0) + 40\n setOpenDirection(\n spaceBelow < estimatedPanelHeight && spaceAbove > spaceBelow\n ? 'top'\n : 'bottom',\n )\n }, [isSearchable, windowHeight, windowPosition])\n\n const recomputePortalPosition = useCallback(() => {\n if (!reactPortal || !anchorRef.current) return\n const rect = anchorRef.current.getBoundingClientRect()\n setPortalStyle({\n position: 'fixed',\n left: rect.left,\n top: openDirection === 'top' ? rect.top : rect.bottom,\n width: rect.width,\n zIndex: 9999,\n })\n setPortalReady(true)\n }, [reactPortal, openDirection])\n\n useEffect(() => {\n const next = hasSelectionLimit\n ? defaultSelectedOptions.slice(0, maxSelectionCount)\n : defaultSelectedOptions\n setSelectedOptions(next)\n }, [defaultSelectedOptions, hasSelectionLimit, maxSelectionCount])\n\n useEffect(() => {\n if (!showOptions) {\n windowClose?.(true)\n setSearchValue('')\n }\n }, [showOptions, windowClose])\n\n useEffect(() => {\n if (!showOptions) return undefined\n\n const rootEl = rootRef.current\n const portalEl = portalWrapRef.current\n\n const handlePointerDown = (event: PointerEvent) => {\n const target = event.target as Node\n const inRoot = rootEl?.contains(target)\n const inPortal = portalEl?.contains(target)\n if (!inRoot && !inPortal) setShowOptions(false)\n }\n\n document.addEventListener('pointerdown', handlePointerDown, true)\n return () =>\n document.removeEventListener('pointerdown', handlePointerDown, true)\n }, [showOptions])\n\n useLayoutEffect(() => {\n if (!showOptions) {\n setPortalReady(false)\n return\n }\n recomputeOpenDirection()\n }, [showOptions, recomputeOpenDirection])\n\n useLayoutEffect(() => {\n if (!showOptions || !reactPortal) return\n recomputePortalPosition()\n }, [showOptions, reactPortal, recomputePortalPosition])\n\n useEffect(() => {\n if (!showOptions) return undefined\n\n const handleReposition = () => {\n recomputeOpenDirection()\n if (reactPortal) recomputePortalPosition()\n }\n window.addEventListener('resize', handleReposition)\n window.addEventListener('scroll', handleReposition, true)\n\n return () => {\n window.removeEventListener('resize', handleReposition)\n window.removeEventListener('scroll', handleReposition, true)\n }\n }, [showOptions, reactPortal, recomputeOpenDirection, recomputePortalPosition])\n\n const updateSelection = useCallback(\n (next: T[]) => {\n setSelectedOptions(next)\n onChange?.(next)\n },\n [onChange],\n )\n\n const handleScroll = useCallback(\n (event: UIEvent<HTMLDivElement>) => {\n const target = event.currentTarget\n if (target.scrollHeight - target.scrollTop <= target.clientHeight + 1) {\n isScrollEnd?.(true)\n }\n },\n [isScrollEnd],\n )\n\n const toggleOption = useCallback(\n (option: T) => {\n if (isOptionSelected(selectedOptions, option, optionValue)) {\n updateSelection(\n selectedOptions.filter(\n (item) => item?.[optionValue] !== option?.[optionValue],\n ),\n )\n return\n }\n if (hasSelectionLimit && selectedOptions.length >= maxSelectionCount) {\n return\n }\n updateSelection([...selectedOptions, option])\n },\n [\n hasSelectionLimit,\n maxSelectionCount,\n optionValue,\n selectedOptions,\n updateSelection,\n ],\n )\n\n const filteredOptions = useMemo(() => {\n const query = searchValue.trim().toLocaleLowerCase()\n if (!query) return options\n return options.filter((option) =>\n String(option?.[optionLabel] ?? '')\n .toLocaleLowerCase()\n .includes(query),\n )\n }, [options, optionLabel, searchValue])\n\n const inputValue = useMemo(() => {\n if (selectedOptions.length === 0) return ''\n if (selectedOptions.length === 1) {\n return String(selectedOptions[0]?.[optionLabel] ?? '')\n }\n return `${selectedOptions.length} ${selectedInputMessage || itemSelectedText}`\n }, [itemSelectedText, optionLabel, selectedInputMessage, selectedOptions])\n\n const inputPlaceholder =\n errorPlace === 'in' ? errorMessage || placeholder : placeholder\n\n const toggleDropdown = useCallback(() => {\n if (isDisabled) return\n setShowOptions((prev) => !prev)\n }, [isDisabled])\n\n const handleTriggerKeyDown = (event: KeyboardEvent<HTMLDivElement>) => {\n if (event.key === 'Enter' || event.key === ' ') {\n event.preventDefault()\n toggleDropdown()\n }\n }\n\n const allFilteredSelected = useMemo(\n () =>\n filteredOptions.length > 0 &&\n filteredOptions.every((option) =>\n isOptionSelected(selectedOptions, option, optionValue),\n ),\n [filteredOptions, optionValue, selectedOptions],\n )\n\n const handleSelectAll = useCallback(() => {\n if (allFilteredSelected) {\n updateSelection(\n selectedOptions.filter(\n (selected) =>\n !filteredOptions.some(\n (option) => selected?.[optionValue] === option?.[optionValue],\n ),\n ),\n )\n return\n }\n const toAdd = filteredOptions.filter(\n (option) => !isOptionSelected(selectedOptions, option, optionValue),\n )\n const limitedToAdd = hasSelectionLimit\n ? toAdd.slice(0, Math.max(maxSelectionCount - selectedOptions.length, 0))\n : toAdd\n updateSelection([...selectedOptions, ...limitedToAdd])\n }, [\n allFilteredSelected,\n filteredOptions,\n hasSelectionLimit,\n maxSelectionCount,\n optionValue,\n selectedOptions,\n updateSelection,\n ])\n\n const baseId = id || 'inconel-multi-select-checkbox'\n\n const optionsPanel = (\n <div\n ref={reactPortal ? portalWrapRef : undefined}\n className={classNames(\n 'inconel-multi-select-checkbox__panel-wrap',\n reactPortal && 'inconel-multi-select-checkbox__panel-wrap--portal',\n openDirection === 'top' && 'inconel-is-open-top',\n )}\n style={\n reactPortal\n ? { ...(portalStyle ?? {}), visibility: portalReady ? 'visible' : 'hidden' }\n : undefined\n }\n onPointerDown={(event) => event.stopPropagation()}\n >\n <div\n className={classNames(\n 'inconel-multi-select-checkbox__options',\n reactPortal && 'inconel-multi-select-checkbox__options--portal',\n optionsClassName,\n )}\n onScroll={handleScroll}\n >\n {isSearchable && (\n <div className=\"inconel-multi-select-checkbox__search\">\n <input\n type=\"text\"\n placeholder={searchPlaceholder}\n className={classNames(\n 'inconel-multi-select-checkbox__search-input',\n searchableInputClassName,\n )}\n value={searchValue}\n onChange={(event: ChangeEvent<HTMLInputElement>) =>\n setSearchValue(event.target.value)\n }\n disabled={isDisabled}\n />\n </div>\n )}\n\n <div\n className={classNames(\n 'inconel-multi-select-checkbox__option-item',\n optionItemClassName,\n )}\n >\n <input\n id={`${baseId}-select-all`}\n type=\"checkbox\"\n checked={allFilteredSelected}\n onChange={handleSelectAll}\n disabled={isDisabled}\n />\n <label htmlFor={`${baseId}-select-all`}>{selectAllText}</label>\n </div>\n\n {filteredOptions.map((option, index) => {\n const value = option?.[optionValue] ?? index\n const checked = isOptionSelected(selectedOptions, option, optionValue)\n const optionDisabled =\n isDisabled ||\n (!checked && hasSelectionLimit && selectedOptions.length >= maxSelectionCount)\n const inputId = `${baseId}-${String(value)}`\n\n return (\n <div\n key={String(value)}\n className={classNames(\n 'inconel-multi-select-checkbox__option-item',\n checked && 'inconel-is-selected',\n optionDisabled && 'inconel-is-disabled',\n optionItemClassName,\n )}\n title={getOptionTooltip(option)}\n >\n <input\n id={inputId}\n type=\"checkbox\"\n checked={checked}\n onChange={() => toggleOption(option)}\n disabled={optionDisabled}\n />\n <label htmlFor={inputId}>\n {String(option?.[optionLabel] ?? '')}\n </label>\n </div>\n )\n })}\n </div>\n </div>\n )\n\n return (\n <div\n ref={rootRef}\n id={id ?? undefined}\n className={classNames(\n 'inconel-multi-select-checkbox',\n errorMessage && 'inconel-is-error',\n isDisabled && 'inconel-is-disabled',\n openDirection === 'top' && !reactPortal && 'inconel-is-open-top',\n className,\n )}\n >\n {label && (\n <span\n className={classNames(\n 'inconel-multi-select-checkbox__label',\n labelClassName,\n )}\n >\n {label}\n </span>\n )}\n\n <div className=\"inconel-multi-select-checkbox__input-wrap\">\n {isLoading && (\n <div className=\"inconel-multi-select-checkbox__loader-cover\">\n <DotLoader />\n </div>\n )}\n\n <div\n ref={anchorRef}\n role=\"button\"\n tabIndex={0}\n className=\"inconel-multi-select-checkbox__input-container\"\n onClick={toggleDropdown}\n onKeyDown={handleTriggerKeyDown}\n >\n <input\n type=\"text\"\n className={classNames(\n 'inconel-multi-select-checkbox__input',\n inputClassName,\n )}\n placeholder={inputPlaceholder}\n readOnly\n value={inputValue}\n />\n <span\n className=\"inconel-multi-select-checkbox__indicator\"\n aria-hidden=\"true\"\n />\n </div>\n </div>\n\n {showOptions &&\n (options.length > 0 ? (\n reactPortal ? (\n createPortal(optionsPanel, document.body)\n ) : (\n optionsPanel\n )\n ) : (\n <div className=\"inconel-multi-select-checkbox__nodata\">\n <span>{noDataMessage}</span>\n </div>\n ))}\n\n {errorPlace !== 'in' && errorMessage && (\n <span className=\"inconel-multi-select-checkbox__error\">\n {errorMessage}\n </span>\n )}\n </div>\n )\n}\n"],"names":["EMPTY_OPTIONS","isOptionSelected","selected","option","optionValue","item","MultiSelectCheckBox","id","label","className","labelClassName","inputClassName","optionsClassName","optionItemClassName","searchableInputClassName","options","defaultSelectedOptions","optionLabel","onChange","placeholder","selectedInputMessage","itemSelectedText","selectAllText","searchPlaceholder","noDataMessage","errorMessage","errorPlace","isSearchable","isLoading","isDisabled","reactPortal","windowPosition","windowHeight","windowClose","isScrollEnd","getOptionTooltip","limit","selectionLimit","rootRef","useRef","anchorRef","portalWrapRef","showOptions","setShowOptions","useState","selectedOptions","setSelectedOptions","openDirection","setOpenDirection","searchValue","setSearchValue","portalStyle","setPortalStyle","portalReady","setPortalReady","maxSelectionCount","hasSelectionLimit","recomputeOpenDirection","useCallback","anchor","rect","spaceBelow","spaceAbove","estimatedPanelHeight","recomputePortalPosition","useEffect","next","rootEl","portalEl","handlePointerDown","event","target","inRoot","inPortal","useLayoutEffect","handleReposition","updateSelection","handleScroll","toggleOption","filteredOptions","useMemo","query","inputValue","inputPlaceholder","toggleDropdown","prev","handleTriggerKeyDown","allFilteredSelected","handleSelectAll","toAdd","limitedToAdd","baseId","optionsPanel","jsx","classNames","jsxs","index","value","checked","optionDisabled","inputId","DotLoader","createPortal"],"mappings":"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"}
|