npm - @frontify/fondue - Versions diffs - 12.0.0-beta.152 → 12.0.0-beta.154 - Mend

@frontify/fondue 12.0.0-beta.152 → 12.0.0-beta.154

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.

Files changed (34) hide show

package/dist/components/RichTextEditor/serializer/markdown/types.d.ts CHANGED Viewed

@@ -45,7 +45,7 @@ export type BlockType = {
     url?: string;
     id?: string;
     category?: string;
-    target?: '_blank' | '_self';
+    target?: TargetValue;
 };
 export type RecursivePartial<T> = {
     [P in keyof T]?: RecursivePartial<T[P]>;
@@ -73,7 +73,13 @@ export type MarkdownAstNode = {
     spread?: any;
     checked?: any;
     indent?: any;
+    target?: TargetValue;
 };
+export declare const Targets: {
+    readonly Blank: "_blank";
+    readonly Self: "_self";
+};
+export type TargetValue = typeof Targets[keyof typeof Targets];
 export type TextNode = {
     text?: string;
 };

package/dist/components/RichTextEditor/serializer/markdown/types.es.js CHANGED Viewed

@@ -22,8 +22,12 @@ const e = {
   thematicBreak: "thematic_break",
   image: "image",
   mention: "mention"
+}, i = {
+  Blank: "_blank",
+  Self: "_self"
 };
 export {
+  i as Targets,
   e as defaultNodeTypes
 };
 //# sourceMappingURL=types.es.js.map

package/dist/components/RichTextEditor/serializer/markdown/types.es.js.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"types.es.js","sources":["../../../../../src/components/RichTextEditor/serializer/markdown/types.ts"],"sourcesContent":["/* (c) Copyright Frontify Ltd., all rights reserved. */\n\nexport type InputNodeTypes = {\n paragraph: string;\n blockQuote: string;\n codeBlock: string;\n link: string;\n ulList: string;\n olList: string;\n listItem: string;\n listItemChild: string;\n heading: {\n 1: string;\n 2: string;\n 3: string;\n 4: string;\n 5: string;\n 6: string;\n };\n emphasisMark: string;\n strongMark: string;\n deleteMark: string;\n inlineCodeMark: string;\n thematicBreak: string;\n image: string;\n mention: string;\n};\n\nexport type MarkdownAstNodeType =\n \| 'paragraph'\n \| 'heading'\n \| 'list'\n \| 'listItem'\n \| 'listItemChild'\n \| 'link'\n \| 'image'\n \| 'blockquote'\n \| 'code'\n \| 'html'\n \| 'emphasis'\n \| 'strong'\n \| 'delete'\n \| 'inlineCode'\n \| 'thematicBreak'\n \| 'text'\n \| 'mention';\n\nexport const defaultNodeTypes: InputNodeTypes = {\n paragraph: 'paragraph',\n blockQuote: 'block_quote',\n codeBlock: 'code_block',\n link: 'link',\n ulList: 'ul_list',\n olList: 'ol_list',\n listItem: 'list_item',\n listItemChild: 'lic',\n heading: {\n 1: 'heading_one',\n 2: 'heading_two',\n 3: 'heading_three',\n 4: 'heading_four',\n 5: 'heading_five',\n 6: 'heading_six',\n },\n emphasisMark: 'italic',\n strongMark: 'bold',\n deleteMark: 'strikethrough',\n inlineCodeMark: 'code',\n thematicBreak: 'thematic_break',\n image: 'image',\n mention: 'mention',\n};\n\nexport type NodeType = BlockType \| LeafType;\n\nexport type LeafType = {\n text: string;\n strikethrough?: boolean;\n bold?: boolean;\n italic?: boolean;\n code?: boolean;\n parentType?: string;\n};\n\nexport type BlockType = {\n type: string;\n children: NodeType[];\n parentType?: string;\n caption?: string;\n language?: string;\n break?: boolean;\n link?: string;\n url?: string;\n id?: string;\n category?: string;\n target?: ~~'_blank' \| '_self'~~;\n};\n\nexport type RecursivePartial<T> = {\n [P in keyof T]?: RecursivePartial<T[P]>;\n};\n\nexport type OptionType<T extends InputNodeTypes = InputNodeTypes> = {\n nodeTypes: RecursivePartial<T>;\n linkDestinationKey: string;\n ignoreParagraphNewline: boolean;\n listDepth: number;\n imageSourceKey?: string;\n imageCaptionKey?: string;\n};\n\nexport type PartialOptionType<T extends OptionType = OptionType> = Partial<T>;\n\nexport type MarkdownAstNode = {\n type?: MarkdownAstNodeType;\n ordered?: boolean;\n value?: string;\n text?: string;\n children?: Array<MarkdownAstNode>;\n depth?: 1 \| 2 \| 3 \| 4 \| 5 \| 6;\n url?: string;\n alt?: string;\n lang?: string;\n // Markdown Ast metadata\n // eslint-disable-next-line @typescript-eslint/no-explicit-any\n position?: any;\n // eslint-disable-next-line @typescript-eslint/no-explicit-any\n spread?: any;\n // eslint-disable-next-line @typescript-eslint/no-explicit-any\n checked?: any;\n // eslint-disable-next-line @typescript-eslint/no-explicit-any\n indent?: any;\n};\n\nexport type TextNode = { text?: string };\n\nexport type CodeBlockNode<T extends InputNodeTypes> = {\n type: T['codeBlock'];\n language: string \| undefined;\n children: Array<TextNode>;\n};\n\nexport type HeadingNode<T extends InputNodeTypes> = {\n type: T['heading'][1] \| T['heading'][2] \| T['heading'][3] \| T['heading'][4] \| T['heading'][5] \| T['heading'][6];\n children: Array<DeserializedNode<T>>;\n};\n\nexport type ListNode<T extends InputNodeTypes> = {\n type: T['olList'] \| T['ulList'];\n children: Array<DeserializedNode<T>>;\n};\n\nexport type ListItemNode<T extends InputNodeTypes> = {\n type: T['listItem'];\n children: Array<DeserializedNode<T>>;\n};\n\nexport type ListItemChildNode<T extends InputNodeTypes> = {\n type: T['listItemChild'];\n children: Array<DeserializedNode<T>>;\n};\n\nexport type ParagraphNode<T extends InputNodeTypes> = {\n type: T['paragraph'];\n break?: true;\n children: Array<DeserializedNode<T>>;\n};\n\nexport type LinkNode<T extends InputNodeTypes> = {\n type: T['link'];\n children: Array<DeserializedNode<T>>;\n [urlKey: string]: string \| undefined \| Array<DeserializedNode<T>>;\n};\n\nexport type ImageNode<T extends InputNodeTypes> = {\n type: T['image'];\n children: Array<DeserializedNode<T>>;\n [sourceOrCaptionKey: string]: string \| undefined \| Array<DeserializedNode<T>>;\n};\n\nexport type BlockQuoteNode<T extends InputNodeTypes> = {\n type: T['blockQuote'];\n children: Array<DeserializedNode<T>>;\n};\n\nexport type InlineCodeMarkNode<T extends InputNodeTypes> = {\n type: T['inlineCodeMark'];\n children: Array<TextNode>;\n language: string \| undefined;\n};\n\nexport type ThematicBreakNode<T extends InputNodeTypes> = {\n type: T['thematicBreak'];\n children: Array<DeserializedNode<T>>;\n};\n\nexport type ItalicNode<T extends InputNodeTypes> = {\n [K in T['emphasisMark']]: true;\n} & {\n children: TextNode;\n};\n\nexport type BoldNode = {\n bold: true;\n children: TextNode;\n};\n\nexport type StrikeThoughNode = {\n strikethrough: true;\n children: TextNode;\n};\n\nexport type InlineCodeNode = {\n code: true;\n text: string \| undefined;\n};\n\nexport type DeserializedNode<T extends InputNodeTypes> =\n \| CodeBlockNode<T>\n \| HeadingNode<T>\n \| ListNode<T>\n \| ListItemNode<T>\n \| ListItemChildNode<T>\n \| ParagraphNode<T>\n \| LinkNode<T>\n \| ImageNode<T>\n \| BlockQuoteNode<T>\n \| InlineCodeMarkNode<T>\n \| ThematicBreakNode<T>\n \| ItalicNode<T>\n \| BoldNode\n \| StrikeThoughNode\n \| InlineCodeNode\n \| TextNode;\n"],"names":["defaultNodeTypes"],"mappings":"AA+CO,MAAMA,IAAmC;AAAA,EAC5C,WAAW;AAAA,EACX,YAAY;AAAA,EACZ,WAAW;AAAA,EACX,MAAM;AAAA,EACN,QAAQ;AAAA,EACR,QAAQ;AAAA,EACR,UAAU;AAAA,EACV,eAAe;AAAA,EACf,SAAS;AAAA,IACL,GAAG;AAAA,IACH,GAAG;AAAA,IACH,GAAG;AAAA,IACH,GAAG;AAAA,IACH,GAAG;AAAA,IACH,GAAG;AAAA,EACP;AAAA,EACA,cAAc;AAAA,EACd,YAAY;AAAA,EACZ,YAAY;AAAA,EACZ,gBAAgB;AAAA,EAChB,eAAe;AAAA,EACf,OAAO;AAAA,EACP,SAAS;AACb;"}
1	+ {"version":3,"file":"types.es.js","sources":["../../../../../src/components/RichTextEditor/serializer/markdown/types.ts"],"sourcesContent":["/* (c) Copyright Frontify Ltd., all rights reserved. */\n\nexport type InputNodeTypes = {\n paragraph: string;\n blockQuote: string;\n codeBlock: string;\n link: string;\n ulList: string;\n olList: string;\n listItem: string;\n listItemChild: string;\n heading: {\n 1: string;\n 2: string;\n 3: string;\n 4: string;\n 5: string;\n 6: string;\n };\n emphasisMark: string;\n strongMark: string;\n deleteMark: string;\n inlineCodeMark: string;\n thematicBreak: string;\n image: string;\n mention: string;\n};\n\nexport type MarkdownAstNodeType =\n \| 'paragraph'\n \| 'heading'\n \| 'list'\n \| 'listItem'\n \| 'listItemChild'\n \| 'link'\n \| 'image'\n \| 'blockquote'\n \| 'code'\n \| 'html'\n \| 'emphasis'\n \| 'strong'\n \| 'delete'\n \| 'inlineCode'\n \| 'thematicBreak'\n \| 'text'\n \| 'mention';\n\nexport const defaultNodeTypes: InputNodeTypes = {\n paragraph: 'paragraph',\n blockQuote: 'block_quote',\n codeBlock: 'code_block',\n link: 'link',\n ulList: 'ul_list',\n olList: 'ol_list',\n listItem: 'list_item',\n listItemChild: 'lic',\n heading: {\n 1: 'heading_one',\n 2: 'heading_two',\n 3: 'heading_three',\n 4: 'heading_four',\n 5: 'heading_five',\n 6: 'heading_six',\n },\n emphasisMark: 'italic',\n strongMark: 'bold',\n deleteMark: 'strikethrough',\n inlineCodeMark: 'code',\n thematicBreak: 'thematic_break',\n image: 'image',\n mention: 'mention',\n};\n\nexport type NodeType = BlockType \| LeafType;\n\nexport type LeafType = {\n text: string;\n strikethrough?: boolean;\n bold?: boolean;\n italic?: boolean;\n code?: boolean;\n parentType?: string;\n};\n\nexport type BlockType = {\n type: string;\n children: NodeType[];\n parentType?: string;\n caption?: string;\n language?: string;\n break?: boolean;\n link?: string;\n url?: string;\n id?: string;\n category?: string;\n target?: TargetValue;\n};\n\nexport type RecursivePartial<T> = {\n [P in keyof T]?: RecursivePartial<T[P]>;\n};\n\nexport type OptionType<T extends InputNodeTypes = InputNodeTypes> = {\n nodeTypes: RecursivePartial<T>;\n linkDestinationKey: string;\n ignoreParagraphNewline: boolean;\n listDepth: number;\n imageSourceKey?: string;\n imageCaptionKey?: string;\n};\n\nexport type PartialOptionType<T extends OptionType = OptionType> = Partial<T>;\n\nexport type MarkdownAstNode = {\n type?: MarkdownAstNodeType;\n ordered?: boolean;\n value?: string;\n text?: string;\n children?: Array<MarkdownAstNode>;\n depth?: 1 \| 2 \| 3 \| 4 \| 5 \| 6;\n url?: string;\n alt?: string;\n lang?: string;\n // Markdown Ast metadata\n // eslint-disable-next-line @typescript-eslint/no-explicit-any\n position?: any;\n // eslint-disable-next-line @typescript-eslint/no-explicit-any\n spread?: any;\n // eslint-disable-next-line @typescript-eslint/no-explicit-any\n checked?: any;\n // eslint-disable-next-line @typescript-eslint/no-explicit-any\n indent?: any;\n target?: TargetValue;\n};\n\nexport const Targets = {\n Blank: '_blank',\n Self: '_self',\n} as const;\n\nexport type TargetValue = typeof Targets[keyof typeof Targets];\n\nexport type TextNode = { text?: string };\n\nexport type CodeBlockNode<T extends InputNodeTypes> = {\n type: T['codeBlock'];\n language: string \| undefined;\n children: Array<TextNode>;\n};\n\nexport type HeadingNode<T extends InputNodeTypes> = {\n type: T['heading'][1] \| T['heading'][2] \| T['heading'][3] \| T['heading'][4] \| T['heading'][5] \| T['heading'][6];\n children: Array<DeserializedNode<T>>;\n};\n\nexport type ListNode<T extends InputNodeTypes> = {\n type: T['olList'] \| T['ulList'];\n children: Array<DeserializedNode<T>>;\n};\n\nexport type ListItemNode<T extends InputNodeTypes> = {\n type: T['listItem'];\n children: Array<DeserializedNode<T>>;\n};\n\nexport type ListItemChildNode<T extends InputNodeTypes> = {\n type: T['listItemChild'];\n children: Array<DeserializedNode<T>>;\n};\n\nexport type ParagraphNode<T extends InputNodeTypes> = {\n type: T['paragraph'];\n break?: true;\n children: Array<DeserializedNode<T>>;\n};\n\nexport type LinkNode<T extends InputNodeTypes> = {\n type: T['link'];\n children: Array<DeserializedNode<T>>;\n [urlKey: string]: string \| undefined \| Array<DeserializedNode<T>>;\n};\n\nexport type ImageNode<T extends InputNodeTypes> = {\n type: T['image'];\n children: Array<DeserializedNode<T>>;\n [sourceOrCaptionKey: string]: string \| undefined \| Array<DeserializedNode<T>>;\n};\n\nexport type BlockQuoteNode<T extends InputNodeTypes> = {\n type: T['blockQuote'];\n children: Array<DeserializedNode<T>>;\n};\n\nexport type InlineCodeMarkNode<T extends InputNodeTypes> = {\n type: T['inlineCodeMark'];\n children: Array<TextNode>;\n language: string \| undefined;\n};\n\nexport type ThematicBreakNode<T extends InputNodeTypes> = {\n type: T['thematicBreak'];\n children: Array<DeserializedNode<T>>;\n};\n\nexport type ItalicNode<T extends InputNodeTypes> = {\n [K in T['emphasisMark']]: true;\n} & {\n children: TextNode;\n};\n\nexport type BoldNode = {\n bold: true;\n children: TextNode;\n};\n\nexport type StrikeThoughNode = {\n strikethrough: true;\n children: TextNode;\n};\n\nexport type InlineCodeNode = {\n code: true;\n text: string \| undefined;\n};\n\nexport type DeserializedNode<T extends InputNodeTypes> =\n \| CodeBlockNode<T>\n \| HeadingNode<T>\n \| ListNode<T>\n \| ListItemNode<T>\n \| ListItemChildNode<T>\n \| ParagraphNode<T>\n \| LinkNode<T>\n \| ImageNode<T>\n \| BlockQuoteNode<T>\n \| InlineCodeMarkNode<T>\n \| ThematicBreakNode<T>\n \| ItalicNode<T>\n \| BoldNode\n \| StrikeThoughNode\n \| InlineCodeNode\n \| TextNode;\n"],"names":["defaultNodeTypes","Targets"],"mappings":"AA+CO,MAAMA,IAAmC;AAAA,EAC5C,WAAW;AAAA,EACX,YAAY;AAAA,EACZ,WAAW;AAAA,EACX,MAAM;AAAA,EACN,QAAQ;AAAA,EACR,QAAQ;AAAA,EACR,UAAU;AAAA,EACV,eAAe;AAAA,EACf,SAAS;AAAA,IACL,GAAG;AAAA,IACH,GAAG;AAAA,IACH,GAAG;AAAA,IACH,GAAG;AAAA,IACH,GAAG;AAAA,IACH,GAAG;AAAA,EACP;AAAA,EACA,cAAc;AAAA,EACd,YAAY;AAAA,EACZ,YAAY;AAAA,EACZ,gBAAgB;AAAA,EAChB,eAAe;AAAA,EACf,OAAO;AAAA,EACP,SAAS;AACb,GAgEaC,IAAU;AAAA,EACnB,OAAO;AAAA,EACP,MAAM;AACV;"}

package/dist/components/RichTextEditor/serializer/nodes/link.es.js CHANGED Viewed

@@ -1,12 +1,12 @@
-import e from "escape-html";
-import { reactCssPropsToCss as f } from "../utils/reactCssPropsToCss.es.js";
+import p from "escape-html";
+import { reactCssPropsToCss as e } from "../utils/reactCssPropsToCss.es.js";
 const m = (r, a, l, s) => {
   var $;
   if (r.chosenLink) {
     const { chosenLink: t } = r;
-    return `<a class="${s}" style="${f(l.link)}" target=${t != null && t.openInNewTab ? "_blank" : "_self"} href="${e(($ = t == null ? void 0 : t.searchResult) == null ? void 0 : $.link)}">${a}</a>`;
+    return `<a class="${s}" style="${e(l.link)}" target=${t != null && t.openInNewTab ? "_blank" : "_self"} href="${p(($ = t == null ? void 0 : t.searchResult) == null ? void 0 : $.link)}">${a}</a>`;
   }
-  return `<a class="${s}" style="${f(l.link)}" target="${(r == null ? void 0 : r.target) ?? "_self"}" href="${e(r.url)}">${a}</a>`;
+  return `<a class="${s}" style="${e(l.link)}" target="${(r == null ? void 0 : r.target) ?? "_blank"}" href="${p(r.url)}">${a}</a>`;
 };
 export {
   m as linkNode

package/dist/components/RichTextEditor/serializer/nodes/link.es.js.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"link.es.js","sources":["../../../../../src/components/RichTextEditor/serializer/nodes/link.ts"],"sourcesContent":["/* (c) Copyright Frontify Ltd., all rights reserved. */\n\nimport { TLinkElement } from '@components/RichTextEditor/Plugins/LinkPlugin/types';\nimport { DesignTokens } from '@components/RichTextEditor/types';\nimport { TElement } from '@udecode/plate';\nimport escapeHtml from 'escape-html';\nimport { reactCssPropsToCss } from '../utils/reactCssPropsToCss';\n\nexport const linkNode = (node: TElement, children: string, designTokens: DesignTokens, defaultClassNames: string) => {\n if (node.chosenLink) {\n const { chosenLink } = node as TLinkElement;\n return `<a class=\"${defaultClassNames}\" style=\"${reactCssPropsToCss(designTokens.link)}\" target=${\n chosenLink?.openInNewTab ? '_blank' : '_self'\n } href=\"${escapeHtml(chosenLink?.searchResult?.link)}\">${children}</a>`;\n }\n return `<a class=\"${defaultClassNames}\" style=\"${reactCssPropsToCss(designTokens.link)}\" target=\"${\n node?.target ?? '~~_self~~'\n }\" href=\"${escapeHtml(node.url as string)}\">${children}</a>`;\n};\n"],"names":["linkNode","node","children","designTokens","defaultClassNames","chosenLink","reactCssPropsToCss","escapeHtml","_a"],"mappings":";;AAQO,MAAMA,IAAW,CAACC,GAAgBC,GAAkBC,GAA4BC,MAA8B;;AACjH,MAAIH,EAAK,YAAY;AACX,UAAA,EAAE,YAAAI,EAAe,IAAAJ;AACvB,WAAO,aAAaG,aAA6BE,EAAmBH,EAAa,IAAI,aACjFE,KAAA,QAAAA,EAAY,eAAe,WAAW,iBAChCE,GAAWC,IAAAH,KAAA,gBAAAA,EAAY,iBAAZ,gBAAAG,EAA0B,IAAI,MAAMN;AAAA,EAC7D;AACA,SAAO,aAAaE,aAA6BE,EAAmBH,EAAa,IAAI,eACjFF,KAAA,gBAAAA,EAAM,WAAU,~~kBACTM~~,EAAWN,EAAK,GAAa,MAAMC;AAClD;"}
1	+ {"version":3,"file":"link.es.js","sources":["../../../../../src/components/RichTextEditor/serializer/nodes/link.ts"],"sourcesContent":["/* (c) Copyright Frontify Ltd., all rights reserved. */\n\nimport { TLinkElement } from '@components/RichTextEditor/Plugins/LinkPlugin/types';\nimport { DesignTokens } from '@components/RichTextEditor/types';\nimport { TElement } from '@udecode/plate';\nimport escapeHtml from 'escape-html';\nimport { reactCssPropsToCss } from '../utils/reactCssPropsToCss';\n\nexport const linkNode = (node: TElement, children: string, designTokens: DesignTokens, defaultClassNames: string) => {\n if (node.chosenLink) {\n const { chosenLink } = node as TLinkElement;\n return `<a class=\"${defaultClassNames}\" style=\"${reactCssPropsToCss(designTokens.link)}\" target=${\n chosenLink?.openInNewTab ? '_blank' : '_self'\n } href=\"${escapeHtml(chosenLink?.searchResult?.link)}\">${children}</a>`;\n }\n return `<a class=\"${defaultClassNames}\" style=\"${reactCssPropsToCss(designTokens.link)}\" target=\"${\n node?.target ?? '_blank'\n }\" href=\"${escapeHtml(node.url as string)}\">${children}</a>`;\n};\n"],"names":["linkNode","node","children","designTokens","defaultClassNames","chosenLink","reactCssPropsToCss","escapeHtml","_a"],"mappings":";;AAQO,MAAMA,IAAW,CAACC,GAAgBC,GAAkBC,GAA4BC,MAA8B;;AACjH,MAAIH,EAAK,YAAY;AACX,UAAA,EAAE,YAAAI,EAAe,IAAAJ;AACvB,WAAO,aAAaG,aAA6BE,EAAmBH,EAAa,IAAI,aACjFE,KAAA,QAAAA,EAAY,eAAe,WAAW,iBAChCE,GAAWC,IAAAH,KAAA,gBAAAA,EAAY,iBAAZ,gBAAAG,EAA0B,IAAI,MAAMN;AAAA,EAC7D;AACA,SAAO,aAAaE,aAA6BE,EAAmBH,EAAa,IAAI,eACjFF,KAAA,gBAAAA,EAAM,WAAU,mBACTM,EAAWN,EAAK,GAAa,MAAMC;AAClD;"}

package/dist/components/TextInput/TextInput.es.js CHANGED Viewed

@@ -31,8 +31,8 @@ const lt = ({
   onChange: w,
   onEnterPressed: k,
   onBlur: O,
-  onClear: g,
-  onFocus: E,
+  onClear: E,
+  onFocus: g,
   size: z,
   spellcheck: y,
   readonly: b,
@@ -86,7 +86,7 @@ const lt = ({
         id: G(s),
         ref: l,
         className: o([
-          "tw-w-full tw-grow tw-border-none tw-outline-none tw-bg-transparent tw-hide-input-arrows !tw-ring-0",
+          "tw-w-full tw-grow tw-border-none tw-outline-none tw-bg-transparent tw-hide-input-arrows",
           r || b ? "tw-text-black-40 tw-placeholder-black-30 dark:tw-text-black-30 dark:tw-placeholder-black-40" : "tw-text-black tw-placeholder-black-60 dark:tw-text-white"
         ]),
         onClick: () => {
@@ -103,7 +103,7 @@ const lt = ({
         readOnly: b,
         disabled: r,
         onFocus: (e) => {
-          M && e.target.select(), E && E(e);
+          M && e.target.select(), g && g(e);
         },
         autoComplete: j ? "on" : "off",
         size: z,
@@ -121,7 +121,7 @@ const lt = ({
         ]),
         onClick: () => {
           var e, v;
-          (e = l.current) == null || e.focus(), (v = l.current) == null || v.setAttribute("value", ""), w && w(""), g && g();
+          (e = l.current) == null || e.focus(), (v = l.current) == null || v.setAttribute("value", ""), w && w(""), E && E();
         },
         "data-test-id": "clear-icon",
         title: "Clear text input",

package/dist/components/TextInput/TextInput.es.js.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"TextInput.es.js","sources":["../../../src/components/TextInput/TextInput.tsx"],"sourcesContent":["/* (c) Copyright Frontify Ltd., all rights reserved. */\n\nimport { LoadingCircle, LoadingCircleSize } from '@components/LoadingCircle';\nimport { useCopy } from '@hooks/useCopy';\nimport { useMemoizedId } from '@hooks/useMemoizedId';\nimport { useFocusRing } from '@react-aria/focus';\nimport { FOCUS_STYLE } from '@utilities/focusStyle';\nimport { merge } from '@utilities/merge';\nimport { Validation, validationClassMap } from '@utilities/validation';\nimport React, { FC, FocusEvent, KeyboardEvent, ReactNode, useEffect, useRef, useState } from 'react';\nimport {\n IconCheckMark,\n IconClipboard,\n IconCross,\n IconCrossCircle,\n IconExclamationMarkTriangle,\n IconEye,\n IconEyeOff,\n} from '@foundation/Icon/Generated';\n\nexport enum TextInputType {\n Text = 'text',\n Password = 'password',\n Number = 'number',\n}\n\nexport type TextInputBaseProps = {\n id?: string;\n type?: TextInputType;\n decorator?: ReactNode;\n dotted?: boolean;\n clearable?: boolean;\n placeholder?: string;\n required?: boolean;\n disabled?: boolean;\n autocomplete?: boolean;\n readonly?: boolean;\n validation?: Validation;\n copyable?: boolean;\n value?: string;\n onChange?: (value: string) => void;\n onEnterPressed?: (event: KeyboardEvent<HTMLInputElement>) => void;\n onBlur?: (event: FocusEvent<HTMLInputElement>) => void;\n onFocus?: (event: FocusEvent<HTMLInputElement>) => void;\n onClear?: () => void;\n size?: number;\n spellcheck?: boolean;\n focusOnMount?: boolean;\n selectable?: boolean;\n};\n\nexport type TextInputProps =\n \| ({\n type?: TextInputType.Text;\n obfuscated?: false;\n } & TextInputBaseProps)\n \| ({\n type?: TextInputType.Number;\n obfuscated?: false;\n min?: number;\n max?: number;\n } & TextInputBaseProps)\n \| ({\n type: TextInputType.Password;\n obfuscated?: boolean;\n } & TextInputBaseProps);\n\nexport const TextInput: FC<TextInputProps> = ({\n id: propId,\n type = TextInputType.Text,\n decorator,\n validation = Validation.Default,\n clearable = false,\n placeholder,\n required,\n obfuscated,\n disabled = false,\n autocomplete = false,\n dotted = false,\n value = '',\n copyable = false,\n onChange,\n onEnterPressed,\n onBlur,\n onClear,\n onFocus,\n size,\n spellcheck,\n readonly,\n focusOnMount,\n selectable = false,\n}) => {\n const { isFocusVisible, focusProps } = useFocusRing({ within: true, isTextInput: true });\n const { isFocusVisible: clearButtonIsFocusVisible, focusProps: clearButtonFocusProps } = useFocusRing();\n const { isFocusVisible: passwordButtonIsFocusVisible, focusProps: passwordButtonFocusProps } = useFocusRing();\n const { isFocusVisible: copyButtonIsFocusVisible, focusProps: copyButtonFocusProps } = useFocusRing();\n\n const { copy, status } = useCopy();\n\n const inputElement = useRef<HTMLInputElement \| null>(null);\n const [isObfuscated, setIsObfuscated] = useState(\n typeof obfuscated === 'boolean' ? obfuscated : type === TextInputType.Password,\n );\n\n useEffect(() => {\n setTimeout(() => {\n focusOnMount && inputElement.current?.focus();\n }, 0);\n }, [focusOnMount]);\n\n useEffect(() => {\n if (typeof obfuscated === 'boolean') {\n setIsObfuscated(obfuscated);\n }\n }, [obfuscated]);\n\n const onKeyDown = (event: KeyboardEvent<HTMLInputElement>) => {\n if (event.key === 'Enter') {\n onEnterPressed && onEnterPressed(event);\n }\n };\n\n const getInputType = () => {\n if (type === TextInputType.Password) {\n return isObfuscated ? TextInputType.Password : TextInputType.Text;\n }\n return type;\n };\n\n const spellcheckProp = typeof spellcheck === 'boolean' ? { spellCheck: spellcheck } : null;\n\n return (\n <div\n {...focusProps}\n className={merge([\n 'tw-flex tw-items-center tw-h-9 tw-gap-2 tw-px-3 tw-border tw-transition tw-rounded tw-text-s tw-font-sans tw-relative tw-bg-white dark:tw-bg-transparent',\n dotted ? 'tw-border-dashed' : 'tw-border-solid',\n disabled \|\| readonly\n ? 'tw-border-black-5 tw-bg-black-5 dark:tw-bg-black-90 dark:tw-border-black-90'\n : merge([\n 'focus-within:tw-border-black-90 hover:tw-border-black-90',\n validationClassMap[validation],\n isFocusVisible &&\n !clearButtonIsFocusVisible &&\n !passwordButtonIsFocusVisible &&\n !copyButtonIsFocusVisible &&\n FOCUS_STYLE,\n ]),\n ])}\n data-test-id=\"fondue-text-input-component\"\n >\n {decorator && (\n <div\n className={merge([\n 'tw-flex tw-items-center tw-justify-center tw-pl-1',\n disabled ? 'tw-text-black-60' : 'tw-text-black-80',\n ])}\n data-test-id=\"decorator\"\n >\n {decorator}\n </div>\n )}\n <input\n id={useMemoizedId(propId)}\n ref={inputElement}\n className={merge([\n 'tw-w-full tw-grow tw-border-none tw-outline-none tw-bg-transparent tw-hide-input-arrows !tw-ring-0',\n disabled \|\| readonly\n ? 'tw-text-black-40 tw-placeholder-black-30 dark:tw-text-black-30 dark:tw-placeholder-black-40'\n : 'tw-text-black tw-placeholder-black-60 dark:tw-text-white',\n ])}\n onClick={() => inputElement.current?.focus()}\n onChange={(event) => onChange && onChange(event.currentTarget.value)}\n onBlur={onBlur}\n onKeyDown={onKeyDown}\n placeholder={placeholder}\n value={value}\n type={getInputType()}\n required={required}\n readOnly={readonly}\n disabled={disabled}\n onFocus={(e) => {\n if (selectable) {\n e.target.select();\n }\n if (onFocus) {\n onFocus(e);\n }\n }}\n autoComplete={autocomplete ? 'on' : 'off'}\n size={size}\n data-test-id=\"text-input\"\n {...spellcheckProp}\n />\n {`${value}`.length > 0 && clearable && (\n <button\n className={merge([\n 'tw-flex tw-items-center tw-justify-center tw-transition-colors tw-rounded',\n disabled ? 'tw-cursor-default tw-text-black-40' : 'tw-text-black-60 hover:tw-text-black-100',\n clearButtonIsFocusVisible && FOCUS_STYLE,\n ])}\n onClick={() => {\n inputElement.current?.focus();\n inputElement.current?.setAttribute('value', '');\n\n onChange && onChange('');\n onClear && onClear();\n }}\n data-test-id=\"clear-icon\"\n title=\"Clear text input\"\n aria-label=\"clear text input\"\n disabled={disabled}\n type=\"button\"\n {...clearButtonFocusProps}\n >\n <IconCross />\n </button>\n )}\n {type === TextInputType.Password && (\n <button\n className={merge([\n 'tw-flex tw-items-center tw-justify-center tw-transition-colors tw-rounded',\n disabled ? 'tw-cursor-default tw-text-black-40' : 'tw-text-black-60 hover:tw-text-black-100',\n passwordButtonIsFocusVisible && FOCUS_STYLE,\n ])}\n onClick={() => setIsObfuscated(!isObfuscated)}\n data-test-id=\"visibility-icon\"\n title=\"Toggle text visibility\"\n type=\"button\"\n aria-label={`${isObfuscated ? 'unveil' : 'obfuscate'} text input`}\n disabled={disabled}\n {...passwordButtonFocusProps}\n >\n {isObfuscated ? <IconEye /> : <IconEyeOff />}\n </button>\n )}\n {validation === Validation.Loading && (\n <span className=\"tw-absolute tw-top-[-0.55rem] tw-right-[-0.55rem] tw-bg-white tw-rounded-full tw-p-[2px] tw-border tw-border-black-10\">\n <LoadingCircle size={LoadingCircleSize.ExtraSmall} />\n </span>\n )}\n {(validation === Validation.Error \|\| validation === Validation.Warning) && (\n <span\n className={merge([\n 'tw-flex tw-items-center tw-justify-center',\n validation === Validation.Error && 'tw-text-text-negative',\n validation === Validation.Warning && 'tw-text-text-warning',\n ])}\n data-test-id=\"error-state-exclamation-mark-icon\"\n >\n <IconExclamationMarkTriangle />\n </span>\n )}\n {copyable && (\n <button\n className={merge([\n 'tw-flex tw-items-center tw-justify-center tw-transition-colors tw-rounded',\n disabled ? 'tw-cursor-default tw-text-black-40' : 'tw-text-black-60 hover:tw-text-black-100',\n copyButtonIsFocusVisible && FOCUS_STYLE,\n ])}\n onClick={() => copy(value)}\n data-test-id=\"copy-icon\"\n title=\"Copy input text\"\n disabled={disabled}\n type=\"button\"\n {...copyButtonFocusProps}\n >\n {status === 'error' && (\n <span className=\"tw-text-box-negative-strong\">\n <IconCrossCircle />\n </span>\n )}\n {status === 'idle' && <IconClipboard />}\n {status === 'success' && (\n <span className=\"tw-text-box-positive-strong\">\n <IconCheckMark />\n </span>\n )}\n </button>\n )}\n </div>\n );\n};\nTextInput.displayName = 'FondueTextInput';\n"],"names":["TextInputType","TextInput","propId","type","decorator","validation","Validation","clearable","placeholder","required","obfuscated","disabled","autocomplete","dotted","value","copyable","onChange","onEnterPressed","onBlur","onClear","onFocus","size","spellcheck","readonly","focusOnMount","selectable","isFocusVisible","focusProps","useFocusRing","clearButtonIsFocusVisible","clearButtonFocusProps","passwordButtonIsFocusVisible","passwordButtonFocusProps","copyButtonIsFocusVisible","copyButtonFocusProps","copy","status","useCopy","inputElement","useRef","isObfuscated","setIsObfuscated","useState","useEffect","_a","onKeyDown","event","getInputType","spellcheckProp","React","merge","validationClassMap","FOCUS_STYLE","useMemoizedId","_b","IconCross","IconEye","IconEyeOff","LoadingCircle","LoadingCircleSize","IconExclamationMarkTriangle","IconCrossCircle","IconClipboard","IconCheckMark"],"mappings":"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"}
1	+ {"version":3,"file":"TextInput.es.js","sources":["../../../src/components/TextInput/TextInput.tsx"],"sourcesContent":["/* (c) Copyright Frontify Ltd., all rights reserved. */\n\nimport { LoadingCircle, LoadingCircleSize } from '@components/LoadingCircle';\nimport { useCopy } from '@hooks/useCopy';\nimport { useMemoizedId } from '@hooks/useMemoizedId';\nimport { useFocusRing } from '@react-aria/focus';\nimport { FOCUS_STYLE } from '@utilities/focusStyle';\nimport { merge } from '@utilities/merge';\nimport { Validation, validationClassMap } from '@utilities/validation';\nimport React, { FC, FocusEvent, KeyboardEvent, ReactNode, useEffect, useRef, useState } from 'react';\nimport {\n IconCheckMark,\n IconClipboard,\n IconCross,\n IconCrossCircle,\n IconExclamationMarkTriangle,\n IconEye,\n IconEyeOff,\n} from '@foundation/Icon/Generated';\n\nexport enum TextInputType {\n Text = 'text',\n Password = 'password',\n Number = 'number',\n}\n\nexport type TextInputBaseProps = {\n id?: string;\n type?: TextInputType;\n decorator?: ReactNode;\n dotted?: boolean;\n clearable?: boolean;\n placeholder?: string;\n required?: boolean;\n disabled?: boolean;\n autocomplete?: boolean;\n readonly?: boolean;\n validation?: Validation;\n copyable?: boolean;\n value?: string;\n onChange?: (value: string) => void;\n onEnterPressed?: (event: KeyboardEvent<HTMLInputElement>) => void;\n onBlur?: (event: FocusEvent<HTMLInputElement>) => void;\n onFocus?: (event: FocusEvent<HTMLInputElement>) => void;\n onClear?: () => void;\n size?: number;\n spellcheck?: boolean;\n focusOnMount?: boolean;\n selectable?: boolean;\n};\n\nexport type TextInputProps =\n \| ({\n type?: TextInputType.Text;\n obfuscated?: false;\n } & TextInputBaseProps)\n \| ({\n type?: TextInputType.Number;\n obfuscated?: false;\n min?: number;\n max?: number;\n } & TextInputBaseProps)\n \| ({\n type: TextInputType.Password;\n obfuscated?: boolean;\n } & TextInputBaseProps);\n\nexport const TextInput: FC<TextInputProps> = ({\n id: propId,\n type = TextInputType.Text,\n decorator,\n validation = Validation.Default,\n clearable = false,\n placeholder,\n required,\n obfuscated,\n disabled = false,\n autocomplete = false,\n dotted = false,\n value = '',\n copyable = false,\n onChange,\n onEnterPressed,\n onBlur,\n onClear,\n onFocus,\n size,\n spellcheck,\n readonly,\n focusOnMount,\n selectable = false,\n}) => {\n const { isFocusVisible, focusProps } = useFocusRing({ within: true, isTextInput: true });\n const { isFocusVisible: clearButtonIsFocusVisible, focusProps: clearButtonFocusProps } = useFocusRing();\n const { isFocusVisible: passwordButtonIsFocusVisible, focusProps: passwordButtonFocusProps } = useFocusRing();\n const { isFocusVisible: copyButtonIsFocusVisible, focusProps: copyButtonFocusProps } = useFocusRing();\n\n const { copy, status } = useCopy();\n\n const inputElement = useRef<HTMLInputElement \| null>(null);\n const [isObfuscated, setIsObfuscated] = useState(\n typeof obfuscated === 'boolean' ? obfuscated : type === TextInputType.Password,\n );\n\n useEffect(() => {\n setTimeout(() => {\n focusOnMount && inputElement.current?.focus();\n }, 0);\n }, [focusOnMount]);\n\n useEffect(() => {\n if (typeof obfuscated === 'boolean') {\n setIsObfuscated(obfuscated);\n }\n }, [obfuscated]);\n\n const onKeyDown = (event: KeyboardEvent<HTMLInputElement>) => {\n if (event.key === 'Enter') {\n onEnterPressed && onEnterPressed(event);\n }\n };\n\n const getInputType = () => {\n if (type === TextInputType.Password) {\n return isObfuscated ? TextInputType.Password : TextInputType.Text;\n }\n return type;\n };\n\n const spellcheckProp = typeof spellcheck === 'boolean' ? { spellCheck: spellcheck } : null;\n\n return (\n <div\n {...focusProps}\n className={merge([\n 'tw-flex tw-items-center tw-h-9 tw-gap-2 tw-px-3 tw-border tw-transition tw-rounded tw-text-s tw-font-sans tw-relative tw-bg-white dark:tw-bg-transparent',\n dotted ? 'tw-border-dashed' : 'tw-border-solid',\n disabled \|\| readonly\n ? 'tw-border-black-5 tw-bg-black-5 dark:tw-bg-black-90 dark:tw-border-black-90'\n : merge([\n 'focus-within:tw-border-black-90 hover:tw-border-black-90',\n validationClassMap[validation],\n isFocusVisible &&\n !clearButtonIsFocusVisible &&\n !passwordButtonIsFocusVisible &&\n !copyButtonIsFocusVisible &&\n FOCUS_STYLE,\n ]),\n ])}\n data-test-id=\"fondue-text-input-component\"\n >\n {decorator && (\n <div\n className={merge([\n 'tw-flex tw-items-center tw-justify-center tw-pl-1',\n disabled ? 'tw-text-black-60' : 'tw-text-black-80',\n ])}\n data-test-id=\"decorator\"\n >\n {decorator}\n </div>\n )}\n <input\n id={useMemoizedId(propId)}\n ref={inputElement}\n className={merge([\n 'tw-w-full tw-grow tw-border-none tw-outline-none tw-bg-transparent tw-hide-input-arrows',\n disabled \|\| readonly\n ? 'tw-text-black-40 tw-placeholder-black-30 dark:tw-text-black-30 dark:tw-placeholder-black-40'\n : 'tw-text-black tw-placeholder-black-60 dark:tw-text-white',\n ])}\n onClick={() => inputElement.current?.focus()}\n onChange={(event) => onChange && onChange(event.currentTarget.value)}\n onBlur={onBlur}\n onKeyDown={onKeyDown}\n placeholder={placeholder}\n value={value}\n type={getInputType()}\n required={required}\n readOnly={readonly}\n disabled={disabled}\n onFocus={(e) => {\n if (selectable) {\n e.target.select();\n }\n if (onFocus) {\n onFocus(e);\n }\n }}\n autoComplete={autocomplete ? 'on' : 'off'}\n size={size}\n data-test-id=\"text-input\"\n {...spellcheckProp}\n />\n {`${value}`.length > 0 && clearable && (\n <button\n className={merge([\n 'tw-flex tw-items-center tw-justify-center tw-transition-colors tw-rounded',\n disabled ? 'tw-cursor-default tw-text-black-40' : 'tw-text-black-60 hover:tw-text-black-100',\n clearButtonIsFocusVisible && FOCUS_STYLE,\n ])}\n onClick={() => {\n inputElement.current?.focus();\n inputElement.current?.setAttribute('value', '');\n\n onChange && onChange('');\n onClear && onClear();\n }}\n data-test-id=\"clear-icon\"\n title=\"Clear text input\"\n aria-label=\"clear text input\"\n disabled={disabled}\n type=\"button\"\n {...clearButtonFocusProps}\n >\n <IconCross />\n </button>\n )}\n {type === TextInputType.Password && (\n <button\n className={merge([\n 'tw-flex tw-items-center tw-justify-center tw-transition-colors tw-rounded',\n disabled ? 'tw-cursor-default tw-text-black-40' : 'tw-text-black-60 hover:tw-text-black-100',\n passwordButtonIsFocusVisible && FOCUS_STYLE,\n ])}\n onClick={() => setIsObfuscated(!isObfuscated)}\n data-test-id=\"visibility-icon\"\n title=\"Toggle text visibility\"\n type=\"button\"\n aria-label={`${isObfuscated ? 'unveil' : 'obfuscate'} text input`}\n disabled={disabled}\n {...passwordButtonFocusProps}\n >\n {isObfuscated ? <IconEye /> : <IconEyeOff />}\n </button>\n )}\n {validation === Validation.Loading && (\n <span className=\"tw-absolute tw-top-[-0.55rem] tw-right-[-0.55rem] tw-bg-white tw-rounded-full tw-p-[2px] tw-border tw-border-black-10\">\n <LoadingCircle size={LoadingCircleSize.ExtraSmall} />\n </span>\n )}\n {(validation === Validation.Error \|\| validation === Validation.Warning) && (\n <span\n className={merge([\n 'tw-flex tw-items-center tw-justify-center',\n validation === Validation.Error && 'tw-text-text-negative',\n validation === Validation.Warning && 'tw-text-text-warning',\n ])}\n data-test-id=\"error-state-exclamation-mark-icon\"\n >\n <IconExclamationMarkTriangle />\n </span>\n )}\n {copyable && (\n <button\n className={merge([\n 'tw-flex tw-items-center tw-justify-center tw-transition-colors tw-rounded',\n disabled ? 'tw-cursor-default tw-text-black-40' : 'tw-text-black-60 hover:tw-text-black-100',\n copyButtonIsFocusVisible && FOCUS_STYLE,\n ])}\n onClick={() => copy(value)}\n data-test-id=\"copy-icon\"\n title=\"Copy input text\"\n disabled={disabled}\n type=\"button\"\n {...copyButtonFocusProps}\n >\n {status === 'error' && (\n <span className=\"tw-text-box-negative-strong\">\n <IconCrossCircle />\n </span>\n )}\n {status === 'idle' && <IconClipboard />}\n {status === 'success' && (\n <span className=\"tw-text-box-positive-strong\">\n <IconCheckMark />\n </span>\n )}\n </button>\n )}\n </div>\n );\n};\nTextInput.displayName = 'FondueTextInput';\n"],"names":["TextInputType","TextInput","propId","type","decorator","validation","Validation","clearable","placeholder","required","obfuscated","disabled","autocomplete","dotted","value","copyable","onChange","onEnterPressed","onBlur","onClear","onFocus","size","spellcheck","readonly","focusOnMount","selectable","isFocusVisible","focusProps","useFocusRing","clearButtonIsFocusVisible","clearButtonFocusProps","passwordButtonIsFocusVisible","passwordButtonFocusProps","copyButtonIsFocusVisible","copyButtonFocusProps","copy","status","useCopy","inputElement","useRef","isObfuscated","setIsObfuscated","useState","useEffect","_a","onKeyDown","event","getInputType","spellcheckProp","React","merge","validationClassMap","FOCUS_STYLE","useMemoizedId","_b","IconCross","IconEye","IconEyeOff","LoadingCircle","LoadingCircleSize","IconExclamationMarkTriangle","IconCrossCircle","IconClipboard","IconCheckMark"],"mappings":"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"}