@bikdotai/bik-component-library 0.0.814 → 0.0.815

package/dist/cjs/components/QueryBuilder/components/Connectors/Components/IgPicker.js.map

@@ -1 +1 @@
-{"version":3,"file":"IgPicker.js","sources":["../../../../../../../src/components/QueryBuilder/components/Connectors/Components/IgPicker.tsx"],"sourcesContent":["import CrossIcon from '@src/assets/icons/cross.svg';\nimport InstagramIcon from '@src/assets/icons/instagram.svg';\nimport PlusIcon from '@src/assets/icons/plus.svg';\nimport React, { useEffect, useState } from 'react';\nimport styled from 'styled-components';\nimport * as Sc from '@src/components/button/Button.styled';\nimport { Media, MEDIA_TYPES, PostPicker } from '@src/components/postPicker';\nimport { ConnectorComponentProps } from '@src/components/QueryBuilder/types';\nimport {\n\tBodyCaption,\n\tBodyPrimary,\n\tBodySecondary,\n} from '@src/components/TypographyStyle';\nimport { unCamelCase } from '@src/utils/unCamelCase';\nimport { PRIMARY } from '@src/constants/colors';\nimport { COLORS } from '@src/constants/Theme';\n\nconst IgPicker: React.FC<\n\tConnectorComponentProps & { mediaType: MEDIA_TYPES }\n> = (props) => {\n\tconst [showModal, setShowModal] = useState<boolean>(false);\n\tconst [selectedMedia, setSelectedMedia] = useState<Media[]>([]);\n\tconst [allMedia, setAllMedia] = useState<Media[]>([]);\n\tconst [error, setError] = useState<boolean>(false);\n\n\tuseEffect(() => {\n\t\tif (props.errors && props.errors.val) {\n\t\t\tsetError(true);\n\t\t}\n\t}, [props.errors?.val]);\n\n\tuseEffect(() => {\n\t\tif (props.val && (props.val as Media[])?.length > 0) {\n\t\t\tsetSelectedMedia(props.val as Media[]);\n\t\t}\n\t}, [(props.val as Media[])?.length]);\n\n\tuseEffect(() => {\n\t\tif (props?.extra?.originalData && props?.extra?.originalData?.length > 0) {\n\t\t\tconst formattedData = props?.extra?.originalData?.map((item) => {\n\t\t\t\treturn {\n\t\t\t\t\tid: item.id,\n\t\t\t\t\timageUrl:\n\t\t\t\t\t\titem.media_type === 'VIDEO' ? item.thumbnail_url : item.media_url,\n\t\t\t\t\tredirectionUrl: item.permalink,\n\t\t\t\t\toverlayCaption: `posted on: ${formatTimestamp(item.timestamp)}`,\n\t\t\t\t};\n\t\t\t});\n\t\t\tsetAllMedia(formattedData);\n\t\t}\n\t}, [props?.extra?.originalData]);\n\n\tconst formatTimestamp = (date: string) => {\n\t\tconst inputDate = new Date(date);\n\t\tconst month = inputDate.getMonth() + 1;\n\t\tconst day = inputDate.getDate();\n\t\tconst year = inputDate.getFullYear();\n\t\treturn `${day}/${month}/${year}`;\n\t};\n\n\tconst handleSelection = (selection: Media[]) => {\n\t\tsetSelectedMedia(selection);\n\t\tsetShowModal(false);\n\t\tprops.onChange?.(selection);\n\t};\n\n\tconst handlePostPicker = () => {\n\t\tsetShowModal(true);\n\t};\n\n\tconst handlePickerClose = () => {\n\t\tsetShowModal(false);\n\t};\n\n\tconst handleDeleteSelection = (id: string) => {\n\t\tconst currentlySelected = [...selectedMedia];\n\t\tconst updatedMedia = currentlySelected.filter((media) => media.id !== id);\n\t\tsetSelectedMedia(updatedMedia);\n\t\tif (updatedMedia.length > 0) {\n\t\t\tprops.onChange?.(updatedMedia);\n\t\t} else {\n\t\t\tprops.onChange?.(undefined);\n\t\t}\n\t};\n\n\tconst generateTitle = (mediaType: MEDIA_TYPES) => {\n\t\tif (mediaType === MEDIA_TYPES.POST || mediaType === MEDIA_TYPES.REEL) {\n\t\t\treturn `Select upto 10 ${props.mediaType}s`;\n\t\t} else {\n\t\t\treturn `Select upto 10 stories`;\n\t\t}\n\t};\n\n\treturn (\n\t\t<IgPickerStyled mediaType={props.mediaType}>\n\t\t\t<div style={{ padding: 12 }}>\n\t\t\t\t<button\n\t\t\t\t\tclassName={`${error ? 'add-media-btn error' : 'add-media-btn'}`}\n\t\t\t\t\tonClick={() => handlePostPicker()}\n\t\t\t\t>\n\t\t\t\t\t<Sc.ButtonCustomDashedBorder />\n\t\t\t\t\t<PlusIcon\n\t\t\t\t\t\tcolor={error ? COLORS.content.negative : COLORS.content.secondary}\n\t\t\t\t\t\twidth={20}\n\t\t\t\t\t\theight={20}\n\t\t\t\t\t\tstyle={{ marginBottom: 15 }}\n\t\t\t\t\t/>\n\t\t\t\t\t<BodySecondary\n\t\t\t\t\t\tstyle={{\n\t\t\t\t\t\t\tcolor: error ? COLORS.content.negative : COLORS.content.primary,\n\t\t\t\t\t\t}}\n\t\t\t\t\t>\n\t\t\t\t\t\tAdd {unCamelCase(props.mediaType)}\n\t\t\t\t\t</BodySecondary>\n\t\t\t\t\t<div className=\"overlay-container\"></div>\n\t\t\t\t</button>\n\t\t\t</div>\n\t\t\t<div className=\"product-card-container\">\n\t\t\t\t{selectedMedia?.length > 0 &&\n\t\t\t\t\tselectedMedia.map((media) => {\n\t\t\t\t\t\treturn (\n\t\t\t\t\t\t\t<div key={media.id} style={{ padding: '7px' }}>\n\t\t\t\t\t\t\t\t<ProductCard mediaType={props.mediaType}>\n\t\t\t\t\t\t\t\t\t<img src={media.imageUrl} alt={media.overlayCaption} />\n\n\t\t\t\t\t\t\t\t\t<div className=\"overlay\">\n\t\t\t\t\t\t\t\t\t\t<a\n\t\t\t\t\t\t\t\t\t\t\ttarget=\"_blank\"\n\t\t\t\t\t\t\t\t\t\t\trel=\"noreferrer\"\n\t\t\t\t\t\t\t\t\t\t\thref={media.redirectionUrl}\n\t\t\t\t\t\t\t\t\t\t>\n\t\t\t\t\t\t\t\t\t\t\t<div className=\"overlay__redirection\">\n\t\t\t\t\t\t\t\t\t\t\t\t<InstagramIcon height={22} width={22} />\n\t\t\t\t\t\t\t\t\t\t\t\t<BodyPrimary\n\t\t\t\t\t\t\t\t\t\t\t\t\tcolor={PRIMARY}\n\t\t\t\t\t\t\t\t\t\t\t\t\tstyle={{\n\t\t\t\t\t\t\t\t\t\t\t\t\t\tfontWeight: 500,\n\t\t\t\t\t\t\t\t\t\t\t\t\t}}\n\t\t\t\t\t\t\t\t\t\t\t\t>\n\t\t\t\t\t\t\t\t\t\t\t\t\tView\n\t\t\t\t\t\t\t\t\t\t\t\t</BodyPrimary>\n\t\t\t\t\t\t\t\t\t\t\t</div>\n\t\t\t\t\t\t\t\t\t\t</a>\n\t\t\t\t\t\t\t\t\t\t<div className=\"overlay__caption\">\n\t\t\t\t\t\t\t\t\t\t\t<BodyCaption color={COLORS.content.placeholder}>\n\t\t\t\t\t\t\t\t\t\t\t\t{media.overlayCaption}\n\t\t\t\t\t\t\t\t\t\t\t</BodyCaption>\n\t\t\t\t\t\t\t\t\t\t</div>\n\t\t\t\t\t\t\t\t\t</div>\n\t\t\t\t\t\t\t\t\t<button\n\t\t\t\t\t\t\t\t\t\tclassName=\"cross-icon\"\n\t\t\t\t\t\t\t\t\t\tonClick={() => handleDeleteSelection(media.id)}\n\t\t\t\t\t\t\t\t\t>\n\t\t\t\t\t\t\t\t\t\t<CrossIcon\n\t\t\t\t\t\t\t\t\t\t\twidth={12}\n\t\t\t\t\t\t\t\t\t\t\theight={12}\n\t\t\t\t\t\t\t\t\t\t\tcolor={COLORS.content.secondary}\n\t\t\t\t\t\t\t\t\t\t/>\n\t\t\t\t\t\t\t\t\t</button>\n\t\t\t\t\t\t\t\t</ProductCard>\n\t\t\t\t\t\t\t</div>\n\t\t\t\t\t\t);\n\t\t\t\t\t})}\n\t\t\t</div>\n\t\t\t{showModal && (\n\t\t\t\t<PostPicker\n\t\t\t\t\tlimit={10}\n\t\t\t\t\tselected={selectedMedia}\n\t\t\t\t\tonSelect={handleSelection}\n\t\t\t\t\ttitle={generateTitle(props.mediaType)}\n\t\t\t\t\tshowModal={showModal}\n\t\t\t\t\tonClose={() => handlePickerClose()}\n\t\t\t\t\tmedia={allMedia}\n\t\t\t\t\tmediaType={props.mediaType}\n\t\t\t\t/>\n\t\t\t)}\n\t\t</IgPickerStyled>\n\t);\n};\n\nconst PostIgPicker = (props: ConnectorComponentProps) => (\n\t<IgPicker {...props} mediaType={MEDIA_TYPES.POST} />\n);\nconst ReelIgPicker = (props: ConnectorComponentProps) => (\n\t<IgPicker {...props} mediaType={MEDIA_TYPES.REEL} />\n);\nconst StoryIgPicker = (props: ConnectorComponentProps) => (\n\t<IgPicker {...props} mediaType={MEDIA_TYPES.STORY} />\n);\nexport { PostIgPicker, ReelIgPicker, StoryIgPicker };\n\nconst IgPickerStyled = styled.div<{ mediaType: MEDIA_TYPES }>`\n\tdisplay: flex;\n\tflex-direction: row;\n\talign-items: center;\n\tflex: 1;\n\toverflow: hidden;\n\n\t.product-card-container {\n\t\tdisplay: flex;\n\t\toverflow: auto;\n\t\tmax-width: calc(\n\t\t\t${(props) =>\n\t\t\t\tprops.mediaType == MEDIA_TYPES.POST ? '100% - 172px' : '100% - 132px'}\n\t\t);\n\t}\n\n\t.add-media-btn.error {\n\t\t.line-top {\n\t\t\tbackground: repeating-linear-gradient(\n\t\t\t\tto right,\n\t\t\t\t${COLORS.content.negative},\n\t\t\t\t${COLORS.content.negative} 5px,\n\t\t\t\ttransparent 5px,\n\t\t\t\ttransparent 10px\n\t\t\t);\n\t\t}\n\t\t.line-right {\n\t\t\tbackground: repeating-linear-gradient(\n\t\t\t\tto bottom,\n\t\t\t\t${COLORS.content.negative},\n\t\t\t\t${COLORS.content.negative} 5px,\n\t\t\t\ttransparent 5px,\n\t\t\t\ttransparent 10px\n\t\t\t);\n\t\t}\n\t\t.line-bottom {\n\t\t\tbackground: repeating-linear-gradient(\n\t\t\t\tto right,\n\t\t\t\t${COLORS.content.negative},\n\t\t\t\t${COLORS.content.negative} 5px,\n\t\t\t\ttransparent 5px,\n\t\t\t\ttransparent 10px\n\t\t\t);\n\t\t}\n\t\t.line-left {\n\t\t\tbackground: repeating-linear-gradient(\n\t\t\t\tto bottom,\n\t\t\t\t${COLORS.content.negative},\n\t\t\t\t${COLORS.content.negative} 5px,\n\t\t\t\ttransparent 5px,\n\t\t\t\ttransparent 10px\n\t\t\t);\n\t\t}\n\t}\n\n\t.add-media-btn {\n\t\tdisplay: flex;\n\t\tflex-direction: column;\n\t\tjustify-content: center;\n\t\talign-items: center;\n\t\tborder: none;\n\t\tcursor: pointer;\n\t\twidth: ${(props) => (props.mediaType === MEDIA_TYPES.POST ? 148 : 108)}px;\n\t\theight: ${(props) => (props.mediaType === MEDIA_TYPES.POST ? 148 : 180)}px;\n\t\tposition: relative;\n\t\tbackground-color: transparent;\n\t\tborder-radius: 4px;\n\t\t.line-top {\n\t\t\tposition: absolute;\n\t\t\tleft: 0;\n\t\t\ttop: 0;\n\t\t\theight: 1px;\n\t\t\twidth: 100%;\n\t\t\tbackground: repeating-linear-gradient(\n\t\t\t\tto right,\n\t\t\t\t#9e9e9e,\n\t\t\t\t#9e9e9e 5px,\n\t\t\t\ttransparent 5px,\n\t\t\t\ttransparent 10px\n\t\t\t);\n\t\t}\n\t\t.line-right {\n\t\t\tposition: absolute;\n\t\t\tright: 0;\n\t\t\ttop: 0;\n\t\t\twidth: 1px;\n\t\t\theight: 100%;\n\t\t\tbackground: repeating-linear-gradient(\n\t\t\t\tto bottom,\n\t\t\t\t#9e9e9e,\n\t\t\t\t#9e9e9e 5px,\n\t\t\t\ttransparent 5px,\n\t\t\t\ttransparent 10px\n\t\t\t);\n\t\t}\n\t\t.line-bottom {\n\t\t\tposition: absolute;\n\t\t\tleft: 0;\n\t\t\tbottom: 0;\n\t\t\theight: 1px;\n\t\t\twidth: 100%;\n\t\t\tbackground: repeating-linear-gradient(\n\t\t\t\tto right,\n\t\t\t\t#9e9e9e,\n\t\t\t\t#9e9e9e 5px,\n\t\t\t\ttransparent 5px,\n\t\t\t\ttransparent 10px\n\t\t\t);\n\t\t}\n\t\t.line-left {\n\t\t\tposition: absolute;\n\t\t\tleft: 0;\n\t\t\ttop: 0;\n\t\t\twidth: 1px;\n\t\t\theight: 100%;\n\t\t\tbackground: repeating-linear-gradient(\n\t\t\t\tto bottom,\n\t\t\t\t#9e9e9e,\n\t\t\t\t#9e9e9e 5px,\n\t\t\t\ttransparent 5px,\n\t\t\t\ttransparent 10px\n\t\t\t);\n\t\t\t.overlay-container {\n\t\t\t\tdisplay: none;\n\t\t\t}\n\t\t}\n\t}\n\n\t.add-media-btn:hover {\n\t\t.overlay-container {\n\t\t\tdisplay: block;\n\t\t\tposition: absolute;\n\t\t\tpadding: 0;\n\t\t\tpadding-top: 1px;\n\t\t\ttop: 0;\n\t\t\tleft: 0;\n\t\t\twidth: 100%;\n\t\t\theight: 100%;\n\t\t\tbackground-color: #000000;\n\t\t\topacity: 0.03;\n\t\t}\n\t}\n\t.add-media-btn:active {\n\t\tbackground-color: ${COLORS.background.brandLight};\n\n\t\t.line-top,\n\t\t.line-bottom {\n\t\t\tbackground: repeating-linear-gradient(\n\t\t\t\tto right,\n\t\t\t\t${COLORS.content.brand},\n\t\t\t\t${COLORS.content.brand} 5px,\n\t\t\t\ttransparent 5px,\n\t\t\t\ttransparent 10px\n\t\t\t);\n\t\t}\n\t\t.line-right,\n\t\t.line-left {\n\t\t\tbackground: repeating-linear-gradient(\n\t\t\t\tto bottom,\n\t\t\t\t${COLORS.content.brand},\n\t\t\t\t${COLORS.content.brand} 5px,\n\t\t\t\ttransparent 5px,\n\t\t\t\ttransparent 10px\n\t\t\t);\n\t\t}\n\t}\n`;\n\nconst ProductCard = styled.div<{ mediaType: MEDIA_TYPES }>`\n\tborder-radius: 4px;\n\tborder: 1px solid ${COLORS.stroke.primary};\n\tposition: relative;\n\theight: ${(props) => (props.mediaType === MEDIA_TYPES.POST ? 150 : 182)}px;\n\n\t.overlay {\n\t\tdisplay: none;\n\t}\n\n\t.overlay__caption {\n\t\ttext-align: center;\n\t\tbackground: #fafafa;\n\t\tpadding: 10px 20px;\n\t\theight: 40px;\n\t\tdisplay: flex;\n\t\talign-items: center;\n\t\tjustify-content: center;\n\t\tborder-bottom-left-radius: 4px;\n\t\tborder-bottom-right-radius: 4px;\n\t}\n\n\t.overlay__redirection {\n\t\tdisplay: flex;\n\t\tjustify-content: center;\n\t\tgap: 5px;\n\t\tpadding: 10px;\n\t}\n\n\timg {\n\t\tborder-radius: 4px;\n\t\tobject-fit: cover;\n\t\twidth: ${(props) => (props.mediaType === MEDIA_TYPES.POST ? 148 : 108)}px;\n\t\theight: ${(props) => (props.mediaType === MEDIA_TYPES.POST ? 148 : 180)}px;\n\t}\n\t.cross-icon {\n\t\tposition: absolute;\n\t\tright: -8px;\n\t\ttop: -8px;\n\t\twidth: 20px;\n\t\theight: 20px;\n\t\tborder-radius: 10px;\n\t\tborder: 1px solid ${COLORS.stroke.primary};\n\t\tbackground-color: ${COLORS.surface.subdued};\n\t\tdisplay: flex;\n\t\talign-items: center;\n\t\tjustify-content: center;\n\t\tcursor: pointer;\n\t\tpadding: 0;\n\t}\n\n\t&:hover {\n\t\t.overlay {\n\t\t\ttop: 0;\n\t\t\tbackground-color: rgba(255, 255, 255, 0.9);\n\t\t\tborder-radius: 4px;\n\t\t\tdisplay: flex;\n\t\t\tflex-direction: column;\n\t\t\talign-items: center;\n\t\t\tjustify-content: space-between;\n\t\t\tposition: absolute;\n\t\t\twidth: ${(props) => (props.mediaType === MEDIA_TYPES.POST ? 148 : 108)}px;\n\t\t\theight: ${(props) =>\n\t\t\t\tprops.mediaType === MEDIA_TYPES.POST ? 148 : 180}px;\n\t\t\ta {\n\t\t\t\ttext-decoration: none;\n\t\t\t}\n\t\t}\n\t}\n`;\n"],"names":["IgPicker","props","showModal","setShowModal","useState","selectedMedia","setSelectedMedia","allMedia","setAllMedia","error","setError","useEffect","formattedData","item","formatTimestamp","date","inputDate","month","day","year","handleSelection","selection","handlePostPicker","handlePickerClose","handleDeleteSelection","id","updatedMedia","media","generateTitle","mediaType","MEDIA_TYPES","jsxs","IgPickerStyled","jsx","Sc.ButtonCustomDashedBorder","PlusIcon","COLORS","BodySecondary","unCamelCase","ProductCard","InstagramIcon","BodyPrimary","PRIMARY","BodyCaption","CrossIcon","PostPicker","PostIgPicker","ReelIgPicker","StoryIgPicker","styled"],"mappings":"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"}
+{"version":3,"file":"IgPicker.js","sources":["../../../../../../../src/components/QueryBuilder/components/Connectors/Components/IgPicker.tsx"],"sourcesContent":["import CrossIcon from '@src/assets/icons/cross.svg';\nimport InstagramIcon from '@src/assets/icons/instagram.svg';\nimport PlusIcon from '@src/assets/icons/plus.svg';\nimport React, { useEffect, useState } from 'react';\nimport styled from 'styled-components';\nimport * as Sc from '@src/components/button/Button.styled';\nimport { Media, MEDIA_TYPES, PostPicker } from '@src/components/postPicker';\nimport { ConnectorComponentProps } from '@src/components/QueryBuilder/types';\nimport {\n\tBodyCaption,\n\tBodyPrimary,\n\tBodySecondary,\n} from '@src/components/TypographyStyle';\nimport { unCamelCase } from '@src/utils/unCamelCase';\nimport { PRIMARY } from '@src/constants/colors';\nimport { COLORS } from '@src/constants/Theme';\n\nconst IgPicker: React.FC<\n\tConnectorComponentProps & { mediaType: MEDIA_TYPES }\n> = (props) => {\n\tconst [showModal, setShowModal] = useState<boolean>(false);\n\tconst [selectedMedia, setSelectedMedia] = useState<Media[]>([]);\n\tconst [allMedia, setAllMedia] = useState<Media[]>([]);\n\tconst [error, setError] = useState<boolean>(false);\n\n\tuseEffect(() => {\n\t\tif (props.errors && props.errors.val) {\n\t\t\tsetError(true);\n\t\t}\n\t}, [props.errors?.val]);\n\n\tuseEffect(() => {\n\t\tif (props.val && (props.val as Media[])?.length > 0) {\n\t\t\tsetSelectedMedia(props.val as Media[]);\n\t\t}\n\t}, [(props.val as Media[])?.length]);\n\n\tuseEffect(() => {\n\t\tif (props?.extra?.originalData && props?.extra?.originalData?.length > 0) {\n\t\t\tconst formattedData = props?.extra?.originalData?.map((item) => {\n\t\t\t\treturn {\n\t\t\t\t\tid: item.id,\n\t\t\t\t\timageUrl:\n\t\t\t\t\t\titem.media_type === 'VIDEO' ? item.thumbnail_url : item.media_url,\n\t\t\t\t\tredirectionUrl: item.permalink,\n\t\t\t\t\toverlayCaption: `posted on: ${formatTimestamp(item.timestamp)}`,\n\t\t\t\t};\n\t\t\t});\n\t\t\tsetAllMedia(formattedData);\n\t\t}\n\t}, [props?.extra?.originalData]);\n\n\tconst formatTimestamp = (date: string) => {\n\t\tconst inputDate = new Date(date);\n\t\tconst month = inputDate.getMonth() + 1;\n\t\tconst day = inputDate.getDate();\n\t\tconst year = inputDate.getFullYear();\n\t\treturn `${day}/${month}/${year}`;\n\t};\n\n\tconst handleSelection = (selection: Media[]) => {\n\t\tsetSelectedMedia(selection);\n\t\tsetShowModal(false);\n\t\tprops.onChange?.(selection);\n\t};\n\n\tconst handlePostPicker = () => {\n\t\tsetShowModal(true);\n\t};\n\n\tconst handlePickerClose = () => {\n\t\tsetShowModal(false);\n\t};\n\n\tconst handleDeleteSelection = (id: string) => {\n\t\tconst currentlySelected = [...selectedMedia];\n\t\tconst updatedMedia = currentlySelected.filter((media) => media.id !== id);\n\t\tsetSelectedMedia(updatedMedia);\n\t\tif (updatedMedia.length > 0) {\n\t\t\tprops.onChange?.(updatedMedia);\n\t\t} else {\n\t\t\tprops.onChange?.(undefined);\n\t\t}\n\t};\n\n\tconst generateTitle = (mediaType: MEDIA_TYPES) => {\n\t\tif (mediaType === MEDIA_TYPES.POST || mediaType === MEDIA_TYPES.REEL) {\n\t\t\treturn `Select upto 10 ${props.mediaType}s`;\n\t\t} else {\n\t\t\treturn `Select upto 10 stories`;\n\t\t}\n\t};\n\n\treturn (\n\t\t<IgPickerStyled mediaType={props.mediaType}>\n\t\t\t<div style={{ padding: 12 }}>\n\t\t\t\t<button\n\t\t\t\t\tclassName={`${error ? 'add-media-btn error' : 'add-media-btn'}`}\n\t\t\t\t\tonClick={() => handlePostPicker()}\n\t\t\t\t>\n\t\t\t\t\t<Sc.ButtonCustomDashedBorder />\n\t\t\t\t\t<PlusIcon\n\t\t\t\t\t\tcolor={error ? COLORS.content.negative : COLORS.content.secondary}\n\t\t\t\t\t\twidth={20}\n\t\t\t\t\t\theight={20}\n\t\t\t\t\t\tstyle={{ marginBottom: 15 }}\n\t\t\t\t\t/>\n\t\t\t\t\t<BodySecondary\n\t\t\t\t\t\tstyle={{\n\t\t\t\t\t\t\tcolor: error ? COLORS.content.negative : COLORS.content.primary,\n\t\t\t\t\t\t}}\n\t\t\t\t\t>\n\t\t\t\t\t\tAdd {unCamelCase(props.mediaType)}\n\t\t\t\t\t</BodySecondary>\n\t\t\t\t\t<div className=\"overlay-container\"></div>\n\t\t\t\t</button>\n\t\t\t</div>\n\t\t\t<div className=\"product-card-container\">\n\t\t\t\t{selectedMedia?.length > 0 &&\n\t\t\t\t\tselectedMedia.map((media) => {\n\t\t\t\t\t\treturn (\n\t\t\t\t\t\t\t<div key={media.id} style={{ padding: '7px' }}>\n\t\t\t\t\t\t\t\t<ProductCard mediaType={props.mediaType}>\n\t\t\t\t\t\t\t\t\t<img src={media.imageUrl} alt={media.overlayCaption} />\n\n\t\t\t\t\t\t\t\t\t<div className=\"overlay\">\n\t\t\t\t\t\t\t\t\t\t<a\n\t\t\t\t\t\t\t\t\t\t\ttarget=\"_blank\"\n\t\t\t\t\t\t\t\t\t\t\trel=\"noreferrer\"\n\t\t\t\t\t\t\t\t\t\t\thref={media.redirectionUrl}\n\t\t\t\t\t\t\t\t\t\t>\n\t\t\t\t\t\t\t\t\t\t\t<div className=\"overlay__redirection\">\n\t\t\t\t\t\t\t\t\t\t\t\t<InstagramIcon height={22} width={22} />\n\t\t\t\t\t\t\t\t\t\t\t\t<BodyPrimary\n\t\t\t\t\t\t\t\t\t\t\t\t\tcolor={PRIMARY}\n\t\t\t\t\t\t\t\t\t\t\t\t\tstyle={{\n\t\t\t\t\t\t\t\t\t\t\t\t\t\tfontWeight: 500,\n\t\t\t\t\t\t\t\t\t\t\t\t\t}}\n\t\t\t\t\t\t\t\t\t\t\t\t>\n\t\t\t\t\t\t\t\t\t\t\t\t\tView\n\t\t\t\t\t\t\t\t\t\t\t\t</BodyPrimary>\n\t\t\t\t\t\t\t\t\t\t\t</div>\n\t\t\t\t\t\t\t\t\t\t</a>\n\t\t\t\t\t\t\t\t\t\t<div className=\"overlay__caption\">\n\t\t\t\t\t\t\t\t\t\t\t<BodyCaption color={COLORS.content.placeholder}>\n\t\t\t\t\t\t\t\t\t\t\t\t{media.overlayCaption}\n\t\t\t\t\t\t\t\t\t\t\t</BodyCaption>\n\t\t\t\t\t\t\t\t\t\t</div>\n\t\t\t\t\t\t\t\t\t</div>\n\t\t\t\t\t\t\t\t\t<button\n\t\t\t\t\t\t\t\t\t\tclassName=\"cross-icon\"\n\t\t\t\t\t\t\t\t\t\tonClick={() => handleDeleteSelection(media.id)}\n\t\t\t\t\t\t\t\t\t>\n\t\t\t\t\t\t\t\t\t\t<CrossIcon\n\t\t\t\t\t\t\t\t\t\t\twidth={12}\n\t\t\t\t\t\t\t\t\t\t\theight={12}\n\t\t\t\t\t\t\t\t\t\t\tcolor={COLORS.content.secondary}\n\t\t\t\t\t\t\t\t\t\t/>\n\t\t\t\t\t\t\t\t\t</button>\n\t\t\t\t\t\t\t\t</ProductCard>\n\t\t\t\t\t\t\t</div>\n\t\t\t\t\t\t);\n\t\t\t\t\t})}\n\t\t\t</div>\n\t\t\t{showModal && (\n\t\t\t\t<PostPicker\n\t\t\t\t\tlimit={10}\n\t\t\t\t\tselected={selectedMedia}\n\t\t\t\t\tonSelect={handleSelection}\n\t\t\t\t\ttitle={generateTitle(props.mediaType)}\n\t\t\t\t\tshowModal={showModal}\n\t\t\t\t\tonClose={() => handlePickerClose()}\n\t\t\t\t\tmedia={allMedia}\n\t\t\t\t\tmediaType={props.mediaType}\n\t\t\t\t/>\n\t\t\t)}\n\t\t</IgPickerStyled>\n\t);\n};\n\nconst PostIgPicker = (props: ConnectorComponentProps) => (\n\t<IgPicker {...props} mediaType={MEDIA_TYPES.POST} />\n);\nconst ReelIgPicker = (props: ConnectorComponentProps) => (\n\t<IgPicker {...props} mediaType={MEDIA_TYPES.REEL} />\n);\nconst StoryIgPicker = (props: ConnectorComponentProps) => (\n\t<IgPicker {...props} mediaType={MEDIA_TYPES.STORY} />\n);\nexport { PostIgPicker, ReelIgPicker, StoryIgPicker };\n\nconst IgPickerStyled = styled.div<{ mediaType: MEDIA_TYPES }>`\n\tdisplay: flex;\n\tflex-direction: row;\n\talign-items: center;\n\tflex: 1;\n\toverflow: hidden;\n\n\t.product-card-container {\n\t\tdisplay: flex;\n\t\toverflow: auto;\n\t\tmax-width: calc(\n\t\t\t${(props) =>\n\t\t\t\tprops.mediaType == MEDIA_TYPES.POST ? '100% - 172px' : '100% - 132px'}\n\t\t);\n\t}\n\n\t.add-media-btn.error {\n\t\t.line-top {\n\t\t\tbackground: repeating-linear-gradient(\n\t\t\t\tto right,\n\t\t\t\t${COLORS.content.negative},\n\t\t\t\t${COLORS.content.negative} 5px,\n\t\t\t\ttransparent 5px,\n\t\t\t\ttransparent 10px\n\t\t\t);\n\t\t}\n\t\t.line-right {\n\t\t\tbackground: repeating-linear-gradient(\n\t\t\t\tto bottom,\n\t\t\t\t${COLORS.content.negative},\n\t\t\t\t${COLORS.content.negative} 5px,\n\t\t\t\ttransparent 5px,\n\t\t\t\ttransparent 10px\n\t\t\t);\n\t\t}\n\t\t.line-bottom {\n\t\t\tbackground: repeating-linear-gradient(\n\t\t\t\tto right,\n\t\t\t\t${COLORS.content.negative},\n\t\t\t\t${COLORS.content.negative} 5px,\n\t\t\t\ttransparent 5px,\n\t\t\t\ttransparent 10px\n\t\t\t);\n\t\t}\n\t\t.line-left {\n\t\t\tbackground: repeating-linear-gradient(\n\t\t\t\tto bottom,\n\t\t\t\t${COLORS.content.negative},\n\t\t\t\t${COLORS.content.negative} 5px,\n\t\t\t\ttransparent 5px,\n\t\t\t\ttransparent 10px\n\t\t\t);\n\t\t}\n\t}\n\n\t.add-media-btn {\n\t\tdisplay: flex;\n\t\tflex-direction: column;\n\t\tjustify-content: center;\n\t\talign-items: center;\n\t\tborder: none;\n\t\tcursor: pointer;\n\t\twidth: ${(props) => (props.mediaType === MEDIA_TYPES.POST ? 148 : 108)}px;\n\t\theight: ${(props) => (props.mediaType === MEDIA_TYPES.POST ? 148 : 180)}px;\n\t\tposition: relative;\n\t\tbackground-color: transparent;\n\t\tborder-radius: 4px;\n\t\t.line-top {\n\t\t\tposition: absolute;\n\t\t\tleft: 0;\n\t\t\ttop: 0;\n\t\t\theight: 1px;\n\t\t\twidth: 100%;\n\t\t\tbackground: repeating-linear-gradient(\n\t\t\t\tto right,\n\t\t\t\t#9e9e9e,\n\t\t\t\t#9e9e9e 5px,\n\t\t\t\ttransparent 5px,\n\t\t\t\ttransparent 10px\n\t\t\t);\n\t\t}\n\t\t.line-right {\n\t\t\tposition: absolute;\n\t\t\tright: 0;\n\t\t\ttop: 0;\n\t\t\twidth: 1px;\n\t\t\theight: 100%;\n\t\t\tbackground: repeating-linear-gradient(\n\t\t\t\tto bottom,\n\t\t\t\t#9e9e9e,\n\t\t\t\t#9e9e9e 5px,\n\t\t\t\ttransparent 5px,\n\t\t\t\ttransparent 10px\n\t\t\t);\n\t\t}\n\t\t.line-bottom {\n\t\t\tposition: absolute;\n\t\t\tleft: 0;\n\t\t\tbottom: 0;\n\t\t\theight: 1px;\n\t\t\twidth: 100%;\n\t\t\tbackground: repeating-linear-gradient(\n\t\t\t\tto right,\n\t\t\t\t#9e9e9e,\n\t\t\t\t#9e9e9e 5px,\n\t\t\t\ttransparent 5px,\n\t\t\t\ttransparent 10px\n\t\t\t);\n\t\t}\n\t\t.line-left {\n\t\t\tposition: absolute;\n\t\t\tleft: 0;\n\t\t\ttop: 0;\n\t\t\twidth: 1px;\n\t\t\theight: 100%;\n\t\t\tbackground: repeating-linear-gradient(\n\t\t\t\tto bottom,\n\t\t\t\t#9e9e9e,\n\t\t\t\t#9e9e9e 5px,\n\t\t\t\ttransparent 5px,\n\t\t\t\ttransparent 10px\n\t\t\t);\n\t\t\t.overlay-container {\n\t\t\t\tdisplay: none;\n\t\t\t}\n\t\t}\n\t}\n\n\t.add-media-btn:hover {\n\t\t.overlay-container {\n\t\t\tdisplay: block;\n\t\t\tposition: absolute;\n\t\t\tpadding: 0;\n\t\t\tpadding-top: 1px;\n\t\t\ttop: 0;\n\t\t\tleft: 0;\n\t\t\twidth: 100%;\n\t\t\theight: 100%;\n\t\t\tbackground-color: #000000;\n\t\t\topacity: 0.03;\n\t\t}\n\t}\n\t.add-media-btn:active {\n\t\tbackground-color: ${COLORS.background.brandLight};\n\n\t\t.line-top,\n\t\t.line-bottom {\n\t\t\tbackground: repeating-linear-gradient(\n\t\t\t\tto right,\n\t\t\t\t${COLORS.content.brand},\n\t\t\t\t${COLORS.content.brand} 5px,\n\t\t\t\ttransparent 5px,\n\t\t\t\ttransparent 10px\n\t\t\t);\n\t\t}\n\t\t.line-right,\n\t\t.line-left {\n\t\t\tbackground: repeating-linear-gradient(\n\t\t\t\tto bottom,\n\t\t\t\t${COLORS.content.brand},\n\t\t\t\t${COLORS.content.brand} 5px,\n\t\t\t\ttransparent 5px,\n\t\t\t\ttransparent 10px\n\t\t\t);\n\t\t}\n\t}\n`;\n\nconst ProductCard = styled.div<{ mediaType: MEDIA_TYPES }>`\n\tborder-radius: 4px;\n\tborder: 1px solid ${COLORS.stroke.primary};\n\tposition: relative;\n\theight: ${(props) => (props.mediaType === MEDIA_TYPES.POST ? 150 : 182)}px;\n\n\t.overlay {\n\t\tdisplay: none;\n\t}\n\n\t.overlay__caption {\n\t\ttext-align: center;\n\t\tbackground: #fafafa;\n\t\tpadding: 10px 20px;\n\t\theight: 40px;\n\t\tdisplay: flex;\n\t\talign-items: center;\n\t\tjustify-content: center;\n\t\tborder-bottom-left-radius: 4px;\n\t\tborder-bottom-right-radius: 4px;\n\t}\n\n\t.overlay__redirection {\n\t\tdisplay: flex;\n\t\tjustify-content: center;\n\t\tgap: 5px;\n\t\tpadding: 10px;\n\t}\n\n\timg {\n\t\tborder-radius: 4px;\n\t\tobject-fit: cover;\n\t\twidth: ${(props) => (props.mediaType === MEDIA_TYPES.POST ? 148 : 108)}px;\n\t\theight: ${(props) => (props.mediaType === MEDIA_TYPES.POST ? 148 : 180)}px;\n\t}\n\t.cross-icon {\n\t\tposition: absolute;\n\t\tright: -8px;\n\t\ttop: -8px;\n\t\twidth: 20px;\n\t\theight: 20px;\n\t\tborder-radius: 10px;\n\t\tborder: 1px solid ${COLORS.stroke.primary};\n\t\tbackground-color: ${COLORS.surface.subdued};\n\t\tdisplay: flex;\n\t\talign-items: center;\n\t\tjustify-content: center;\n\t\tcursor: pointer;\n\t\tpadding: 0;\n\t}\n\n\t&:hover {\n\t\t.overlay {\n\t\t\ttop: 0;\n\t\t\tbackground-color: rgba(255, 255, 255, 0.9);\n\t\t\tborder-radius: 4px;\n\t\t\tdisplay: flex;\n\t\t\tflex-direction: column;\n\t\t\talign-items: center;\n\t\t\tjustify-content: space-between;\n\t\t\tposition: absolute;\n\t\t\twidth: ${(props) => (props.mediaType === MEDIA_TYPES.POST ? 148 : 108)}px;\n\t\t\theight: ${(props) =>\n\t\t\t\tprops.mediaType === MEDIA_TYPES.POST ? 148 : 180}px;\n\t\t\ta {\n\t\t\t\ttext-decoration: none;\n\t\t\t}\n\t\t}\n\t}\n`;\n"],"names":["IgPicker","props","showModal","setShowModal","useState","selectedMedia","setSelectedMedia","allMedia","setAllMedia","error","setError","useEffect","formattedData","item","formatTimestamp","date","inputDate","month","day","year","handleSelection","selection","handlePostPicker","handlePickerClose","handleDeleteSelection","id","updatedMedia","media","generateTitle","mediaType","MEDIA_TYPES","jsxs","IgPickerStyled","jsx","Sc.ButtonCustomDashedBorder","PlusIcon","COLORS","BodySecondary","unCamelCase","ProductCard","InstagramIcon","BodyPrimary","PRIMARY","BodyCaption","CrossIcon","PostPicker","PostIgPicker","ReelIgPicker","StoryIgPicker","styled"],"mappings":"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"}

package/dist/cjs/components/QueryBuilder/components/Connectors/Components/InTheLast.js

@@ -1,6 +1,6 @@
-"use strict";Object.defineProperties(exports,{__esModule:{value:!0},[Symbol.toStringTag]:{value:"Module"}});const s=require("react/jsx-runtime"),a=require("react"),h=require("styled-components"),q=require("../../../../input/context/InputStyleProvider.js"),c=require("../../../types/QueryBuilderEnum.type.js"),w=require("../../InputLoader.js"),I=require("../../../../input/Input.js"),b=require("../../../../dropdown/Dropdown.js"),S=h.div`
+"use strict";Object.defineProperties(exports,{__esModule:{value:!0},[Symbol.toStringTag]:{value:"Module"}});const s=require("react/jsx-runtime"),a=require("react"),b=require("styled-components"),h=require("../../../../input/context/InputStyleProvider.js"),c=require("../../../types/QueryBuilderEnum.type.js"),q=require("../../InputLoader.js"),w=require("../../../../input/Input.js"),I=require("../../../../dropdown/Dropdown.js"),S=e=>e&&typeof e=="object"&&"default"in e?e:{default:e},T=S(b),_=T.default.div`
 	display: flex;
 	flex-direction: row;
 	gap: 12px;
-`,p=e=>e===c.QueryBuilderConnectorType.exactly||e===c.QueryBuilderConnectorType.dateDaysOnly?[{label:"day(s)",value:"days"}]:[{label:"day(s)",value:"days"},{label:"minute(s)",value:"minutes"},{label:"hour(s)",value:"hours"}],T=({val:e,onChange:r,errors:y,isLoading:m,disabled:o,connectorType:u})=>{const[x,f]=a.useState(p(u)),v=e?.[1]??"days",d=e?.[0]??"1";return a.useEffect(()=>{const t=p(u),j=t.map(n=>n.value),i=e?.[1]??"days",l=j.includes(i)?i:"days";f(t.map(n=>({...n,selected:l===n.value}))),l!==i&&r?.([e?.[0]??"1",l])},[u,e]),a.useEffect(()=>{if(typeof e?.[0]>"u"){const t=e?.[1]??"days";r?.(["1",t])}},[]),m?s.jsx("div",{style:{width:200},children:s.jsx(w.default,{containerStyle:{padding:"5px 8px"}})}):s.jsx(q.InputStyleContext.Provider,{value:{InputWrapper:{width:104}},children:s.jsxs(S,{children:[s.jsx(I.Input,{type:"number",variant:"small",state:o?"disabled":"none",errorMessage:y?.val,value:d,onChangeText:t=>r?.([t,v])}),s.jsx(b.Dropdown,{disabled:o,placeHolder:"Time",width:"108px",size:"small",options:x,onSelect:t=>{r?.([d,t.value])}})]})})},O=e=>s.jsx(T,{...e});exports.default=O;
+`,p=e=>e===c.QueryBuilderConnectorType.exactly||e===c.QueryBuilderConnectorType.dateDaysOnly?[{label:"day(s)",value:"days"}]:[{label:"day(s)",value:"days"},{label:"minute(s)",value:"minutes"},{label:"hour(s)",value:"hours"}],O=({val:e,onChange:n,errors:y,isLoading:f,disabled:o,connectorType:u})=>{const[m,x]=a.useState(p(u)),v=e?.[1]??"days",d=e?.[0]??"1";return a.useEffect(()=>{const t=p(u),j=t.map(r=>r.value),i=e?.[1]??"days",l=j.includes(i)?i:"days";x(t.map(r=>({...r,selected:l===r.value}))),l!==i&&n?.([e?.[0]??"1",l])},[u,e]),a.useEffect(()=>{if(typeof e?.[0]>"u"){const t=e?.[1]??"days";n?.(["1",t])}},[]),f?s.jsx("div",{style:{width:200},children:s.jsx(q.default,{containerStyle:{padding:"5px 8px"}})}):s.jsx(h.InputStyleContext.Provider,{value:{InputWrapper:{width:104}},children:s.jsxs(_,{children:[s.jsx(w.Input,{type:"number",variant:"small",state:o?"disabled":"none",errorMessage:y?.val,value:d,onChangeText:t=>n?.([t,v])}),s.jsx(I.Dropdown,{disabled:o,placeHolder:"Time",width:"108px",size:"small",options:m,onSelect:t=>{n?.([d,t.value])}})]})})},D=e=>s.jsx(O,{...e});exports.default=D;
 //# sourceMappingURL=InTheLast.js.map

package/dist/cjs/components/QueryBuilder/components/Connectors/Components/InTheLast.js.map

@@ -1 +1 @@
-{"version":3,"file":"InTheLast.js","sources":["../../../../../../../src/components/QueryBuilder/components/Connectors/Components/InTheLast.tsx"],"sourcesContent":["import React, { useEffect, useState } from 'react';\nimport styled from 'styled-components';\nimport { Dropdown } from '@src/components/dropdown';\nimport { SingleOption } from '@src/components/dropdown/type';\nimport { Input } from '@src/components/input';\nimport { InputStyleContext } from '@src/components/input/context/InputStyleProvider';\nimport { ConnectorComponentProps } from '@src/components/QueryBuilder/types/QueryBuilderConnector.type';\nimport { QueryBuilderConnectorType } from '@src/components/QueryBuilder/types/QueryBuilderEnum.type';\nimport InputLoader from '../../InputLoader';\n\nconst Container = styled.div`\n\tdisplay: flex;\n\tflex-direction: row;\n\tgap: 12px;\n`;\n\nconst timeOptions = (connectorType: string) => {\n\tif (\n\t\tconnectorType === QueryBuilderConnectorType.exactly ||\n\t\tconnectorType === QueryBuilderConnectorType.dateDaysOnly\n\t) {\n\t\treturn [\n\t\t\t{\n\t\t\t\tlabel: 'day(s)',\n\t\t\t\tvalue: 'days',\n\t\t\t},\n\t\t];\n\t} else {\n\t\treturn [\n\t\t\t{\n\t\t\t\tlabel: 'day(s)',\n\t\t\t\tvalue: 'days',\n\t\t\t},\n\t\t\t{ label: 'minute(s)', value: 'minutes' },\n\t\t\t{ label: 'hour(s)', value: 'hours' },\n\t\t];\n\t}\n};\n\nconst InTheLast: React.FC<ConnectorComponentProps> = ({\n\tval,\n\tonChange,\n\terrors,\n\tisLoading,\n\tdisabled,\n\tconnectorType,\n}) => {\n\tconst [options, setOptions] = useState(timeOptions(connectorType));\n\n\tconst time = val?.[1] ?? 'days';\n\tconst num = val?.[0] ?? '1';\n\n\tuseEffect(() => {\n\t\tconst newOptions = timeOptions(connectorType);\n\t\tconst allowedValues = newOptions.map((o) => o.value);\n\t\tconst currentTime = val?.[1] ?? 'days';\n\t\tconst normalizedTime = allowedValues.includes(currentTime)\n\t\t\t? currentTime\n\t\t\t: 'days';\n\t\tsetOptions(\n\t\t\tnewOptions.map((op) => ({\n\t\t\t\t...op,\n\t\t\t\tselected: normalizedTime === op.value,\n\t\t\t})),\n\t\t);\n\t\tif (normalizedTime !== currentTime) {\n\t\t\tonChange?.([val?.[0] ?? '1', normalizedTime]);\n\t\t}\n\t}, [connectorType, val]);\n\n\tuseEffect(() => {\n\t\tif (typeof val?.[0] === 'undefined') {\n\t\t\tconst time = val?.[1] ?? 'days';\n\t\t\tonChange?.(['1', time]);\n\t\t}\n\t}, []);\n\n\tif (isLoading) {\n\t\treturn (\n\t\t\t<div style={{ width: 200 }}>\n\t\t\t\t<InputLoader containerStyle={{ padding: '5px 8px' }} />\n\t\t\t</div>\n\t\t);\n\t}\n\n\treturn (\n\t\t<InputStyleContext.Provider\n\t\t\tvalue={{\n\t\t\t\tInputWrapper: {\n\t\t\t\t\twidth: 104,\n\t\t\t\t},\n\t\t\t}}\n\t\t>\n\t\t\t<Container>\n\t\t\t\t<Input\n\t\t\t\t\ttype=\"number\"\n\t\t\t\t\tvariant=\"small\"\n\t\t\t\t\tstate={disabled ? 'disabled' : 'none'}\n\t\t\t\t\terrorMessage={errors?.val as string}\n\t\t\t\t\tvalue={num}\n\t\t\t\t\tonChangeText={(text) => onChange?.([text, time])}\n\t\t\t\t/>\n\t\t\t\t<Dropdown\n\t\t\t\t\tdisabled={disabled}\n\t\t\t\t\tplaceHolder=\"Time\"\n\t\t\t\t\twidth=\"108px\"\n\t\t\t\t\tsize=\"small\"\n\t\t\t\t\toptions={options}\n\t\t\t\t\tonSelect={(option) => {\n\t\t\t\t\t\tonChange?.([num, (option as SingleOption).value]);\n\t\t\t\t\t}}\n\t\t\t\t/>\n\t\t\t</Container>\n\t\t</InputStyleContext.Provider>\n\t);\n};\n\nconst InTheLastWrapper = (props: ConnectorComponentProps) => (\n\t<InTheLast {...props} />\n);\n\nexport default InTheLastWrapper;\n"],"names":["Container","styled","timeOptions","connectorType","QueryBuilderConnectorType","InTheLast","val","onChange","errors","isLoading","disabled","options","setOptions","useState","time","num","useEffect","newOptions","allowedValues","o","currentTime","normalizedTime","op","jsx","InputLoader","InputStyleContext","Input","text","Dropdown","option","InTheLastWrapper","props"],"mappings":"6aAUMA,EAAYC,EAAO;AAAA;AAAA;AAAA;AAAA,EAMnBC,EAAeC,GAEnBA,IAAkBC,EAAAA,0BAA0B,SAC5CD,IAAkBC,EAAAA,0BAA0B,aAErC,CACN,CACC,MAAO,SACP,MAAO,MAAA,CACR,EAGM,CACN,CACC,MAAO,SACP,MAAO,MAAA,EAER,CAAE,MAAO,YAAa,MAAO,SAAA,EAC7B,CAAE,MAAO,UAAW,MAAO,OAAA,CAAQ,EAKhCC,EAA+C,CAAC,CACrD,IAAAC,EACA,SAAAC,EACA,OAAAC,EACA,UAAAC,EACA,SAAAC,EACA,cAAAP,CACD,IAAM,CACL,KAAM,CAACQ,EAASC,CAAU,EAAIC,EAAAA,SAASX,EAAYC,CAAa,CAAC,EAE3DW,EAAOR,IAAM,CAAC,GAAK,OACnBS,EAAMT,IAAM,CAAC,GAAK,IA2BxB,OAzBAU,EAAAA,UAAU,IAAM,CACf,MAAMC,EAAaf,EAAYC,CAAa,EACtCe,EAAgBD,EAAW,IAAKE,GAAMA,EAAE,KAAK,EAC7CC,EAAcd,IAAM,CAAC,GAAK,OAC1Be,EAAiBH,EAAc,SAASE,CAAW,EACtDA,EACA,OACHR,EACCK,EAAW,IAAKK,IAAQ,CACvB,GAAGA,EACH,SAAUD,IAAmBC,EAAG,KAAA,EAC/B,CAAA,EAECD,IAAmBD,GACtBb,IAAW,CAACD,IAAM,CAAC,GAAK,IAAKe,CAAc,CAAC,CAE9C,EAAG,CAAClB,EAAeG,CAAG,CAAC,EAEvBU,EAAAA,UAAU,IAAM,CACf,GAAI,OAAOV,IAAM,CAAC,EAAM,IAAa,CACpC,MAAMQ,EAAOR,IAAM,CAAC,GAAK,OACzBC,IAAW,CAAC,IAAKO,CAAI,CAAC,CACvB,CACD,EAAG,CAAA,CAAE,EAEDL,EAEFc,EAAAA,IAAC,MAAA,CAAI,MAAO,CAAE,MAAO,KACpB,SAAAA,EAAAA,IAACC,EAAAA,QAAA,CAAY,eAAgB,CAAE,QAAS,SAAA,EAAa,EACtD,EAKDD,EAAAA,IAACE,EAAAA,kBAAkB,SAAlB,CACA,MAAO,CACN,aAAc,CACb,MAAO,GAAA,CACR,EAGD,gBAACzB,EAAA,CACA,SAAA,CAAAuB,EAAAA,IAACG,EAAAA,MAAA,CACA,KAAK,SACL,QAAQ,QACR,MAAOhB,EAAW,WAAa,OAC/B,aAAcF,GAAQ,IACtB,MAAOO,EACP,aAAeY,GAASpB,IAAW,CAACoB,EAAMb,CAAI,CAAC,CAAA,CAAA,EAEhDS,EAAAA,IAACK,EAAAA,SAAA,CACA,SAAAlB,EACA,YAAY,OACZ,MAAM,QACN,KAAK,QACL,QAAAC,EACA,SAAWkB,GAAW,CACrBtB,IAAW,CAACQ,EAAMc,EAAwB,KAAK,CAAC,CACjD,CAAA,CAAA,CACD,CAAA,CACD,CAAA,CAAA,CAGH,EAEMC,EAAoBC,GACzBR,EAAAA,IAAClB,EAAA,CAAW,GAAG0B,CAAA,CAAO"}
+{"version":3,"file":"InTheLast.js","sources":["../../../../../../../src/components/QueryBuilder/components/Connectors/Components/InTheLast.tsx"],"sourcesContent":["import React, { useEffect, useState } from 'react';\nimport styled from 'styled-components';\nimport { Dropdown } from '@src/components/dropdown';\nimport { SingleOption } from '@src/components/dropdown/type';\nimport { Input } from '@src/components/input';\nimport { InputStyleContext } from '@src/components/input/context/InputStyleProvider';\nimport { ConnectorComponentProps } from '@src/components/QueryBuilder/types/QueryBuilderConnector.type';\nimport { QueryBuilderConnectorType } from '@src/components/QueryBuilder/types/QueryBuilderEnum.type';\nimport InputLoader from '../../InputLoader';\n\nconst Container = styled.div`\n\tdisplay: flex;\n\tflex-direction: row;\n\tgap: 12px;\n`;\n\nconst timeOptions = (connectorType: string) => {\n\tif (\n\t\tconnectorType === QueryBuilderConnectorType.exactly ||\n\t\tconnectorType === QueryBuilderConnectorType.dateDaysOnly\n\t) {\n\t\treturn [\n\t\t\t{\n\t\t\t\tlabel: 'day(s)',\n\t\t\t\tvalue: 'days',\n\t\t\t},\n\t\t];\n\t} else {\n\t\treturn [\n\t\t\t{\n\t\t\t\tlabel: 'day(s)',\n\t\t\t\tvalue: 'days',\n\t\t\t},\n\t\t\t{ label: 'minute(s)', value: 'minutes' },\n\t\t\t{ label: 'hour(s)', value: 'hours' },\n\t\t];\n\t}\n};\n\nconst InTheLast: React.FC<ConnectorComponentProps> = ({\n\tval,\n\tonChange,\n\terrors,\n\tisLoading,\n\tdisabled,\n\tconnectorType,\n}) => {\n\tconst [options, setOptions] = useState(timeOptions(connectorType));\n\n\tconst time = val?.[1] ?? 'days';\n\tconst num = val?.[0] ?? '1';\n\n\tuseEffect(() => {\n\t\tconst newOptions = timeOptions(connectorType);\n\t\tconst allowedValues = newOptions.map((o) => o.value);\n\t\tconst currentTime = val?.[1] ?? 'days';\n\t\tconst normalizedTime = allowedValues.includes(currentTime)\n\t\t\t? currentTime\n\t\t\t: 'days';\n\t\tsetOptions(\n\t\t\tnewOptions.map((op) => ({\n\t\t\t\t...op,\n\t\t\t\tselected: normalizedTime === op.value,\n\t\t\t})),\n\t\t);\n\t\tif (normalizedTime !== currentTime) {\n\t\t\tonChange?.([val?.[0] ?? '1', normalizedTime]);\n\t\t}\n\t}, [connectorType, val]);\n\n\tuseEffect(() => {\n\t\tif (typeof val?.[0] === 'undefined') {\n\t\t\tconst time = val?.[1] ?? 'days';\n\t\t\tonChange?.(['1', time]);\n\t\t}\n\t}, []);\n\n\tif (isLoading) {\n\t\treturn (\n\t\t\t<div style={{ width: 200 }}>\n\t\t\t\t<InputLoader containerStyle={{ padding: '5px 8px' }} />\n\t\t\t</div>\n\t\t);\n\t}\n\n\treturn (\n\t\t<InputStyleContext.Provider\n\t\t\tvalue={{\n\t\t\t\tInputWrapper: {\n\t\t\t\t\twidth: 104,\n\t\t\t\t},\n\t\t\t}}\n\t\t>\n\t\t\t<Container>\n\t\t\t\t<Input\n\t\t\t\t\ttype=\"number\"\n\t\t\t\t\tvariant=\"small\"\n\t\t\t\t\tstate={disabled ? 'disabled' : 'none'}\n\t\t\t\t\terrorMessage={errors?.val as string}\n\t\t\t\t\tvalue={num}\n\t\t\t\t\tonChangeText={(text) => onChange?.([text, time])}\n\t\t\t\t/>\n\t\t\t\t<Dropdown\n\t\t\t\t\tdisabled={disabled}\n\t\t\t\t\tplaceHolder=\"Time\"\n\t\t\t\t\twidth=\"108px\"\n\t\t\t\t\tsize=\"small\"\n\t\t\t\t\toptions={options}\n\t\t\t\t\tonSelect={(option) => {\n\t\t\t\t\t\tonChange?.([num, (option as SingleOption).value]);\n\t\t\t\t\t}}\n\t\t\t\t/>\n\t\t\t</Container>\n\t\t</InputStyleContext.Provider>\n\t);\n};\n\nconst InTheLastWrapper = (props: ConnectorComponentProps) => (\n\t<InTheLast {...props} />\n);\n\nexport default InTheLastWrapper;\n"],"names":["Container","styled","timeOptions","connectorType","QueryBuilderConnectorType","InTheLast","val","onChange","errors","isLoading","disabled","options","setOptions","useState","time","num","useEffect","newOptions","allowedValues","o","currentTime","normalizedTime","op","jsx","InputLoader","InputStyleContext","Input","text","Dropdown","option","InTheLastWrapper","props"],"mappings":"4eAUMA,EAAYC,EAAAA,QAAO;AAAA;AAAA;AAAA;AAAA,EAMnBC,EAAeC,GAEnBA,IAAkBC,EAAAA,0BAA0B,SAC5CD,IAAkBC,EAAAA,0BAA0B,aAErC,CACN,CACC,MAAO,SACP,MAAO,MAAA,CACR,EAGM,CACN,CACC,MAAO,SACP,MAAO,MAAA,EAER,CAAE,MAAO,YAAa,MAAO,SAAA,EAC7B,CAAE,MAAO,UAAW,MAAO,OAAA,CAAQ,EAKhCC,EAA+C,CAAC,CACrD,IAAAC,EACA,SAAAC,EACA,OAAAC,EACA,UAAAC,EACA,SAAAC,EACA,cAAAP,CACD,IAAM,CACL,KAAM,CAACQ,EAASC,CAAU,EAAIC,EAAAA,SAASX,EAAYC,CAAa,CAAC,EAE3DW,EAAOR,IAAM,CAAC,GAAK,OACnBS,EAAMT,IAAM,CAAC,GAAK,IA2BxB,OAzBAU,EAAAA,UAAU,IAAM,CACf,MAAMC,EAAaf,EAAYC,CAAa,EACtCe,EAAgBD,EAAW,IAAKE,GAAMA,EAAE,KAAK,EAC7CC,EAAcd,IAAM,CAAC,GAAK,OAC1Be,EAAiBH,EAAc,SAASE,CAAW,EACtDA,EACA,OACHR,EACCK,EAAW,IAAKK,IAAQ,CACvB,GAAGA,EACH,SAAUD,IAAmBC,EAAG,KAAA,EAC/B,CAAA,EAECD,IAAmBD,GACtBb,IAAW,CAACD,IAAM,CAAC,GAAK,IAAKe,CAAc,CAAC,CAE9C,EAAG,CAAClB,EAAeG,CAAG,CAAC,EAEvBU,EAAAA,UAAU,IAAM,CACf,GAAI,OAAOV,IAAM,CAAC,EAAM,IAAa,CACpC,MAAMQ,EAAOR,IAAM,CAAC,GAAK,OACzBC,IAAW,CAAC,IAAKO,CAAI,CAAC,CACvB,CACD,EAAG,CAAA,CAAE,EAEDL,EAEFc,EAAAA,IAAC,MAAA,CAAI,MAAO,CAAE,MAAO,KACpB,SAAAA,EAAAA,IAACC,EAAAA,QAAA,CAAY,eAAgB,CAAE,QAAS,SAAA,EAAa,EACtD,EAKDD,EAAAA,IAACE,EAAAA,kBAAkB,SAAlB,CACA,MAAO,CACN,aAAc,CACb,MAAO,GAAA,CACR,EAGD,gBAACzB,EAAA,CACA,SAAA,CAAAuB,EAAAA,IAACG,EAAAA,MAAA,CACA,KAAK,SACL,QAAQ,QACR,MAAOhB,EAAW,WAAa,OAC/B,aAAcF,GAAQ,IACtB,MAAOO,EACP,aAAeY,GAASpB,IAAW,CAACoB,EAAMb,CAAI,CAAC,CAAA,CAAA,EAEhDS,EAAAA,IAACK,EAAAA,SAAA,CACA,SAAAlB,EACA,YAAY,OACZ,MAAM,QACN,KAAK,QACL,QAAAC,EACA,SAAWkB,GAAW,CACrBtB,IAAW,CAACQ,EAAMc,EAAwB,KAAK,CAAC,CACjD,CAAA,CAAA,CACD,CAAA,CACD,CAAA,CAAA,CAGH,EAEMC,EAAoBC,GACzBR,EAAAA,IAAClB,EAAA,CAAW,GAAG0B,CAAA,CAAO"}

package/dist/cjs/components/QueryBuilder/components/Connectors/Components/InTwoLast.js

@@ -1,7 +1,7 @@
-"use strict";Object.defineProperties(exports,{__esModule:{value:!0},[Symbol.toStringTag]:{value:"Module"}});const t=require("react/jsx-runtime"),p=require("react"),I=require("styled-components"),T=require("../../../../input/context/InputStyleProvider.js"),m=require("../../../types/QueryBuilderEnum.type.js"),b=require("../../../../TypographyStyle.js"),g=require("../../InputLoader.js"),j=require("../../../../input/Input.js"),O=require("../../../../dropdown/Dropdown.js"),D=I.div`
+"use strict";Object.defineProperties(exports,{__esModule:{value:!0},[Symbol.toStringTag]:{value:"Module"}});const t=require("react/jsx-runtime"),p=require("react"),q=require("styled-components"),I=require("../../../../input/context/InputStyleProvider.js"),m=require("../../../types/QueryBuilderEnum.type.js"),T=require("../../../../TypographyStyle.js"),g=require("../../InputLoader.js"),j=require("../../../../input/Input.js"),O=require("../../../../dropdown/Dropdown.js"),D=e=>e&&typeof e=="object"&&"default"in e?e:{default:e},_=D(q),B=_.default.div`
 	display: flex;
 	flex-direction: row;
 	gap: 12px;
 	align-items: center;
-`,v=e=>e?[{label:"day(s)",value:"days"}]:[{label:"day(s)",value:"days"},{label:"minute(s)",value:"minutes"},{label:"hour(s)",value:"hours"}],B=({val:e,onChange:n,errors:f,isLoading:S,disabled:a,connectorType:i})=>{const w=i===m.QueryBuilderConnectorType.dateDaysOnly,[h,q]=p.useState(v(w)),x=e?.type??"days",u=e?.start??"1",l=e?.offset??"2";return p.useEffect(()=>{const s=i===m.QueryBuilderConnectorType.dateDaysOnly,r=v(s),d=r.map(o=>o.value),y=e?.type??"days",c=d.includes(y)?y:"days";q(r.map(o=>({...o,selected:c===o.value}))),c!==y&&n?.({type:c,start:e?.start??"1",offset:e?.offset??"2"})},[i,e]),p.useEffect(()=>{if(typeof e?.start>"u"){const s=e?.type??"days",r=e?.start??"1",d=e?.offset??"2";n?.({type:s,start:r,offset:d})}},[]),S?t.jsx("div",{style:{width:200},children:t.jsx(g.default,{containerStyle:{padding:"5px 8px"}})}):t.jsx(T.InputStyleContext.Provider,{value:{InputWrapper:{width:104}},children:t.jsxs(D,{children:[t.jsx(j.Input,{type:"number",variant:"small",state:a?"disabled":"none",errorMessage:f?.val,value:l.toString(),onChangeText:s=>n?.({type:x,start:u,offset:s})}),t.jsx("div",{children:t.jsx(b.BodySecondary,{children:"to"})}),t.jsx(j.Input,{type:"number",variant:"small",state:a?"disabled":"none",errorMessage:f?.val,value:u.toString(),onChangeText:s=>n?.({type:x,start:s,offset:l})}),t.jsx(O.Dropdown,{disabled:a,placeHolder:"Time",width:"108px",size:"small",options:h,onSelect:s=>{n?.({type:s.value,start:u,offset:l})}})]})})},M=e=>t.jsx(B,{...e});exports.default=M;
+`,v=e=>e?[{label:"day(s)",value:"days"}]:[{label:"day(s)",value:"days"},{label:"minute(s)",value:"minutes"},{label:"hour(s)",value:"hours"}],M=({val:e,onChange:n,errors:f,isLoading:S,disabled:a,connectorType:u})=>{const w=u===m.QueryBuilderConnectorType.dateDaysOnly,[b,h]=p.useState(v(w)),x=e?.type??"days",i=e?.start??"1",l=e?.offset??"2";return p.useEffect(()=>{const s=u===m.QueryBuilderConnectorType.dateDaysOnly,r=v(s),d=r.map(o=>o.value),y=e?.type??"days",c=d.includes(y)?y:"days";h(r.map(o=>({...o,selected:c===o.value}))),c!==y&&n?.({type:c,start:e?.start??"1",offset:e?.offset??"2"})},[u,e]),p.useEffect(()=>{if(typeof e?.start>"u"){const s=e?.type??"days",r=e?.start??"1",d=e?.offset??"2";n?.({type:s,start:r,offset:d})}},[]),S?t.jsx("div",{style:{width:200},children:t.jsx(g.default,{containerStyle:{padding:"5px 8px"}})}):t.jsx(I.InputStyleContext.Provider,{value:{InputWrapper:{width:104}},children:t.jsxs(B,{children:[t.jsx(j.Input,{type:"number",variant:"small",state:a?"disabled":"none",errorMessage:f?.val,value:l.toString(),onChangeText:s=>n?.({type:x,start:i,offset:s})}),t.jsx("div",{children:t.jsx(T.BodySecondary,{children:"to"})}),t.jsx(j.Input,{type:"number",variant:"small",state:a?"disabled":"none",errorMessage:f?.val,value:i.toString(),onChangeText:s=>n?.({type:x,start:s,offset:l})}),t.jsx(O.Dropdown,{disabled:a,placeHolder:"Time",width:"108px",size:"small",options:b,onSelect:s=>{n?.({type:s.value,start:i,offset:l})}})]})})},C=e=>t.jsx(M,{...e});exports.default=C;
 //# sourceMappingURL=InTwoLast.js.map

package/dist/cjs/components/QueryBuilder/components/Connectors/Components/InTwoLast.js.map

@@ -1 +1 @@
-{"version":3,"file":"InTwoLast.js","sources":["../../../../../../../src/components/QueryBuilder/components/Connectors/Components/InTwoLast.tsx"],"sourcesContent":["import React, { useEffect, useState } from 'react';\nimport styled from 'styled-components';\nimport { Dropdown } from '@src/components/dropdown';\nimport { SingleOption } from '@src/components/dropdown/type';\nimport { Input } from '@src/components/input';\nimport { InputStyleContext } from '@src/components/input/context/InputStyleProvider';\nimport { ConnectorComponentProps } from '@src/components/QueryBuilder/types/QueryBuilderConnector.type';\nimport { QueryBuilderConnectorType } from '@src/components/QueryBuilder/types/QueryBuilderEnum.type';\nimport { BodySecondary } from '@src/components/TypographyStyle';\nimport InputLoader from '../../InputLoader';\n\nconst Container = styled.div`\n\tdisplay: flex;\n\tflex-direction: row;\n\tgap: 12px;\n\talign-items: center;\n`;\n\nconst timeOptions = (daysOnly: boolean) => {\n\tif (daysOnly) {\n\t\treturn [\n\t\t\t{\n\t\t\t\tlabel: 'day(s)',\n\t\t\t\tvalue: 'days',\n\t\t\t},\n\t\t];\n\t}\n\treturn [\n\t\t{\n\t\t\tlabel: 'day(s)',\n\t\t\tvalue: 'days',\n\t\t},\n\t\t{ label: 'minute(s)', value: 'minutes' },\n\t\t{ label: 'hour(s)', value: 'hours' },\n\t];\n};\n\nconst InTwoLast: React.FC<\n\tOmit<ConnectorComponentProps, 'val'> & {\n\t\tval: { type: string; start: string | number; offset: string | number };\n\t}\n> = ({ val, onChange, errors, isLoading, disabled, connectorType }) => {\n\tconst isDaysOnly = connectorType === QueryBuilderConnectorType.dateDaysOnly;\n\tconst [options, setOptions] = useState(timeOptions(isDaysOnly));\n\n\tconst type = val?.type ?? 'days';\n\tconst start = val?.start ?? '1';\n\tconst offset = val?.offset ?? '2';\n\n\tuseEffect(() => {\n\t\tconst daysOnly = connectorType === QueryBuilderConnectorType.dateDaysOnly;\n\t\tconst newOptions = timeOptions(daysOnly);\n\t\tconst allowedValues = newOptions.map((o) => o.value);\n\t\tconst currentType = val?.type ?? 'days';\n\t\tconst normalizedType = allowedValues.includes(currentType)\n\t\t\t? currentType\n\t\t\t: 'days';\n\t\tsetOptions(\n\t\t\tnewOptions.map((op) => ({\n\t\t\t\t...op,\n\t\t\t\tselected: normalizedType === op.value,\n\t\t\t})),\n\t\t);\n\t\tif (normalizedType !== currentType) {\n\t\t\tonChange?.({\n\t\t\t\ttype: normalizedType,\n\t\t\t\tstart: val?.start ?? '1',\n\t\t\t\toffset: val?.offset ?? '2',\n\t\t\t});\n\t\t}\n\t}, [connectorType, val]);\n\n\tuseEffect(() => {\n\t\tif (typeof val?.start === 'undefined') {\n\t\t\tconst type = val?.type ?? 'days';\n\t\t\tconst start = val?.start ?? '1';\n\t\t\tconst offset = val?.offset ?? '2';\n\t\t\tonChange?.({\n\t\t\t\ttype,\n\t\t\t\tstart,\n\t\t\t\toffset,\n\t\t\t});\n\t\t}\n\t}, []);\n\n\tif (isLoading) {\n\t\treturn (\n\t\t\t<div style={{ width: 200 }}>\n\t\t\t\t<InputLoader containerStyle={{ padding: '5px 8px' }} />\n\t\t\t</div>\n\t\t);\n\t}\n\n\treturn (\n\t\t<InputStyleContext.Provider\n\t\t\tvalue={{\n\t\t\t\tInputWrapper: {\n\t\t\t\t\twidth: 104,\n\t\t\t\t},\n\t\t\t}}\n\t\t>\n\t\t\t<Container>\n\t\t\t\t<Input\n\t\t\t\t\ttype=\"number\"\n\t\t\t\t\tvariant=\"small\"\n\t\t\t\t\tstate={disabled ? 'disabled' : 'none'}\n\t\t\t\t\terrorMessage={errors?.val as string}\n\t\t\t\t\tvalue={offset.toString()}\n\t\t\t\t\tonChangeText={(text) =>\n\t\t\t\t\t\tonChange?.({\n\t\t\t\t\t\t\ttype,\n\t\t\t\t\t\t\tstart,\n\t\t\t\t\t\t\toffset: text,\n\t\t\t\t\t\t})\n\t\t\t\t\t}\n\t\t\t\t/>\n\t\t\t\t<div>\n\t\t\t\t\t<BodySecondary>to</BodySecondary>\n\t\t\t\t</div>\n\t\t\t\t<Input\n\t\t\t\t\ttype=\"number\"\n\t\t\t\t\tvariant=\"small\"\n\t\t\t\t\tstate={disabled ? 'disabled' : 'none'}\n\t\t\t\t\terrorMessage={errors?.val as string}\n\t\t\t\t\tvalue={start.toString()}\n\t\t\t\t\tonChangeText={(text) =>\n\t\t\t\t\t\tonChange?.({\n\t\t\t\t\t\t\ttype,\n\t\t\t\t\t\t\tstart: text,\n\t\t\t\t\t\t\toffset,\n\t\t\t\t\t\t})\n\t\t\t\t\t}\n\t\t\t\t/>\n\t\t\t\t<Dropdown\n\t\t\t\t\tdisabled={disabled}\n\t\t\t\t\tplaceHolder=\"Time\"\n\t\t\t\t\twidth=\"108px\"\n\t\t\t\t\tsize=\"small\"\n\t\t\t\t\toptions={options}\n\t\t\t\t\tonSelect={(option) => {\n\t\t\t\t\t\tonChange?.({\n\t\t\t\t\t\t\ttype: (option as SingleOption).value,\n\t\t\t\t\t\t\tstart,\n\t\t\t\t\t\t\toffset,\n\t\t\t\t\t\t});\n\t\t\t\t\t}}\n\t\t\t\t/>\n\t\t\t</Container>\n\t\t</InputStyleContext.Provider>\n\t);\n};\n\n// eslint-disable-next-line @typescript-eslint/ban-ts-comment\n// @ts-ignore\n// eslint-disable-next-line react/display-name\nexport default (props: ConnectorComponentProps) => <InTwoLast {...props} />;\n"],"names":["Container","styled","timeOptions","daysOnly","InTwoLast","val","onChange","errors","isLoading","disabled","connectorType","isDaysOnly","QueryBuilderConnectorType","options","setOptions","useState","type","start","offset","useEffect","newOptions","allowedValues","currentType","normalizedType","op","jsx","InputLoader","InputStyleContext","Input","text","BodySecondary","Dropdown","option","props"],"mappings":"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"}
+{"version":3,"file":"InTwoLast.js","sources":["../../../../../../../src/components/QueryBuilder/components/Connectors/Components/InTwoLast.tsx"],"sourcesContent":["import React, { useEffect, useState } from 'react';\nimport styled from 'styled-components';\nimport { Dropdown } from '@src/components/dropdown';\nimport { SingleOption } from '@src/components/dropdown/type';\nimport { Input } from '@src/components/input';\nimport { InputStyleContext } from '@src/components/input/context/InputStyleProvider';\nimport { ConnectorComponentProps } from '@src/components/QueryBuilder/types/QueryBuilderConnector.type';\nimport { QueryBuilderConnectorType } from '@src/components/QueryBuilder/types/QueryBuilderEnum.type';\nimport { BodySecondary } from '@src/components/TypographyStyle';\nimport InputLoader from '../../InputLoader';\n\nconst Container = styled.div`\n\tdisplay: flex;\n\tflex-direction: row;\n\tgap: 12px;\n\talign-items: center;\n`;\n\nconst timeOptions = (daysOnly: boolean) => {\n\tif (daysOnly) {\n\t\treturn [\n\t\t\t{\n\t\t\t\tlabel: 'day(s)',\n\t\t\t\tvalue: 'days',\n\t\t\t},\n\t\t];\n\t}\n\treturn [\n\t\t{\n\t\t\tlabel: 'day(s)',\n\t\t\tvalue: 'days',\n\t\t},\n\t\t{ label: 'minute(s)', value: 'minutes' },\n\t\t{ label: 'hour(s)', value: 'hours' },\n\t];\n};\n\nconst InTwoLast: React.FC<\n\tOmit<ConnectorComponentProps, 'val'> & {\n\t\tval: { type: string; start: string | number; offset: string | number };\n\t}\n> = ({ val, onChange, errors, isLoading, disabled, connectorType }) => {\n\tconst isDaysOnly = connectorType === QueryBuilderConnectorType.dateDaysOnly;\n\tconst [options, setOptions] = useState(timeOptions(isDaysOnly));\n\n\tconst type = val?.type ?? 'days';\n\tconst start = val?.start ?? '1';\n\tconst offset = val?.offset ?? '2';\n\n\tuseEffect(() => {\n\t\tconst daysOnly = connectorType === QueryBuilderConnectorType.dateDaysOnly;\n\t\tconst newOptions = timeOptions(daysOnly);\n\t\tconst allowedValues = newOptions.map((o) => o.value);\n\t\tconst currentType = val?.type ?? 'days';\n\t\tconst normalizedType = allowedValues.includes(currentType)\n\t\t\t? currentType\n\t\t\t: 'days';\n\t\tsetOptions(\n\t\t\tnewOptions.map((op) => ({\n\t\t\t\t...op,\n\t\t\t\tselected: normalizedType === op.value,\n\t\t\t})),\n\t\t);\n\t\tif (normalizedType !== currentType) {\n\t\t\tonChange?.({\n\t\t\t\ttype: normalizedType,\n\t\t\t\tstart: val?.start ?? '1',\n\t\t\t\toffset: val?.offset ?? '2',\n\t\t\t});\n\t\t}\n\t}, [connectorType, val]);\n\n\tuseEffect(() => {\n\t\tif (typeof val?.start === 'undefined') {\n\t\t\tconst type = val?.type ?? 'days';\n\t\t\tconst start = val?.start ?? '1';\n\t\t\tconst offset = val?.offset ?? '2';\n\t\t\tonChange?.({\n\t\t\t\ttype,\n\t\t\t\tstart,\n\t\t\t\toffset,\n\t\t\t});\n\t\t}\n\t}, []);\n\n\tif (isLoading) {\n\t\treturn (\n\t\t\t<div style={{ width: 200 }}>\n\t\t\t\t<InputLoader containerStyle={{ padding: '5px 8px' }} />\n\t\t\t</div>\n\t\t);\n\t}\n\n\treturn (\n\t\t<InputStyleContext.Provider\n\t\t\tvalue={{\n\t\t\t\tInputWrapper: {\n\t\t\t\t\twidth: 104,\n\t\t\t\t},\n\t\t\t}}\n\t\t>\n\t\t\t<Container>\n\t\t\t\t<Input\n\t\t\t\t\ttype=\"number\"\n\t\t\t\t\tvariant=\"small\"\n\t\t\t\t\tstate={disabled ? 'disabled' : 'none'}\n\t\t\t\t\terrorMessage={errors?.val as string}\n\t\t\t\t\tvalue={offset.toString()}\n\t\t\t\t\tonChangeText={(text) =>\n\t\t\t\t\t\tonChange?.({\n\t\t\t\t\t\t\ttype,\n\t\t\t\t\t\t\tstart,\n\t\t\t\t\t\t\toffset: text,\n\t\t\t\t\t\t})\n\t\t\t\t\t}\n\t\t\t\t/>\n\t\t\t\t<div>\n\t\t\t\t\t<BodySecondary>to</BodySecondary>\n\t\t\t\t</div>\n\t\t\t\t<Input\n\t\t\t\t\ttype=\"number\"\n\t\t\t\t\tvariant=\"small\"\n\t\t\t\t\tstate={disabled ? 'disabled' : 'none'}\n\t\t\t\t\terrorMessage={errors?.val as string}\n\t\t\t\t\tvalue={start.toString()}\n\t\t\t\t\tonChangeText={(text) =>\n\t\t\t\t\t\tonChange?.({\n\t\t\t\t\t\t\ttype,\n\t\t\t\t\t\t\tstart: text,\n\t\t\t\t\t\t\toffset,\n\t\t\t\t\t\t})\n\t\t\t\t\t}\n\t\t\t\t/>\n\t\t\t\t<Dropdown\n\t\t\t\t\tdisabled={disabled}\n\t\t\t\t\tplaceHolder=\"Time\"\n\t\t\t\t\twidth=\"108px\"\n\t\t\t\t\tsize=\"small\"\n\t\t\t\t\toptions={options}\n\t\t\t\t\tonSelect={(option) => {\n\t\t\t\t\t\tonChange?.({\n\t\t\t\t\t\t\ttype: (option as SingleOption).value,\n\t\t\t\t\t\t\tstart,\n\t\t\t\t\t\t\toffset,\n\t\t\t\t\t\t});\n\t\t\t\t\t}}\n\t\t\t\t/>\n\t\t\t</Container>\n\t\t</InputStyleContext.Provider>\n\t);\n};\n\n// eslint-disable-next-line @typescript-eslint/ban-ts-comment\n// @ts-ignore\n// eslint-disable-next-line react/display-name\nexport default (props: ConnectorComponentProps) => <InTwoLast {...props} />;\n"],"names":["Container","styled","timeOptions","daysOnly","InTwoLast","val","onChange","errors","isLoading","disabled","connectorType","isDaysOnly","QueryBuilderConnectorType","options","setOptions","useState","type","start","offset","useEffect","newOptions","allowedValues","currentType","normalizedType","op","jsx","InputLoader","InputStyleContext","Input","text","BodySecondary","Dropdown","option","props"],"mappings":"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"}

package/dist/cjs/components/QueryBuilder/components/Connectors/Connector.styled.js

@@ -1,7 +1,7 @@
-"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const e=require("styled-components"),t=e.div`
+"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const e=require("styled-components"),o=t=>t&&typeof t=="object"&&"default"in t?t:{default:t},a=o(e),i=a.default.div`
 	display: flex;
 	flex-direction: row;
 	gap: 12px;
 	align-items: start;
-`;exports.Container=t;
+`;exports.Container=i;
 //# sourceMappingURL=Connector.styled.js.map

package/dist/cjs/components/QueryBuilder/components/Connectors/Connector.styled.js.map

@@ -1 +1 @@
-{"version":3,"file":"Connector.styled.js","sources":["../../../../../../src/components/QueryBuilder/components/Connectors/Connector.styled.ts"],"sourcesContent":["import styled from 'styled-components';\n\nexport const Container = styled.div`\n\tdisplay: flex;\n\tflex-direction: row;\n\tgap: 12px;\n\talign-items: start;\n`;\n"],"names":["Container","styled"],"mappings":"qHAEaA,EAAYC,EAAO;AAAA;AAAA;AAAA;AAAA;AAAA"}
+{"version":3,"file":"Connector.styled.js","sources":["../../../../../../src/components/QueryBuilder/components/Connectors/Connector.styled.ts"],"sourcesContent":["import styled from 'styled-components';\n\nexport const Container = styled.div`\n\tdisplay: flex;\n\tflex-direction: row;\n\tgap: 12px;\n\talign-items: start;\n`;\n"],"names":["Container","styled"],"mappings":"oLAEaA,EAAYC,EAAAA,QAAO;AAAA;AAAA;AAAA;AAAA;AAAA"}

package/dist/cjs/components/QueryBuilder/components/InputLoader.js

@@ -1,12 +1,12 @@
-"use strict";Object.defineProperties(exports,{__esModule:{value:!0},[Symbol.toStringTag]:{value:"Module"}});const r=require("react/jsx-runtime"),n=require("styled-components"),t=require("../../TypographyStyle.js"),e=require("../../../constants/Theme.js"),i=require("../../spinner/Spinner.js"),s=n.div`
+"use strict";Object.defineProperties(exports,{__esModule:{value:!0},[Symbol.toStringTag]:{value:"Module"}});const t=require("react/jsx-runtime"),o=require("styled-components"),n=require("../../TypographyStyle.js"),r=require("../../../constants/Theme.js"),d=require("../../spinner/Spinner.js"),i=e=>e&&typeof e=="object"&&"default"in e?e:{default:e},s=i(o),l=s.default.div`
 	width: 200px;
 	display: flex;
 	flex-direction: row;
 	align-items: center;
 	padding: 4px 8px;
 	width: 200px;
-	background: ${e.COLORS.surface.hovered};
-	border: 1px solid ${e.COLORS.stroke.primary};
+	background: ${r.COLORS.surface.hovered};
+	border: 1px solid ${r.COLORS.stroke.primary};
 	border-radius: 4px;
-`,d=({containerStyle:o})=>r.jsxs(s,{style:{...o??{}},children:[r.jsx(t.BodySecondary,{style:{color:e.COLORS.content.secondary,flex:1},children:"Loading..."}),r.jsx(i.Spinner,{size:"small",color:e.COLORS.stroke.brand})]});exports.default=d;
+`,a=({containerStyle:e})=>t.jsxs(l,{style:{...e??{}},children:[t.jsx(n.BodySecondary,{style:{color:r.COLORS.content.secondary,flex:1},children:"Loading..."}),t.jsx(d.Spinner,{size:"small",color:r.COLORS.stroke.brand})]});exports.default=a;
 //# sourceMappingURL=InputLoader.js.map

package/dist/cjs/components/QueryBuilder/components/InputLoader.js.map

@@ -1 +1 @@
-{"version":3,"file":"InputLoader.js","sources":["../../../../../src/components/QueryBuilder/components/InputLoader.tsx"],"sourcesContent":["import React from 'react';\nimport styled from 'styled-components';\nimport { Spinner } from '@src/components/spinner';\nimport { BodySecondary } from '@src/components/TypographyStyle';\nimport { COLORS } from '@src/constants/Theme';\n\nconst LoadingContainer = styled.div`\n\twidth: 200px;\n\tdisplay: flex;\n\tflex-direction: row;\n\talign-items: center;\n\tpadding: 4px 8px;\n\twidth: 200px;\n\tbackground: ${COLORS.surface.hovered};\n\tborder: 1px solid ${COLORS.stroke.primary};\n\tborder-radius: 4px;\n`;\n\nconst InputLoader: React.FC<{\n\tcontainerStyle?: React.CSSProperties;\n}> = ({ containerStyle }) => {\n\treturn (\n\t\t<LoadingContainer style={{ ...(containerStyle ?? {}) }}>\n\t\t\t<BodySecondary style={{ color: COLORS.content.secondary, flex: 1 }}>\n\t\t\t\tLoading...\n\t\t\t</BodySecondary>\n\t\t\t<Spinner size={'small'} color={COLORS.stroke.brand} />\n\t\t</LoadingContainer>\n\t);\n};\n\nexport default InputLoader;\n"],"names":["LoadingContainer","styled","COLORS","InputLoader","containerStyle","jsxs","jsx","BodySecondary","Spinner"],"mappings":"qSAMMA,EAAmBC,EAAO;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA,eAOjBC,EAAAA,OAAO,QAAQ,OAAO;AAAA,qBAChBA,EAAAA,OAAO,OAAO,OAAO;AAAA;AAAA,EAIpCC,EAED,CAAC,CAAE,eAAAC,KAENC,EAAAA,KAACL,GAAiB,MAAO,CAAE,GAAII,GAAkB,CAAA,GAChD,SAAA,CAAAE,EAAAA,IAACC,EAAAA,cAAA,CAAc,MAAO,CAAE,MAAOL,EAAAA,OAAO,QAAQ,UAAW,KAAM,CAAA,EAAK,SAAA,YAAA,CAEpE,QACCM,EAAAA,QAAA,CAAQ,KAAM,QAAS,MAAON,EAAAA,OAAO,OAAO,KAAA,CAAO,CAAA,EACrD"}
+{"version":3,"file":"InputLoader.js","sources":["../../../../../src/components/QueryBuilder/components/InputLoader.tsx"],"sourcesContent":["import React from 'react';\nimport styled from 'styled-components';\nimport { Spinner } from '@src/components/spinner';\nimport { BodySecondary } from '@src/components/TypographyStyle';\nimport { COLORS } from '@src/constants/Theme';\n\nconst LoadingContainer = styled.div`\n\twidth: 200px;\n\tdisplay: flex;\n\tflex-direction: row;\n\talign-items: center;\n\tpadding: 4px 8px;\n\twidth: 200px;\n\tbackground: ${COLORS.surface.hovered};\n\tborder: 1px solid ${COLORS.stroke.primary};\n\tborder-radius: 4px;\n`;\n\nconst InputLoader: React.FC<{\n\tcontainerStyle?: React.CSSProperties;\n}> = ({ containerStyle }) => {\n\treturn (\n\t\t<LoadingContainer style={{ ...(containerStyle ?? {}) }}>\n\t\t\t<BodySecondary style={{ color: COLORS.content.secondary, flex: 1 }}>\n\t\t\t\tLoading...\n\t\t\t</BodySecondary>\n\t\t\t<Spinner size={'small'} color={COLORS.stroke.brand} />\n\t\t</LoadingContainer>\n\t);\n};\n\nexport default InputLoader;\n"],"names":["LoadingContainer","styled","COLORS","InputLoader","containerStyle","jsxs","jsx","BodySecondary","Spinner"],"mappings":"oWAMMA,EAAmBC,EAAAA,QAAO;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA,eAOjBC,EAAAA,OAAO,QAAQ,OAAO;AAAA,qBAChBA,EAAAA,OAAO,OAAO,OAAO;AAAA;AAAA,EAIpCC,EAED,CAAC,CAAE,eAAAC,KAENC,EAAAA,KAACL,GAAiB,MAAO,CAAE,GAAII,GAAkB,CAAA,GAChD,SAAA,CAAAE,EAAAA,IAACC,EAAAA,cAAA,CAAc,MAAO,CAAE,MAAOL,EAAAA,OAAO,QAAQ,UAAW,KAAM,CAAA,EAAK,SAAA,YAAA,CAEpE,QACCM,EAAAA,QAAA,CAAQ,KAAM,QAAS,MAAON,EAAAA,OAAO,OAAO,KAAA,CAAO,CAAA,EACrD"}

package/dist/cjs/components/QueryBuilder/components/QueryBuilderNode/Base/BaseQueryBuilderNode.js

@@ -1,10 +1,10 @@
-"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const r=require("react/jsx-runtime"),n=require("styled-components"),s=require("../../../../../constants/Theme.js"),c=require("../Property/PropertyNodes.js"),l=n.div`
-	background: ${s.COLORS.surface.subdued};
-	border: 1px solid ${s.COLORS.stroke.primary};
+"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const t=require("react/jsx-runtime"),n=require("styled-components"),o=require("../../../../../constants/Theme.js"),l=require("../Property/PropertyNodes.js"),a=e=>e&&typeof e=="object"&&"default"in e?e:{default:e},c=a(n),f=c.default.div`
+	background: ${o.COLORS.surface.subdued};
+	border: 1px solid ${o.COLORS.stroke.primary};
 	border-radius: 4px;
 	padding: 12px;
 	width: 100%;
 	display: flex;
 	flex-direction: column;
-`,a=({children:d,node:i,addPropertyBtnText:e,deleteProperty:o,createProperty:u,...t})=>r.jsxs(l,{children:[d,e&&r.jsx(c.default,{node:i,addPropertyBtnText:e,deleteProperty:o,createProperty:u,...t})]});exports.BaseQueryBuilderNode=a;
+`,p=({children:e,node:d,addPropertyBtnText:r,deleteProperty:s,createProperty:u,...i})=>t.jsxs(f,{children:[e,r&&t.jsx(l.default,{node:d,addPropertyBtnText:r,deleteProperty:s,createProperty:u,...i})]});exports.BaseQueryBuilderNode=p;
 //# sourceMappingURL=BaseQueryBuilderNode.js.map

package/dist/cjs/components/QueryBuilder/components/QueryBuilderNode/Base/BaseQueryBuilderNode.js.map

@@ -1 +1 @@
-{"version":3,"file":"BaseQueryBuilderNode.js","sources":["../../../../../../../src/components/QueryBuilder/components/QueryBuilderNode/Base/BaseQueryBuilderNode.tsx"],"sourcesContent":["import React from 'react';\nimport styled from 'styled-components';\nimport { DropdownOption } from '@src/components/dropdown/type';\nimport {\n\tBaseQueryBuilderNode as BaseQueryBuilderNodeType,\n\tQueryBuilderProperty,\n} from '@src/components/QueryBuilder/types/QueryBuilder.type';\nimport { QueryBuilderPropertyProps } from '@src/components/QueryBuilder/types/QueryBuilderPropertyProps';\nimport { COLORS } from '@src/constants/Theme';\nimport PropertyNodes from '../Property/PropertyNodes';\n\nconst Container = styled.div`\n\tbackground: ${COLORS.surface.subdued};\n\tborder: 1px solid ${COLORS.stroke.primary};\n\tborder-radius: 4px;\n\tpadding: 12px;\n\twidth: 100%;\n\tdisplay: flex;\n\tflex-direction: column;\n`;\n\ntype BaseQueryBuilderNodeProps = Omit<QueryBuilderPropertyProps, 'property'> & {\n\tdeleteProperty?: (\n\t\tproperty: Partial<QueryBuilderProperty>,\n\t\tnodeID: string,\n\t) => void;\n\tcreateProperty?: (\n\t\tproperty: Partial<QueryBuilderProperty>,\n\t\tnodeID: string,\n\t) => void;\n\t/** if this is undefined, we will assume that this node doesnt support properties, so property list and adding feature will be hidden */\n\taddPropertyBtnText?: string;\n\tnode: BaseQueryBuilderNodeType;\n\tchildren: React.ReactNode;\n\tonPropertyValueSearch?: (\n\t\tsearchKey: string,\n\t\tproperty: QueryBuilderProperty,\n\t) => Promise<DropdownOption[]>;\n};\n\n/**\n * @exported\n * @stateless\n * @param param0\n * @returns\n */\nexport const BaseQueryBuilderNode: React.FC<\n\tBaseQueryBuilderNodeProps & { children: React.ReactNode }\n> = ({\n\tchildren,\n\tnode,\n\taddPropertyBtnText,\n\tdeleteProperty,\n\tcreateProperty,\n\t...propertyProps\n}) => {\n\treturn (\n\t\t<Container>\n\t\t\t{children}\n\n\t\t\t{addPropertyBtnText && (\n\t\t\t\t<PropertyNodes\n\t\t\t\t\tnode={node}\n\t\t\t\t\taddPropertyBtnText={addPropertyBtnText}\n\t\t\t\t\tdeleteProperty={deleteProperty!}\n\t\t\t\t\tcreateProperty={createProperty!}\n\t\t\t\t\t{...propertyProps}\n\t\t\t\t/>\n\t\t\t)}\n\t\t</Container>\n\t);\n};\n"],"names":["Container","styled","COLORS","BaseQueryBuilderNode","children","node","addPropertyBtnText","deleteProperty","createProperty","propertyProps","jsx","PropertyNodes"],"mappings":"6OAWMA,EAAYC,EAAO;AAAA,eACVC,EAAAA,OAAO,QAAQ,OAAO;AAAA,qBAChBA,EAAAA,OAAO,OAAO,OAAO;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA,EAiC7BC,EAET,CAAC,CACJ,SAAAC,EACA,KAAAC,EACA,mBAAAC,EACA,eAAAC,EACA,eAAAC,EACA,GAAGC,CACJ,WAEGT,EAAA,CACC,SAAA,CAAAI,EAEAE,GACAI,EAAAA,IAACC,EAAAA,QAAA,CACA,KAAAN,EACA,mBAAAC,EACA,eAAAC,EACA,eAAAC,EACC,GAAGC,CAAA,CAAA,CACL,EAEF"}
+{"version":3,"file":"BaseQueryBuilderNode.js","sources":["../../../../../../../src/components/QueryBuilder/components/QueryBuilderNode/Base/BaseQueryBuilderNode.tsx"],"sourcesContent":["import React from 'react';\nimport styled from 'styled-components';\nimport { DropdownOption } from '@src/components/dropdown/type';\nimport {\n\tBaseQueryBuilderNode as BaseQueryBuilderNodeType,\n\tQueryBuilderProperty,\n} from '@src/components/QueryBuilder/types/QueryBuilder.type';\nimport { QueryBuilderPropertyProps } from '@src/components/QueryBuilder/types/QueryBuilderPropertyProps';\nimport { COLORS } from '@src/constants/Theme';\nimport PropertyNodes from '../Property/PropertyNodes';\n\nconst Container = styled.div`\n\tbackground: ${COLORS.surface.subdued};\n\tborder: 1px solid ${COLORS.stroke.primary};\n\tborder-radius: 4px;\n\tpadding: 12px;\n\twidth: 100%;\n\tdisplay: flex;\n\tflex-direction: column;\n`;\n\ntype BaseQueryBuilderNodeProps = Omit<QueryBuilderPropertyProps, 'property'> & {\n\tdeleteProperty?: (\n\t\tproperty: Partial<QueryBuilderProperty>,\n\t\tnodeID: string,\n\t) => void;\n\tcreateProperty?: (\n\t\tproperty: Partial<QueryBuilderProperty>,\n\t\tnodeID: string,\n\t) => void;\n\t/** if this is undefined, we will assume that this node doesnt support properties, so property list and adding feature will be hidden */\n\taddPropertyBtnText?: string;\n\tnode: BaseQueryBuilderNodeType;\n\tchildren: React.ReactNode;\n\tonPropertyValueSearch?: (\n\t\tsearchKey: string,\n\t\tproperty: QueryBuilderProperty,\n\t) => Promise<DropdownOption[]>;\n};\n\n/**\n * @exported\n * @stateless\n * @param param0\n * @returns\n */\nexport const BaseQueryBuilderNode: React.FC<\n\tBaseQueryBuilderNodeProps & { children: React.ReactNode }\n> = ({\n\tchildren,\n\tnode,\n\taddPropertyBtnText,\n\tdeleteProperty,\n\tcreateProperty,\n\t...propertyProps\n}) => {\n\treturn (\n\t\t<Container>\n\t\t\t{children}\n\n\t\t\t{addPropertyBtnText && (\n\t\t\t\t<PropertyNodes\n\t\t\t\t\tnode={node}\n\t\t\t\t\taddPropertyBtnText={addPropertyBtnText}\n\t\t\t\t\tdeleteProperty={deleteProperty!}\n\t\t\t\t\tcreateProperty={createProperty!}\n\t\t\t\t\t{...propertyProps}\n\t\t\t\t/>\n\t\t\t)}\n\t\t</Container>\n\t);\n};\n"],"names":["Container","styled","COLORS","BaseQueryBuilderNode","children","node","addPropertyBtnText","deleteProperty","createProperty","propertyProps","jsx","PropertyNodes"],"mappings":"4SAWMA,EAAYC,EAAAA,QAAO;AAAA,eACVC,EAAAA,OAAO,QAAQ,OAAO;AAAA,qBAChBA,EAAAA,OAAO,OAAO,OAAO;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA,EAiC7BC,EAET,CAAC,CACJ,SAAAC,EACA,KAAAC,EACA,mBAAAC,EACA,eAAAC,EACA,eAAAC,EACA,GAAGC,CACJ,WAEGT,EAAA,CACC,SAAA,CAAAI,EAEAE,GACAI,EAAAA,IAACC,EAAAA,QAAA,CACA,KAAAN,EACA,mBAAAC,EACA,eAAAC,EACA,eAAAC,EACC,GAAGC,CAAA,CAAA,CACL,EAEF"}

package/dist/cjs/components/QueryBuilder/components/QueryBuilderNode/Property/PropertyNode.styled.js

@@ -1,7 +1,7 @@
-"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const e=require("styled-components"),t=e.div`
+"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const e=require("styled-components"),o=t=>t&&typeof t=="object"&&"default"in t?t:{default:t},a=o(e),i=a.default.div`
 	flex-direction: row;
 	gap: 12px;
 	align-items: start;
 	display: flex;
-`;exports.Container=t;
+`;exports.Container=i;
 //# sourceMappingURL=PropertyNode.styled.js.map

package/dist/cjs/components/QueryBuilder/components/QueryBuilderNode/Property/PropertyNode.styled.js.map

@@ -1 +1 @@
-{"version":3,"file":"PropertyNode.styled.js","sources":["../../../../../../../src/components/QueryBuilder/components/QueryBuilderNode/Property/PropertyNode.styled.ts"],"sourcesContent":["import styled from 'styled-components';\n\nexport const Container = styled.div`\n\tflex-direction: row;\n\tgap: 12px;\n\talign-items: start;\n\tdisplay: flex;\n`;\n"],"names":["Container","styled"],"mappings":"qHAEaA,EAAYC,EAAO;AAAA;AAAA;AAAA;AAAA;AAAA"}
+{"version":3,"file":"PropertyNode.styled.js","sources":["../../../../../../../src/components/QueryBuilder/components/QueryBuilderNode/Property/PropertyNode.styled.ts"],"sourcesContent":["import styled from 'styled-components';\n\nexport const Container = styled.div`\n\tflex-direction: row;\n\tgap: 12px;\n\talign-items: start;\n\tdisplay: flex;\n`;\n"],"names":["Container","styled"],"mappings":"oLAEaA,EAAYC,EAAAA,QAAO;AAAA;AAAA;AAAA;AAAA;AAAA"}

package/dist/cjs/components/QueryBuilder/components/QueryBuilderNode/Property/PropertyNodeUIWrapper.styled.js

@@ -1,18 +1,18 @@
-"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const t=require("styled-components"),e=require("../../../../../constants/Theme.js"),o=t.div`
+"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const i=require("styled-components"),o=require("../../../../../constants/Theme.js"),r=t=>t&&typeof t=="object"&&"default"in t?t:{default:t},e=r(i),l=e.default.div`
 	flex-direction: row;
 	align-items: start;
 	display: flex;
-`,r=t.div`
+`,d=e.default.div`
 	display: flex;
 	margin-left: 28px;
 	width: 1px;
 	height: 24px;
-	background: ${e.COLORS.stroke.primary};
-`,i=t.div`
+	background: ${o.COLORS.stroke.primary};
+`,n=e.default.div`
 	display: flex;
 	border-bottom-width: 1px;
 	border-bottom-style: solid;
-	border-bottom-color: ${e.COLORS.stroke.primary};
+	border-bottom-color: ${o.COLORS.stroke.primary};
 	width: 24px;
-`;exports.Container=o;exports.Horinzontal=i;exports.Line=r;
+`;exports.Container=l;exports.Horinzontal=n;exports.Line=d;
 //# sourceMappingURL=PropertyNodeUIWrapper.styled.js.map

package/dist/cjs/components/QueryBuilder/components/QueryBuilderNode/Property/PropertyNodeUIWrapper.styled.js.map

@@ -1 +1 @@
-{"version":3,"file":"PropertyNodeUIWrapper.styled.js","sources":["../../../../../../../src/components/QueryBuilder/components/QueryBuilderNode/Property/PropertyNodeUIWrapper.styled.ts"],"sourcesContent":["import styled from 'styled-components';\nimport { COLORS } from '@src/constants/Theme';\n\nexport const Container = styled.div`\n\tflex-direction: row;\n\talign-items: start;\n\tdisplay: flex;\n`;\n\nexport const Line = styled.div`\n\tdisplay: flex;\n\tmargin-left: 28px;\n\twidth: 1px;\n\theight: 24px;\n\tbackground: ${COLORS.stroke.primary};\n`;\n\nexport const Horinzontal = styled.div`\n\tdisplay: flex;\n\tborder-bottom-width: 1px;\n\tborder-bottom-style: solid;\n\tborder-bottom-color: ${COLORS.stroke.primary};\n\twidth: 24px;\n`;\n"],"names":["Container","styled","Line","COLORS","Horinzontal"],"mappings":"oKAGaA,EAAYC,EAAO;AAAA;AAAA;AAAA;AAAA,EAMnBC,EAAOD,EAAO;AAAA;AAAA;AAAA;AAAA;AAAA,eAKZE,EAAAA,OAAO,OAAO,OAAO;AAAA,EAGvBC,EAAcH,EAAO;AAAA;AAAA;AAAA;AAAA,wBAIVE,EAAAA,OAAO,OAAO,OAAO;AAAA;AAAA"}
+{"version":3,"file":"PropertyNodeUIWrapper.styled.js","sources":["../../../../../../../src/components/QueryBuilder/components/QueryBuilderNode/Property/PropertyNodeUIWrapper.styled.ts"],"sourcesContent":["import styled from 'styled-components';\nimport { COLORS } from '@src/constants/Theme';\n\nexport const Container = styled.div`\n\tflex-direction: row;\n\talign-items: start;\n\tdisplay: flex;\n`;\n\nexport const Line = styled.div`\n\tdisplay: flex;\n\tmargin-left: 28px;\n\twidth: 1px;\n\theight: 24px;\n\tbackground: ${COLORS.stroke.primary};\n`;\n\nexport const Horinzontal = styled.div`\n\tdisplay: flex;\n\tborder-bottom-width: 1px;\n\tborder-bottom-style: solid;\n\tborder-bottom-color: ${COLORS.stroke.primary};\n\twidth: 24px;\n`;\n"],"names":["Container","styled","Line","COLORS","Horinzontal"],"mappings":"mOAGaA,EAAYC,EAAAA,QAAO;AAAA;AAAA;AAAA;AAAA,EAMnBC,EAAOD,EAAAA,QAAO;AAAA;AAAA;AAAA;AAAA;AAAA,eAKZE,EAAAA,OAAO,OAAO,OAAO;AAAA,EAGvBC,EAAcH,EAAAA,QAAO;AAAA;AAAA;AAAA;AAAA,wBAIVE,EAAAA,OAAO,OAAO,OAAO;AAAA;AAAA"}

package/dist/cjs/components/QueryBuilder/components/QueryBuilderNodes.js

@@ -1,2 +1,2 @@
-"use strict";Object.defineProperties(exports,{__esModule:{value:!0},[Symbol.toStringTag]:{value:"Module"}});const e=require("react/jsx-runtime"),l=require("react"),g=require("react-redux"),q=require("../../dropdown/Dropdown.js"),B=require("../constants/operators.js"),w=require("../hooks/useQueryBuilder.js"),S=require("./AddNodeButton.js"),b=require("./DeleteButton.js"),N=require("./QueryBuilderNode/QueryBuilderNode.js"),O=require("./QueryBuilderNodes.styled.js"),T=require("../../button/Button.js"),a=l.forwardRef(({infinite:d,addNodeBtnText:c,allowedNodes:u,typesAPIHandlers:x,onStateChange:p,mode:i,selectorKey:s},f)=>{const r=g.useSelector(t=>t?.[s]),{deleteNode:y,clearAll:o,selectJoinOperator:j,fillState:h}=w.useQueryBuilder(s);l.useEffect(()=>{p?.({...r})},[r]);const m=B.JOIN_OPERATOR_OPTIONS.map(t=>r?.operator&&t.value===r.operator?{...t,selected:!0}:t);return l.useImperativeHandle(f,()=>({getState:()=>({...r}),fillState(t){h({...t})},clearAll:o})),e.jsxs(e.Fragment,{children:[r?.nodes?.map((t,n)=>e.jsxs(e.Fragment,{children:[n!==0&&e.jsx("div",{style:{width:80,position:"relative"},children:e.jsx(q.Dropdown,{disabled:i==="view",onSelect:v=>{j(v.value)},options:m,width:"80px",height:96,size:"small",skipSorting:!0})}),e.jsxs("div",{style:{display:"flex",flexDirection:"row",gap:12},children:[e.jsx(O.LinedContainer,{style:{paddingTop:n===0?0:24,maxWidth:"calc(100% - 24px)"},children:e.jsx(N.default,{selectorKey:s,mode:i??"create",allowedNodes:u,node:t,apiHandler:x[t.type]})}),i!=="view"?e.jsx(e.Fragment,{children:n!==0&&e.jsx(b.default,{onClick:()=>y(t._id)})}):e.jsx(e.Fragment,{})]},t._id)]})),d&&i!=="view"&&e.jsxs("div",{style:{display:"flex",flexDirection:"row",justifyContent:"space-between"},children:[e.jsx(S.default,{buttonText:c,allowedNodes:u,selectorKey:s}),e.jsx(T.Button,{buttonText:"Clear filters",size:"medium",buttonType:"tertiaryGray",onClick:()=>o(u[0])})]})]})});a.displayName="QueryBuilderNodes";exports.default=a;
+"use strict";Object.defineProperties(exports,{__esModule:{value:!0},[Symbol.toStringTag]:{value:"Module"}});const e=require("react/jsx-runtime"),a=require("react"),g=require("react-redux"),q=require("../../dropdown/Dropdown.js"),B=require("../constants/operators.js"),_=require("../hooks/useQueryBuilder.js"),w=require("./AddNodeButton.js"),S=require("./DeleteButton.js"),b=require("./QueryBuilderNode/QueryBuilderNode.js"),N=require("./QueryBuilderNodes.styled.js"),O=require("../../button/Button.js"),R=r=>r&&typeof r=="object"&&"default"in r?r:{default:r},T=R(a),d=T.default.forwardRef(({infinite:r,addNodeBtnText:c,allowedNodes:n,typesAPIHandlers:p,onStateChange:f,mode:s,selectorKey:u},x)=>{const i=g.useSelector(t=>t?.[u]),{deleteNode:y,clearAll:o,selectJoinOperator:j,fillState:m}=_.useQueryBuilder(u);a.useEffect(()=>{f?.({...i})},[i]);const h=B.JOIN_OPERATOR_OPTIONS.map(t=>i?.operator&&t.value===i.operator?{...t,selected:!0}:t);return a.useImperativeHandle(x,()=>({getState:()=>({...i}),fillState(t){m({...t})},clearAll:o})),e.jsxs(e.Fragment,{children:[i?.nodes?.map((t,l)=>e.jsxs(e.Fragment,{children:[l!==0&&e.jsx("div",{style:{width:80,position:"relative"},children:e.jsx(q.Dropdown,{disabled:s==="view",onSelect:v=>{j(v.value)},options:h,width:"80px",height:96,size:"small",skipSorting:!0})}),e.jsxs("div",{style:{display:"flex",flexDirection:"row",gap:12},children:[e.jsx(N.LinedContainer,{style:{paddingTop:l===0?0:24,maxWidth:"calc(100% - 24px)"},children:e.jsx(b.default,{selectorKey:u,mode:s??"create",allowedNodes:n,node:t,apiHandler:p[t.type]})}),s!=="view"?e.jsx(e.Fragment,{children:l!==0&&e.jsx(S.default,{onClick:()=>y(t._id)})}):e.jsx(e.Fragment,{})]},t._id)]})),r&&s!=="view"&&e.jsxs("div",{style:{display:"flex",flexDirection:"row",justifyContent:"space-between"},children:[e.jsx(w.default,{buttonText:c,allowedNodes:n,selectorKey:u}),e.jsx(O.Button,{buttonText:"Clear filters",size:"medium",buttonType:"tertiaryGray",onClick:()=>o(n[0])})]})]})});d.displayName="QueryBuilderNodes";exports.default=d;
 //# sourceMappingURL=QueryBuilderNodes.js.map

package/dist/cjs/components/QueryBuilder/components/QueryBuilderNodes.js.map

@@ -1 +1 @@
-{"version":3,"file":"QueryBuilderNodes.js","sources":["../../../../../src/components/QueryBuilder/components/QueryBuilderNodes.tsx"],"sourcesContent":["import { Response } from '@src/types/apiExecutor';\nimport React, { useEffect, useImperativeHandle } from 'react';\nimport { useSelector } from 'react-redux';\nimport { Button } from '@src/components/button';\nimport { Dropdown } from '@src/components/dropdown/Dropdown';\nimport { SingleOption } from '@src/components/dropdown/type';\nimport { JOIN_OPERATOR_OPTIONS } from '../constants/operators';\nimport { useQueryBuilder } from '../hooks/useQueryBuilder';\nimport { QueryBuilderRef } from '../types';\nimport {\n\tQueryBuilderJoinOperators,\n\tQueryBuilderRoot,\n\tQueryBuilderType,\n} from '../types/QueryBuilder.type';\nimport {\n\tBaseQueryBuilderPayload,\n\tBaseQueryBuilderResponse,\n} from '../types/QueryBuilderAPI.type';\nimport AddNodeButton from './AddNodeButton';\nimport DeleteButton from './DeleteButton';\nimport QueryBuilderNode from './QueryBuilderNode/QueryBuilderNode';\nimport { LinedContainer } from './QueryBuilderNodes.styled';\n\ntype QueryBuilderNodesProps = {\n\tinfinite: boolean;\n\taddNodeBtnText: string;\n\tallowedNodes: QueryBuilderType[];\n\tonStateChange?: (state: QueryBuilderRoot) => void;\n\ttypesAPIHandlers: {\n\t\t[key in QueryBuilderType]?: <T>(\n\t\t\tpayload: BaseQueryBuilderPayload<T>,\n\t\t) => Promise<Response<BaseQueryBuilderResponse>>;\n\t};\n\tstate?: QueryBuilderRoot;\n\tmode?: 'create' | 'edit' | 'view';\n\tselectorKey: string;\n};\n\nconst QueryBuilderNodes = React.forwardRef<\n\tQueryBuilderRef,\n\tQueryBuilderNodesProps\n>(\n\t(\n\t\t{\n\t\t\tinfinite,\n\t\t\taddNodeBtnText,\n\t\t\tallowedNodes,\n\t\t\ttypesAPIHandlers,\n\t\t\tonStateChange,\n\t\t\tmode,\n\t\t\tselectorKey,\n\t\t},\n\t\tref,\n\t) => {\n\t\tconst state = useSelector<\n\t\t\t{\n\t\t\t\tkey: QueryBuilderRoot;\n\t\t\t},\n\t\t\tQueryBuilderRoot\n\t\t>((state) => state?.[selectorKey]);\n\n\t\tconst { deleteNode, clearAll, selectJoinOperator, fillState } =\n\t\t\tuseQueryBuilder(selectorKey);\n\n\t\tuseEffect(() => {\n\t\t\tonStateChange?.({ ...state });\n\t\t}, [state]);\n\n\t\tconst options = JOIN_OPERATOR_OPTIONS.map((option) => {\n\t\t\tif (state?.operator) {\n\t\t\t\tif ((option as SingleOption).value === state.operator) {\n\t\t\t\t\treturn {\n\t\t\t\t\t\t...option,\n\t\t\t\t\t\tselected: true,\n\t\t\t\t\t};\n\t\t\t\t}\n\t\t\t}\n\n\t\t\treturn option;\n\t\t});\n\n\t\tuseImperativeHandle(ref, () => ({\n\t\t\tgetState: () => ({ ...state }),\n\t\t\tfillState(stateFromOutside) {\n\t\t\t\tfillState({ ...stateFromOutside });\n\t\t\t},\n\t\t\tclearAll,\n\t\t}));\n\n\t\treturn (\n\t\t\t<>\n\t\t\t\t{state?.nodes?.map((node, i) => (\n\t\t\t\t\t<>\n\t\t\t\t\t\t{i !== 0 && (\n\t\t\t\t\t\t\t<div style={{ width: 80, position: 'relative' }}>\n\t\t\t\t\t\t\t\t<Dropdown\n\t\t\t\t\t\t\t\t\tdisabled={mode === 'view'}\n\t\t\t\t\t\t\t\t\tonSelect={(option) => {\n\t\t\t\t\t\t\t\t\t\tselectJoinOperator(\n\t\t\t\t\t\t\t\t\t\t\t(option as SingleOption)\n\t\t\t\t\t\t\t\t\t\t\t\t.value as QueryBuilderJoinOperators,\n\t\t\t\t\t\t\t\t\t\t);\n\t\t\t\t\t\t\t\t\t}}\n\t\t\t\t\t\t\t\t\toptions={options}\n\t\t\t\t\t\t\t\t\twidth={'80px'}\n\t\t\t\t\t\t\t\t\theight={96}\n\t\t\t\t\t\t\t\t\tsize=\"small\"\n\t\t\t\t\t\t\t\t\tskipSorting={true}\n\t\t\t\t\t\t\t\t/>\n\t\t\t\t\t\t\t</div>\n\t\t\t\t\t\t)}\n\t\t\t\t\t\t<div\n\t\t\t\t\t\t\tstyle={{ display: 'flex', flexDirection: 'row', gap: 12 }}\n\t\t\t\t\t\t\tkey={node._id}\n\t\t\t\t\t\t>\n\t\t\t\t\t\t\t<LinedContainer\n\t\t\t\t\t\t\t\tstyle={{\n\t\t\t\t\t\t\t\t\tpaddingTop: i === 0 ? 0 : 24,\n\t\t\t\t\t\t\t\t\tmaxWidth: 'calc(100% - 24px)',\n\t\t\t\t\t\t\t\t}}\n\t\t\t\t\t\t\t>\n\t\t\t\t\t\t\t\t<QueryBuilderNode\n\t\t\t\t\t\t\t\t\tselectorKey={selectorKey}\n\t\t\t\t\t\t\t\t\tmode={mode ?? 'create'}\n\t\t\t\t\t\t\t\t\tallowedNodes={allowedNodes}\n\t\t\t\t\t\t\t\t\tnode={node}\n\t\t\t\t\t\t\t\t\tapiHandler={typesAPIHandlers[node.type]!}\n\t\t\t\t\t\t\t\t/>\n\t\t\t\t\t\t\t</LinedContainer>\n\t\t\t\t\t\t\t{mode !== 'view' ? (\n\t\t\t\t\t\t\t\t<>\n\t\t\t\t\t\t\t\t\t{i !== 0 && (\n\t\t\t\t\t\t\t\t\t\t<DeleteButton onClick={() => deleteNode(node._id)} />\n\t\t\t\t\t\t\t\t\t)}\n\t\t\t\t\t\t\t\t</>\n\t\t\t\t\t\t\t) : (\n\t\t\t\t\t\t\t\t<></>\n\t\t\t\t\t\t\t)}\n\t\t\t\t\t\t</div>\n\t\t\t\t\t</>\n\t\t\t\t))}\n\n\t\t\t\t{infinite && mode !== 'view' && (\n\t\t\t\t\t<div\n\t\t\t\t\t\tstyle={{\n\t\t\t\t\t\t\tdisplay: 'flex',\n\t\t\t\t\t\t\tflexDirection: 'row',\n\t\t\t\t\t\t\tjustifyContent: 'space-between',\n\t\t\t\t\t\t}}\n\t\t\t\t\t>\n\t\t\t\t\t\t<AddNodeButton\n\t\t\t\t\t\t\tbuttonText={addNodeBtnText}\n\t\t\t\t\t\t\tallowedNodes={allowedNodes}\n\t\t\t\t\t\t\tselectorKey={selectorKey}\n\t\t\t\t\t\t/>\n\t\t\t\t\t\t<Button\n\t\t\t\t\t\t\tbuttonText=\"Clear filters\"\n\t\t\t\t\t\t\tsize=\"medium\"\n\t\t\t\t\t\t\tbuttonType=\"tertiaryGray\"\n\t\t\t\t\t\t\tonClick={() => clearAll(allowedNodes[0])}\n\t\t\t\t\t\t/>\n\t\t\t\t\t</div>\n\t\t\t\t)}\n\t\t\t</>\n\t\t);\n\t},\n);\n\nQueryBuilderNodes.displayName = 'QueryBuilderNodes';\n\nexport default QueryBuilderNodes;\n"],"names":["QueryBuilderNodes","React","infinite","addNodeBtnText","allowedNodes","typesAPIHandlers","onStateChange","mode","selectorKey","ref","state","useSelector","deleteNode","clearAll","selectJoinOperator","fillState","useQueryBuilder","useEffect","options","JOIN_OPERATOR_OPTIONS","option","useImperativeHandle","stateFromOutside","jsxs","Fragment","node","i","jsx","Dropdown","LinedContainer","QueryBuilderNode","DeleteButton","AddNodeButton","Button"],"mappings":"ufAsCMA,EAAoBC,EAAM,WAI/B,CACC,CACC,SAAAC,EACA,eAAAC,EACA,aAAAC,EACA,iBAAAC,EACA,cAAAC,EACA,KAAAC,EACA,YAAAC,CAAA,EAEDC,IACI,CACJ,MAAMC,EAAQC,EAAAA,YAKXD,GAAUA,IAAQF,CAAW,CAAC,EAE3B,CAAE,WAAAI,EAAY,SAAAC,EAAU,mBAAAC,EAAoB,UAAAC,CAAA,EACjDC,EAAAA,gBAAgBR,CAAW,EAE5BS,EAAAA,UAAU,IAAM,CACfX,IAAgB,CAAE,GAAGI,EAAO,CAC7B,EAAG,CAACA,CAAK,CAAC,EAEV,MAAMQ,EAAUC,EAAAA,sBAAsB,IAAKC,GACtCV,GAAO,UACLU,EAAwB,QAAUV,EAAM,SACrC,CACN,GAAGU,EACH,SAAU,EAAA,EAKNA,CACP,EAEDC,OAAAA,EAAAA,oBAAoBZ,EAAK,KAAO,CAC/B,SAAU,KAAO,CAAE,GAAGC,IACtB,UAAUY,EAAkB,CAC3BP,EAAU,CAAE,GAAGO,EAAkB,CAClC,EACA,SAAAT,CAAA,EACC,EAGDU,EAAAA,KAAAC,WAAA,CACE,SAAA,CAAAd,GAAO,OAAO,IAAI,CAACe,EAAMC,IACzBH,EAAAA,KAAAC,WAAA,CACE,SAAA,CAAAE,IAAM,SACL,MAAA,CAAI,MAAO,CAAE,MAAO,GAAI,SAAU,UAAA,EAClC,SAAAC,EAAAA,IAACC,EAAAA,SAAA,CACA,SAAUrB,IAAS,OACnB,SAAWa,GAAW,CACrBN,EACEM,EACC,KAAA,CAEJ,EACA,QAAAF,EACA,MAAO,OACP,OAAQ,GACR,KAAK,QACL,YAAa,EAAA,CAAA,EAEf,EAEDK,EAAAA,KAAC,MAAA,CACA,MAAO,CAAE,QAAS,OAAQ,cAAe,MAAO,IAAK,EAAA,EAGrD,SAAA,CAAAI,EAAAA,IAACE,EAAAA,eAAA,CACA,MAAO,CACN,WAAYH,IAAM,EAAI,EAAI,GAC1B,SAAU,mBAAA,EAGX,SAAAC,EAAAA,IAACG,EAAAA,QAAA,CACA,YAAAtB,EACA,KAAMD,GAAQ,SACd,aAAAH,EACA,KAAAqB,EACA,WAAYpB,EAAiBoB,EAAK,IAAI,CAAA,CAAA,CACvC,CAAA,EAEAlB,IAAS,OACToB,EAAAA,IAAAH,EAAAA,SAAA,CACE,SAAAE,IAAM,GACNC,EAAAA,IAACI,EAAAA,QAAA,CAAa,QAAS,IAAMnB,EAAWa,EAAK,GAAG,CAAA,CAAG,EAErD,EAEAE,MAAAH,EAAAA,SAAA,CAAA,CAAE,CAAA,CAAA,EAvBEC,EAAK,GAAA,CAyBX,CAAA,CACD,CACA,EAEAvB,GAAYK,IAAS,QACrBgB,EAAAA,KAAC,MAAA,CACA,MAAO,CACN,QAAS,OACT,cAAe,MACf,eAAgB,eAAA,EAGjB,SAAA,CAAAI,EAAAA,IAACK,EAAAA,QAAA,CACA,WAAY7B,EACZ,aAAAC,EACA,YAAAI,CAAA,CAAA,EAEDmB,EAAAA,IAACM,EAAAA,OAAA,CACA,WAAW,gBACX,KAAK,SACL,WAAW,eACX,QAAS,IAAMpB,EAAST,EAAa,CAAC,CAAC,CAAA,CAAA,CACxC,CAAA,CAAA,CACD,EAEF,CAEF,CACD,EAEAJ,EAAkB,YAAc"}
+{"version":3,"file":"QueryBuilderNodes.js","sources":["../../../../../src/components/QueryBuilder/components/QueryBuilderNodes.tsx"],"sourcesContent":["import { Response } from '@src/types/apiExecutor';\nimport React, { useEffect, useImperativeHandle } from 'react';\nimport { useSelector } from 'react-redux';\nimport { Button } from '@src/components/button';\nimport { Dropdown } from '@src/components/dropdown/Dropdown';\nimport { SingleOption } from '@src/components/dropdown/type';\nimport { JOIN_OPERATOR_OPTIONS } from '../constants/operators';\nimport { useQueryBuilder } from '../hooks/useQueryBuilder';\nimport { QueryBuilderRef } from '../types';\nimport {\n\tQueryBuilderJoinOperators,\n\tQueryBuilderRoot,\n\tQueryBuilderType,\n} from '../types/QueryBuilder.type';\nimport {\n\tBaseQueryBuilderPayload,\n\tBaseQueryBuilderResponse,\n} from '../types/QueryBuilderAPI.type';\nimport AddNodeButton from './AddNodeButton';\nimport DeleteButton from './DeleteButton';\nimport QueryBuilderNode from './QueryBuilderNode/QueryBuilderNode';\nimport { LinedContainer } from './QueryBuilderNodes.styled';\n\ntype QueryBuilderNodesProps = {\n\tinfinite: boolean;\n\taddNodeBtnText: string;\n\tallowedNodes: QueryBuilderType[];\n\tonStateChange?: (state: QueryBuilderRoot) => void;\n\ttypesAPIHandlers: {\n\t\t[key in QueryBuilderType]?: <T>(\n\t\t\tpayload: BaseQueryBuilderPayload<T>,\n\t\t) => Promise<Response<BaseQueryBuilderResponse>>;\n\t};\n\tstate?: QueryBuilderRoot;\n\tmode?: 'create' | 'edit' | 'view';\n\tselectorKey: string;\n};\n\nconst QueryBuilderNodes = React.forwardRef<\n\tQueryBuilderRef,\n\tQueryBuilderNodesProps\n>(\n\t(\n\t\t{\n\t\t\tinfinite,\n\t\t\taddNodeBtnText,\n\t\t\tallowedNodes,\n\t\t\ttypesAPIHandlers,\n\t\t\tonStateChange,\n\t\t\tmode,\n\t\t\tselectorKey,\n\t\t},\n\t\tref,\n\t) => {\n\t\tconst state = useSelector<\n\t\t\t{\n\t\t\t\tkey: QueryBuilderRoot;\n\t\t\t},\n\t\t\tQueryBuilderRoot\n\t\t>((state) => state?.[selectorKey]);\n\n\t\tconst { deleteNode, clearAll, selectJoinOperator, fillState } =\n\t\t\tuseQueryBuilder(selectorKey);\n\n\t\tuseEffect(() => {\n\t\t\tonStateChange?.({ ...state });\n\t\t}, [state]);\n\n\t\tconst options = JOIN_OPERATOR_OPTIONS.map((option) => {\n\t\t\tif (state?.operator) {\n\t\t\t\tif ((option as SingleOption).value === state.operator) {\n\t\t\t\t\treturn {\n\t\t\t\t\t\t...option,\n\t\t\t\t\t\tselected: true,\n\t\t\t\t\t};\n\t\t\t\t}\n\t\t\t}\n\n\t\t\treturn option;\n\t\t});\n\n\t\tuseImperativeHandle(ref, () => ({\n\t\t\tgetState: () => ({ ...state }),\n\t\t\tfillState(stateFromOutside) {\n\t\t\t\tfillState({ ...stateFromOutside });\n\t\t\t},\n\t\t\tclearAll,\n\t\t}));\n\n\t\treturn (\n\t\t\t<>\n\t\t\t\t{state?.nodes?.map((node, i) => (\n\t\t\t\t\t<>\n\t\t\t\t\t\t{i !== 0 && (\n\t\t\t\t\t\t\t<div style={{ width: 80, position: 'relative' }}>\n\t\t\t\t\t\t\t\t<Dropdown\n\t\t\t\t\t\t\t\t\tdisabled={mode === 'view'}\n\t\t\t\t\t\t\t\t\tonSelect={(option) => {\n\t\t\t\t\t\t\t\t\t\tselectJoinOperator(\n\t\t\t\t\t\t\t\t\t\t\t(option as SingleOption)\n\t\t\t\t\t\t\t\t\t\t\t\t.value as QueryBuilderJoinOperators,\n\t\t\t\t\t\t\t\t\t\t);\n\t\t\t\t\t\t\t\t\t}}\n\t\t\t\t\t\t\t\t\toptions={options}\n\t\t\t\t\t\t\t\t\twidth={'80px'}\n\t\t\t\t\t\t\t\t\theight={96}\n\t\t\t\t\t\t\t\t\tsize=\"small\"\n\t\t\t\t\t\t\t\t\tskipSorting={true}\n\t\t\t\t\t\t\t\t/>\n\t\t\t\t\t\t\t</div>\n\t\t\t\t\t\t)}\n\t\t\t\t\t\t<div\n\t\t\t\t\t\t\tstyle={{ display: 'flex', flexDirection: 'row', gap: 12 }}\n\t\t\t\t\t\t\tkey={node._id}\n\t\t\t\t\t\t>\n\t\t\t\t\t\t\t<LinedContainer\n\t\t\t\t\t\t\t\tstyle={{\n\t\t\t\t\t\t\t\t\tpaddingTop: i === 0 ? 0 : 24,\n\t\t\t\t\t\t\t\t\tmaxWidth: 'calc(100% - 24px)',\n\t\t\t\t\t\t\t\t}}\n\t\t\t\t\t\t\t>\n\t\t\t\t\t\t\t\t<QueryBuilderNode\n\t\t\t\t\t\t\t\t\tselectorKey={selectorKey}\n\t\t\t\t\t\t\t\t\tmode={mode ?? 'create'}\n\t\t\t\t\t\t\t\t\tallowedNodes={allowedNodes}\n\t\t\t\t\t\t\t\t\tnode={node}\n\t\t\t\t\t\t\t\t\tapiHandler={typesAPIHandlers[node.type]!}\n\t\t\t\t\t\t\t\t/>\n\t\t\t\t\t\t\t</LinedContainer>\n\t\t\t\t\t\t\t{mode !== 'view' ? (\n\t\t\t\t\t\t\t\t<>\n\t\t\t\t\t\t\t\t\t{i !== 0 && (\n\t\t\t\t\t\t\t\t\t\t<DeleteButton onClick={() => deleteNode(node._id)} />\n\t\t\t\t\t\t\t\t\t)}\n\t\t\t\t\t\t\t\t</>\n\t\t\t\t\t\t\t) : (\n\t\t\t\t\t\t\t\t<></>\n\t\t\t\t\t\t\t)}\n\t\t\t\t\t\t</div>\n\t\t\t\t\t</>\n\t\t\t\t))}\n\n\t\t\t\t{infinite && mode !== 'view' && (\n\t\t\t\t\t<div\n\t\t\t\t\t\tstyle={{\n\t\t\t\t\t\t\tdisplay: 'flex',\n\t\t\t\t\t\t\tflexDirection: 'row',\n\t\t\t\t\t\t\tjustifyContent: 'space-between',\n\t\t\t\t\t\t}}\n\t\t\t\t\t>\n\t\t\t\t\t\t<AddNodeButton\n\t\t\t\t\t\t\tbuttonText={addNodeBtnText}\n\t\t\t\t\t\t\tallowedNodes={allowedNodes}\n\t\t\t\t\t\t\tselectorKey={selectorKey}\n\t\t\t\t\t\t/>\n\t\t\t\t\t\t<Button\n\t\t\t\t\t\t\tbuttonText=\"Clear filters\"\n\t\t\t\t\t\t\tsize=\"medium\"\n\t\t\t\t\t\t\tbuttonType=\"tertiaryGray\"\n\t\t\t\t\t\t\tonClick={() => clearAll(allowedNodes[0])}\n\t\t\t\t\t\t/>\n\t\t\t\t\t</div>\n\t\t\t\t)}\n\t\t\t</>\n\t\t);\n\t},\n);\n\nQueryBuilderNodes.displayName = 'QueryBuilderNodes';\n\nexport default QueryBuilderNodes;\n"],"names":["QueryBuilderNodes","React","infinite","addNodeBtnText","allowedNodes","typesAPIHandlers","onStateChange","mode","selectorKey","ref","state","useSelector","deleteNode","clearAll","selectJoinOperator","fillState","useQueryBuilder","useEffect","options","JOIN_OPERATOR_OPTIONS","option","useImperativeHandle","stateFromOutside","jsxs","Fragment","node","i","jsx","Dropdown","LinedContainer","QueryBuilderNode","DeleteButton","AddNodeButton","Button"],"mappings":"sjBAsCMA,EAAoBC,EAAAA,QAAM,WAI/B,CACC,CACC,SAAAC,EACA,eAAAC,EACA,aAAAC,EACA,iBAAAC,EACA,cAAAC,EACA,KAAAC,EACA,YAAAC,CAAA,EAEDC,IACI,CACJ,MAAMC,EAAQC,EAAAA,YAKXD,GAAUA,IAAQF,CAAW,CAAC,EAE3B,CAAE,WAAAI,EAAY,SAAAC,EAAU,mBAAAC,EAAoB,UAAAC,CAAA,EACjDC,EAAAA,gBAAgBR,CAAW,EAE5BS,EAAAA,UAAU,IAAM,CACfX,IAAgB,CAAE,GAAGI,EAAO,CAC7B,EAAG,CAACA,CAAK,CAAC,EAEV,MAAMQ,EAAUC,EAAAA,sBAAsB,IAAKC,GACtCV,GAAO,UACLU,EAAwB,QAAUV,EAAM,SACrC,CACN,GAAGU,EACH,SAAU,EAAA,EAKNA,CACP,EAEDC,OAAAA,EAAAA,oBAAoBZ,EAAK,KAAO,CAC/B,SAAU,KAAO,CAAE,GAAGC,IACtB,UAAUY,EAAkB,CAC3BP,EAAU,CAAE,GAAGO,EAAkB,CAClC,EACA,SAAAT,CAAA,EACC,EAGDU,EAAAA,KAAAC,WAAA,CACE,SAAA,CAAAd,GAAO,OAAO,IAAI,CAACe,EAAMC,IACzBH,EAAAA,KAAAC,WAAA,CACE,SAAA,CAAAE,IAAM,SACL,MAAA,CAAI,MAAO,CAAE,MAAO,GAAI,SAAU,UAAA,EAClC,SAAAC,EAAAA,IAACC,EAAAA,SAAA,CACA,SAAUrB,IAAS,OACnB,SAAWa,GAAW,CACrBN,EACEM,EACC,KAAA,CAEJ,EACA,QAAAF,EACA,MAAO,OACP,OAAQ,GACR,KAAK,QACL,YAAa,EAAA,CAAA,EAEf,EAEDK,EAAAA,KAAC,MAAA,CACA,MAAO,CAAE,QAAS,OAAQ,cAAe,MAAO,IAAK,EAAA,EAGrD,SAAA,CAAAI,EAAAA,IAACE,EAAAA,eAAA,CACA,MAAO,CACN,WAAYH,IAAM,EAAI,EAAI,GAC1B,SAAU,mBAAA,EAGX,SAAAC,EAAAA,IAACG,EAAAA,QAAA,CACA,YAAAtB,EACA,KAAMD,GAAQ,SACd,aAAAH,EACA,KAAAqB,EACA,WAAYpB,EAAiBoB,EAAK,IAAI,CAAA,CAAA,CACvC,CAAA,EAEAlB,IAAS,OACToB,EAAAA,IAAAH,EAAAA,SAAA,CACE,SAAAE,IAAM,GACNC,EAAAA,IAACI,EAAAA,QAAA,CAAa,QAAS,IAAMnB,EAAWa,EAAK,GAAG,CAAA,CAAG,EAErD,EAEAE,MAAAH,EAAAA,SAAA,CAAA,CAAE,CAAA,CAAA,EAvBEC,EAAK,GAAA,CAyBX,CAAA,CACD,CACA,EAEAvB,GAAYK,IAAS,QACrBgB,EAAAA,KAAC,MAAA,CACA,MAAO,CACN,QAAS,OACT,cAAe,MACf,eAAgB,eAAA,EAGjB,SAAA,CAAAI,EAAAA,IAACK,EAAAA,QAAA,CACA,WAAY7B,EACZ,aAAAC,EACA,YAAAI,CAAA,CAAA,EAEDmB,EAAAA,IAACM,EAAAA,OAAA,CACA,WAAW,gBACX,KAAK,SACL,WAAW,eACX,QAAS,IAAMpB,EAAST,EAAa,CAAC,CAAC,CAAA,CAAA,CACxC,CAAA,CAAA,CACD,EAEF,CAEF,CACD,EAEAJ,EAAkB,YAAc"}

package/dist/cjs/components/QueryBuilder/components/QueryBuilderNodes.styled.js

@@ -1,17 +1,17 @@
-"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const e=require("styled-components"),t=require("../../../constants/Theme.js");e.div`
+"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const l=require("styled-components"),d=require("../../../constants/Theme.js"),o=e=>e&&typeof e=="object"&&"default"in e?e:{default:e},t=o(l);t.default.div`
 	flex-direction: row;
 	margin-left: 24px;
 	display: flex;
 	flex: 1;
 	width: 100%;
-`;const r=e.div`
+`;const i=t.default.div`
 	display: flex;
 	border-left-width: 1px;
 	border-left-style: solid;
-	border-left-color: ${t.COLORS.stroke.primary};
+	border-left-color: ${d.COLORS.stroke.primary};
 	flex: 1;
 	padding-left: 16px;
 	padding-bottom: 24px;
 	margin-left: 24px;
-`;exports.LinedContainer=r;
+`;exports.LinedContainer=i;
 //# sourceMappingURL=QueryBuilderNodes.styled.js.map

package/dist/cjs/components/QueryBuilder/components/QueryBuilderNodes.styled.js.map

@@ -1 +1 @@
-{"version":3,"file":"QueryBuilderNodes.styled.js","sources":["../../../../../src/components/QueryBuilder/components/QueryBuilderNodes.styled.ts"],"sourcesContent":["import styled from 'styled-components';\nimport { COLORS } from '@src/constants/Theme';\n\nexport const Container = styled.div`\n\tflex-direction: row;\n\tmargin-left: 24px;\n\tdisplay: flex;\n\tflex: 1;\n\twidth: 100%;\n`;\n\nexport const LinedContainer = styled.div`\n\tdisplay: flex;\n\tborder-left-width: 1px;\n\tborder-left-style: solid;\n\tborder-left-color: ${COLORS.stroke.primary};\n\tflex: 1;\n\tpadding-left: 16px;\n\tpadding-bottom: 24px;\n\tmargin-left: 24px;\n`;\n"],"names":["styled","LinedContainer","COLORS"],"mappings":"8JAGyBA,EAAO;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA,EAQzB,MAAMC,EAAiBD,EAAO;AAAA;AAAA;AAAA;AAAA,sBAIfE,EAAAA,OAAO,OAAO,OAAO;AAAA;AAAA;AAAA;AAAA;AAAA"}
+{"version":3,"file":"QueryBuilderNodes.styled.js","sources":["../../../../../src/components/QueryBuilder/components/QueryBuilderNodes.styled.ts"],"sourcesContent":["import styled from 'styled-components';\nimport { COLORS } from '@src/constants/Theme';\n\nexport const Container = styled.div`\n\tflex-direction: row;\n\tmargin-left: 24px;\n\tdisplay: flex;\n\tflex: 1;\n\twidth: 100%;\n`;\n\nexport const LinedContainer = styled.div`\n\tdisplay: flex;\n\tborder-left-width: 1px;\n\tborder-left-style: solid;\n\tborder-left-color: ${COLORS.stroke.primary};\n\tflex: 1;\n\tpadding-left: 16px;\n\tpadding-bottom: 24px;\n\tmargin-left: 24px;\n`;\n"],"names":["styled","LinedContainer","COLORS"],"mappings":"6NAGyBA,EAAAA,QAAO;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA,EAQzB,MAAMC,EAAiBD,EAAAA,QAAO;AAAA;AAAA;AAAA;AAAA,sBAIfE,EAAAA,OAAO,OAAO,OAAO;AAAA;AAAA;AAAA;AAAA;AAAA"}

package/dist/cjs/components/TablePagination/TablePagination.styled.js

@@ -1,4 +1,4 @@
-"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const r=require("styled-components"),t=require("../../constants/Theme.js"),n=r.div`
+"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const n=require("styled-components"),e=require("../../constants/Theme.js"),r=t=>t&&typeof t=="object"&&"default"in t?t:{default:t},o=r(n),i=o.default.div`
 	background-color: unset !important;
 	display: flex;
 	align-items: center;
@@ -20,21 +20,21 @@
 		display: flex;
 		align-items: center;
 		justify-content: center;
-		background-color: ${t.DEFAULT_THEME.colorsV2.surface.standard};
-		border: 1px solid ${t.DEFAULT_THEME.colorsV2.stroke.primary};
+		background-color: ${e.DEFAULT_THEME.colorsV2.surface.standard};
+		border: 1px solid ${e.DEFAULT_THEME.colorsV2.stroke.primary};
 		border-radius: 4px;
 		cursor: pointer;
 	}
-`,o=r.div`
-	background: ${e=>e.active?t.DEFAULT_THEME.colorsV2.background.brand:"none"};
+`,a=o.default.div`
+	background: ${t=>t.active?e.DEFAULT_THEME.colorsV2.background.brand:"none"};
 	width: 32px;
 	height: 32px;
 	display: flex;
 	align-items: center;
 	justify-content: center;
-	border-right: ${e=>e.isLast?"none":`1px solid ${t.DEFAULT_THEME.colorsV2.stroke.primary}`};
+	border-right: ${t=>t.isLast?"none":`1px solid ${e.DEFAULT_THEME.colorsV2.stroke.primary}`};
 	&:hover {
-		cursor: ${e=>e.disabled?"not-allowed":"pointer"};
+		cursor: ${t=>t.disabled?"not-allowed":"pointer"};
 	}
-`;exports.StyledPagingContainer=o;exports.StyledTablePaginationContainer=n;
+`;exports.StyledPagingContainer=a;exports.StyledTablePaginationContainer=i;
 //# sourceMappingURL=TablePagination.styled.js.map

package/dist/cjs/components/TablePagination/TablePagination.styled.js.map

@@ -1 +1 @@
-{"version":3,"file":"TablePagination.styled.js","sources":["../../../../src/components/TablePagination/TablePagination.styled.tsx"],"sourcesContent":["import styled from 'styled-components';\nimport { DEFAULT_THEME } from '@src/constants/Theme';\n\nexport const StyledTablePaginationContainer = styled.div`\n\tbackground-color: unset !important;\n\tdisplay: flex;\n\talign-items: center;\n\tjustify-content: space-between;\n\tborder-bottom-left-radius: 4px;\n\tborder-bottom-right-radius: 4px;\n\tmargin: 0 16px;\n\n\t.paging__container {\n\t\tdisplay: flex;\n\t\tmargin-top: 8px;\n\t\tmargin-bottom: 8px;\n\t\tjustify-content: center;\n\t\talign-items: center;\n\t\tgap: 8px;\n\t}\n\n\t.pages__buttons-container {\n\t\tdisplay: flex;\n\t\talign-items: center;\n\t\tjustify-content: center;\n\t\tbackground-color: ${DEFAULT_THEME.colorsV2.surface.standard};\n\t\tborder: 1px solid ${DEFAULT_THEME.colorsV2.stroke.primary};\n\t\tborder-radius: 4px;\n\t\tcursor: pointer;\n\t}\n`;\n\nexport const StyledPagingContainer = styled.div<{\n\tactive: boolean;\n\tisLast?: boolean;\n\tdisabled?: boolean;\n}>`\n\tbackground: ${(props) =>\n\t\tprops.active ? DEFAULT_THEME.colorsV2.background.brand : 'none'};\n\twidth: 32px;\n\theight: 32px;\n\tdisplay: flex;\n\talign-items: center;\n\tjustify-content: center;\n\tborder-right: ${(props) =>\n\t\tprops.isLast\n\t\t\t? 'none'\n\t\t\t: `1px solid ${DEFAULT_THEME.colorsV2.stroke.primary}`};\n\t&:hover {\n\t\tcursor: ${(props) => (props.disabled ? 'not-allowed' : 'pointer')};\n\t}\n`;\n"],"names":["StyledTablePaginationContainer","styled","DEFAULT_THEME","StyledPagingContainer","props"],"mappings":"2JAGaA,EAAiCC,EAAO;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA,sBAsB/BC,gBAAc,SAAS,QAAQ,QAAQ;AAAA,sBACvCA,gBAAc,SAAS,OAAO,OAAO;AAAA;AAAA;AAAA;AAAA,EAM9CC,EAAwBF,EAAO;AAAA,eAK5BG,GACdA,EAAM,OAASF,EAAAA,cAAc,SAAS,WAAW,MAAQ,MAAM;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA,iBAM/CE,GAChBA,EAAM,OACH,OACA,aAAaF,EAAAA,cAAc,SAAS,OAAO,OAAO,EAAE;AAAA;AAAA,YAE5CE,GAAWA,EAAM,SAAW,cAAgB,SAAU;AAAA;AAAA"}
+{"version":3,"file":"TablePagination.styled.js","sources":["../../../../src/components/TablePagination/TablePagination.styled.tsx"],"sourcesContent":["import styled from 'styled-components';\nimport { DEFAULT_THEME } from '@src/constants/Theme';\n\nexport const StyledTablePaginationContainer = styled.div`\n\tbackground-color: unset !important;\n\tdisplay: flex;\n\talign-items: center;\n\tjustify-content: space-between;\n\tborder-bottom-left-radius: 4px;\n\tborder-bottom-right-radius: 4px;\n\tmargin: 0 16px;\n\n\t.paging__container {\n\t\tdisplay: flex;\n\t\tmargin-top: 8px;\n\t\tmargin-bottom: 8px;\n\t\tjustify-content: center;\n\t\talign-items: center;\n\t\tgap: 8px;\n\t}\n\n\t.pages__buttons-container {\n\t\tdisplay: flex;\n\t\talign-items: center;\n\t\tjustify-content: center;\n\t\tbackground-color: ${DEFAULT_THEME.colorsV2.surface.standard};\n\t\tborder: 1px solid ${DEFAULT_THEME.colorsV2.stroke.primary};\n\t\tborder-radius: 4px;\n\t\tcursor: pointer;\n\t}\n`;\n\nexport const StyledPagingContainer = styled.div<{\n\tactive: boolean;\n\tisLast?: boolean;\n\tdisabled?: boolean;\n}>`\n\tbackground: ${(props) =>\n\t\tprops.active ? DEFAULT_THEME.colorsV2.background.brand : 'none'};\n\twidth: 32px;\n\theight: 32px;\n\tdisplay: flex;\n\talign-items: center;\n\tjustify-content: center;\n\tborder-right: ${(props) =>\n\t\tprops.isLast\n\t\t\t? 'none'\n\t\t\t: `1px solid ${DEFAULT_THEME.colorsV2.stroke.primary}`};\n\t&:hover {\n\t\tcursor: ${(props) => (props.disabled ? 'not-allowed' : 'pointer')};\n\t}\n`;\n"],"names":["StyledTablePaginationContainer","styled","DEFAULT_THEME","StyledPagingContainer","props"],"mappings":"0NAGaA,EAAiCC,EAAAA,QAAO;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA,sBAsB/BC,gBAAc,SAAS,QAAQ,QAAQ;AAAA,sBACvCA,gBAAc,SAAS,OAAO,OAAO;AAAA;AAAA;AAAA;AAAA,EAM9CC,EAAwBF,EAAAA,QAAO;AAAA,eAK5BG,GACdA,EAAM,OAASF,EAAAA,cAAc,SAAS,WAAW,MAAQ,MAAM;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA,iBAM/CE,GAChBA,EAAM,OACH,OACA,aAAaF,EAAAA,cAAc,SAAS,OAAO,OAAO,EAAE;AAAA;AAAA,YAE5CE,GAAWA,EAAM,SAAW,cAAgB,SAAU;AAAA;AAAA"}

package/dist/cjs/components/TablePagination/TablePaginationCard.js

@@ -1,10 +1,10 @@
-"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const r=require("react/jsx-runtime"),n=require("styled-components"),i=require("./TablePagination.js"),a=require("../../constants/Theme.js"),t=n.div`
-	background: ${a.COLORS.surface.standard};
+"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const t=require("react/jsx-runtime"),o=require("styled-components"),n=require("./TablePagination.js"),r=require("../../constants/Theme.js"),i=e=>e&&typeof e=="object"&&"default"in e?e:{default:e},d=i(o),a=d.default.div`
+	background: ${r.COLORS.surface.standard};
 	border: ${e=>e.removeBorder?0:1}px solid
-		${a.COLORS.stroke.primary};
+		${r.COLORS.stroke.primary};
 	border-radius: 4px;
 	display: flex;
 	justify-content: center;
 	margin: auto;
-`,o=e=>r.jsx(t,{removeBorder:e.removeBorder,children:r.jsx(i.TablePagination,{...e})});exports.TablePaginationCard=o;exports.TablePaginationCardStyled=t;
+`,l=e=>t.jsx(a,{removeBorder:e.removeBorder,children:t.jsx(n.TablePagination,{...e})});exports.TablePaginationCard=l;exports.TablePaginationCardStyled=a;
 //# sourceMappingURL=TablePaginationCard.js.map

package/dist/cjs/components/TablePagination/TablePaginationCard.js.map

@@ -1 +1 @@
-{"version":3,"file":"TablePaginationCard.js","sources":["../../../../src/components/TablePagination/TablePaginationCard.tsx"],"sourcesContent":["import React from 'react';\nimport styled from 'styled-components';\nimport {\n\tTablePagination,\n\tTablePaginationProps,\n} from '@src/components/TablePagination/TablePagination';\nimport { COLORS } from '@src/constants/Theme';\n\nexport const TablePaginationCardStyled = styled.div<{ removeBorder?: boolean }>`\n\tbackground: ${COLORS.surface.standard};\n\tborder: ${(props) => (props.removeBorder ? 0 : 1)}px solid\n\t\t${COLORS.stroke.primary};\n\tborder-radius: 4px;\n\tdisplay: flex;\n\tjustify-content: center;\n\tmargin: auto;\n`;\n\nexport const TablePaginationCard: React.FC<TablePaginationProps> = (props) => {\n\treturn (\n\t\t<TablePaginationCardStyled removeBorder={props.removeBorder}>\n\t\t\t<TablePagination {...props} />\n\t\t</TablePaginationCardStyled>\n\t);\n};\n"],"names":["TablePaginationCardStyled","styled","COLORS","props","TablePaginationCard","jsx","TablePagination"],"mappings":"4NAQaA,EAA4BC,EAAO;AAAA,eACjCC,EAAAA,OAAO,QAAQ,QAAQ;AAAA,WAC1BC,GAAWA,EAAM,aAAe,EAAI,CAAE;AAAA,IAC9CD,EAAAA,OAAO,OAAO,OAAO;AAAA;AAAA;AAAA;AAAA;AAAA,EAOZE,EAAuDD,GAElEE,EAAAA,IAACL,GAA0B,aAAcG,EAAM,aAC9C,SAAAE,EAAAA,IAACC,EAAAA,gBAAA,CAAiB,GAAGH,CAAA,CAAO,CAAA,CAC7B"}
+{"version":3,"file":"TablePaginationCard.js","sources":["../../../../src/components/TablePagination/TablePaginationCard.tsx"],"sourcesContent":["import React from 'react';\nimport styled from 'styled-components';\nimport {\n\tTablePagination,\n\tTablePaginationProps,\n} from '@src/components/TablePagination/TablePagination';\nimport { COLORS } from '@src/constants/Theme';\n\nexport const TablePaginationCardStyled = styled.div<{ removeBorder?: boolean }>`\n\tbackground: ${COLORS.surface.standard};\n\tborder: ${(props) => (props.removeBorder ? 0 : 1)}px solid\n\t\t${COLORS.stroke.primary};\n\tborder-radius: 4px;\n\tdisplay: flex;\n\tjustify-content: center;\n\tmargin: auto;\n`;\n\nexport const TablePaginationCard: React.FC<TablePaginationProps> = (props) => {\n\treturn (\n\t\t<TablePaginationCardStyled removeBorder={props.removeBorder}>\n\t\t\t<TablePagination {...props} />\n\t\t</TablePaginationCardStyled>\n\t);\n};\n"],"names":["TablePaginationCardStyled","styled","COLORS","props","TablePaginationCard","jsx","TablePagination"],"mappings":"2RAQaA,EAA4BC,EAAAA,QAAO;AAAA,eACjCC,EAAAA,OAAO,QAAQ,QAAQ;AAAA,WAC1BC,GAAWA,EAAM,aAAe,EAAI,CAAE;AAAA,IAC9CD,EAAAA,OAAO,OAAO,OAAO;AAAA;AAAA;AAAA;AAAA;AAAA,EAOZE,EAAuDD,GAElEE,EAAAA,IAACL,GAA0B,aAAcG,EAAM,aAC9C,SAAAE,EAAAA,IAACC,EAAAA,gBAAA,CAAiB,GAAGH,CAAA,CAAO,CAAA,CAC7B"}