@mrshmllw/smores-react 10.7.0-crumbs-feature-vite-bundling.1 → 10.7.0

package/dist/RadioGroup/RadioElement.js

@@ -0,0 +1,38 @@
+import React, { forwardRef } from 'react';
+import styled from 'styled-components';
+import { theme } from '../theme';
+import { focusOutline } from '../utils/focusOutline';
+import { visuallyHidden } from '../utils/visuallyHidden';
+import { Box } from '../Box';
+export const RadioElement = forwardRef(function RadioElement({ name, id, value, checked, onChange, onBlur, isError, ...marginProps }, ref) {
+    return (React.createElement(React.Fragment, null,
+        React.createElement(StyledInput, { ref: ref, type: "radio", name: name, id: id, value: `${value}`, checked: checked, onChange: () => onChange(value), onBlur: onBlur }),
+        React.createElement(RadioCircle, { "$isError": isError, "$checked": checked, ...marginProps })));
+});
+const StyledInput = styled.input `
+  ${visuallyHidden}
+`;
+const RADIO_SIZE = 24;
+const RadioCircle = styled(Box) `
+  flex-shrink: 0;
+  width: ${RADIO_SIZE}px;
+  height: ${RADIO_SIZE}px;
+  border-radius: ${RADIO_SIZE}px;
+  background-color: ${theme.colors.cream};
+  border: 2px solid
+    ${({ $isError }) => $isError ? theme.colors.strawberry : theme.colors.sesame};
+
+  ${({ $checked, $isError }) => !$checked &&
+    !$isError &&
+    `
+    &:hover {
+      border: 2px solid ${theme.colors.liquorice};
+    }
+  `}
+
+  ${({ $checked, $isError }) => $checked &&
+    `border: 8px solid ${$isError ? theme.colors.strawberry : theme.colors.liquorice};`}
+
+  ${focusOutline({ selector: `${StyledInput}:focus-visible + &` })}
+`;
+//# sourceMappingURL=RadioElement.js.map

package/dist/RadioGroup/RadioElement.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"RadioElement.js","sourceRoot":"","sources":["../../src/RadioGroup/RadioElement.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,EAAE,EAAc,UAAU,EAAE,MAAM,OAAO,CAAA;AACrD,OAAO,MAAM,MAAM,mBAAmB,CAAA;AAEtC,OAAO,EAAE,KAAK,EAAE,MAAM,UAAU,CAAA;AAChC,OAAO,EAAE,YAAY,EAAE,MAAM,uBAAuB,CAAA;AAEpD,OAAO,EAAE,cAAc,EAAE,MAAM,yBAAyB,CAAA;AAExD,OAAO,EAAE,GAAG,EAAE,MAAM,QAAQ,CAAA;AAa5B,MAAM,CAAC,MAAM,YAAY,GAAG,UAAU,CACpC,SAAS,YAAY,CACnB,EAAE,IAAI,EAAE,EAAE,EAAE,KAAK,EAAE,OAAO,EAAE,QAAQ,EAAE,MAAM,EAAE,OAAO,EAAE,GAAG,WAAW,EAAE,EACvE,GAAG;IAEH,OAAO,CACL;QACE,oBAAC,WAAW,IACV,GAAG,EAAE,GAAG,EACR,IAAI,EAAC,OAAO,EACZ,IAAI,EAAE,IAAI,EACV,EAAE,EAAE,EAAE,EACN,KAAK,EAAE,GAAG,KAAK,EAAE,EACjB,OAAO,EAAE,OAAO,EAChB,QAAQ,EAAE,GAAG,EAAE,CAAC,QAAQ,CAAC,KAAK,CAAC,EAC/B,MAAM,EAAE,MAAM,GACd;QACF,oBAAC,WAAW,gBAAW,OAAO,cAAY,OAAO,KAAM,WAAW,GAAI,CACrE,CACJ,CAAA;AACH,CAAC,CACF,CAAA;AAED,MAAM,WAAW,GAAG,MAAM,CAAC,KAAK,CAAA;IAC5B,cAAc;CACjB,CAAA;AAED,MAAM,UAAU,GAAG,EAAE,CAAA;AAErB,MAAM,WAAW,GAAG,MAAM,CAAC,GAAG,CAAC,CAA0C;;WAE9D,UAAU;YACT,UAAU;mBACH,UAAU;sBACP,KAAK,CAAC,MAAM,CAAC,KAAK;;MAElC,CAAC,EAAE,QAAQ,EAAE,EAAE,EAAE,CACjB,QAAQ,CAAC,CAAC,CAAC,KAAK,CAAC,MAAM,CAAC,UAAU,CAAC,CAAC,CAAC,KAAK,CAAC,MAAM,CAAC,MAAM;;IAE1D,CAAC,EAAE,QAAQ,EAAE,QAAQ,EAAE,EAAE,EAAE,CAC3B,CAAC,QAAQ;IACT,CAAC,QAAQ;IACT;;0BAEsB,KAAK,CAAC,MAAM,CAAC,SAAS;;GAE7C;;IAEC,CAAC,EAAE,QAAQ,EAAE,QAAQ,EAAE,EAAE,EAAE,CAC3B,QAAQ;IACR,qBACE,QAAQ,CAAC,CAAC,CAAC,KAAK,CAAC,MAAM,CAAC,UAAU,CAAC,CAAC,CAAC,KAAK,CAAC,MAAM,CAAC,SACpD,GAAG;;IAEH,YAAY,CAAC,EAAE,QAAQ,EAAE,GAAG,WAAW,oBAAoB,EAAE,CAAC;CACjE,CAAA","sourcesContent":["import React, { FocusEvent, forwardRef } from 'react'\nimport styled from 'styled-components'\n\nimport { theme } from '../theme'\nimport { focusOutline } from '../utils/focusOutline'\nimport { MarginProps } from '../utils/space'\nimport { visuallyHidden } from '../utils/visuallyHidden'\n\nimport { Box } from '../Box'\nimport { BaseValueType } from './types'\n\ntype RadioElementProps = {\n  name: string\n  id: string\n  value: BaseValueType\n  checked: boolean\n  onChange: (value: BaseValueType) => void\n  onBlur?: (e: FocusEvent<HTMLInputElement>) => void\n  isError: boolean\n} & MarginProps\n\nexport const RadioElement = forwardRef<HTMLInputElement, RadioElementProps>(\n  function RadioElement(\n    { name, id, value, checked, onChange, onBlur, isError, ...marginProps },\n    ref,\n  ) {\n    return (\n      <>\n        <StyledInput\n          ref={ref}\n          type=\"radio\"\n          name={name}\n          id={id}\n          value={`${value}`}\n          checked={checked}\n          onChange={() => onChange(value)}\n          onBlur={onBlur}\n        />\n        <RadioCircle $isError={isError} $checked={checked} {...marginProps} />\n      </>\n    )\n  },\n)\n\nconst StyledInput = styled.input`\n  ${visuallyHidden}\n`\n\nconst RADIO_SIZE = 24\n\nconst RadioCircle = styled(Box)<{ $isError: boolean; $checked: boolean }>`\n  flex-shrink: 0;\n  width: ${RADIO_SIZE}px;\n  height: ${RADIO_SIZE}px;\n  border-radius: ${RADIO_SIZE}px;\n  background-color: ${theme.colors.cream};\n  border: 2px solid\n    ${({ $isError }) =>\n      $isError ? theme.colors.strawberry : theme.colors.sesame};\n\n  ${({ $checked, $isError }) =>\n    !$checked &&\n    !$isError &&\n    `\n    &:hover {\n      border: 2px solid ${theme.colors.liquorice};\n    }\n  `}\n\n  ${({ $checked, $isError }) =>\n    $checked &&\n    `border: 8px solid ${\n      $isError ? theme.colors.strawberry : theme.colors.liquorice\n    };`}\n\n  ${focusOutline({ selector: `${StyledInput}:focus-visible + &` })}\n`\n"]}

package/dist/RadioGroup/RadioGroup.d.ts

@@ -0,0 +1,23 @@
+import React, { FocusEvent, ReactElement } from 'react';
+import { CommonFieldProps } from '../fields/commonFieldTypes';
+import { Icons } from '../Icon/iconsList';
+import { BaseValueType, DisplayType, IconPosition } from './types';
+export type RadioGroupProps<Value extends BaseValueType = BaseValueType> = {
+    options: Array<{
+        visual?: string;
+        icon?: Icons;
+        iconPosition?: IconPosition;
+        label: string;
+        value: Value;
+        bodyCopy?: string;
+    }>;
+    onChange: (value: Value) => void;
+    onBlur?: (e: FocusEvent<HTMLInputElement>) => void;
+    value: Value;
+    displayType?: DisplayType;
+    fallbackStyle?: boolean;
+} & CommonFieldProps;
+export type RadioGroupElement = {
+    focus: VoidFunction;
+};
+export declare const RadioGroup: <Value extends BaseValueType = BaseValueType>(p: RadioGroupProps<Value> & React.RefAttributes<HTMLInputElement>) => ReactElement<any> | null;

package/dist/RadioGroup/RadioGroup.js

@@ -0,0 +1,44 @@
+import React, { forwardRef, useImperativeHandle, useRef, } from 'react';
+import styled from 'styled-components';
+import { useUniqueId } from '../utils/id';
+import { Fieldset } from '../fields/Fieldset';
+import { ITEM_GAP } from './constants';
+import { RadioItem } from './RadioItem';
+const RadioGroupComponent = ({ options, onChange, onBlur, value, displayType = 'normal', renderAsTitle = false, error = false, fallbackStyle = false, ...fieldProps }, ref) => {
+    const name = useUniqueId();
+    const optionRefs = useRef([]);
+    useImperativeHandle(ref, () => {
+        return {
+            focus: () => {
+                const selectedIndex = options.findIndex((item) => item.value === value);
+                const elementToFocus = selectedIndex === -1 ? 0 : selectedIndex;
+                optionRefs.current[elementToFocus].current?.focus();
+            },
+        };
+    });
+    return (React.createElement(Fieldset, { renderAsTitle: renderAsTitle, error: error, ...fieldProps },
+        React.createElement(RadioItemList, { "$displayType": displayType }, options.map((option, index) => {
+            const isSelected = option.value === value;
+            return (React.createElement(RadioItem, { ref: (radioOptionRef) => {
+                    optionRefs.current[index] = {
+                        current: radioOptionRef,
+                    };
+                }, key: `${option.value}`, name: name, visual: option.visual, icon: option.icon, iconPosition: option.iconPosition, label: option.label, value: option.value, checked: isSelected, onChange: onChange, onBlur: onBlur, displayType: displayType, isError: error, fallbackStyle: fallbackStyle, bodyCopy: option.bodyCopy }));
+        }))));
+};
+export const RadioGroup = forwardRef(RadioGroupComponent);
+const RadioItemList = styled.div `
+  display: flex;
+  gap: ${ITEM_GAP}px;
+
+  ${({ $displayType }) => {
+    if ($displayType === 'horizontal-card') {
+        return `
+        flex-direction: row;
+        flex-wrap: wrap;
+      `;
+    }
+    return `flex-direction: column;`;
+}}
+`;
+//# sourceMappingURL=RadioGroup.js.map

package/dist/RadioGroup/RadioGroup.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"RadioGroup.js","sourceRoot":"","sources":["../../src/RadioGroup/RadioGroup.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,EAAE,EAGZ,UAAU,EAGV,mBAAmB,EACnB,MAAM,GACP,MAAM,OAAO,CAAA;AACd,OAAO,MAAM,MAAM,mBAAmB,CAAA;AAEtC,OAAO,EAAE,WAAW,EAAE,MAAM,aAAa,CAAA;AAIzC,OAAO,EAAE,QAAQ,EAAE,MAAM,oBAAoB,CAAA;AAG7C,OAAO,EAAE,QAAQ,EAAE,MAAM,aAAa,CAAA;AACtC,OAAO,EAAE,SAAS,EAAE,MAAM,aAAa,CAAA;AAuBvC,MAAM,mBAAmB,GAAG,CAC1B,EACE,OAAO,EACP,QAAQ,EACR,MAAM,EACN,KAAK,EACL,WAAW,GAAG,QAAQ,EACtB,aAAa,GAAG,KAAK,EACrB,KAAK,GAAG,KAAK,EACb,aAAa,GAAG,KAAK,EACrB,GAAG,UAAU,EACU,EACzB,GAAoC,EACpC,EAAE;IACF,MAAM,IAAI,GAAG,WAAW,EAAE,CAAA;IAE1B,MAAM,UAAU,GAAG,MAAM,CAAuC,EAAE,CAAC,CAAA;IACnE,mBAAmB,CAAC,GAAG,EAAE,GAAG,EAAE;QAC5B,OAAO;YACL,KAAK,EAAE,GAAG,EAAE;gBACV,MAAM,aAAa,GAAG,OAAO,CAAC,SAAS,CAAC,CAAC,IAAI,EAAE,EAAE,CAAC,IAAI,CAAC,KAAK,KAAK,KAAK,CAAC,CAAA;gBAEvE,MAAM,cAAc,GAAG,aAAa,KAAK,CAAC,CAAC,CAAC,CAAC,CAAC,CAAC,CAAC,CAAC,CAAC,aAAa,CAAA;gBAC/D,UAAU,CAAC,OAAO,CAAC,cAAc,CAAC,CAAC,OAAO,EAAE,KAAK,EAAE,CAAA;YACrD,CAAC;SACF,CAAA;IACH,CAAC,CAAC,CAAA;IAEF,OAAO,CACL,oBAAC,QAAQ,IAAC,aAAa,EAAE,aAAa,EAAE,KAAK,EAAE,KAAK,KAAM,UAAU;QAClE,oBAAC,aAAa,oBAAe,WAAW,IACrC,OAAO,CAAC,GAAG,CAAC,CAAC,MAAM,EAAE,KAAK,EAAE,EAAE;YAC7B,MAAM,UAAU,GAAG,MAAM,CAAC,KAAK,KAAK,KAAK,CAAA;YAEzC,OAAO,CACL,oBAAC,SAAS,IACR,GAAG,EAAE,CAAC,cAAc,EAAE,EAAE;oBACtB,UAAU,CAAC,OAAO,CAAC,KAAK,CAAC,GAAG;wBAC1B,OAAO,EAAE,cAAc;qBACxB,CAAA;gBACH,CAAC,EACD,GAAG,EAAE,GAAG,MAAM,CAAC,KAAK,EAAE,EACtB,IAAI,EAAE,IAAI,EACV,MAAM,EAAE,MAAM,CAAC,MAAM,EACrB,IAAI,EAAE,MAAM,CAAC,IAAI,EACjB,YAAY,EAAE,MAAM,CAAC,YAAY,EACjC,KAAK,EAAE,MAAM,CAAC,KAAK,EACnB,KAAK,EAAE,MAAM,CAAC,KAAK,EACnB,OAAO,EAAE,UAAU,EACnB,QAAQ,EAAE,QAAQ,EAClB,MAAM,EAAE,MAAM,EACd,WAAW,EAAE,WAAW,EACxB,OAAO,EAAE,KAAK,EACd,aAAa,EAAE,aAAa,EAC5B,QAAQ,EAAE,MAAM,CAAC,QAAQ,GACzB,CACH,CAAA;QACH,CAAC,CAAC,CACY,CACP,CACZ,CAAA;AACH,CAAC,CAAA;AAED,MAAM,CAAC,MAAM,UAAU,GAAG,UAAU,CAAC,mBAAmB,CAI3B,CAAA;AAE7B,MAAM,aAAa,GAAG,MAAM,CAAC,GAAG,CAE/B;;SAEQ,QAAQ;;IAEb,CAAC,EAAE,YAAY,EAAE,EAAE,EAAE;IACrB,IAAI,YAAY,KAAK,iBAAiB,EAAE,CAAC;QACvC,OAAO;;;OAGN,CAAA;IACH,CAAC;IAED,OAAO,yBAAyB,CAAA;AAClC,CAAC;CACF,CAAA","sourcesContent":["import React, {\n  FocusEvent,\n  ForwardedRef,\n  forwardRef,\n  ReactElement,\n  RefObject,\n  useImperativeHandle,\n  useRef,\n} from 'react'\nimport styled from 'styled-components'\n\nimport { useUniqueId } from '../utils/id'\n\nimport { TransientProps } from 'utils/utilTypes'\nimport { CommonFieldProps } from '../fields/commonFieldTypes'\nimport { Fieldset } from '../fields/Fieldset'\nimport { Icons } from '../Icon/iconsList'\n\nimport { ITEM_GAP } from './constants'\nimport { RadioItem } from './RadioItem'\nimport { BaseValueType, DisplayType, IconPosition } from './types'\n\nexport type RadioGroupProps<Value extends BaseValueType = BaseValueType> = {\n  options: Array<{\n    visual?: string\n    icon?: Icons\n    iconPosition?: IconPosition\n    label: string\n    value: Value\n    bodyCopy?: string\n  }>\n  onChange: (value: Value) => void\n  onBlur?: (e: FocusEvent<HTMLInputElement>) => void\n  value: Value\n  displayType?: DisplayType\n  fallbackStyle?: boolean\n} & CommonFieldProps\n\nexport type RadioGroupElement = {\n  focus: VoidFunction\n}\n\nconst RadioGroupComponent = <Value extends BaseValueType>(\n  {\n    options,\n    onChange,\n    onBlur,\n    value,\n    displayType = 'normal',\n    renderAsTitle = false,\n    error = false,\n    fallbackStyle = false,\n    ...fieldProps\n  }: RadioGroupProps<Value>,\n  ref: ForwardedRef<RadioGroupElement>,\n) => {\n  const name = useUniqueId()\n\n  const optionRefs = useRef<RefObject<HTMLInputElement | null>[]>([])\n  useImperativeHandle(ref, () => {\n    return {\n      focus: () => {\n        const selectedIndex = options.findIndex((item) => item.value === value)\n\n        const elementToFocus = selectedIndex === -1 ? 0 : selectedIndex\n        optionRefs.current[elementToFocus].current?.focus()\n      },\n    }\n  })\n\n  return (\n    <Fieldset renderAsTitle={renderAsTitle} error={error} {...fieldProps}>\n      <RadioItemList $displayType={displayType}>\n        {options.map((option, index) => {\n          const isSelected = option.value === value\n\n          return (\n            <RadioItem\n              ref={(radioOptionRef) => {\n                optionRefs.current[index] = {\n                  current: radioOptionRef,\n                }\n              }}\n              key={`${option.value}`}\n              name={name}\n              visual={option.visual}\n              icon={option.icon}\n              iconPosition={option.iconPosition}\n              label={option.label}\n              value={option.value}\n              checked={isSelected}\n              onChange={onChange}\n              onBlur={onBlur}\n              displayType={displayType}\n              isError={error}\n              fallbackStyle={fallbackStyle}\n              bodyCopy={option.bodyCopy}\n            />\n          )\n        })}\n      </RadioItemList>\n    </Fieldset>\n  )\n}\n\nexport const RadioGroup = forwardRef(RadioGroupComponent) as <\n  Value extends BaseValueType = BaseValueType,\n>(\n  p: RadioGroupProps<Value> & React.RefAttributes<HTMLInputElement>,\n) => ReactElement<any> | null\n\nconst RadioItemList = styled.div<\n  TransientProps<Pick<RadioGroupProps, 'displayType'>>\n>`\n  display: flex;\n  gap: ${ITEM_GAP}px;\n\n  ${({ $displayType }) => {\n    if ($displayType === 'horizontal-card') {\n      return `\n        flex-direction: row;\n        flex-wrap: wrap;\n      `\n    }\n\n    return `flex-direction: column;`\n  }}\n`\n"]}

package/dist/RadioGroup/RadioItem.d.ts

@@ -0,0 +1,20 @@
+import React, { FocusEvent } from 'react';
+import { Icons } from '../Icon/iconsList';
+import { BaseValueType, DisplayType, IconPosition } from './types';
+type RadioItemProps = {
+    name: string;
+    visual?: string;
+    icon?: Icons;
+    iconPosition?: IconPosition;
+    value: BaseValueType;
+    label: string;
+    checked: boolean;
+    onChange: (value: BaseValueType) => void;
+    onBlur?: (e: FocusEvent<HTMLInputElement>) => void;
+    displayType: DisplayType;
+    isError: boolean;
+    fallbackStyle?: boolean;
+    bodyCopy?: string;
+};
+export declare const RadioItem: React.ForwardRefExoticComponent<RadioItemProps & React.RefAttributes<HTMLInputElement>>;
+export {};

package/dist/RadioGroup/RadioItem.js

@@ -0,0 +1,98 @@
+import React, { forwardRef } from 'react';
+import styled, { css } from 'styled-components';
+import { theme } from '../theme';
+import { useUniqueId } from '../utils/id';
+import { Box } from '../Box';
+import { Icon } from '../Icon';
+import { Text } from '../Text';
+import { RadioElement } from './RadioElement';
+import { ITEM_GAP } from './constants';
+export const RadioItem = forwardRef(function RadioItem({ name, visual, icon, iconPosition = 'center', label, value, checked, onChange, onBlur, displayType, isError, fallbackStyle, bodyCopy, }, ref) {
+    const id = useUniqueId();
+    return (React.createElement(Wrapper, { htmlFor: id, checked: checked, "$displayType": displayType, "data-testid": value, "$isError": isError, "$fallbackStyle": fallbackStyle },
+        visual && !icon && (React.createElement(VisualWrapper, null,
+            React.createElement(Visual, { "$visualUrl": visual }))),
+        !visual && icon && (React.createElement(IconWrapper, { "$iconPosition": iconPosition },
+            React.createElement(Icon, { render: icon, size: 24 }))),
+        React.createElement(Box, { flex: true, alignItems: "center" },
+            React.createElement(RadioElement, { ref: ref, name: name, id: id, value: value, checked: checked, onChange: onChange, onBlur: onBlur, isError: isError, mr: "8px" }),
+            React.createElement(Box, null,
+                React.createElement(RadioText, { "$isError": isError }, label),
+                bodyCopy && (React.createElement(Box, null,
+                    React.createElement(Text, { typo: "caption" }, bodyCopy)))))));
+});
+const VisualWrapper = styled.div `
+  width: 100%;
+  max-width: 120px;
+  margin: 0 auto 8px;
+`;
+const IconWrapper = styled.div `
+  display: flex;
+  padding-bottom: 12px;
+
+  ${({ $iconPosition }) => $iconPosition === 'center' &&
+    css `
+      justify-content: center;
+    `}
+
+  ${({ $iconPosition }) => $iconPosition === 'start' &&
+    css `
+      justify-content: flex-start;
+    `}
+`;
+const Visual = styled.div `
+  width: 100%;
+  padding-top: 100%;
+  background-image: url('${(p) => p.$visualUrl}');
+  background-size: contain;
+  background-repeat: no-repeat;
+  background-position: center;
+`;
+const Wrapper = styled.label `
+  display: flex;
+  flex-direction: column;
+  cursor: pointer;
+
+  ${({ $displayType, checked, $isError, $fallbackStyle }) => css `
+    ${($displayType === 'horizontal-card' ||
+    $displayType === 'vertical-card') &&
+    css `
+      border-radius: 12px;
+      background-color: ${$fallbackStyle
+        ? theme.colors.cream
+        : theme.colors.custard};
+      padding: ${checked ? '10px' : '12px'};
+      border: ${checked &&
+        ($isError
+            ? `2px solid ${theme.colors.strawberry}`
+            : `2px solid ${theme.colors.liquorice}`)};
+
+      &:hover {
+        background-color: ${$fallbackStyle
+        ? theme.colors.coconut
+        : theme.colors.oatmeal};
+      }
+    `}
+    ${$displayType === 'horizontal-card' &&
+    css `
+      width: 100%;
+      justify-content: center;
+
+      @media (min-width: 420px) {
+        width: calc(50% - ${ITEM_GAP / 2}px);
+      }
+
+      @media (min-width: 768px) {
+        width: 201px;
+      }
+    `}
+  `}
+`;
+const RadioText = styled.span `
+  line-height: 16px;
+  font-size: 16px;
+  font-weight: ${theme.font.weight.medium};
+  color: ${({ $isError }) => $isError ? theme.colors.strawberry : theme.colors.liquorice};
+  margin-top: 4px;
+`;
+//# sourceMappingURL=RadioItem.js.map

package/dist/RadioGroup/RadioItem.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"RadioItem.js","sourceRoot":"","sources":["../../src/RadioGroup/RadioItem.tsx"],"names":[],"mappings":"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","sourcesContent":["import React, { FocusEvent, forwardRef } from 'react'\nimport styled, { css } from 'styled-components'\n\nimport { theme } from '../theme'\nimport { useUniqueId } from '../utils/id'\n\nimport { TransientProps } from 'utils/utilTypes'\nimport { Box } from '../Box'\nimport { Icon } from '../Icon'\nimport { Icons } from '../Icon/iconsList'\n\nimport { Text } from '../Text'\nimport { RadioElement } from './RadioElement'\nimport { ITEM_GAP } from './constants'\nimport { BaseValueType, DisplayType, IconPosition } from './types'\n\ntype RadioItemProps = {\n  name: string\n  visual?: string\n  icon?: Icons\n  iconPosition?: IconPosition\n  value: BaseValueType\n  label: string\n  checked: boolean\n  onChange: (value: BaseValueType) => void\n  onBlur?: (e: FocusEvent<HTMLInputElement>) => void\n  displayType: DisplayType\n  isError: boolean\n  fallbackStyle?: boolean\n  bodyCopy?: string\n}\n\nexport const RadioItem = forwardRef<HTMLInputElement, RadioItemProps>(\n  function RadioItem(\n    {\n      name,\n      visual,\n      icon,\n      iconPosition = 'center',\n      label,\n      value,\n      checked,\n      onChange,\n      onBlur,\n      displayType,\n      isError,\n      fallbackStyle,\n      bodyCopy,\n    },\n    ref,\n  ) {\n    const id = useUniqueId()\n    return (\n      <Wrapper\n        htmlFor={id}\n        checked={checked}\n        $displayType={displayType}\n        data-testid={value}\n        $isError={isError}\n        $fallbackStyle={fallbackStyle}\n      >\n        {visual && !icon && (\n          <VisualWrapper>\n            <Visual $visualUrl={visual} />\n          </VisualWrapper>\n        )}\n        {!visual && icon && (\n          <IconWrapper $iconPosition={iconPosition}>\n            <Icon render={icon} size={24} />\n          </IconWrapper>\n        )}\n        <Box flex alignItems=\"center\">\n          <RadioElement\n            ref={ref}\n            name={name}\n            id={id}\n            value={value}\n            checked={checked}\n            onChange={onChange}\n            onBlur={onBlur}\n            isError={isError}\n            mr=\"8px\"\n          />\n          <Box>\n            <RadioText $isError={isError}>{label}</RadioText>\n            {bodyCopy && (\n              <Box>\n                <Text typo=\"caption\">{bodyCopy}</Text>\n              </Box>\n            )}\n          </Box>\n        </Box>\n      </Wrapper>\n    )\n  },\n)\n\nconst VisualWrapper = styled.div`\n  width: 100%;\n  max-width: 120px;\n  margin: 0 auto 8px;\n`\n\nconst IconWrapper = styled.div<{ $iconPosition?: IconPosition }>`\n  display: flex;\n  padding-bottom: 12px;\n\n  ${({ $iconPosition }) =>\n    $iconPosition === 'center' &&\n    css`\n      justify-content: center;\n    `}\n\n  ${({ $iconPosition }) =>\n    $iconPosition === 'start' &&\n    css`\n      justify-content: flex-start;\n    `}\n`\n\nconst Visual = styled.div<{ $visualUrl: string }>`\n  width: 100%;\n  padding-top: 100%;\n  background-image: url('${(p) => p.$visualUrl}');\n  background-size: contain;\n  background-repeat: no-repeat;\n  background-position: center;\n`\n\nconst Wrapper = styled.label<\n  TransientProps<\n    Pick<RadioItemProps, 'displayType' | 'isError' | 'fallbackStyle'>\n  > & { checked: boolean }\n>`\n  display: flex;\n  flex-direction: column;\n  cursor: pointer;\n\n  ${({ $displayType, checked, $isError, $fallbackStyle }) => css`\n    ${($displayType === 'horizontal-card' ||\n      $displayType === 'vertical-card') &&\n    css`\n      border-radius: 12px;\n      background-color: ${$fallbackStyle\n        ? theme.colors.cream\n        : theme.colors.custard};\n      padding: ${checked ? '10px' : '12px'};\n      border: ${checked &&\n      ($isError\n        ? `2px solid ${theme.colors.strawberry}`\n        : `2px solid ${theme.colors.liquorice}`)};\n\n      &:hover {\n        background-color: ${$fallbackStyle\n          ? theme.colors.coconut\n          : theme.colors.oatmeal};\n      }\n    `}\n    ${$displayType === 'horizontal-card' &&\n    css`\n      width: 100%;\n      justify-content: center;\n\n      @media (min-width: 420px) {\n        width: calc(50% - ${ITEM_GAP / 2}px);\n      }\n\n      @media (min-width: 768px) {\n        width: 201px;\n      }\n    `}\n  `}\n`\n\nconst RadioText = styled.span<{ $isError: boolean }>`\n  line-height: 16px;\n  font-size: 16px;\n  font-weight: ${theme.font.weight.medium};\n  color: ${({ $isError }) =>\n    $isError ? theme.colors.strawberry : theme.colors.liquorice};\n  margin-top: 4px;\n`\n"]}

package/dist/RadioGroup/constants.d.ts

@@ -0,0 +1 @@
+export declare const ITEM_GAP = 12;

package/dist/RadioGroup/constants.js

@@ -0,0 +1,2 @@
+export const ITEM_GAP = 12;
+//# sourceMappingURL=constants.js.map

package/dist/RadioGroup/constants.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"constants.js","sourceRoot":"","sources":["../../src/RadioGroup/constants.ts"],"names":[],"mappings":"AAAA,MAAM,CAAC,MAAM,QAAQ,GAAG,EAAE,CAAA","sourcesContent":["export const ITEM_GAP = 12\n"]}

package/dist/RadioGroup/index.d.ts

@@ -0,0 +1 @@
+export * from './RadioGroup';

package/dist/RadioGroup/index.js

@@ -0,0 +1,2 @@
+export * from './RadioGroup';
+//# sourceMappingURL=index.js.map

package/dist/RadioGroup/index.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"index.js","sourceRoot":"","sources":["../../src/RadioGroup/index.ts"],"names":[],"mappings":"AAAA,cAAc,cAAc,CAAA","sourcesContent":["export * from './RadioGroup'\n"]}

package/dist/RadioGroup/types.d.ts

@@ -0,0 +1,3 @@
+export type IconPosition = 'center' | 'start';
+export type DisplayType = 'normal' | 'vertical-card' | 'horizontal-card';
+export type BaseValueType = string | boolean | null;

package/dist/RadioGroup/types.js

@@ -0,0 +1,2 @@
+export {};
+//# sourceMappingURL=types.js.map

package/dist/RadioGroup/types.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"types.js","sourceRoot":"","sources":["../../src/RadioGroup/types.ts"],"names":[],"mappings":"","sourcesContent":["export type IconPosition = 'center' | 'start'\n\nexport type DisplayType = 'normal' | 'vertical-card' | 'horizontal-card'\n\nexport type BaseValueType = string | boolean | null\n"]}

package/dist/RichText/RichText.d.ts

@@ -0,0 +1,6 @@
+import React from 'react';
+import { MarginProps } from '../utils/space';
+export interface RichTextProps extends MarginProps {
+    htmlString: string;
+}
+export declare const RichText: React.ForwardRefExoticComponent<RichTextProps & React.RefAttributes<HTMLDivElement>>;

package/dist/RichText/RichText.js

@@ -0,0 +1,35 @@
+import domPurify from 'dompurify';
+import React, { forwardRef } from 'react';
+import styled from 'styled-components';
+import { Box } from '../Box';
+import { Icon } from '../Icon';
+import { theme } from '../theme';
+export const RichText = forwardRef(function RichText({ htmlString, ...props }, ref) {
+    const sanitisedHtml = domPurify.sanitize(htmlString);
+    if (!domPurify.isSupported) {
+        return (React.createElement(Box, { ...props },
+            React.createElement(WarningText, null,
+                React.createElement(Icon, { render: "warning" }),
+                "Your browser is not supported, please upgrade to a newer version"),
+            htmlString));
+    }
+    else {
+        return (React.createElement(HtmlBox, { ref: ref, ...props, dangerouslySetInnerHTML: { __html: sanitisedHtml } }));
+    }
+});
+const WarningText = styled(Box) `
+  background-color: ${theme.colors.sherbert};
+  padding: 16px;
+  border-radius: 16px;
+  width: fit-content;
+  display: flex;
+  align-items: center;
+  gap: 16px;
+  margin-bottom: 16px;
+`;
+const HtmlBox = styled(Box) `
+  * {
+    all: revert;
+  }
+`;
+//# sourceMappingURL=RichText.js.map

package/dist/RichText/RichText.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"RichText.js","sourceRoot":"","sources":["../../src/RichText/RichText.tsx"],"names":[],"mappings":"AAAA,OAAO,SAAS,MAAM,WAAW,CAAA;AACjC,OAAO,KAAK,EAAE,EAAgB,UAAU,EAAE,MAAM,OAAO,CAAA;AACvD,OAAO,MAAM,MAAM,mBAAmB,CAAA;AACtC,OAAO,EAAE,GAAG,EAAE,MAAM,QAAQ,CAAA;AAC5B,OAAO,EAAE,IAAI,EAAE,MAAM,SAAS,CAAA;AAC9B,OAAO,EAAE,KAAK,EAAE,MAAM,UAAU,CAAA;AAOhC,MAAM,CAAC,MAAM,QAAQ,GAAG,UAAU,CAAC,SAAS,QAAQ,CAClD,EAAE,UAAU,EAAE,GAAG,KAAK,EAAiB,EACvC,GAAiC;IAEjC,MAAM,aAAa,GAAG,SAAS,CAAC,QAAQ,CAAC,UAAU,CAAC,CAAA;IAEpD,IAAI,CAAC,SAAS,CAAC,WAAW,EAAE,CAAC;QAC3B,OAAO,CACL,oBAAC,GAAG,OAAK,KAAK;YACZ,oBAAC,WAAW;gBACV,oBAAC,IAAI,IAAC,MAAM,EAAC,SAAS,GAAG;mFAEb;YACb,UAAU,CACP,CACP,CAAA;IACH,CAAC;SAAM,CAAC;QACN,OAAO,CACL,oBAAC,OAAO,IACN,GAAG,EAAE,GAAG,KACJ,KAAK,EACT,uBAAuB,EAAE,EAAE,MAAM,EAAE,aAAa,EAAE,GAClD,CACH,CAAA;IACH,CAAC;AACH,CAAC,CAAC,CAAA;AAEF,MAAM,WAAW,GAAG,MAAM,CAAC,GAAG,CAAC,CAAA;sBACT,KAAK,CAAC,MAAM,CAAC,QAAQ;;;;;;;;CAQ1C,CAAA;AAED,MAAM,OAAO,GAAG,MAAM,CAAC,GAAG,CAAC,CAAA;;;;CAI1B,CAAA","sourcesContent":["import domPurify from 'dompurify'\nimport React, { ForwardedRef, forwardRef } from 'react'\nimport styled from 'styled-components'\nimport { Box } from '../Box'\nimport { Icon } from '../Icon'\nimport { theme } from '../theme'\nimport { MarginProps } from '../utils/space'\n\nexport interface RichTextProps extends MarginProps {\n  htmlString: string\n}\n\nexport const RichText = forwardRef(function RichText(\n  { htmlString, ...props }: RichTextProps,\n  ref: ForwardedRef<HTMLDivElement>,\n) {\n  const sanitisedHtml = domPurify.sanitize(htmlString)\n\n  if (!domPurify.isSupported) {\n    return (\n      <Box {...props}>\n        <WarningText>\n          <Icon render=\"warning\" />\n          Your browser is not supported, please upgrade to a newer version\n        </WarningText>\n        {htmlString}\n      </Box>\n    )\n  } else {\n    return (\n      <HtmlBox\n        ref={ref}\n        {...props}\n        dangerouslySetInnerHTML={{ __html: sanitisedHtml }}\n      />\n    )\n  }\n})\n\nconst WarningText = styled(Box)`\n  background-color: ${theme.colors.sherbert};\n  padding: 16px;\n  border-radius: 16px;\n  width: fit-content;\n  display: flex;\n  align-items: center;\n  gap: 16px;\n  margin-bottom: 16px;\n`\n\nconst HtmlBox = styled(Box)`\n  * {\n    all: revert;\n  }\n`\n"]}

package/dist/RichText/index.d.ts

@@ -0,0 +1 @@
+export { RichText } from './RichText';

package/dist/RichText/index.js

@@ -0,0 +1,2 @@
+export { RichText } from './RichText';
+//# sourceMappingURL=index.js.map

package/dist/RichText/index.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"index.js","sourceRoot":"","sources":["../../src/RichText/index.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,QAAQ,EAAE,MAAM,YAAY,CAAA","sourcesContent":["export { RichText } from './RichText'\n"]}

package/dist/RichTextEditor/RichTextEditor.d.ts

@@ -0,0 +1,10 @@
+import { FC } from 'react';
+import { MarginProps } from '../utils/space';
+export interface RichTextEditorProps extends MarginProps {
+    defaultValue?: string;
+    maxHeight?: string;
+    height?: string;
+    outline?: boolean;
+    onChange: (e: string) => void;
+}
+export declare const RichTextEditor: FC<RichTextEditorProps>;

package/dist/RichTextEditor/RichTextEditor.js

@@ -0,0 +1,88 @@
+import { CodeHighlightNode, CodeNode } from '@lexical/code';
+import { $generateNodesFromDOM } from '@lexical/html';
+import { AutoLinkNode, LinkNode } from '@lexical/link';
+import { ListItemNode, ListNode } from '@lexical/list';
+import { TRANSFORMERS } from '@lexical/markdown';
+import { LexicalComposer } from '@lexical/react/LexicalComposer';
+import { ContentEditable } from '@lexical/react/LexicalContentEditable';
+import LexicalErrorBoundary from '@lexical/react/LexicalErrorBoundary';
+import { HistoryPlugin } from '@lexical/react/LexicalHistoryPlugin';
+import { LinkPlugin } from '@lexical/react/LexicalLinkPlugin';
+import { ListPlugin } from '@lexical/react/LexicalListPlugin';
+import { MarkdownShortcutPlugin } from '@lexical/react/LexicalMarkdownShortcutPlugin';
+import { RichTextPlugin } from '@lexical/react/LexicalRichTextPlugin';
+import { HeadingNode, QuoteNode } from '@lexical/rich-text';
+import DOMPurify from 'dompurify';
+import { $getRoot } from 'lexical';
+import React from 'react';
+import styled from 'styled-components';
+import { Box } from '../Box';
+import { theme } from '../theme';
+import CustomAutoLinkPlugin from './plugins/AutoLinkPlugin';
+import { EditorDefaultUpdatePlugin } from './plugins/EditorDefaultUpdatePlugin';
+import { EditorUpdatePlugin } from './plugins/EditorUpdatePlugin';
+import ToolbarPlugin from './plugins/ToolbarPlugin';
+import { appendNodes } from './utils';
+export const RichTextEditor = ({ defaultValue, height, outline = false, maxHeight = '300px', onChange, ...props }) => {
+    const defaultEditorState = (editor) => {
+        const parser = new DOMParser();
+        const dom = parser.parseFromString(defaultValue ? DOMPurify.sanitize(defaultValue) : '<p></p>', 'text/html');
+        const nodes = $generateNodesFromDOM(editor, dom);
+        const root = $getRoot();
+        root.clear();
+        appendNodes(root, nodes);
+    };
+    const initialConfig = {
+        editorState: defaultEditorState,
+        namespace: 'MarshmallowRichTextEditor',
+        onError: (e) => console.log(e),
+        nodes: [
+            AutoLinkNode,
+            LinkNode,
+            ListNode,
+            ListItemNode,
+            HeadingNode,
+            QuoteNode,
+            CodeHighlightNode,
+            CodeNode,
+        ],
+    };
+    return (React.createElement(Container, { "$outline": outline, ...props },
+        React.createElement(Editor, { "$maxHeight": maxHeight, "$height": height },
+            React.createElement(LexicalComposer, { initialConfig: initialConfig },
+                React.createElement(ToolbarPlugin, null),
+                React.createElement(RichTextPlugin, { contentEditable: React.createElement(ContentEditable, { className: "editor-input" }), placeholder: React.createElement("div", null), ErrorBoundary: LexicalErrorBoundary }),
+                React.createElement(LinkPlugin, null),
+                React.createElement(ListPlugin, null),
+                React.createElement(HistoryPlugin, null),
+                React.createElement(CustomAutoLinkPlugin, null),
+                React.createElement(MarkdownShortcutPlugin, { transformers: TRANSFORMERS }),
+                React.createElement(EditorUpdatePlugin, { onChange: onChange }),
+                React.createElement(EditorDefaultUpdatePlugin, { defaultValue: defaultValue })))));
+};
+const Editor = styled(Box) `
+  .editor-input {
+    margin-top: 12px;
+    background-color: ${theme.colors.cream};
+    border-radius: 12px;
+    border: 2px solid ${theme.colors.oatmeal};
+    padding: 16px;
+    overflow: scroll;
+    outline-color: ${theme.colors.marzipan};
+    max-height: ${({ $maxHeight }) => $maxHeight};
+    ${({ $height }) => $height && `height: ${$height}`};
+    min-height: 84px;
+
+    * {
+      all: revert;
+      outline: none;
+    }
+  }
+`;
+const Container = styled(Box) `
+  background-color: ${theme.colors.coconut};
+  border-radius: 16px;
+  padding: 12px;
+  ${({ $outline }) => $outline && `border: 2px solid ${theme.colors.oatmeal}`}
+`;
+//# sourceMappingURL=RichTextEditor.js.map

package/dist/RichTextEditor/RichTextEditor.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"RichTextEditor.js","sourceRoot":"","sources":["../../src/RichTextEditor/RichTextEditor.tsx"],"names":[],"mappings":"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","sourcesContent":["import { CodeHighlightNode, CodeNode } from '@lexical/code'\nimport { $generateNodesFromDOM } from '@lexical/html'\nimport { AutoLinkNode, LinkNode } from '@lexical/link'\nimport { ListItemNode, ListNode } from '@lexical/list'\nimport { TRANSFORMERS } from '@lexical/markdown'\nimport { LexicalComposer } from '@lexical/react/LexicalComposer'\nimport { ContentEditable } from '@lexical/react/LexicalContentEditable'\nimport LexicalErrorBoundary from '@lexical/react/LexicalErrorBoundary'\nimport { HistoryPlugin } from '@lexical/react/LexicalHistoryPlugin'\nimport { LinkPlugin } from '@lexical/react/LexicalLinkPlugin'\nimport { ListPlugin } from '@lexical/react/LexicalListPlugin'\nimport { MarkdownShortcutPlugin } from '@lexical/react/LexicalMarkdownShortcutPlugin'\nimport { RichTextPlugin } from '@lexical/react/LexicalRichTextPlugin'\nimport { HeadingNode, QuoteNode } from '@lexical/rich-text'\nimport DOMPurify from 'dompurify'\nimport { $getRoot, LexicalEditor } from 'lexical'\nimport React, { FC } from 'react'\nimport styled from 'styled-components'\nimport { Box } from '../Box'\nimport { theme } from '../theme'\nimport { MarginProps } from '../utils/space'\nimport CustomAutoLinkPlugin from './plugins/AutoLinkPlugin'\nimport { EditorDefaultUpdatePlugin } from './plugins/EditorDefaultUpdatePlugin'\nimport { EditorUpdatePlugin } from './plugins/EditorUpdatePlugin'\nimport ToolbarPlugin from './plugins/ToolbarPlugin'\nimport { appendNodes } from './utils'\n\nexport interface RichTextEditorProps extends MarginProps {\n  defaultValue?: string\n  maxHeight?: string\n  height?: string\n  outline?: boolean\n  onChange: (e: string) => void\n}\n\nexport const RichTextEditor: FC<RichTextEditorProps> = ({\n  defaultValue,\n  height,\n  outline = false,\n  maxHeight = '300px',\n  onChange,\n  ...props\n}) => {\n  const defaultEditorState = (editor: LexicalEditor) => {\n    const parser = new DOMParser()\n    const dom = parser.parseFromString(\n      defaultValue ? DOMPurify.sanitize(defaultValue) : '<p></p>',\n      'text/html',\n    )\n    const nodes = $generateNodesFromDOM(editor, dom)\n    const root = $getRoot()\n    root.clear()\n\n    appendNodes(root, nodes)\n  }\n\n  const initialConfig = {\n    editorState: defaultEditorState,\n    namespace: 'MarshmallowRichTextEditor',\n    onError: (e: Error) => console.log(e),\n    nodes: [\n      AutoLinkNode,\n      LinkNode,\n      ListNode,\n      ListItemNode,\n      HeadingNode,\n      QuoteNode,\n      CodeHighlightNode,\n      CodeNode,\n    ],\n  }\n\n  return (\n    <Container $outline={outline} {...props}>\n      <Editor $maxHeight={maxHeight} $height={height}>\n        <LexicalComposer initialConfig={initialConfig}>\n          <ToolbarPlugin />\n          <RichTextPlugin\n            contentEditable={<ContentEditable className=\"editor-input\" />}\n            placeholder={<div></div>}\n            ErrorBoundary={LexicalErrorBoundary}\n          />\n          <LinkPlugin />\n          <ListPlugin />\n          <HistoryPlugin />\n          <CustomAutoLinkPlugin />\n          <MarkdownShortcutPlugin transformers={TRANSFORMERS} />\n          <EditorUpdatePlugin onChange={onChange} />\n          <EditorDefaultUpdatePlugin defaultValue={defaultValue} />\n        </LexicalComposer>\n      </Editor>\n    </Container>\n  )\n}\n\nconst Editor = styled(Box)<{ $maxHeight: string; $height?: string }>`\n  .editor-input {\n    margin-top: 12px;\n    background-color: ${theme.colors.cream};\n    border-radius: 12px;\n    border: 2px solid ${theme.colors.oatmeal};\n    padding: 16px;\n    overflow: scroll;\n    outline-color: ${theme.colors.marzipan};\n    max-height: ${({ $maxHeight }) => $maxHeight};\n    ${({ $height }) => $height && `height: ${$height}`};\n    min-height: 84px;\n\n    * {\n      all: revert;\n      outline: none;\n    }\n  }\n`\n\nconst Container = styled(Box)<{ $outline: boolean }>`\n  background-color: ${theme.colors.coconut};\n  border-radius: 16px;\n  padding: 12px;\n  ${({ $outline }) => $outline && `border: 2px solid ${theme.colors.oatmeal}`}\n`\n"]}

package/dist/RichTextEditor/index.d.ts

@@ -0,0 +1 @@
+export { RichTextEditor } from './RichTextEditor';

package/dist/RichTextEditor/index.js

@@ -0,0 +1,2 @@
+export { RichTextEditor } from './RichTextEditor';
+//# sourceMappingURL=index.js.map

package/dist/RichTextEditor/index.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"index.js","sourceRoot":"","sources":["../../src/RichTextEditor/index.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,cAAc,EAAE,MAAM,kBAAkB,CAAA","sourcesContent":["export { RichTextEditor } from './RichTextEditor'\n"]}

package/dist/RichTextEditor/plugins/AutoLinkPlugin.d.ts

@@ -0,0 +1,2 @@
+import React from 'react';
+export default function CustomAutoLinkPlugin(): React.JSX.Element;

package/dist/RichTextEditor/plugins/AutoLinkPlugin.js

@@ -0,0 +1,28 @@
+import React from 'react';
+import { AutoLinkPlugin } from '@lexical/react/LexicalAutoLinkPlugin';
+const URL_MATCHER = /((https?:\/\/(www\.)?)|(www\.))[-a-zA-Z0-9@:%._+~#=]{1,256}\.[a-zA-Z0-9()]{1,6}\b([-a-zA-Z0-9()@:%_+.~#?&//=]*)/;
+const EMAIL_MATCHER = /(([^<>()[\]\\.,;:\s@"]+(\.[^<>()[\]\\.,;:\s@"]+)*)|(".+"))@((\[[0-9]{1,3}\.[0-9]{1,3}\.[0-9]{1,3}\.[0-9]{1,3}\])|(([a-zA-Z\-0-9]+\.)+[a-zA-Z]{2,}))/;
+const MATCHERS = [
+    (text) => {
+        const match = URL_MATCHER.exec(text);
+        return (match && {
+            index: match.index,
+            length: match[0].length,
+            text: match[0],
+            url: match[0],
+        });
+    },
+    (text) => {
+        const match = EMAIL_MATCHER.exec(text);
+        return (match && {
+            index: match.index,
+            length: match[0].length,
+            text: match[0],
+            url: `mailto:${match[0]}`,
+        });
+    },
+];
+export default function CustomAutoLinkPlugin() {
+    return React.createElement(AutoLinkPlugin, { matchers: MATCHERS });
+}
+//# sourceMappingURL=AutoLinkPlugin.js.map

package/dist/RichTextEditor/plugins/AutoLinkPlugin.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"AutoLinkPlugin.js","sourceRoot":"","sources":["../../../src/RichTextEditor/plugins/AutoLinkPlugin.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,MAAM,OAAO,CAAA;AAEzB,OAAO,EAAE,cAAc,EAAE,MAAM,sCAAsC,CAAA;AAErE,MAAM,WAAW,GACf,iHAAiH,CAAA;AAEnH,MAAM,aAAa,GACjB,qJAAqJ,CAAA;AAEvJ,MAAM,QAAQ,GAAG;IACf,CAAC,IAAY,EAAE,EAAE;QACf,MAAM,KAAK,GAAG,WAAW,CAAC,IAAI,CAAC,IAAI,CAAC,CAAA;QACpC,OAAO,CACL,KAAK,IAAI;YACP,KAAK,EAAE,KAAK,CAAC,KAAK;YAClB,MAAM,EAAE,KAAK,CAAC,CAAC,CAAC,CAAC,MAAM;YACvB,IAAI,EAAE,KAAK,CAAC,CAAC,CAAC;YACd,GAAG,EAAE,KAAK,CAAC,CAAC,CAAC;SACd,CACF,CAAA;IACH,CAAC;IACD,CAAC,IAAY,EAAE,EAAE;QACf,MAAM,KAAK,GAAG,aAAa,CAAC,IAAI,CAAC,IAAI,CAAC,CAAA;QACtC,OAAO,CACL,KAAK,IAAI;YACP,KAAK,EAAE,KAAK,CAAC,KAAK;YAClB,MAAM,EAAE,KAAK,CAAC,CAAC,CAAC,CAAC,MAAM;YACvB,IAAI,EAAE,KAAK,CAAC,CAAC,CAAC;YACd,GAAG,EAAE,UAAU,KAAK,CAAC,CAAC,CAAC,EAAE;SAC1B,CACF,CAAA;IACH,CAAC;CACF,CAAA;AAED,MAAM,CAAC,OAAO,UAAU,oBAAoB;IAC1C,OAAO,oBAAC,cAAc,IAAC,QAAQ,EAAE,QAAQ,GAAI,CAAA;AAC/C,CAAC","sourcesContent":["import React from 'react'\n\nimport { AutoLinkPlugin } from '@lexical/react/LexicalAutoLinkPlugin'\n\nconst URL_MATCHER =\n  /((https?:\\/\\/(www\\.)?)|(www\\.))[-a-zA-Z0-9@:%._+~#=]{1,256}\\.[a-zA-Z0-9()]{1,6}\\b([-a-zA-Z0-9()@:%_+.~#?&//=]*)/\n\nconst EMAIL_MATCHER =\n  /(([^<>()[\\]\\\\.,;:\\s@\"]+(\\.[^<>()[\\]\\\\.,;:\\s@\"]+)*)|(\".+\"))@((\\[[0-9]{1,3}\\.[0-9]{1,3}\\.[0-9]{1,3}\\.[0-9]{1,3}\\])|(([a-zA-Z\\-0-9]+\\.)+[a-zA-Z]{2,}))/\n\nconst MATCHERS = [\n  (text: string) => {\n    const match = URL_MATCHER.exec(text)\n    return (\n      match && {\n        index: match.index,\n        length: match[0].length,\n        text: match[0],\n        url: match[0],\n      }\n    )\n  },\n  (text: string) => {\n    const match = EMAIL_MATCHER.exec(text)\n    return (\n      match && {\n        index: match.index,\n        length: match[0].length,\n        text: match[0],\n        url: `mailto:${match[0]}`,\n      }\n    )\n  },\n]\n\nexport default function CustomAutoLinkPlugin() {\n  return <AutoLinkPlugin matchers={MATCHERS} />\n}\n"]}

package/dist/RichTextEditor/plugins/EditorDefaultUpdatePlugin.d.ts

@@ -0,0 +1,4 @@
+import { FC } from 'react';
+export declare const EditorDefaultUpdatePlugin: FC<{
+    defaultValue?: string;
+}>;

package/dist/RichTextEditor/plugins/EditorDefaultUpdatePlugin.js

@@ -0,0 +1,21 @@
+import { $generateNodesFromDOM } from '@lexical/html';
+import { useLexicalComposerContext } from '@lexical/react/LexicalComposerContext';
+import DOMPurify from 'dompurify';
+import { $getRoot } from 'lexical';
+import { useEffect } from 'react';
+import { appendNodes } from '../utils';
+export const EditorDefaultUpdatePlugin = ({ defaultValue }) => {
+    const [editor] = useLexicalComposerContext();
+    useEffect(() => {
+        editor.update(() => {
+            const parser = new DOMParser();
+            const dom = parser.parseFromString(defaultValue ? DOMPurify.sanitize(defaultValue) : '<p></p>', 'text/html');
+            const root = $getRoot();
+            root.clear();
+            const nodes = $generateNodesFromDOM(editor, dom);
+            appendNodes(root, nodes);
+        });
+    }, [defaultValue]);
+    return null;
+};
+//# sourceMappingURL=EditorDefaultUpdatePlugin.js.map

package/dist/RichTextEditor/plugins/EditorDefaultUpdatePlugin.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"EditorDefaultUpdatePlugin.js","sourceRoot":"","sources":["../../../src/RichTextEditor/plugins/EditorDefaultUpdatePlugin.tsx"],"names":[],"mappings":"AAAA,OAAO,EAAE,qBAAqB,EAAE,MAAM,eAAe,CAAA;AACrD,OAAO,EAAE,yBAAyB,EAAE,MAAM,uCAAuC,CAAA;AACjF,OAAO,SAAS,MAAM,WAAW,CAAA;AACjC,OAAO,EAAE,QAAQ,EAAE,MAAM,SAAS,CAAA;AAClC,OAAO,EAAM,SAAS,EAAE,MAAM,OAAO,CAAA;AACrC,OAAO,EAAE,WAAW,EAAE,MAAM,UAAU,CAAA;AAEtC,MAAM,CAAC,MAAM,yBAAyB,GAEjC,CAAC,EAAE,YAAY,EAAE,EAAE,EAAE;IACxB,MAAM,CAAC,MAAM,CAAC,GAAG,yBAAyB,EAAE,CAAA;IAE5C,SAAS,CAAC,GAAG,EAAE;QACb,MAAM,CAAC,MAAM,CAAC,GAAG,EAAE;YACjB,MAAM,MAAM,GAAG,IAAI,SAAS,EAAE,CAAA;YAC9B,MAAM,GAAG,GAAG,MAAM,CAAC,eAAe,CAChC,YAAY,CAAC,CAAC,CAAC,SAAS,CAAC,QAAQ,CAAC,YAAY,CAAC,CAAC,CAAC,CAAC,SAAS,EAC3D,WAAW,CACZ,CAAA;YACD,MAAM,IAAI,GAAG,QAAQ,EAAE,CAAA;YACvB,IAAI,CAAC,KAAK,EAAE,CAAA;YACZ,MAAM,KAAK,GAAG,qBAAqB,CAAC,MAAM,EAAE,GAAG,CAAC,CAAA;YAChD,WAAW,CAAC,IAAI,EAAE,KAAK,CAAC,CAAA;QAC1B,CAAC,CAAC,CAAA;IACJ,CAAC,EAAE,CAAC,YAAY,CAAC,CAAC,CAAA;IAElB,OAAO,IAAI,CAAA;AACb,CAAC,CAAA","sourcesContent":["import { $generateNodesFromDOM } from '@lexical/html'\nimport { useLexicalComposerContext } from '@lexical/react/LexicalComposerContext'\nimport DOMPurify from 'dompurify'\nimport { $getRoot } from 'lexical'\nimport { FC, useEffect } from 'react'\nimport { appendNodes } from '../utils'\n\nexport const EditorDefaultUpdatePlugin: FC<{\n  defaultValue?: string\n}> = ({ defaultValue }) => {\n  const [editor] = useLexicalComposerContext()\n\n  useEffect(() => {\n    editor.update(() => {\n      const parser = new DOMParser()\n      const dom = parser.parseFromString(\n        defaultValue ? DOMPurify.sanitize(defaultValue) : '<p></p>',\n        'text/html',\n      )\n      const root = $getRoot()\n      root.clear()\n      const nodes = $generateNodesFromDOM(editor, dom)\n      appendNodes(root, nodes)\n    })\n  }, [defaultValue])\n\n  return null\n}\n"]}

package/dist/RichTextEditor/plugins/EditorUpdatePlugin.d.ts

@@ -0,0 +1,4 @@
+import { FC } from 'react';
+export declare const EditorUpdatePlugin: FC<{
+    onChange: (value: string) => void;
+}>;

package/dist/RichTextEditor/plugins/EditorUpdatePlugin.js

@@ -0,0 +1,18 @@
+import { $generateHtmlFromNodes } from '@lexical/html';
+import { useLexicalComposerContext } from '@lexical/react/LexicalComposerContext';
+import DOMPurify from 'dompurify';
+import { useEffect } from 'react';
+export const EditorUpdatePlugin = ({ onChange }) => {
+    const [editor] = useLexicalComposerContext();
+    useEffect(() => {
+        return editor.registerUpdateListener((listener) => {
+            if (listener.editorState !== listener.prevEditorState) {
+                editor.update(() => {
+                    onChange(DOMPurify.sanitize($generateHtmlFromNodes(editor, null)));
+                });
+            }
+        });
+    }, []);
+    return null;
+};
+//# sourceMappingURL=EditorUpdatePlugin.js.map

package/dist/RichTextEditor/plugins/EditorUpdatePlugin.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"EditorUpdatePlugin.js","sourceRoot":"","sources":["../../../src/RichTextEditor/plugins/EditorUpdatePlugin.tsx"],"names":[],"mappings":"AAAA,OAAO,EAAE,sBAAsB,EAAE,MAAM,eAAe,CAAA;AACtD,OAAO,EAAE,yBAAyB,EAAE,MAAM,uCAAuC,CAAA;AACjF,OAAO,SAAS,MAAM,WAAW,CAAA;AACjC,OAAO,EAAM,SAAS,EAAE,MAAM,OAAO,CAAA;AAErC,MAAM,CAAC,MAAM,kBAAkB,GAE1B,CAAC,EAAE,QAAQ,EAAE,EAAE,EAAE;IACpB,MAAM,CAAC,MAAM,CAAC,GAAG,yBAAyB,EAAE,CAAA;IAE5C,SAAS,CAAC,GAAG,EAAE;QACb,OAAO,MAAM,CAAC,sBAAsB,CAAC,CAAC,QAAQ,EAAE,EAAE;YAChD,IAAI,QAAQ,CAAC,WAAW,KAAK,QAAQ,CAAC,eAAe,EAAE,CAAC;gBACtD,MAAM,CAAC,MAAM,CAAC,GAAG,EAAE;oBACjB,QAAQ,CAAC,SAAS,CAAC,QAAQ,CAAC,sBAAsB,CAAC,MAAM,EAAE,IAAI,CAAC,CAAC,CAAC,CAAA;gBACpE,CAAC,CAAC,CAAA;YACJ,CAAC;QACH,CAAC,CAAC,CAAA;IACJ,CAAC,EAAE,EAAE,CAAC,CAAA;IAEN,OAAO,IAAI,CAAA;AACb,CAAC,CAAA","sourcesContent":["import { $generateHtmlFromNodes } from '@lexical/html'\nimport { useLexicalComposerContext } from '@lexical/react/LexicalComposerContext'\nimport DOMPurify from 'dompurify'\nimport { FC, useEffect } from 'react'\n\nexport const EditorUpdatePlugin: FC<{\n  onChange: (value: string) => void\n}> = ({ onChange }) => {\n  const [editor] = useLexicalComposerContext()\n\n  useEffect(() => {\n    return editor.registerUpdateListener((listener) => {\n      if (listener.editorState !== listener.prevEditorState) {\n        editor.update(() => {\n          onChange(DOMPurify.sanitize($generateHtmlFromNodes(editor, null)))\n        })\n      }\n    })\n  }, [])\n\n  return null\n}\n"]}

package/dist/RichTextEditor/plugins/ToolbarPlugin.d.ts

@@ -0,0 +1,2 @@
+import React from 'react';
+export default function ToolbarPlugin(): React.JSX.Element;