@bikdotai/bik-component-library 0.0.43 → 0.0.44-2.beta.link.2

package/dist/cjs/components/SearchFilter/components/SearchFilterItem.d.ts

@@ -0,0 +1,7 @@
+import React from 'react';
+import { InputVariant } from '../../input';
+import { FilterSchema, FilterValueType } from '../types/SearchFilter.type';
+export declare const SearchFilterItem: React.FC<FilterSchema & {
+    variant: InputVariant;
+    onChange: (val: FilterValueType) => void;
+}>;

package/dist/cjs/components/SearchFilter/components/SearchFilterItem.js

@@ -0,0 +1 @@
+"use strict";Object.defineProperty(exports,"__esModule",{value:!0});var e=require("react/jsx-runtime");require("../../tooltips/Tooltip.js"),require("../../../constants/Theme.js"),require("../../TypographyStyle.js"),require("../../analytics-chips-and-dropdowns/CommonStyles.js");var r=require("../../analytics-chips-and-dropdowns/AnalyticsDropdown.js");require("react"),require("../../analytics-chips-and-dropdowns/AnalyticsMetric.js"),require("../../tag/Tag.js"),require("../../analytics-chips-and-dropdowns/chart/LineChart/LineChart.js"),require("react-bootstrap"),require("../../analytics-chips-and-dropdowns/chart/linearChipGroupedChart/LinearChipGroupedChart.styled.js"),require("../../analytics-chips-and-dropdowns/chart/Pie/PieChartAnalytics.js"),require("../../analytics-chips-and-dropdowns/chart/Pie/PieChart.js"),require("../../analytics-chips-and-dropdowns/chart/HorizontalBarGraph/HorizontalGraph.js"),require("../../analytics-chips-and-dropdowns/chart/StackedBarChart/StackedBarChart.js"),require("../../analytics-chips-and-dropdowns/chart/VerticalBarGraph/VerticalGraph.js"),require("../../analytics-chips-and-dropdowns/chart/heatmap/HeatMap.js"),require("../../analytics-chips-and-dropdowns/chart/VerticalBarAndLinearGraph/VerticalBarAndLinearGraph.js"),require("../../dropdown/DropdownPopover/index.js");var t=require("../../dropdown/Dropdown.js"),n=require("../../dropdown/ChipDropdown.js");require("../../zeroState/ZeroState.js"),require("../../dropdown/OpenedDropdown/components/description/Description.styled.js"),require("../../checkBox/CheckBox.styled.js"),require("../../list-item/ListItem.js"),require("../../dropdown/OpenedDropdown/components/menu/FreeFormMenu.styled.js"),require("../../dropdown/OpenedDropdown/components/menu/MenuItem.js"),require("../../dropdown/OpenedDropdown/components/menu/MenuList.styled.js"),require("../../button/Button.js"),require("../../dropdown/OpenedDropdown/components/multiSelect/MultiSelectDropdownBottomBar.styled.js"),require("../../dropdown/OpenedDropdown/components/OpennedDropdown.styled.js"),require("../../input/Input.js"),require("../../dropdown/MenuItem/MenuItem.js");var a=require("../types/SearchFilter.type.js"),o=require("./DatePickerButton.js"),i=require("./DateRangeOnlyButton.js");const s=[{label:"Last 7 days",value:"7 days",key:7,noOfDays:7},{label:"Last 30 days",value:"30 days",key:30,noOfDays:30},{label:"Custom range",value:"calender",key:"custom",isCustom:!0,dateRangeSelectionOptions:{selectRange:!0}}];exports.SearchFilterItem=d=>{var p,l,c;return d.type===a.FilterType.Date?e.jsx(o.DatePickerButton,Object.assign({},d,{variant:d.variant,onSelect:e=>d.onChange(e)})):d.type===a.FilterType.DateRange?d.rangePickerDateOnly?e.jsx(i.DateRangeOnlyButton,Object.assign({},d,{variant:d.variant,onSelect:e=>d.onChange(e)})):e.jsx(r.AnalyticsDropdown,{datePickerPlacement:d.datePickerPlacement,variant:d.variant,placeholder:d.text,options:d.preset?s:null!==(p=d.options)&&void 0!==p?p:[],onOptionSelected:function(e){var r,t;e.selectedRange&&d.onChange([null===(r=e.selectedRange)||void 0===r?void 0:r[0],null===(t=e.selectedRange)||void 0===t?void 0:t[1]])}},d.id):"small"===d.variant?e.jsx(n.ChipDropdown,{isMultiSelect:d.type===a.FilterType.Multiple,options:null!==(l=d.options)&&void 0!==l?l:[],defaultOptions:d.defaultValue,onSelect:d.onChange,placeHolder:d.text}):e.jsx(t.Dropdown,{isMultiSelect:d.type===a.FilterType.Multiple,size:"small",options:null!==(c=d.options)&&void 0!==c?c:[],defaultOptions:d.defaultValue,onSelect:d.onChange,placeHolder:d.text,width:10*d.text.length+"px"})};

package/dist/cjs/components/SearchFilter/index.d.ts

@@ -0,0 +1,3 @@
+import React from 'react';
+import { SearchFilterProps } from './types/SearchFilter.type';
+export declare const SearchFilter: React.FC<SearchFilterProps>;

package/dist/cjs/components/SearchFilter/index.js

@@ -0,0 +1 @@
+"use strict";Object.defineProperty(exports,"__esModule",{value:!0});var e=require("react"),t=require("react/jsx-runtime"),r=require("../searchBar/searchBar.js"),i=require("./components/FilterChipListRenderer.js"),l=require("./components/SearchFilterItem.js"),n=require("./types/SearchFilter.type.js");exports.SearchFilter=a=>{let{direction:s="row",schema:c,variant:d,onChange:u,showSelectedChips:p}=a;var o,f,v;const h=e.useRef(null!==(o=null==c?void 0:c.filter((e=>e.defaultValue)).map((e=>({id:e.id,value:e.defaultValue,type:e.type,text:e.text}))))&&void 0!==o?o:[]),[x,y]=e.useState([]),g=c.find((e=>e.type===n.FilterType.Search)),j=e=>{g&&e&&m(g.id,e)},m=(e,t)=>{const r=c.find((t=>t.id===e)),i=[...x];if(r){const l=i.findIndex((t=>t.id===e));-1!==l?i[l]={id:r.id,value:t}:i.push({id:r.id,value:t});const n=h.current.find((t=>t.id===e));h.current=n?h.current.map((r=>r.id===e?{id:r.id,value:t,type:r.type,text:r.text}:r)):[...h.current,{id:e,value:t,type:r.type,text:r.text}],u(r.id,h.current,t),y([...i])}};return t.jsxs("div",Object.assign({style:{display:"flex",flexDirection:"column",gap:8}},{children:[t.jsxs("div",Object.assign({style:{display:"flex",flexDirection:s,gap:8,flexWrap:"wrap",alignItems:"row"===s?"center":"self-start"}},{children:[g&&t.jsx(r.SearchBar,{width:null!==(v=null===(f=g.width)||void 0===f?void 0:f.toString())&&void 0!==v?v:"100%",isEnabled:!0,onChange:j,onEnter:j,placeholder:g.text,variant:"small"}),t.jsx("div",Object.assign({style:{display:"flex",flexDirection:"row",gap:8,flexWrap:"wrap",alignItems:"row"===s?"center":"self-start"}},{children:c.filter((e=>e.type!==n.FilterType.Search)).map(((t,r)=>e.createElement(l.SearchFilterItem,Object.assign({},t,{key:r,variant:d,onChange:e=>{m(t.id,e)}}))))}))]})),p&&t.jsx("div",Object.assign({style:{display:"flex",flexDirection:"row",gap:8}},{children:t.jsx(i.FilterChipListRenderer,{selectedState:h.current,onDeSelect:(e,t)=>{const r=c.find((t=>t.id===e));let i=[...x];r&&(r.type===n.FilterType.Multiple?(i=i.map((r=>{if(r.id===e){const e=r.value.filter((e=>e.value!==t.value));return e.length?Object.assign(Object.assign({},r),{value:e}):null}return r})).filter((e=>!!e)),h.current=h.current.map((r=>{var i;if(r.id===e){const e=null===(i=r.value)||void 0===i?void 0:i.filter((e=>e.value!==t.value));return e.length?Object.assign(Object.assign({},r),{value:e}):null}return r})).filter((e=>!!e))):(i=i.filter((t=>t.id!==e)),h.current=h.current.filter((t=>t.id!==e))),u(r.id,h.current,t),y([...i]))}})}))]}))};

package/dist/cjs/components/SearchFilter/types/SearchFilter.type.d.ts

@@ -0,0 +1,37 @@
+import { DropDirection } from 'react-bootstrap/esm/DropdownContext';
+import { DropdownOptions } from "../../analytics-chips-and-dropdowns";
+import { DropdownOption } from "../../dropdown/type";
+import { InputVariant } from "../../input";
+export declare enum FilterType {
+    Date = "Date",
+    DateRange = "DateRange",
+    Multiple = "Multiple",
+    Single = "Single",
+    Search = "Search"
+}
+export type FilterValueType = DropdownOption | DropdownOption[] | Date | Date[] | string;
+export type SearchFilterOutputState = {
+    id: string;
+    type: FilterType;
+    value?: FilterValueType;
+    text: string;
+};
+export type FilterSchema = {
+    id: string;
+    type: FilterType;
+    text: string;
+    options?: DropdownOption[] | DropdownOptions[];
+    preset?: boolean;
+    defaultValue?: FilterValueType;
+    width?: number | string;
+    datePickerPlacement?: DropDirection;
+    /** show oly the picker like date filter instead of dropdown */
+    rangePickerDateOnly?: boolean;
+};
+export type SearchFilterProps = {
+    variant: InputVariant;
+    showSelectedChips: boolean;
+    direction: 'row' | 'column';
+    schema: FilterSchema[];
+    onChange: (id: string, selectedStates: SearchFilterOutputState[], value?: FilterValueType) => void;
+};

package/dist/cjs/components/SearchFilter/types/SearchFilter.type.js

@@ -0,0 +1 @@
+"use strict";var e;Object.defineProperty(exports,"__esModule",{value:!0}),exports.FilterType=void 0,(e=exports.FilterType||(exports.FilterType={})).Date="Date",e.DateRange="DateRange",e.Multiple="Multiple",e.Single="Single",e.Search="Search";

package/dist/cjs/components/TablePagination/TablePagination.d.ts

@@ -4,6 +4,7 @@ export type TablePaginationProps = {
     pageSize: 5 | 10 | 20;
     pageNumber: number;
     totalRows: number;
+    hidePageSizeOptions?: boolean;
     updatePageNumber: (pageNumber: number) => void;
     updatePageSize: (option: DropdownOption | DropdownOption[]) => void;
 };

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

@@ -0,0 +1 @@
+"use strict";Object.defineProperty(exports,"__esModule",{value:!0});var e=require("react/jsx-runtime"),s=require("../../assets/icons/chevronLeft.svg.js"),t=require("../../assets/icons/chevronRight.svg.js"),n=require("./TablePagination.styled.js"),a=require("../../constants/Theme.js"),i=require("../dropdown/Dropdown.js"),r=require("../TypographyStyle.js");exports.TablePagination=o=>{let{pageNumber:l,pageSize:c,totalRows:d,updatePageNumber:g,updatePageSize:h,hidePageSizeOptions:j}=o;const p=a.DEFAULT_THEME.colorsV2,u=(l-1)*c+1,y=(l-1)*c+c,b=Math.ceil(d/c),x=1==b;let v=[];v=b>=5?l===b?[l-4,l-3,l-2,l-1,l]:1===l?[l,l+1,l+2,l+3,l+4]:2===l?[l-1,l,l+1,l+2,l+3]:l===b-1?[l-3,l-2,l-1,l,l+1]:[l-2,l-1,l,l+1,l+2]:Array.from({length:b},((e,s)=>s+1));const m=[{label:"5 rows per page",value:"5",selected:5===c},{label:"10 rows per page",value:"10",selected:10===c},{label:"20 rows per page",value:"20",selected:20===c}];return e.jsxs(n.StyledTablePaginationContainer,{children:[!j&&e.jsx("div",{children:e.jsx(i.Dropdown,{size:"small",options:m,onSelect:h,width:"162px"})}),e.jsxs("div",Object.assign({className:"paging__container"},{children:[!j&&d&&e.jsxs(r.BodySecondary,Object.assign({style:{color:p.content.placeholder,marginRight:8}},{children:["Showing ",u,"-",y>d?d:y," of"," ",d," results"]})),e.jsxs("div",Object.assign({className:"pages__buttons-container"},{children:[!x&&e.jsx(n.StyledPagingContainer,Object.assign({active:!1,onClick:()=>{1!==l&&g(Math.max(l-1,1))},disabled:1===l},{children:e.jsx(s.default,{color:p.content.secondary,height:14,width:14})})),v.map((s=>e.jsx(n.StyledPagingContainer,Object.assign({active:s==l,onClick:()=>g(s),style:{display:1==s&&d<=c?"none":"flex"}},{children:e.jsx(r.BodySecondary,Object.assign({style:{color:s==l?p.content.primaryInverse:p.content.secondary}},{children:s}))}),s))),!x&&e.jsx(n.StyledPagingContainer,Object.assign({isLast:!0,active:!1,onClick:()=>{l!==b&&g(Math.min(l+1,b))},disabled:l===b},{children:e.jsx(t.default,{color:p.content.secondary,height:14,width:14})}))]}))]}))]})};

package/dist/cjs/components/TablePagination/TablePagination.styled.d.ts

@@ -2,4 +2,5 @@ export declare const StyledTablePaginationContainer: import("styled-components")
 export declare const StyledPagingContainer: import("styled-components").StyledComponent<"div", any, {
     active: boolean;
     isLast?: boolean | undefined;
+    disabled?: boolean | undefined;
 }, never>;

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

@@ -0,0 +1,38 @@
+"use strict";Object.defineProperty(exports,"__esModule",{value:!0});var e=require("styled-components"),t=require("../../constants/Theme.js");function r(e){return e&&"object"==typeof e&&"default"in e?e:{default:e}}var o=r(e);const n=o.default.div`
+	background-color: unset !important;
+	display: flex;
+	align-items: center;
+	justify-content: space-between;
+	border-bottom-left-radius: 4px;
+	border-bottom-right-radius: 4px;
+	margin: 0 16px;
+
+	.paging__container {
+		display: flex;
+		margin-top: 8px;
+		margin-bottom: 8px;
+		justify-content: center;
+		align-items: center;
+	}
+
+	.pages__buttons-container {
+		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};
+		border-radius: 4px;
+		cursor: pointer;
+	}
+`,i=o.default.div`
+	background: ${e=>e.active?t.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}`};
+	&:hover {
+		cursor: ${e=>e.disabled?"not-allowed":"pointer"};
+	}
+`;exports.StyledPagingContainer=i,exports.StyledTablePaginationContainer=n;

package/dist/cjs/components/TablePagination/TablePaginationCard.d.ts

@@ -0,0 +1,7 @@
+import React from 'react';
+import { TablePaginationProps } from "./TablePagination";
+export declare const TablePaginationCardStyled: import("@emotion/styled").StyledComponent<{
+    theme?: import("@emotion/react").Theme | undefined;
+    as?: React.ElementType<any> | undefined;
+}, React.DetailedHTMLProps<React.HTMLAttributes<HTMLDivElement>, HTMLDivElement>, {}>;
+export declare const TablePaginationCard: React.FC<TablePaginationProps>;

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

@@ -0,0 +1 @@
+"use strict";Object.defineProperty(exports,"__esModule",{value:!0});var e=require("@emotion/styled/base"),c=require("react/jsx-runtime"),a=require("./TablePagination.js"),b=require("../../constants/Theme.js");function t(e){return e&&"object"==typeof e&&"default"in e?e:{default:e}}const l=t(e).default("div","production"===process.env.NODE_ENV?{target:"exfv5q90"}:{target:"exfv5q90",label:"TablePaginationCardStyled"})("background:",b.COLORS.surface.standard,";border:1px solid ",b.COLORS.stroke.primary,";border-radius:4px;display:flex;justify-content:center;"+("production"===process.env.NODE_ENV?"":"/*# sourceMappingURL=data:application/json;charset=utf-8;base64,eyJ2ZXJzaW9uIjozLCJzb3VyY2VzIjpbIlRhYmxlUGFnaW5hdGlvbkNhcmQudHN4Il0sIm5hbWVzIjpbXSwibWFwcGluZ3MiOiJBQUlvRCIsImZpbGUiOiJUYWJsZVBhZ2luYXRpb25DYXJkLnRzeCIsInNvdXJjZXNDb250ZW50IjpbImltcG9ydCB7IGpzeCBhcyBfanN4IH0gZnJvbSBcInJlYWN0L2pzeC1ydW50aW1lXCI7XHJcbmltcG9ydCBzdHlsZWQgZnJvbSAnQGVtb3Rpb24vc3R5bGVkJztcclxuaW1wb3J0IHsgVGFibGVQYWdpbmF0aW9uLCB9IGZyb20gXCIuL1RhYmxlUGFnaW5hdGlvblwiO1xyXG5pbXBvcnQgeyBDT0xPUlMgfSBmcm9tIFwiLi4vLi4vY29uc3RhbnRzL1RoZW1lXCI7XHJcbmV4cG9ydCBjb25zdCBUYWJsZVBhZ2luYXRpb25DYXJkU3R5bGVkID0gc3R5bGVkLmRpdiBgXG5cdGJhY2tncm91bmQ6ICR7Q09MT1JTLnN1cmZhY2Uuc3RhbmRhcmR9O1xuXHRib3JkZXI6IDFweCBzb2xpZCAke0NPTE9SUy5zdHJva2UucHJpbWFyeX07XG5cdGJvcmRlci1yYWRpdXM6IDRweDtcblx0ZGlzcGxheTogZmxleDtcblx0anVzdGlmeS1jb250ZW50OiBjZW50ZXI7XG5gO1xyXG5leHBvcnQgY29uc3QgVGFibGVQYWdpbmF0aW9uQ2FyZCA9IChwcm9wcykgPT4ge1xyXG4gICAgcmV0dXJuIChfanN4KFRhYmxlUGFnaW5hdGlvbkNhcmRTdHlsZWQsIHsgY2hpbGRyZW46IF9qc3goVGFibGVQYWdpbmF0aW9uLCBPYmplY3QuYXNzaWduKHt9LCBwcm9wcykpIH0pKTtcclxufTtcclxuLy8jIHNvdXJjZU1hcHBpbmdVUkw9VGFibGVQYWdpbmF0aW9uQ2FyZC5qcy5tYXAiXX0= */"));exports.TablePaginationCard=e=>c.jsx(l,{children:c.jsx(a.TablePagination,Object.assign({},e))}),exports.TablePaginationCardStyled=l;

package/dist/cjs/components/TablePagination/index.d.ts

@@ -1 +1,2 @@
 export * from './TablePagination';
+export * from './TablePaginationCard';

package/dist/cjs/components/TypographyStyle.d.ts

@@ -1,17 +1,72 @@
-export declare const TitleLarge: import("styled-components").StyledComponent<"div", any, {}, never>;
-export declare const TitleMedium: import("styled-components").StyledComponent<"div", any, {}, never>;
-export declare const TitleRegular: import("styled-components").StyledComponent<"div", any, {}, never>;
-export declare const TitleSmall: import("styled-components").StyledComponent<"div", any, {}, never>;
-export declare const Display: import("styled-components").StyledComponent<"div", any, {}, never>;
-export declare const BodyLarge: import("styled-components").StyledComponent<"div", any, {}, never>;
-export declare const BodyPrimary: import("styled-components").StyledComponent<"div", any, {}, never>;
-export declare const BodySecondary: import("styled-components").StyledComponent<"div", any, {}, never>;
-export declare const BodyPrimaryLink: import("styled-components").StyledComponent<"div", any, {}, never>;
-export declare const BodySecondaryLink: import("styled-components").StyledComponent<"div", any, {}, never>;
-export declare const BodyCaption: import("styled-components").StyledComponent<"div", any, {}, never>;
-export declare const BodyTiny: import("styled-components").StyledComponent<"div", any, {}, never>;
-export declare const ButtonLarge: import("styled-components").StyledComponent<"div", any, {}, never>;
-export declare const ButtonRegular: import("styled-components").StyledComponent<"div", any, {}, never>;
-export declare const SubHeading: import("styled-components").StyledComponent<"div", any, {}, never>;
-export declare const BodyRegular: import("styled-components").StyledComponent<"div", any, {}, never>;
-export declare const Caption: import("styled-components").StyledComponent<"div", any, {}, never>;
+export declare const TitleLarge: import("styled-components").StyledComponent<"div", any, {
+    numberOfLines?: number | undefined;
+    color?: string | undefined;
+}, never>;
+export declare const TitleMedium: import("styled-components").StyledComponent<"div", any, {
+    numberOfLines?: number | undefined;
+    color?: string | undefined;
+}, never>;
+export declare const SmallRegular: import("styled-components").StyledComponent<"div", any, {
+    numberOfLines?: number | undefined;
+    color?: string | undefined;
+}, never>;
+export declare const TitleRegular: import("styled-components").StyledComponent<"div", any, {
+    numberOfLines?: number | undefined;
+    color?: string | undefined;
+}, never>;
+export declare const TitleSmall: import("styled-components").StyledComponent<"div", any, {
+    numberOfLines?: number | undefined;
+    color?: string | undefined;
+}, never>;
+export declare const Display: import("styled-components").StyledComponent<"div", any, {
+    numberOfLines?: number | undefined;
+    color?: string | undefined;
+}, never>;
+export declare const BodyLarge: import("styled-components").StyledComponent<"div", any, {
+    numberOfLines?: number | undefined;
+    color?: string | undefined;
+}, never>;
+export declare const BodyPrimary: import("styled-components").StyledComponent<"div", any, {
+    numberOfLines?: number | undefined;
+    color?: string | undefined;
+}, never>;
+export declare const BodySecondary: import("styled-components").StyledComponent<"div", any, {
+    numberOfLines?: number | undefined;
+    color?: string | undefined;
+}, never>;
+export declare const BodyPrimaryLink: import("styled-components").StyledComponent<"div", any, {
+    numberOfLines?: number | undefined;
+    color?: string | undefined;
+}, never>;
+export declare const BodySecondaryLink: import("styled-components").StyledComponent<"div", any, {
+    numberOfLines?: number | undefined;
+    color?: string | undefined;
+}, never>;
+export declare const BodyCaption: import("styled-components").StyledComponent<"div", any, {
+    numberOfLines?: number | undefined;
+    color?: string | undefined;
+}, never>;
+export declare const BodyTiny: import("styled-components").StyledComponent<"div", any, {
+    numberOfLines?: number | undefined;
+    color?: string | undefined;
+}, never>;
+export declare const ButtonLarge: import("styled-components").StyledComponent<"div", any, {
+    numberOfLines?: number | undefined;
+    color?: string | undefined;
+}, never>;
+export declare const ButtonRegular: import("styled-components").StyledComponent<"div", any, {
+    numberOfLines?: number | undefined;
+    color?: string | undefined;
+}, never>;
+export declare const SubHeading: import("styled-components").StyledComponent<"div", any, {
+    numberOfLines?: number | undefined;
+    color?: string | undefined;
+}, never>;
+export declare const BodyRegular: import("styled-components").StyledComponent<"div", any, {
+    numberOfLines?: number | undefined;
+    color?: string | undefined;
+}, never>;
+export declare const Caption: import("styled-components").StyledComponent<"div", any, {
+    numberOfLines?: number | undefined;
+    color?: string | undefined;
+}, never>;

package/dist/cjs/components/TypographyStyle.js

@@ -1,100 +1,170 @@
-"use strict";Object.defineProperty(exports,"__esModule",{value:!0});var t=require("styled-components"),e=require("../constants/Theme.js");function i(t){return t&&"object"==typeof t&&"default"in t?t:{default:t}}var o=i(t);const n=t=>t+"px",r=o.default.div`
+"use strict";Object.defineProperty(exports,"__esModule",{value:!0});var e=require("styled-components"),t=require("../constants/Theme.js");function i(e){return e&&"object"==typeof e&&"default"in e?e:{default:e}}var o=i(e);const n=e=>e+"px",l=o.default.div`
 	font-family: Inter;
-	color: ${t=>t.color||e.COLORS.text.primary};
-	font-weight: ${e.FONTS.titleLarge.fontWeight};
-	font-size: ${n(e.FONTS.titleLarge.fontSize)};
-	line-height: ${n(e.FONTS.titleLarge.lineHeight)};
-`,l=o.default.div`
+	color: ${e=>e.color||t.COLORS.text.primary};
+	font-weight: ${t.FONTS.titleLarge.fontWeight};
+	font-size: ${n(t.FONTS.titleLarge.fontSize)};
+	line-height: ${n(t.FONTS.titleLarge.lineHeight)};
+	-webkit-box-orient: vertical;
+	overflow: hidden;
+	display: -webkit-box;
+	-webkit-line-clamp: ${e=>e.numberOfLines};
+`,r=o.default.div`
 	font-family: Inter;
-	color: ${t=>t.color||e.COLORS.text.primary};
-	font-weight: ${e.FONTS.titleMedium.fontWeight};
-	font-size: ${n(e.FONTS.titleMedium.fontSize)};
-	line-height: ${n(e.FONTS.titleMedium.lineHeight)};
+	color: ${e=>e.color||t.COLORS.text.primary};
+	font-weight: ${t.FONTS.titleMedium.fontWeight};
+	font-size: ${n(t.FONTS.titleMedium.fontSize)};
+	line-height: ${n(t.FONTS.titleMedium.lineHeight)};
+	-webkit-box-orient: vertical;
+	overflow: hidden;
+	display: -webkit-box;
+	-webkit-line-clamp: ${e=>e.numberOfLines};
 `,a=o.default.div`
 	font-family: Inter;
-	color: ${t=>t.color||e.COLORS.text.primary};
-	font-weight: ${e.FONTS.titleRegular.fontWeight};
-	font-size: ${n(e.FONTS.titleRegular.fontSize)};
-	line-height: ${n(e.FONTS.titleRegular.lineHeight)};
+	color: ${e=>e.color||t.COLORS.text.primary};
+	font-weight: ${t.FONTS.title4.fontWeight};
+	font-size: ${n(t.FONTS.title4.fontSize)};
+	line-height: ${n(t.FONTS.title4.lineHeight)};
+	-webkit-box-orient: vertical;
+	overflow: hidden;
+	display: -webkit-box;
+	-webkit-line-clamp: ${e=>e.numberOfLines};
 `,f=o.default.div`
 	font-family: Inter;
-	color: ${t=>t.color||e.COLORS.text.primary};
-	font-weight: ${e.FONTS.titleSmall.fontWeight};
-	font-size: ${n(e.FONTS.titleSmall.fontSize)};
-	line-height: ${n(e.FONTS.titleSmall.lineHeight)};
-`,S=o.default.div`
+	color: ${e=>e.color||t.COLORS.text.primary};
+	font-weight: ${t.FONTS.titleRegular.fontWeight};
+	font-size: ${n(t.FONTS.titleRegular.fontSize)};
+	line-height: ${n(t.FONTS.titleRegular.lineHeight)};
+	-webkit-box-orient: vertical;
+	overflow: hidden;
+	display: -webkit-box;
+	-webkit-line-clamp: ${e=>e.numberOfLines};
+`,d=o.default.div`
 	font-family: Inter;
-	color: ${t=>t.color||e.COLORS.text.primary};
-	font-weight: ${e.FONTS.display.fontWeight};
-	font-size: ${n(e.FONTS.display.fontSize)};
-	line-height: ${n(e.FONTS.display.lineHeight)};
-`,g=o.default.div`
+	color: ${e=>e.color||t.COLORS.text.primary};
+	font-weight: ${t.FONTS.titleSmall.fontWeight};
+	font-size: ${n(t.FONTS.titleSmall.fontSize)};
+	line-height: ${n(t.FONTS.titleSmall.lineHeight)};
+	-webkit-box-orient: vertical;
+	overflow: hidden;
+	display: -webkit-box;
+	-webkit-line-clamp: ${e=>e.numberOfLines};
+`,b=o.default.div`
 	font-family: Inter;
-	color: ${t=>t.color||e.COLORS.text.primary};
-	font-weight: ${e.FONTS.bodyPrimary.fontWeight};
-	font-size: ${n(e.FONTS.bodyLarge.fontSize)};
-	line-height: ${n(e.FONTS.bodyLarge.lineHeight)};
+	color: ${e=>e.color||t.COLORS.text.primary};
+	font-weight: ${t.FONTS.display.fontWeight};
+	font-size: ${n(t.FONTS.display.fontSize)};
+	line-height: ${n(t.FONTS.display.lineHeight)};
+	-webkit-box-orient: vertical;
+	overflow: hidden;
+	display: -webkit-box;
+	-webkit-line-clamp: ${e=>e.numberOfLines};
 `,O=o.default.div`
 	font-family: Inter;
-	color: ${t=>t.color||e.COLORS.text.primary};
-	font-weight: ${e.FONTS.bodyPrimary.fontWeight};
-	font-size: ${n(e.FONTS.bodyPrimary.fontSize)};
-	line-height: ${n(e.FONTS.bodyPrimary.lineHeight)};
-`,d=o.default.div`
+	color: ${e=>e.color||t.COLORS.text.primary};
+	font-weight: ${t.FONTS.bodyPrimary.fontWeight};
+	font-size: ${n(t.FONTS.bodyLarge.fontSize)};
+	line-height: ${n(t.FONTS.bodyLarge.lineHeight)};
+	-webkit-box-orient: vertical;
+	overflow: hidden;
+	display: -webkit-box;
+	-webkit-line-clamp: ${e=>e.numberOfLines};
+`,h=o.default.div`
+	font-family: Inter;
+	color: ${e=>e.color||t.COLORS.text.primary};
+	font-weight: ${t.FONTS.bodyPrimary.fontWeight};
+	font-size: ${n(t.FONTS.bodyPrimary.fontSize)};
+	line-height: ${n(t.FONTS.bodyPrimary.lineHeight)};
+	-webkit-box-orient: vertical;
+	overflow: hidden;
+	display: -webkit-box;
+	-webkit-line-clamp: ${e=>e.numberOfLines};
+`,c=o.default.div`
 	font-family: Inter;
-	color: ${e.COLORS.content.primary};
-	font-weight: ${e.FONTS.bodySecondary.fontWeight};
-	font-size: ${n(e.FONTS.bodySecondary.fontSize)};
-	line-height: ${n(e.FONTS.bodySecondary.lineHeight)};
-`,h=o.default(O)`
+	color: ${e=>e.color||t.COLORS.text.primary};
+	font-weight: ${t.FONTS.bodySecondary.fontWeight};
+	font-size: ${n(t.FONTS.bodySecondary.fontSize)};
+	line-height: ${n(t.FONTS.bodySecondary.lineHeight)};
+	-webkit-box-orient: vertical;
+	overflow: hidden;
+	display: -webkit-box;
+	-webkit-line-clamp: ${e=>e.numberOfLines};
+`,S=o.default(h)`
 	text-decoration: underline;
-	color: ${e.COLORS.content.brand};
-	text-decoration-color: ${e.COLORS.content.brand};
+	color: ${t.COLORS.content.brand};
+	text-decoration-color: ${t.COLORS.content.brand};
 	cursor: pointer;
-`,y=o.default(d)`
+`,g=o.default(c)`
 	text-decoration: underline;
-	color: ${e.COLORS.content.brand};
-	text-decoration-color: ${e.COLORS.content.brand};
+	color: ${t.COLORS.content.brand};
+	text-decoration-color: ${t.COLORS.content.brand};
 	cursor: pointer;
-`,$=o.default.div`
+`,y=o.default.div`
 	font-family: Inter;
-	color: ${t=>t.color||e.COLORS.text.primary};
-	font-weight: ${e.FONTS.caption.fontWeight};
-	font-size: ${n(e.FONTS.caption.fontSize)};
-	line-height: ${n(e.FONTS.caption.lineHeight)};
-`,c=o.default.div`
-	color: ${t=>t.color||e.COLORS.text.primary};
-	font-weight: ${e.FONTS.tiny.fontWeight};
-	font-size: ${n(e.FONTS.tiny.fontSize)};
-	line-height: ${n(e.FONTS.tiny.lineHeight)};
-`,u=o.default.div`
-	font-family: Inter;
-	color: ${t=>t.color||e.COLORS.text.primary};
-	font-weight: ${e.FONTS.buttonLarge.fontWeight};
-	font-size: ${n(e.FONTS.buttonLarge.fontSize)};
-	line-height: ${n(e.FONTS.buttonLarge.lineHeight)};
+	color: ${e=>e.color||t.COLORS.text.primary};
+	font-weight: ${t.FONTS.caption.fontWeight};
+	font-size: ${n(t.FONTS.caption.fontSize)};
+	line-height: ${n(t.FONTS.caption.lineHeight)};
+	-webkit-box-orient: vertical;
+	overflow: hidden;
+	display: -webkit-box;
+	-webkit-line-clamp: ${e=>e.numberOfLines};
 `,p=o.default.div`
-	font-family: Inter;
-	color: ${t=>t.color||e.COLORS.text.primary};
-	font-weight: ${e.FONTS.buttonRegular.fontWeight};
-	font-size: ${n(e.FONTS.buttonRegular.fontSize)};
-	line-height: ${n(e.FONTS.buttonRegular.lineHeight)};
+	color: ${e=>e.color||t.COLORS.text.primary};
+	font-weight: ${t.FONTS.tiny.fontWeight};
+	font-size: ${n(t.FONTS.tiny.fontSize)};
+	line-height: ${n(t.FONTS.tiny.lineHeight)};
+	-webkit-box-orient: vertical;
+	overflow: hidden;
+	display: -webkit-box;
+	-webkit-line-clamp: ${e=>e.numberOfLines};
 `,s=o.default.div`
 	font-family: Inter;
-	color: ${t=>t.color||e.COLORS.text.primary};
-	font-weight: ${e.FONTS.subHeading.fontWeight};
-	font-size: ${n(e.FONTS.subHeading.fontSize)};
-	line-height: ${n(e.FONTS.subHeading.lineHeight)};
-`,T=o.default.div`
+	color: ${e=>e.color||t.COLORS.text.primary};
+	font-weight: ${t.FONTS.buttonLarge.fontWeight};
+	font-size: ${n(t.FONTS.buttonLarge.fontSize)};
+	line-height: ${n(t.FONTS.buttonLarge.lineHeight)};
+	-webkit-box-orient: vertical;
+	overflow: hidden;
+	display: -webkit-box;
+	-webkit-line-clamp: ${e=>e.numberOfLines};
+`,$=o.default.div`
 	font-family: Inter;
-	color: ${t=>t.color||e.COLORS.text.primary};
-	font-weight: ${e.FONTS.bodyRegular.fontWeight};
-	font-size: ${n(e.FONTS.bodyRegular.fontSize)};
-	line-height: ${n(e.FONTS.bodyRegular.lineHeight)};
+	color: ${e=>e.color||t.COLORS.text.primary};
+	font-weight: ${t.FONTS.buttonRegular.fontWeight};
+	font-size: ${n(t.FONTS.buttonRegular.fontSize)};
+	line-height: ${n(t.FONTS.buttonRegular.lineHeight)};
+	-webkit-box-orient: vertical;
+	overflow: hidden;
+	display: -webkit-box;
+	-webkit-line-clamp: ${e=>e.numberOfLines};
 `,m=o.default.div`
 	font-family: Inter;
-	color: ${e.COLORS.text.primary};
-	font-weight: ${e.FONTS.caption.fontWeight};
-	font-size: ${n(e.FONTS.caption.fontSize)};
-	line-height: ${n(e.FONTS.caption.lineHeight)};
-`;exports.BodyCaption=$,exports.BodyLarge=g,exports.BodyPrimary=O,exports.BodyPrimaryLink=h,exports.BodyRegular=T,exports.BodySecondary=d,exports.BodySecondaryLink=y,exports.BodyTiny=c,exports.ButtonLarge=u,exports.ButtonRegular=p,exports.Caption=m,exports.Display=S,exports.SubHeading=s,exports.TitleLarge=r,exports.TitleMedium=l,exports.TitleRegular=a,exports.TitleSmall=f;
+	color: ${e=>e.color||t.COLORS.text.primary};
+	font-weight: ${t.FONTS.subHeading.fontWeight};
+	font-size: ${n(t.FONTS.subHeading.fontSize)};
+	line-height: ${n(t.FONTS.subHeading.lineHeight)};
+	-webkit-box-orient: vertical;
+	overflow: hidden;
+	display: -webkit-box;
+	-webkit-line-clamp: ${e=>e.numberOfLines};
+`,w=o.default.div`
+	font-family: Inter;
+	color: ${e=>e.color||t.COLORS.text.primary};
+	font-weight: ${t.FONTS.bodyRegular.fontWeight};
+	font-size: ${n(t.FONTS.bodyRegular.fontSize)};
+	line-height: ${n(t.FONTS.bodyRegular.lineHeight)};
+	-webkit-box-orient: vertical;
+	overflow: hidden;
+	display: -webkit-box;
+	-webkit-line-clamp: ${e=>e.numberOfLines};
+`,u=o.default.div`
+	font-family: Inter;
+	color: ${t.COLORS.text.primary};
+	font-weight: ${t.FONTS.caption.fontWeight};
+	font-size: ${n(t.FONTS.caption.fontSize)};
+	line-height: ${n(t.FONTS.caption.lineHeight)};
+	-webkit-box-orient: vertical;
+	overflow: hidden;
+	display: -webkit-box;
+	-webkit-line-clamp: ${e=>e.numberOfLines};
+`;exports.BodyCaption=y,exports.BodyLarge=O,exports.BodyPrimary=h,exports.BodyPrimaryLink=S,exports.BodyRegular=w,exports.BodySecondary=c,exports.BodySecondaryLink=g,exports.BodyTiny=p,exports.ButtonLarge=s,exports.ButtonRegular=$,exports.Caption=u,exports.Display=b,exports.SmallRegular=a,exports.SubHeading=m,exports.TitleLarge=l,exports.TitleMedium=r,exports.TitleRegular=f,exports.TitleSmall=d;

package/dist/cjs/components/WhatsAppTextEditor/CustomEditor.styled.d.ts

@@ -0,0 +1,15 @@
+/// <reference types="react" />
+export declare const Container: import("@emotion/styled").StyledComponent<{
+    theme?: import("@emotion/react").Theme | undefined;
+    as?: import("react").ElementType<any> | undefined;
+} & {
+    isError: boolean;
+}, import("react").DetailedHTMLProps<import("react").HTMLAttributes<HTMLDivElement>, HTMLDivElement>, {}>;
+export declare const TextSpace: import("@emotion/styled").StyledComponent<{
+    theme?: import("@emotion/react").Theme | undefined;
+    as?: import("react").ElementType<any> | undefined;
+}, import("react").DetailedHTMLProps<import("react").TextareaHTMLAttributes<HTMLTextAreaElement>, HTMLTextAreaElement>, {}>;
+export declare const OuterContainer: import("@emotion/styled").StyledComponent<{
+    theme?: import("@emotion/react").Theme | undefined;
+    as?: import("react").ElementType<any> | undefined;
+}, import("react").DetailedHTMLProps<import("react").HTMLAttributes<HTMLDivElement>, HTMLDivElement>, {}>;

package/dist/cjs/components/WhatsAppTextEditor/CustomEditor.styled.js

@@ -0,0 +1 @@
+"use strict";Object.defineProperty(exports,"__esModule",{value:!0});var c=require("@emotion/styled/base"),b=require("../../constants/Theme.js");function e(c){return c&&"object"==typeof c&&"default"in c?c:{default:c}}var l=e(c);const d=l.default("div","production"===process.env.NODE_ENV?{target:"e91dva42"}:{target:"e91dva42",label:"Container"})("background:",b.COLORS.surface.standard,";border:",(c=>c.isError?2:1),"px solid ",(c=>c.isError?b.COLORS.stroke.negative.vibrant:b.COLORS.stroke.primary),";border-radius:4px;"+("production"===process.env.NODE_ENV?"":"/*# sourceMappingURL=data:application/json;charset=utf-8;base64,eyJ2ZXJzaW9uIjozLCJzb3VyY2VzIjpbIkN1c3RvbUVkaXRvci5zdHlsZWQudHMiXSwibmFtZXMiOltdLCJtYXBwaW5ncyI6IkFBRW9DIiwiZmlsZSI6IkN1c3RvbUVkaXRvci5zdHlsZWQudHMiLCJzb3VyY2VzQ29udGVudCI6WyJpbXBvcnQgc3R5bGVkIGZyb20gJ0BlbW90aW9uL3N0eWxlZCc7XHJcbmltcG9ydCB7IENPTE9SUyB9IGZyb20gXCIuLi8uLi9jb25zdGFudHMvVGhlbWVcIjtcclxuZXhwb3J0IGNvbnN0IENvbnRhaW5lciA9IHN0eWxlZC5kaXYgYFxuXHRiYWNrZ3JvdW5kOiAke0NPTE9SUy5zdXJmYWNlLnN0YW5kYXJkfTtcblx0Ym9yZGVyOiAkeyhwcm9wcykgPT4gKHByb3BzLmlzRXJyb3IgPyAyIDogMSl9cHggc29saWRcblx0XHQkeyhwcm9wcykgPT4gcHJvcHMuaXNFcnJvciA/IENPTE9SUy5zdHJva2UubmVnYXRpdmUudmlicmFudCA6IENPTE9SUy5zdHJva2UucHJpbWFyeX07XG5cdGJvcmRlci1yYWRpdXM6IDRweDtcbmA7XHJcbmV4cG9ydCBjb25zdCBUZXh0U3BhY2UgPSBzdHlsZWQudGV4dGFyZWEgYFxuXHR3aWR0aDogMTAwJTtcblxuXHRib3JkZXI6IDA7XG5cdHBhZGRpbmc6IDEycHggMTZweDtcblx0cmVzaXplOiBub25lO1xuXHRjb2xvcjogJHtDT0xPUlMuY29udGVudC5wcmltYXJ5fTtcblxuXHQmOmZvY3VzLXdpdGhpbiB7XG5cdFx0Ym9yZGVyOiAwO1xuXHRcdG91dGxpbmU6IDA7XG5cdH1cbmA7XHJcbmV4cG9ydCBjb25zdCBPdXRlckNvbnRhaW5lciA9IHN0eWxlZC5kaXYgYFxuXHRkaXNwbGF5OiBmbGV4O1xuXHRmbGV4LWRpcmVjdGlvbjogY29sdW1uO1xuXHRnYXA6IDhweDtcbmA7XHJcbi8vIyBzb3VyY2VNYXBwaW5nVVJMPUN1c3RvbUVkaXRvci5zdHlsZWQuanMubWFwIl19 */")),t=l.default("textarea","production"===process.env.NODE_ENV?{target:"e91dva41"}:{target:"e91dva41",label:"TextSpace"})("width:100%;border:0;padding:12px 16px;resize:none;color:",b.COLORS.content.primary,";&:focus-within{border:0;outline:0;}"+("production"===process.env.NODE_ENV?"":"/*# sourceMappingURL=data:application/json;charset=utf-8;base64,eyJ2ZXJzaW9uIjozLCJzb3VyY2VzIjpbIkN1c3RvbUVkaXRvci5zdHlsZWQudHMiXSwibmFtZXMiOltdLCJtYXBwaW5ncyI6IkFBUXlDIiwiZmlsZSI6IkN1c3RvbUVkaXRvci5zdHlsZWQudHMiLCJzb3VyY2VzQ29udGVudCI6WyJpbXBvcnQgc3R5bGVkIGZyb20gJ0BlbW90aW9uL3N0eWxlZCc7XHJcbmltcG9ydCB7IENPTE9SUyB9IGZyb20gXCIuLi8uLi9jb25zdGFudHMvVGhlbWVcIjtcclxuZXhwb3J0IGNvbnN0IENvbnRhaW5lciA9IHN0eWxlZC5kaXYgYFxuXHRiYWNrZ3JvdW5kOiAke0NPTE9SUy5zdXJmYWNlLnN0YW5kYXJkfTtcblx0Ym9yZGVyOiAkeyhwcm9wcykgPT4gKHByb3BzLmlzRXJyb3IgPyAyIDogMSl9cHggc29saWRcblx0XHQkeyhwcm9wcykgPT4gcHJvcHMuaXNFcnJvciA/IENPTE9SUy5zdHJva2UubmVnYXRpdmUudmlicmFudCA6IENPTE9SUy5zdHJva2UucHJpbWFyeX07XG5cdGJvcmRlci1yYWRpdXM6IDRweDtcbmA7XHJcbmV4cG9ydCBjb25zdCBUZXh0U3BhY2UgPSBzdHlsZWQudGV4dGFyZWEgYFxuXHR3aWR0aDogMTAwJTtcblxuXHRib3JkZXI6IDA7XG5cdHBhZGRpbmc6IDEycHggMTZweDtcblx0cmVzaXplOiBub25lO1xuXHRjb2xvcjogJHtDT0xPUlMuY29udGVudC5wcmltYXJ5fTtcblxuXHQmOmZvY3VzLXdpdGhpbiB7XG5cdFx0Ym9yZGVyOiAwO1xuXHRcdG91dGxpbmU6IDA7XG5cdH1cbmA7XHJcbmV4cG9ydCBjb25zdCBPdXRlckNvbnRhaW5lciA9IHN0eWxlZC5kaXYgYFxuXHRkaXNwbGF5OiBmbGV4O1xuXHRmbGV4LWRpcmVjdGlvbjogY29sdW1uO1xuXHRnYXA6IDhweDtcbmA7XHJcbi8vIyBzb3VyY2VNYXBwaW5nVVJMPUN1c3RvbUVkaXRvci5zdHlsZWQuanMubWFwIl19 */")),a=l.default("div","production"===process.env.NODE_ENV?{target:"e91dva40"}:{target:"e91dva40",label:"OuterContainer"})("production"===process.env.NODE_ENV?{name:"3w0yoi",styles:"display:flex;flex-direction:column;gap:8px"}:{name:"3w0yoi",styles:"display:flex;flex-direction:column;gap:8px",map:"/*# sourceMappingURL=data:application/json;charset=utf-8;base64,eyJ2ZXJzaW9uIjozLCJzb3VyY2VzIjpbIkN1c3RvbUVkaXRvci5zdHlsZWQudHMiXSwibmFtZXMiOltdLCJtYXBwaW5ncyI6IkFBcUJ5QyIsImZpbGUiOiJDdXN0b21FZGl0b3Iuc3R5bGVkLnRzIiwic291cmNlc0NvbnRlbnQiOlsiaW1wb3J0IHN0eWxlZCBmcm9tICdAZW1vdGlvbi9zdHlsZWQnO1xyXG5pbXBvcnQgeyBDT0xPUlMgfSBmcm9tIFwiLi4vLi4vY29uc3RhbnRzL1RoZW1lXCI7XHJcbmV4cG9ydCBjb25zdCBDb250YWluZXIgPSBzdHlsZWQuZGl2IGBcblx0YmFja2dyb3VuZDogJHtDT0xPUlMuc3VyZmFjZS5zdGFuZGFyZH07XG5cdGJvcmRlcjogJHsocHJvcHMpID0+IChwcm9wcy5pc0Vycm9yID8gMiA6IDEpfXB4IHNvbGlkXG5cdFx0JHsocHJvcHMpID0+IHByb3BzLmlzRXJyb3IgPyBDT0xPUlMuc3Ryb2tlLm5lZ2F0aXZlLnZpYnJhbnQgOiBDT0xPUlMuc3Ryb2tlLnByaW1hcnl9O1xuXHRib3JkZXItcmFkaXVzOiA0cHg7XG5gO1xyXG5leHBvcnQgY29uc3QgVGV4dFNwYWNlID0gc3R5bGVkLnRleHRhcmVhIGBcblx0d2lkdGg6IDEwMCU7XG5cblx0Ym9yZGVyOiAwO1xuXHRwYWRkaW5nOiAxMnB4IDE2cHg7XG5cdHJlc2l6ZTogbm9uZTtcblx0Y29sb3I6ICR7Q09MT1JTLmNvbnRlbnQucHJpbWFyeX07XG5cblx0Jjpmb2N1cy13aXRoaW4ge1xuXHRcdGJvcmRlcjogMDtcblx0XHRvdXRsaW5lOiAwO1xuXHR9XG5gO1xyXG5leHBvcnQgY29uc3QgT3V0ZXJDb250YWluZXIgPSBzdHlsZWQuZGl2IGBcblx0ZGlzcGxheTogZmxleDtcblx0ZmxleC1kaXJlY3Rpb246IGNvbHVtbjtcblx0Z2FwOiA4cHg7XG5gO1xyXG4vLyMgc291cmNlTWFwcGluZ1VSTD1DdXN0b21FZGl0b3Iuc3R5bGVkLmpzLm1hcCJdfQ== */",toString:function(){return"You have tried to stringify object returned from `css` function. It isn't supposed to be used directly (e.g. as value of the `className` prop), but rather handed to emotion so it can handle it (e.g. as value of `css` prop)."}});exports.Container=d,exports.OuterContainer=a,exports.TextSpace=t;

package/dist/cjs/components/WhatsAppTextEditor/WhatsAppTextEditor.d.ts

@@ -0,0 +1,40 @@
+import React from 'react';
+import { EditorActionTypes } from './WhatsAppTextEditorHeader';
+export type CustomEditorProps = React.TextareaHTMLAttributes<HTMLTextAreaElement> & {
+    onChange?: (text: string, html: string) => void;
+    text?: string;
+    RightComponent?: React.FC;
+    error?: string;
+    limit?: number;
+    rows?: number;
+    actions?: EditorActionTypes[];
+    /**
+     * Calls only for editor only error, not for errors coming from outside
+     */
+    onError?: (err: string) => void;
+};
+export type CustomEditorRef = {
+    addTextOrWrap: (textToAdd: string) => {
+        text: string;
+        html: string;
+    };
+    addText: (textToAdd: string) => {
+        text: string;
+        html: string;
+    };
+    get: () => string;
+    setCaretPosition(caretPos: number): void;
+};
+export declare const WhatsAppTextEditor: React.ForwardRefExoticComponent<React.TextareaHTMLAttributes<HTMLTextAreaElement> & {
+    onChange?: ((text: string, html: string) => void) | undefined;
+    text?: string | undefined;
+    RightComponent?: React.FC<{}> | undefined;
+    error?: string | undefined;
+    limit?: number | undefined;
+    rows?: number | undefined;
+    actions?: EditorActionTypes[] | undefined;
+    /**
+     * Calls only for editor only error, not for errors coming from outside
+     */
+    onError?: ((err: string) => void) | undefined;
+} & React.RefAttributes<CustomEditorRef>>;

package/dist/cjs/components/WhatsAppTextEditor/WhatsAppTextEditor.js

@@ -0,0 +1 @@
+"use strict";Object.defineProperty(exports,"__esModule",{value:!0});var e=require("../../_virtual/_tslib.js"),t=require("react/jsx-runtime"),n=require("../../helpers/BaseWhatsappContentLang.helper.js"),r=require("react"),l=require("../../constants/Theme.js"),o=require("../TypographyStyle.js"),i=require("./CustomEditor.styled.js"),u=require("./WhatsAppTextEditorHeader.js");function c(e){return e&&"object"==typeof e&&"default"in e?e:{default:e}}var s=c(r);const a="Character limit reached",d=new n.BaseWhatsappContentLangHelper,v={[u.EditorActionTypes.BOLD]:"*",[u.EditorActionTypes.ITALIC]:"_",[u.EditorActionTypes.STRIKETHROUGH]:"~"},p=s.default.forwardRef(((n,c)=>{var s,p,{onChange:h,text:f,RightComponent:g,error:x,limit:j,onError:m,rows:C,actions:E}=n,T=e.__rest(n,["onChange","text","RightComponent","error","limit","onError","rows","actions"]);const y=r.useRef(null);function O(e){const t=null==y?void 0:y.current;null!=t&&(t.selectionStart?(t.focus(),t.selectionEnd=e):t.focus())}function L(e){var t,n;let r=null!==(n=null===(t=y.current)||void 0===t?void 0:t.value)&&void 0!==n?n:"";if(y.current&&e){const t=y.current.selectionStart,n=y.current.selectionEnd,l=e;if(t===n)return S(l);{r=d.wrappWildcard(t,n,l,r);const e=d.getHTML(r);return y.current.value=r,{text:r,html:e}}}return{text:r,html:r}}function S(e){var t,n;let r=null!==(n=null===(t=y.current)||void 0===t?void 0:t.value)&&void 0!==n?n:"";if(y.current&&e){const t=y.current.selectionStart;if(t===y.current.selectionEnd)return H(e,t)}return{text:r,html:r}}function H(e,t){var n,r;let l=null!==(r=null===(n=y.current)||void 0===n?void 0:n.value)&&void 0!==r?r:"";l=l.slice(0,t)+e+l.slice(t);const o=d.getHTML(l);return y.current.value=l,{text:l,html:o}}return r.useImperativeHandle(c,(()=>({addTextOrWrap:L,addText:S,get(){var e,t;return null!==(t=null===(e=y.current)||void 0===e?void 0:e.value)&&void 0!==t?t:""},setCaretPosition:O}))),r.useEffect((()=>{if(null==y?void 0:y.current){y.current.value=f||"";const e=d.getHTML(f||"");null==h||h(f||"",e)}}),[f]),r.useEffect((()=>{var e,t;(null===(e=null==y?void 0:y.current)||void 0===e?void 0:e.value)&&j&&((null===(t=null==y?void 0:y.current)||void 0===t?void 0:t.value.length)>j?null==m||m(a):null==m||m(null!=x?x:""))}),[null===(s=null==y?void 0:y.current)||void 0===s?void 0:s.value.length]),t.jsxs(i.OuterContainer,{children:[t.jsxs(i.Container,Object.assign({isError:!!x},{children:[t.jsx(u.WhatsAppTextEditorHeader,{actions:E,ref:y,onActionSelect:function(e){if((null==v?void 0:v[e])&&y.current){const t=y.current.selectionStart;if(t===y.current.selectionEnd){H(null==v?void 0:v[e],t);const{text:n,html:r}=H(null==v?void 0:v[e],t);O(t+1),null==h||h(n,r)}else{const{text:t,html:n}=L(null==v?void 0:v[e]);null==h||h(t,n)}}},RightComponent:g,onEmojiClick:function(e){const{text:t,html:n}=S(e);null==h||h(t,n)}}),t.jsx(i.TextSpace,Object.assign({ref:y,onChange:function(e){const t=e.target.value,n=d.getHTML(t);null==h||h(t,n)}},T,{rows:C}))]})),x&&x!==a?t.jsx(o.BodyCaption,Object.assign({style:{color:l.COLORS.content.negative}},{children:x})):t.jsx(t.Fragment,{children:j&&(null==y?void 0:y.current)?t.jsxs(o.BodyCaption,Object.assign({style:{color:x===a||(null===(p=null==y?void 0:y.current)||void 0===p?void 0:p.value.length)>j?l.COLORS.content.negative:l.COLORS.content.secondary}},{children:[y.current.value.length,"/",j]})):t.jsx(t.Fragment,{})})]})}));p.displayName="WhatsAppTextEditor",exports.WhatsAppTextEditor=p;

package/dist/cjs/components/WhatsAppTextEditor/WhatsAppTextEditorHeader.d.ts

@@ -0,0 +1,14 @@
+import React from 'react';
+export declare enum EditorActionTypes {
+    'BOLD' = "BOLD",
+    'ITALIC' = "ITALIC",
+    'STRIKETHROUGH' = "STRIKETHROUGH",
+    'EMOJI' = "EMOJI"
+}
+export type WhatsAppTextEditorHeaderProps = {
+    onActionSelect: (actionType: EditorActionTypes) => void;
+    RightComponent?: React.FC;
+    onEmojiClick?: (emoji: string) => void;
+    actions?: EditorActionTypes[];
+};
+export declare const WhatsAppTextEditorHeader: React.ForwardRefExoticComponent<WhatsAppTextEditorHeaderProps & React.RefAttributes<HTMLTextAreaElement>>;