@choco-vanille/ui 1.4.0 → 1.5.0

package/dist/components/forms/rich-text-editor/components/lists-group/ListsGroup.cjs.map

@@ -1 +1 @@
-{"version":3,"file":"ListsGroup.cjs","sources":["../../../../../../src/components/forms/rich-text-editor/components/lists-group/ListsGroup.tsx"],"sourcesContent":["import { IconButton } from '@components/actions/icon-button'\r\nimport { Tooltip } from '@components/overlay/tooltip'\r\nimport { DropdownMenu } from '@components/overlay/dropdown-menu'\r\nimport { useState } from 'react'\r\n\r\nimport { useRichTextEditorContext } from '@components/forms/rich-text-editor/context/RichTextEditor.context.ts'\r\nimport { LISTS_GROUP_STYLES } from '@components/forms/rich-text-editor/components/lists-group/styles/ListsGroup.css.ts'\r\nimport type { ListsGroupProps } from '@components/forms/rich-text-editor/components/lists-group/types/ListsGroup.props.ts'\r\n\r\nconst ListsGroup = ({ presentation = 'menu' }: ListsGroupProps) => {\r\n    const { editor, disabled, labels } = useRichTextEditorContext()\r\n    const [listsOpen, setListsOpen] = useState(false)\r\n\r\n    if (!editor) {\r\n        return null\r\n    }\r\n\r\n    const isBulletList = editor.isActive('bulletList')\r\n    const isOrderedList = editor.isActive('orderedList')\r\n\r\n    return (\r\n        <div\r\n            className={LISTS_GROUP_STYLES.root}\r\n            role={'group'}\r\n            aria-label={labels.listsGroup}\r\n        >\r\n            {presentation === 'inline' ? (\r\n                <>\r\n                    <Tooltip\r\n                        content={labels.bulletedList}\r\n                        delayDuration={700}\r\n                        openOnFocus={false}\r\n                        position={'top'}\r\n                    >\r\n                        <IconButton\r\n                            type={'button'}\r\n                            icon={'lucide:list'}\r\n                            aria-label={labels.bulletedList}\r\n                            variant={'ghost'}\r\n                            color={'primary'}\r\n                            size={'sm'}\r\n                            disabled={disabled}\r\n                            onMouseDown={(event) => event.preventDefault()}\r\n                            onClick={() => editor.chain().focus().toggleBulletList().run()}\r\n                        />\r\n                    </Tooltip>\r\n                    <Tooltip\r\n                        content={labels.numberedList}\r\n                        delayDuration={700}\r\n                        openOnFocus={false}\r\n                        position={'top'}\r\n                    >\r\n                        <IconButton\r\n                            type={'button'}\r\n                            icon={'lucide:list-ordered'}\r\n                            aria-label={labels.numberedList}\r\n                            variant={'ghost'}\r\n                            color={'primary'}\r\n                            size={'sm'}\r\n                            disabled={disabled}\r\n                            onMouseDown={(event) => event.preventDefault()}\r\n                            onClick={() => editor.chain().focus().toggleOrderedList().run()}\r\n                        />\r\n                    </Tooltip>\r\n                </>\r\n            ) : (\r\n                <DropdownMenu\r\n                    modal={false}\r\n                    open={listsOpen}\r\n                    onOpenChange={setListsOpen}\r\n                >\r\n                    <Tooltip\r\n                        content={labels.listsTrigger}\r\n                        delayDuration={700}\r\n                        openOnFocus={false}\r\n                        position={'top'}\r\n                    >\r\n                        <DropdownMenu.Trigger>\r\n                            <IconButton\r\n                                type={'button'}\r\n                                icon={'lucide:list'}\r\n                                aria-label={labels.listsTrigger}\r\n                                variant={'ghost'}\r\n                                color={'primary'}\r\n                                size={'sm'}\r\n                                active={listsOpen}\r\n                                disabled={disabled}\r\n                            />\r\n                        </DropdownMenu.Trigger>\r\n                    </Tooltip>\r\n                    <DropdownMenu.Content aria-label={labels.listOptions}>\r\n                        <DropdownMenu.Item\r\n                            label={labels.bulletedList}\r\n                            startIcon={'lucide:list'}\r\n                            active={isBulletList}\r\n                            onClick={() => editor.chain().focus().toggleBulletList().run()}\r\n                        />\r\n                        <DropdownMenu.Item\r\n                            label={labels.numberedList}\r\n                            startIcon={'lucide:list-ordered'}\r\n                            active={isOrderedList}\r\n                            onClick={() => editor.chain().focus().toggleOrderedList().run()}\r\n                        />\r\n                    </DropdownMenu.Content>\r\n                </DropdownMenu>\r\n            )}\r\n        </div>\r\n    )\r\n}\r\n\r\nListsGroup.displayName = 'RichTextEditor.ListsGroup'\r\n\r\nexport default ListsGroup\r\n"],"names":["ListsGroup","presentation","editor","disabled","labels","useRichTextEditorContext","listsOpen","setListsOpen","useState","isBulletList","isOrderedList","jsx","LISTS_GROUP_STYLES","jsxs","Fragment","Tooltip","IconButton","event","DropdownMenu"],"mappings":"isBASMA,EAAa,CAAC,CAAE,aAAAC,EAAe,UAA8B,CAC/D,KAAM,CAAE,OAAAC,EAAQ,SAAAC,EAAU,OAAAC,CAAA,EAAWC,EAAAA,yBAAA,EAC/B,CAACC,EAAWC,CAAY,EAAIC,EAAAA,SAAS,EAAK,EAEhD,GAAI,CAACN,EACD,OAAO,KAGX,MAAMO,EAAeP,EAAO,SAAS,YAAY,EAC3CQ,EAAgBR,EAAO,SAAS,aAAa,EAEnD,OACIS,EAAAA,IAAC,MAAA,CACG,UAAWC,EAAAA,mBAAmB,KAC9B,KAAM,QACN,aAAYR,EAAO,WAElB,SAAAH,IAAiB,SACdY,EAAAA,KAAAC,EAAAA,SAAA,CACI,SAAA,CAAAH,EAAAA,IAACI,EAAA,CACG,QAASX,EAAO,aAChB,cAAe,IACf,YAAa,GACb,SAAU,MAEV,SAAAO,EAAAA,IAACK,EAAA,CACG,KAAM,SACN,KAAM,cACN,aAAYZ,EAAO,aACnB,QAAS,QACT,MAAO,UACP,KAAM,KACN,SAAAD,EACA,YAAcc,GAAUA,EAAM,eAAA,EAC9B,QAAS,IAAMf,EAAO,MAAA,EAAQ,MAAA,EAAQ,iBAAA,EAAmB,IAAA,CAAI,CAAA,CACjE,CAAA,EAEJS,EAAAA,IAACI,EAAA,CACG,QAASX,EAAO,aAChB,cAAe,IACf,YAAa,GACb,SAAU,MAEV,SAAAO,EAAAA,IAACK,EAAA,CACG,KAAM,SACN,KAAM,sBACN,aAAYZ,EAAO,aACnB,QAAS,QACT,MAAO,UACP,KAAM,KACN,SAAAD,EACA,YAAcc,GAAUA,EAAM,eAAA,EAC9B,QAAS,IAAMf,EAAO,MAAA,EAAQ,MAAA,EAAQ,kBAAA,EAAoB,IAAA,CAAI,CAAA,CAClE,CAAA,CACJ,CAAA,CACJ,EAEAW,EAAAA,KAACK,EAAA,CACG,MAAO,GACP,KAAMZ,EACN,aAAcC,EAEd,SAAA,CAAAI,EAAAA,IAACI,EAAA,CACG,QAASX,EAAO,aAChB,cAAe,IACf,YAAa,GACb,SAAU,MAEV,SAAAO,EAAAA,IAACO,EAAa,QAAb,CACG,SAAAP,EAAAA,IAACK,EAAA,CACG,KAAM,SACN,KAAM,cACN,aAAYZ,EAAO,aACnB,QAAS,QACT,MAAO,UACP,KAAM,KACN,OAAQE,EACR,SAAAH,CAAA,CAAA,CACJ,CACJ,CAAA,CAAA,SAEHe,EAAa,QAAb,CAAqB,aAAYd,EAAO,YACrC,SAAA,CAAAO,EAAAA,IAACO,EAAa,KAAb,CACG,MAAOd,EAAO,aACd,UAAW,cACX,OAAQK,EACR,QAAS,IAAMP,EAAO,MAAA,EAAQ,MAAA,EAAQ,iBAAA,EAAmB,IAAA,CAAI,CAAA,EAEjES,EAAAA,IAACO,EAAa,KAAb,CACG,MAAOd,EAAO,aACd,UAAW,sBACX,OAAQM,EACR,QAAS,IAAMR,EAAO,MAAA,EAAQ,MAAA,EAAQ,kBAAA,EAAoB,IAAA,CAAI,CAAA,CAClE,CAAA,CACJ,CAAA,CAAA,CAAA,CACJ,CAAA,CAIhB,EAEAF,EAAW,YAAc"}
+{"version":3,"file":"ListsGroup.cjs","sources":["../../../../../../src/components/forms/rich-text-editor/components/lists-group/ListsGroup.tsx"],"sourcesContent":["import { IconButton } from '@components/actions/icon-button'\r\nimport { Tooltip } from '@components/overlay/tooltip'\r\nimport { DropdownMenu } from '@components/overlay/dropdown-menu'\r\nimport { useState } from 'react'\r\n\r\nimport { useRichTextEditorContext } from '@components/forms/rich-text-editor/context/RichTextEditor.context.ts'\r\nimport { LISTS_GROUP_STYLES } from '@components/forms/rich-text-editor/components/lists-group/styles/ListsGroup.css.ts'\r\nimport type { ListsGroupProps } from '@components/forms/rich-text-editor/components/lists-group/types/ListsGroup.props.ts'\r\n\r\n/**\r\n * Toolbar group for list commands: bulleted and numbered lists. Use\r\n * `presentation=\"inline\"` for individual icon buttons or `\"menu\"` (default)\r\n * for a dropdown trigger.\r\n */\r\nconst ListsGroup = ({ presentation = 'menu' }: ListsGroupProps) => {\r\n    const { editor, disabled, labels } = useRichTextEditorContext()\r\n    const [listsOpen, setListsOpen] = useState(false)\r\n\r\n    if (!editor) {\r\n        return null\r\n    }\r\n\r\n    const isBulletList = editor.isActive('bulletList')\r\n    const isOrderedList = editor.isActive('orderedList')\r\n\r\n    return (\r\n        <div\r\n            className={LISTS_GROUP_STYLES.root}\r\n            role={'group'}\r\n            aria-label={labels.listsGroup}\r\n        >\r\n            {presentation === 'inline' ? (\r\n                <>\r\n                    <Tooltip\r\n                        content={labels.bulletedList}\r\n                        delayDuration={700}\r\n                        openOnFocus={false}\r\n                        position={'top'}\r\n                    >\r\n                        <IconButton\r\n                            type={'button'}\r\n                            icon={'lucide:list'}\r\n                            aria-label={labels.bulletedList}\r\n                            variant={'ghost'}\r\n                            color={'primary'}\r\n                            size={'sm'}\r\n                            disabled={disabled}\r\n                            onMouseDown={(event) => event.preventDefault()}\r\n                            onClick={() => editor.chain().focus().toggleBulletList().run()}\r\n                        />\r\n                    </Tooltip>\r\n                    <Tooltip\r\n                        content={labels.numberedList}\r\n                        delayDuration={700}\r\n                        openOnFocus={false}\r\n                        position={'top'}\r\n                    >\r\n                        <IconButton\r\n                            type={'button'}\r\n                            icon={'lucide:list-ordered'}\r\n                            aria-label={labels.numberedList}\r\n                            variant={'ghost'}\r\n                            color={'primary'}\r\n                            size={'sm'}\r\n                            disabled={disabled}\r\n                            onMouseDown={(event) => event.preventDefault()}\r\n                            onClick={() => editor.chain().focus().toggleOrderedList().run()}\r\n                        />\r\n                    </Tooltip>\r\n                </>\r\n            ) : (\r\n                <DropdownMenu\r\n                    modal={false}\r\n                    open={listsOpen}\r\n                    onOpenChange={setListsOpen}\r\n                >\r\n                    <Tooltip\r\n                        content={labels.listsTrigger}\r\n                        delayDuration={700}\r\n                        openOnFocus={false}\r\n                        position={'top'}\r\n                    >\r\n                        <DropdownMenu.Trigger>\r\n                            <IconButton\r\n                                type={'button'}\r\n                                icon={'lucide:list'}\r\n                                aria-label={labels.listsTrigger}\r\n                                variant={'ghost'}\r\n                                color={'primary'}\r\n                                size={'sm'}\r\n                                active={listsOpen}\r\n                                disabled={disabled}\r\n                            />\r\n                        </DropdownMenu.Trigger>\r\n                    </Tooltip>\r\n                    <DropdownMenu.Content aria-label={labels.listOptions}>\r\n                        <DropdownMenu.Item\r\n                            label={labels.bulletedList}\r\n                            startIcon={'lucide:list'}\r\n                            active={isBulletList}\r\n                            onClick={() => editor.chain().focus().toggleBulletList().run()}\r\n                        />\r\n                        <DropdownMenu.Item\r\n                            label={labels.numberedList}\r\n                            startIcon={'lucide:list-ordered'}\r\n                            active={isOrderedList}\r\n                            onClick={() => editor.chain().focus().toggleOrderedList().run()}\r\n                        />\r\n                    </DropdownMenu.Content>\r\n                </DropdownMenu>\r\n            )}\r\n        </div>\r\n    )\r\n}\r\n\r\nListsGroup.displayName = 'RichTextEditor.ListsGroup'\r\n\r\nexport default ListsGroup\r\n"],"names":["ListsGroup","presentation","editor","disabled","labels","useRichTextEditorContext","listsOpen","setListsOpen","useState","isBulletList","isOrderedList","jsx","LISTS_GROUP_STYLES","jsxs","Fragment","Tooltip","IconButton","event","DropdownMenu"],"mappings":"isBAcMA,EAAa,CAAC,CAAE,aAAAC,EAAe,UAA8B,CAC/D,KAAM,CAAE,OAAAC,EAAQ,SAAAC,EAAU,OAAAC,CAAA,EAAWC,EAAAA,yBAAA,EAC/B,CAACC,EAAWC,CAAY,EAAIC,EAAAA,SAAS,EAAK,EAEhD,GAAI,CAACN,EACD,OAAO,KAGX,MAAMO,EAAeP,EAAO,SAAS,YAAY,EAC3CQ,EAAgBR,EAAO,SAAS,aAAa,EAEnD,OACIS,EAAAA,IAAC,MAAA,CACG,UAAWC,EAAAA,mBAAmB,KAC9B,KAAM,QACN,aAAYR,EAAO,WAElB,SAAAH,IAAiB,SACdY,EAAAA,KAAAC,EAAAA,SAAA,CACI,SAAA,CAAAH,EAAAA,IAACI,EAAA,CACG,QAASX,EAAO,aAChB,cAAe,IACf,YAAa,GACb,SAAU,MAEV,SAAAO,EAAAA,IAACK,EAAA,CACG,KAAM,SACN,KAAM,cACN,aAAYZ,EAAO,aACnB,QAAS,QACT,MAAO,UACP,KAAM,KACN,SAAAD,EACA,YAAcc,GAAUA,EAAM,eAAA,EAC9B,QAAS,IAAMf,EAAO,MAAA,EAAQ,MAAA,EAAQ,iBAAA,EAAmB,IAAA,CAAI,CAAA,CACjE,CAAA,EAEJS,EAAAA,IAACI,EAAA,CACG,QAASX,EAAO,aAChB,cAAe,IACf,YAAa,GACb,SAAU,MAEV,SAAAO,EAAAA,IAACK,EAAA,CACG,KAAM,SACN,KAAM,sBACN,aAAYZ,EAAO,aACnB,QAAS,QACT,MAAO,UACP,KAAM,KACN,SAAAD,EACA,YAAcc,GAAUA,EAAM,eAAA,EAC9B,QAAS,IAAMf,EAAO,MAAA,EAAQ,MAAA,EAAQ,kBAAA,EAAoB,IAAA,CAAI,CAAA,CAClE,CAAA,CACJ,CAAA,CACJ,EAEAW,EAAAA,KAACK,EAAA,CACG,MAAO,GACP,KAAMZ,EACN,aAAcC,EAEd,SAAA,CAAAI,EAAAA,IAACI,EAAA,CACG,QAASX,EAAO,aAChB,cAAe,IACf,YAAa,GACb,SAAU,MAEV,SAAAO,EAAAA,IAACO,EAAa,QAAb,CACG,SAAAP,EAAAA,IAACK,EAAA,CACG,KAAM,SACN,KAAM,cACN,aAAYZ,EAAO,aACnB,QAAS,QACT,MAAO,UACP,KAAM,KACN,OAAQE,EACR,SAAAH,CAAA,CAAA,CACJ,CACJ,CAAA,CAAA,SAEHe,EAAa,QAAb,CAAqB,aAAYd,EAAO,YACrC,SAAA,CAAAO,EAAAA,IAACO,EAAa,KAAb,CACG,MAAOd,EAAO,aACd,UAAW,cACX,OAAQK,EACR,QAAS,IAAMP,EAAO,MAAA,EAAQ,MAAA,EAAQ,iBAAA,EAAmB,IAAA,CAAI,CAAA,EAEjES,EAAAA,IAACO,EAAa,KAAb,CACG,MAAOd,EAAO,aACd,UAAW,sBACX,OAAQM,EACR,QAAS,IAAMR,EAAO,MAAA,EAAQ,MAAA,EAAQ,kBAAA,EAAoB,IAAA,CAAI,CAAA,CAClE,CAAA,CACJ,CAAA,CAAA,CAAA,CACJ,CAAA,CAIhB,EAEAF,EAAW,YAAc"}

package/dist/components/forms/rich-text-editor/components/lists-group/ListsGroup.d.ts

@@ -1,4 +1,9 @@
 import { ListsGroupProps } from './types/ListsGroup.props.ts';
+/**
+ * Toolbar group for list commands: bulleted and numbered lists. Use
+ * `presentation="inline"` for individual icon buttons or `"menu"` (default)
+ * for a dropdown trigger.
+ */
 declare const ListsGroup: {
     ({ presentation }: ListsGroupProps): import("react").JSX.Element | null;
     displayName: string;

package/dist/components/forms/rich-text-editor/components/lists-group/ListsGroup.js

@@ -3,7 +3,7 @@ import s from "../../../../actions/icon-button/IconButton.js";
 import "../../../../actions/icon-button/styles/IconButton.css.js";
 import a from "../../../../overlay/tooltip/Tooltip.js";
 import "../../../../overlay/tooltip/components/tooltip-provider/TooltipProvider.js";
-import '../../../../../ui-kit62.css';import '../../../../../ui-kit.css';/* empty css                                               */
+import '../../../../../ui-kit54.css';import '../../../../../ui-kit.css';/* empty css                                               */
 /* empty css                                                            */
 import "../../../../overlay/dropdown-menu/index.js";
 import { useState as g } from "react";

package/dist/components/forms/rich-text-editor/components/lists-group/ListsGroup.js.map

@@ -1 +1 @@
-{"version":3,"file":"ListsGroup.js","sources":["../../../../../../src/components/forms/rich-text-editor/components/lists-group/ListsGroup.tsx"],"sourcesContent":["import { IconButton } from '@components/actions/icon-button'\r\nimport { Tooltip } from '@components/overlay/tooltip'\r\nimport { DropdownMenu } from '@components/overlay/dropdown-menu'\r\nimport { useState } from 'react'\r\n\r\nimport { useRichTextEditorContext } from '@components/forms/rich-text-editor/context/RichTextEditor.context.ts'\r\nimport { LISTS_GROUP_STYLES } from '@components/forms/rich-text-editor/components/lists-group/styles/ListsGroup.css.ts'\r\nimport type { ListsGroupProps } from '@components/forms/rich-text-editor/components/lists-group/types/ListsGroup.props.ts'\r\n\r\nconst ListsGroup = ({ presentation = 'menu' }: ListsGroupProps) => {\r\n    const { editor, disabled, labels } = useRichTextEditorContext()\r\n    const [listsOpen, setListsOpen] = useState(false)\r\n\r\n    if (!editor) {\r\n        return null\r\n    }\r\n\r\n    const isBulletList = editor.isActive('bulletList')\r\n    const isOrderedList = editor.isActive('orderedList')\r\n\r\n    return (\r\n        <div\r\n            className={LISTS_GROUP_STYLES.root}\r\n            role={'group'}\r\n            aria-label={labels.listsGroup}\r\n        >\r\n            {presentation === 'inline' ? (\r\n                <>\r\n                    <Tooltip\r\n                        content={labels.bulletedList}\r\n                        delayDuration={700}\r\n                        openOnFocus={false}\r\n                        position={'top'}\r\n                    >\r\n                        <IconButton\r\n                            type={'button'}\r\n                            icon={'lucide:list'}\r\n                            aria-label={labels.bulletedList}\r\n                            variant={'ghost'}\r\n                            color={'primary'}\r\n                            size={'sm'}\r\n                            disabled={disabled}\r\n                            onMouseDown={(event) => event.preventDefault()}\r\n                            onClick={() => editor.chain().focus().toggleBulletList().run()}\r\n                        />\r\n                    </Tooltip>\r\n                    <Tooltip\r\n                        content={labels.numberedList}\r\n                        delayDuration={700}\r\n                        openOnFocus={false}\r\n                        position={'top'}\r\n                    >\r\n                        <IconButton\r\n                            type={'button'}\r\n                            icon={'lucide:list-ordered'}\r\n                            aria-label={labels.numberedList}\r\n                            variant={'ghost'}\r\n                            color={'primary'}\r\n                            size={'sm'}\r\n                            disabled={disabled}\r\n                            onMouseDown={(event) => event.preventDefault()}\r\n                            onClick={() => editor.chain().focus().toggleOrderedList().run()}\r\n                        />\r\n                    </Tooltip>\r\n                </>\r\n            ) : (\r\n                <DropdownMenu\r\n                    modal={false}\r\n                    open={listsOpen}\r\n                    onOpenChange={setListsOpen}\r\n                >\r\n                    <Tooltip\r\n                        content={labels.listsTrigger}\r\n                        delayDuration={700}\r\n                        openOnFocus={false}\r\n                        position={'top'}\r\n                    >\r\n                        <DropdownMenu.Trigger>\r\n                            <IconButton\r\n                                type={'button'}\r\n                                icon={'lucide:list'}\r\n                                aria-label={labels.listsTrigger}\r\n                                variant={'ghost'}\r\n                                color={'primary'}\r\n                                size={'sm'}\r\n                                active={listsOpen}\r\n                                disabled={disabled}\r\n                            />\r\n                        </DropdownMenu.Trigger>\r\n                    </Tooltip>\r\n                    <DropdownMenu.Content aria-label={labels.listOptions}>\r\n                        <DropdownMenu.Item\r\n                            label={labels.bulletedList}\r\n                            startIcon={'lucide:list'}\r\n                            active={isBulletList}\r\n                            onClick={() => editor.chain().focus().toggleBulletList().run()}\r\n                        />\r\n                        <DropdownMenu.Item\r\n                            label={labels.numberedList}\r\n                            startIcon={'lucide:list-ordered'}\r\n                            active={isOrderedList}\r\n                            onClick={() => editor.chain().focus().toggleOrderedList().run()}\r\n                        />\r\n                    </DropdownMenu.Content>\r\n                </DropdownMenu>\r\n            )}\r\n        </div>\r\n    )\r\n}\r\n\r\nListsGroup.displayName = 'RichTextEditor.ListsGroup'\r\n\r\nexport default ListsGroup\r\n"],"names":["ListsGroup","presentation","editor","disabled","labels","useRichTextEditorContext","listsOpen","setListsOpen","useState","isBulletList","isOrderedList","jsx","LISTS_GROUP_STYLES","jsxs","Fragment","Tooltip","IconButton","event","DropdownMenu"],"mappings":"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"}
+{"version":3,"file":"ListsGroup.js","sources":["../../../../../../src/components/forms/rich-text-editor/components/lists-group/ListsGroup.tsx"],"sourcesContent":["import { IconButton } from '@components/actions/icon-button'\r\nimport { Tooltip } from '@components/overlay/tooltip'\r\nimport { DropdownMenu } from '@components/overlay/dropdown-menu'\r\nimport { useState } from 'react'\r\n\r\nimport { useRichTextEditorContext } from '@components/forms/rich-text-editor/context/RichTextEditor.context.ts'\r\nimport { LISTS_GROUP_STYLES } from '@components/forms/rich-text-editor/components/lists-group/styles/ListsGroup.css.ts'\r\nimport type { ListsGroupProps } from '@components/forms/rich-text-editor/components/lists-group/types/ListsGroup.props.ts'\r\n\r\n/**\r\n * Toolbar group for list commands: bulleted and numbered lists. Use\r\n * `presentation=\"inline\"` for individual icon buttons or `\"menu\"` (default)\r\n * for a dropdown trigger.\r\n */\r\nconst ListsGroup = ({ presentation = 'menu' }: ListsGroupProps) => {\r\n    const { editor, disabled, labels } = useRichTextEditorContext()\r\n    const [listsOpen, setListsOpen] = useState(false)\r\n\r\n    if (!editor) {\r\n        return null\r\n    }\r\n\r\n    const isBulletList = editor.isActive('bulletList')\r\n    const isOrderedList = editor.isActive('orderedList')\r\n\r\n    return (\r\n        <div\r\n            className={LISTS_GROUP_STYLES.root}\r\n            role={'group'}\r\n            aria-label={labels.listsGroup}\r\n        >\r\n            {presentation === 'inline' ? (\r\n                <>\r\n                    <Tooltip\r\n                        content={labels.bulletedList}\r\n                        delayDuration={700}\r\n                        openOnFocus={false}\r\n                        position={'top'}\r\n                    >\r\n                        <IconButton\r\n                            type={'button'}\r\n                            icon={'lucide:list'}\r\n                            aria-label={labels.bulletedList}\r\n                            variant={'ghost'}\r\n                            color={'primary'}\r\n                            size={'sm'}\r\n                            disabled={disabled}\r\n                            onMouseDown={(event) => event.preventDefault()}\r\n                            onClick={() => editor.chain().focus().toggleBulletList().run()}\r\n                        />\r\n                    </Tooltip>\r\n                    <Tooltip\r\n                        content={labels.numberedList}\r\n                        delayDuration={700}\r\n                        openOnFocus={false}\r\n                        position={'top'}\r\n                    >\r\n                        <IconButton\r\n                            type={'button'}\r\n                            icon={'lucide:list-ordered'}\r\n                            aria-label={labels.numberedList}\r\n                            variant={'ghost'}\r\n                            color={'primary'}\r\n                            size={'sm'}\r\n                            disabled={disabled}\r\n                            onMouseDown={(event) => event.preventDefault()}\r\n                            onClick={() => editor.chain().focus().toggleOrderedList().run()}\r\n                        />\r\n                    </Tooltip>\r\n                </>\r\n            ) : (\r\n                <DropdownMenu\r\n                    modal={false}\r\n                    open={listsOpen}\r\n                    onOpenChange={setListsOpen}\r\n                >\r\n                    <Tooltip\r\n                        content={labels.listsTrigger}\r\n                        delayDuration={700}\r\n                        openOnFocus={false}\r\n                        position={'top'}\r\n                    >\r\n                        <DropdownMenu.Trigger>\r\n                            <IconButton\r\n                                type={'button'}\r\n                                icon={'lucide:list'}\r\n                                aria-label={labels.listsTrigger}\r\n                                variant={'ghost'}\r\n                                color={'primary'}\r\n                                size={'sm'}\r\n                                active={listsOpen}\r\n                                disabled={disabled}\r\n                            />\r\n                        </DropdownMenu.Trigger>\r\n                    </Tooltip>\r\n                    <DropdownMenu.Content aria-label={labels.listOptions}>\r\n                        <DropdownMenu.Item\r\n                            label={labels.bulletedList}\r\n                            startIcon={'lucide:list'}\r\n                            active={isBulletList}\r\n                            onClick={() => editor.chain().focus().toggleBulletList().run()}\r\n                        />\r\n                        <DropdownMenu.Item\r\n                            label={labels.numberedList}\r\n                            startIcon={'lucide:list-ordered'}\r\n                            active={isOrderedList}\r\n                            onClick={() => editor.chain().focus().toggleOrderedList().run()}\r\n                        />\r\n                    </DropdownMenu.Content>\r\n                </DropdownMenu>\r\n            )}\r\n        </div>\r\n    )\r\n}\r\n\r\nListsGroup.displayName = 'RichTextEditor.ListsGroup'\r\n\r\nexport default ListsGroup\r\n"],"names":["ListsGroup","presentation","editor","disabled","labels","useRichTextEditorContext","listsOpen","setListsOpen","useState","isBulletList","isOrderedList","jsx","LISTS_GROUP_STYLES","jsxs","Fragment","Tooltip","IconButton","event","DropdownMenu"],"mappings":"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"}

package/dist/components/forms/rich-text-editor/components/read-only-field/ReadOnlyField.cjs

@@ -1,2 +1,2 @@
-"use strict";require('../../../../../ui-kit147.css');require('../../../../../ui-kit34.css');require('../../../../../ui-kit.css');const e=require("react/jsx-runtime"),q=require("react"),R=require("../../../../data-display/rich-text-renderer/RichTextRenderer.cjs");;/* empty css                                                 */;/* empty css                                                                                       */const h=require("../rich-text-editor-form-field/RichTextEditorFormField.cjs");;/* empty css                                                                                 */const m=require("../../context/RichTextEditor.context.cjs"),l=q.memo(({className:d})=>{const{ariaLabel:n,ariaLabelledBy:s,error:i,helperText:o,label:t,labelId:u,helperId:c,name:a,disabled:x,renderedValue:b,editor:r}=m.useRichTextEditorContext();return r?e.jsxs(e.Fragment,{children:[e.jsx(R,{value:b,className:d,"aria-describedby":i||o?c:void 0,"aria-invalid":i?"true":void 0,"aria-label":n??t,"aria-labelledby":s??(t?u:void 0)}),a&&e.jsx(h,{name:a,value:r.isEmpty?"":JSON.stringify(r.getJSON()),disabled:x,required:!1})]}):null});l.displayName="RichTextEditor.ReadOnlyField";module.exports=l;
+"use strict";require('../../../../../ui-kit151.css');require('../../../../../ui-kit40.css');require('../../../../../ui-kit.css');const e=require("react/jsx-runtime"),q=require("react"),R=require("../../../../data-display/rich-text-renderer/RichTextRenderer.cjs");;/* empty css                                                 */;/* empty css                                                                                       */const h=require("../rich-text-editor-form-field/RichTextEditorFormField.cjs");;/* empty css                                                                                 */const m=require("../../context/RichTextEditor.context.cjs"),l=q.memo(({className:d})=>{const{ariaLabel:n,ariaLabelledBy:s,error:i,helperText:o,label:t,labelId:u,helperId:c,name:a,disabled:x,renderedValue:b,editor:r}=m.useRichTextEditorContext();return r?e.jsxs(e.Fragment,{children:[e.jsx(R,{value:b,className:d,"aria-describedby":i||o?c:void 0,"aria-invalid":i?"true":void 0,"aria-label":n??t,"aria-labelledby":s??(t?u:void 0)}),a&&e.jsx(h,{name:a,value:r.isEmpty?"":JSON.stringify(r.getJSON()),disabled:x,required:!1})]}):null});l.displayName="RichTextEditor.ReadOnlyField";module.exports=l;
 //# sourceMappingURL=ReadOnlyField.cjs.map

package/dist/components/forms/rich-text-editor/components/read-only-field/ReadOnlyField.cjs.map

@@ -1 +1 @@
-{"version":3,"file":"ReadOnlyField.cjs","sources":["../../../../../../src/components/forms/rich-text-editor/components/read-only-field/ReadOnlyField.tsx"],"sourcesContent":["import { memo, type FC } from 'react'\r\n\r\nimport { RichTextRenderer } from '@components/data-display/rich-text-renderer'\r\nimport { RichTextEditorFormField } from '@components/forms/rich-text-editor/components/rich-text-editor-form-field'\r\nimport { useRichTextEditorContext } from '@components/forms/rich-text-editor/context/RichTextEditor.context.ts'\r\nimport type { ReadOnlyFieldProps } from '@components/forms/rich-text-editor/components/read-only-field/types/ReadOnlyField.props.ts'\r\n\r\nconst ReadOnlyField: FC<ReadOnlyFieldProps> = memo(({ className }) => {\r\n    const {\r\n        ariaLabel,\r\n        ariaLabelledBy,\r\n        error,\r\n        helperText,\r\n        label,\r\n        labelId,\r\n        helperId,\r\n        name,\r\n        disabled,\r\n        renderedValue,\r\n        editor,\r\n    } = useRichTextEditorContext()\r\n\r\n    if (!editor) {\r\n        return null\r\n    }\r\n\r\n    return (\r\n        <>\r\n            <RichTextRenderer\r\n                value={renderedValue}\r\n                className={className}\r\n                aria-describedby={error || helperText ? helperId : undefined}\r\n                aria-invalid={error ? 'true' : undefined}\r\n                aria-label={ariaLabel ?? label}\r\n                aria-labelledby={ariaLabelledBy ?? (label ? labelId : undefined)}\r\n            />\r\n            {name && (\r\n                <RichTextEditorFormField\r\n                    name={name}\r\n                    value={editor.isEmpty ? '' : JSON.stringify(editor.getJSON())}\r\n                    disabled={disabled}\r\n                    required={false}\r\n                />\r\n            )}\r\n        </>\r\n    )\r\n})\r\n\r\nReadOnlyField.displayName = 'RichTextEditor.ReadOnlyField'\r\n\r\nexport default ReadOnlyField\r\n"],"names":["ReadOnlyField","memo","className","ariaLabel","ariaLabelledBy","error","helperText","label","labelId","helperId","name","disabled","renderedValue","editor","useRichTextEditorContext","jsxs","Fragment","jsx","RichTextRenderer","RichTextEditorFormField"],"mappings":"miBAOMA,EAAwCC,EAAAA,KAAK,CAAC,CAAE,UAAAC,KAAgB,CAClE,KAAM,CACF,UAAAC,EACA,eAAAC,EACA,MAAAC,EACA,WAAAC,EACA,MAAAC,EACA,QAAAC,EACA,SAAAC,EACA,KAAAC,EACA,SAAAC,EACA,cAAAC,EACA,OAAAC,CAAA,EACAC,2BAAA,EAEJ,OAAKD,EAKDE,EAAAA,KAAAC,WAAA,CACI,SAAA,CAAAC,EAAAA,IAACC,EAAA,CACG,MAAON,EACP,UAAAV,EACA,mBAAkBG,GAASC,EAAaG,EAAW,OACnD,eAAcJ,EAAQ,OAAS,OAC/B,aAAYF,GAAaI,EACzB,kBAAiBH,IAAmBG,EAAQC,EAAU,OAAA,CAAA,EAEzDE,GACGO,EAAAA,IAACE,EAAA,CACG,KAAAT,EACA,MAAOG,EAAO,QAAU,GAAK,KAAK,UAAUA,EAAO,SAAS,EAC5D,SAAAF,EACA,SAAU,EAAA,CAAA,CACd,EAER,EArBO,IAuBf,CAAC,EAEDX,EAAc,YAAc"}
+{"version":3,"file":"ReadOnlyField.cjs","sources":["../../../../../../src/components/forms/rich-text-editor/components/read-only-field/ReadOnlyField.tsx"],"sourcesContent":["import { memo, type FC } from 'react'\r\n\r\nimport { RichTextRenderer } from '@components/data-display/rich-text-renderer'\r\nimport { RichTextEditorFormField } from '@components/forms/rich-text-editor/components/rich-text-editor-form-field'\r\nimport { useRichTextEditorContext } from '@components/forms/rich-text-editor/context/RichTextEditor.context.ts'\r\nimport type { ReadOnlyFieldProps } from '@components/forms/rich-text-editor/components/read-only-field/types/ReadOnlyField.props.ts'\r\n\r\n/**\r\n * Read-only rendered view of the editor document. Uses `RichTextRenderer`\r\n * and forwards ARIA naming/description attributes from `RichTextEditor`\r\n * context. Also emits the hidden form field when `name` is set.\r\n */\r\nconst ReadOnlyField: FC<ReadOnlyFieldProps> = memo(({ className }) => {\r\n    const {\r\n        ariaLabel,\r\n        ariaLabelledBy,\r\n        error,\r\n        helperText,\r\n        label,\r\n        labelId,\r\n        helperId,\r\n        name,\r\n        disabled,\r\n        renderedValue,\r\n        editor,\r\n    } = useRichTextEditorContext()\r\n\r\n    if (!editor) {\r\n        return null\r\n    }\r\n\r\n    return (\r\n        <>\r\n            <RichTextRenderer\r\n                value={renderedValue}\r\n                className={className}\r\n                aria-describedby={error || helperText ? helperId : undefined}\r\n                aria-invalid={error ? 'true' : undefined}\r\n                aria-label={ariaLabel ?? label}\r\n                aria-labelledby={ariaLabelledBy ?? (label ? labelId : undefined)}\r\n            />\r\n            {name && (\r\n                <RichTextEditorFormField\r\n                    name={name}\r\n                    value={editor.isEmpty ? '' : JSON.stringify(editor.getJSON())}\r\n                    disabled={disabled}\r\n                    required={false}\r\n                />\r\n            )}\r\n        </>\r\n    )\r\n})\r\n\r\nReadOnlyField.displayName = 'RichTextEditor.ReadOnlyField'\r\n\r\nexport default ReadOnlyField\r\n"],"names":["ReadOnlyField","memo","className","ariaLabel","ariaLabelledBy","error","helperText","label","labelId","helperId","name","disabled","renderedValue","editor","useRichTextEditorContext","jsxs","Fragment","jsx","RichTextRenderer","RichTextEditorFormField"],"mappings":"miBAYMA,EAAwCC,EAAAA,KAAK,CAAC,CAAE,UAAAC,KAAgB,CAClE,KAAM,CACF,UAAAC,EACA,eAAAC,EACA,MAAAC,EACA,WAAAC,EACA,MAAAC,EACA,QAAAC,EACA,SAAAC,EACA,KAAAC,EACA,SAAAC,EACA,cAAAC,EACA,OAAAC,CAAA,EACAC,2BAAA,EAEJ,OAAKD,EAKDE,EAAAA,KAAAC,WAAA,CACI,SAAA,CAAAC,EAAAA,IAACC,EAAA,CACG,MAAON,EACP,UAAAV,EACA,mBAAkBG,GAASC,EAAaG,EAAW,OACnD,eAAcJ,EAAQ,OAAS,OAC/B,aAAYF,GAAaI,EACzB,kBAAiBH,IAAmBG,EAAQC,EAAU,OAAA,CAAA,EAEzDE,GACGO,EAAAA,IAACE,EAAA,CACG,KAAAT,EACA,MAAOG,EAAO,QAAU,GAAK,KAAK,UAAUA,EAAO,SAAS,EAC5D,SAAAF,EACA,SAAU,EAAA,CAAA,CACd,EAER,EArBO,IAuBf,CAAC,EAEDX,EAAc,YAAc"}

package/dist/components/forms/rich-text-editor/components/read-only-field/ReadOnlyField.d.ts

@@ -1,4 +1,9 @@
 import { FC } from 'react';
 import { ReadOnlyFieldProps } from './types/ReadOnlyField.props.ts';
+/**
+ * Read-only rendered view of the editor document. Uses `RichTextRenderer`
+ * and forwards ARIA naming/description attributes from `RichTextEditor`
+ * context. Also emits the hidden form field when `name` is set.
+ */
 declare const ReadOnlyField: FC<ReadOnlyFieldProps>;
 export default ReadOnlyField;

package/dist/components/forms/rich-text-editor/components/read-only-field/ReadOnlyField.js

@@ -1,7 +1,7 @@
 import { jsxs as u, Fragment as f, jsx as l } from "react/jsx-runtime";
 import { memo as x } from "react";
 import c from "../../../../data-display/rich-text-renderer/RichTextRenderer.js";
-import '../../../../../ui-kit147.css';import '../../../../../ui-kit34.css';import '../../../../../ui-kit.css';/* empty css                                               */
+import '../../../../../ui-kit151.css';import '../../../../../ui-kit40.css';import '../../../../../ui-kit.css';/* empty css                                               */
 /* empty css                                                                                     */
 import y from "../rich-text-editor-form-field/RichTextEditorFormField.js";
 /* empty css                                                                               */

package/dist/components/forms/rich-text-editor/components/read-only-field/ReadOnlyField.js.map

@@ -1 +1 @@
-{"version":3,"file":"ReadOnlyField.js","sources":["../../../../../../src/components/forms/rich-text-editor/components/read-only-field/ReadOnlyField.tsx"],"sourcesContent":["import { memo, type FC } from 'react'\r\n\r\nimport { RichTextRenderer } from '@components/data-display/rich-text-renderer'\r\nimport { RichTextEditorFormField } from '@components/forms/rich-text-editor/components/rich-text-editor-form-field'\r\nimport { useRichTextEditorContext } from '@components/forms/rich-text-editor/context/RichTextEditor.context.ts'\r\nimport type { ReadOnlyFieldProps } from '@components/forms/rich-text-editor/components/read-only-field/types/ReadOnlyField.props.ts'\r\n\r\nconst ReadOnlyField: FC<ReadOnlyFieldProps> = memo(({ className }) => {\r\n    const {\r\n        ariaLabel,\r\n        ariaLabelledBy,\r\n        error,\r\n        helperText,\r\n        label,\r\n        labelId,\r\n        helperId,\r\n        name,\r\n        disabled,\r\n        renderedValue,\r\n        editor,\r\n    } = useRichTextEditorContext()\r\n\r\n    if (!editor) {\r\n        return null\r\n    }\r\n\r\n    return (\r\n        <>\r\n            <RichTextRenderer\r\n                value={renderedValue}\r\n                className={className}\r\n                aria-describedby={error || helperText ? helperId : undefined}\r\n                aria-invalid={error ? 'true' : undefined}\r\n                aria-label={ariaLabel ?? label}\r\n                aria-labelledby={ariaLabelledBy ?? (label ? labelId : undefined)}\r\n            />\r\n            {name && (\r\n                <RichTextEditorFormField\r\n                    name={name}\r\n                    value={editor.isEmpty ? '' : JSON.stringify(editor.getJSON())}\r\n                    disabled={disabled}\r\n                    required={false}\r\n                />\r\n            )}\r\n        </>\r\n    )\r\n})\r\n\r\nReadOnlyField.displayName = 'RichTextEditor.ReadOnlyField'\r\n\r\nexport default ReadOnlyField\r\n"],"names":["ReadOnlyField","memo","className","ariaLabel","ariaLabelledBy","error","helperText","label","labelId","helperId","name","disabled","renderedValue","editor","useRichTextEditorContext","jsxs","Fragment","jsx","RichTextRenderer","RichTextEditorFormField"],"mappings":";;;;;;;;AAOA,MAAMA,IAAwCC,EAAK,CAAC,EAAE,WAAAC,QAAgB;AAClE,QAAM;AAAA,IACF,WAAAC;AAAA,IACA,gBAAAC;AAAA,IACA,OAAAC;AAAA,IACA,YAAAC;AAAA,IACA,OAAAC;AAAA,IACA,SAAAC;AAAA,IACA,UAAAC;AAAA,IACA,MAAAC;AAAA,IACA,UAAAC;AAAA,IACA,eAAAC;AAAA,IACA,QAAAC;AAAA,EAAA,IACAC,EAAA;AAEJ,SAAKD,IAKD,gBAAAE,EAAAC,GAAA,EACI,UAAA;AAAA,IAAA,gBAAAC;AAAA,MAACC;AAAA,MAAA;AAAA,QACG,OAAON;AAAA,QACP,WAAAV;AAAA,QACA,oBAAkBG,KAASC,IAAaG,IAAW;AAAA,QACnD,gBAAcJ,IAAQ,SAAS;AAAA,QAC/B,cAAYF,KAAaI;AAAA,QACzB,mBAAiBH,MAAmBG,IAAQC,IAAU;AAAA,MAAA;AAAA,IAAA;AAAA,IAEzDE,KACG,gBAAAO;AAAA,MAACE;AAAA,MAAA;AAAA,QACG,MAAAT;AAAA,QACA,OAAOG,EAAO,UAAU,KAAK,KAAK,UAAUA,EAAO,SAAS;AAAA,QAC5D,UAAAF;AAAA,QACA,UAAU;AAAA,MAAA;AAAA,IAAA;AAAA,EACd,GAER,IArBO;AAuBf,CAAC;AAEDX,EAAc,cAAc;"}
+{"version":3,"file":"ReadOnlyField.js","sources":["../../../../../../src/components/forms/rich-text-editor/components/read-only-field/ReadOnlyField.tsx"],"sourcesContent":["import { memo, type FC } from 'react'\r\n\r\nimport { RichTextRenderer } from '@components/data-display/rich-text-renderer'\r\nimport { RichTextEditorFormField } from '@components/forms/rich-text-editor/components/rich-text-editor-form-field'\r\nimport { useRichTextEditorContext } from '@components/forms/rich-text-editor/context/RichTextEditor.context.ts'\r\nimport type { ReadOnlyFieldProps } from '@components/forms/rich-text-editor/components/read-only-field/types/ReadOnlyField.props.ts'\r\n\r\n/**\r\n * Read-only rendered view of the editor document. Uses `RichTextRenderer`\r\n * and forwards ARIA naming/description attributes from `RichTextEditor`\r\n * context. Also emits the hidden form field when `name` is set.\r\n */\r\nconst ReadOnlyField: FC<ReadOnlyFieldProps> = memo(({ className }) => {\r\n    const {\r\n        ariaLabel,\r\n        ariaLabelledBy,\r\n        error,\r\n        helperText,\r\n        label,\r\n        labelId,\r\n        helperId,\r\n        name,\r\n        disabled,\r\n        renderedValue,\r\n        editor,\r\n    } = useRichTextEditorContext()\r\n\r\n    if (!editor) {\r\n        return null\r\n    }\r\n\r\n    return (\r\n        <>\r\n            <RichTextRenderer\r\n                value={renderedValue}\r\n                className={className}\r\n                aria-describedby={error || helperText ? helperId : undefined}\r\n                aria-invalid={error ? 'true' : undefined}\r\n                aria-label={ariaLabel ?? label}\r\n                aria-labelledby={ariaLabelledBy ?? (label ? labelId : undefined)}\r\n            />\r\n            {name && (\r\n                <RichTextEditorFormField\r\n                    name={name}\r\n                    value={editor.isEmpty ? '' : JSON.stringify(editor.getJSON())}\r\n                    disabled={disabled}\r\n                    required={false}\r\n                />\r\n            )}\r\n        </>\r\n    )\r\n})\r\n\r\nReadOnlyField.displayName = 'RichTextEditor.ReadOnlyField'\r\n\r\nexport default ReadOnlyField\r\n"],"names":["ReadOnlyField","memo","className","ariaLabel","ariaLabelledBy","error","helperText","label","labelId","helperId","name","disabled","renderedValue","editor","useRichTextEditorContext","jsxs","Fragment","jsx","RichTextRenderer","RichTextEditorFormField"],"mappings":";;;;;;;;AAYA,MAAMA,IAAwCC,EAAK,CAAC,EAAE,WAAAC,QAAgB;AAClE,QAAM;AAAA,IACF,WAAAC;AAAA,IACA,gBAAAC;AAAA,IACA,OAAAC;AAAA,IACA,YAAAC;AAAA,IACA,OAAAC;AAAA,IACA,SAAAC;AAAA,IACA,UAAAC;AAAA,IACA,MAAAC;AAAA,IACA,UAAAC;AAAA,IACA,eAAAC;AAAA,IACA,QAAAC;AAAA,EAAA,IACAC,EAAA;AAEJ,SAAKD,IAKD,gBAAAE,EAAAC,GAAA,EACI,UAAA;AAAA,IAAA,gBAAAC;AAAA,MAACC;AAAA,MAAA;AAAA,QACG,OAAON;AAAA,QACP,WAAAV;AAAA,QACA,oBAAkBG,KAASC,IAAaG,IAAW;AAAA,QACnD,gBAAcJ,IAAQ,SAAS;AAAA,QAC/B,cAAYF,KAAaI;AAAA,QACzB,mBAAiBH,MAAmBG,IAAQC,IAAU;AAAA,MAAA;AAAA,IAAA;AAAA,IAEzDE,KACG,gBAAAO;AAAA,MAACE;AAAA,MAAA;AAAA,QACG,MAAAT;AAAA,QACA,OAAOG,EAAO,UAAU,KAAK,KAAK,UAAUA,EAAO,SAAS;AAAA,QAC5D,UAAAF;AAAA,QACA,UAAU;AAAA,MAAA;AAAA,IAAA;AAAA,EACd,GAER,IArBO;AAuBf,CAAC;AAEDX,EAAc,cAAc;"}

package/dist/components/forms/rich-text-editor/components/rich-text-editor-form-field/styles/RichTextEditorFormField.css.cjs

@@ -1,2 +1,2 @@
-"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});require('../../../../../../ui-kit147.css');;/* empty css                                             */var _={root:"rsin5k0"};exports.RICH_TEXT_EDITOR_FORM_FIELD_STYLES=_;
+"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});require('../../../../../../ui-kit151.css');;/* empty css                                             */var _={root:"rsin5k0"};exports.RICH_TEXT_EDITOR_FORM_FIELD_STYLES=_;
 //# sourceMappingURL=RichTextEditorFormField.css.cjs.map

package/dist/components/forms/rich-text-editor/components/rich-text-editor-form-field/styles/RichTextEditorFormField.css.js

@@ -1,4 +1,4 @@
-import '../../../../../../ui-kit147.css';/* empty css                                           */
+import '../../../../../../ui-kit151.css';/* empty css                                           */
 var _ = { root: "rsin5k0" };
 export {
   _ as RICH_TEXT_EDITOR_FORM_FIELD_STYLES

package/dist/components/forms/rich-text-editor/components/rich-text-editor-label/RichTextEditorLabel.cjs.map

@@ -1 +1 @@
-{"version":3,"file":"RichTextEditorLabel.cjs","sources":["../../../../../../src/components/forms/rich-text-editor/components/rich-text-editor-label/RichTextEditorLabel.tsx"],"sourcesContent":["import { memo, useContext, type FC } from 'react'\r\n\r\nimport { RICH_TEXT_EDITOR_LABEL_STYLES } from '@components/forms/rich-text-editor/components/rich-text-editor-label/styles/RichTextEditorLabel.css.ts'\r\nimport type { RichTextEditorLabelProps } from '@components/forms/rich-text-editor/components/rich-text-editor-label/types/RichTextEditorLabel.props.ts'\r\nimport { RichTextEditorContext } from '@components/forms/rich-text-editor/context/RichTextEditor.context.ts'\r\n\r\nconst RichTextEditorLabel: FC<RichTextEditorLabelProps> = memo(({ id, disabled, children }) => {\r\n    const context = useContext(RichTextEditorContext)\r\n    const resolvedId = id ?? context?.labelId\r\n\r\n    return (\r\n        <label\r\n            id={resolvedId}\r\n            className={RICH_TEXT_EDITOR_LABEL_STYLES.root}\r\n            data-disabled={disabled ? '' : undefined}\r\n        >\r\n            {children}\r\n        </label>\r\n    )\r\n})\r\n\r\nRichTextEditorLabel.displayName = 'RichTextEditor.Label'\r\n\r\nexport default RichTextEditorLabel\r\n"],"names":["RichTextEditorLabel","memo","id","disabled","children","context","useContext","RichTextEditorContext","resolvedId","jsx","RICH_TEXT_EDITOR_LABEL_STYLES"],"mappings":"6KAMMA,EAAoDC,EAAAA,KAAK,CAAC,CAAE,GAAAC,EAAI,SAAAC,EAAU,SAAAC,KAAe,CAC3F,MAAMC,EAAUC,EAAAA,WAAWC,uBAAqB,EAC1CC,EAAaN,GAAMG,GAAS,QAElC,OACII,EAAAA,IAAC,QAAA,CACG,GAAID,EACJ,UAAWE,EAAAA,8BAA8B,KACzC,gBAAeP,EAAW,GAAK,OAE9B,SAAAC,CAAA,CAAA,CAGb,CAAC,EAEDJ,EAAoB,YAAc"}
+{"version":3,"file":"RichTextEditorLabel.cjs","sources":["../../../../../../src/components/forms/rich-text-editor/components/rich-text-editor-label/RichTextEditorLabel.tsx"],"sourcesContent":["import { memo, useContext, type FC } from 'react'\r\n\r\nimport { RICH_TEXT_EDITOR_LABEL_STYLES } from '@components/forms/rich-text-editor/components/rich-text-editor-label/styles/RichTextEditorLabel.css.ts'\r\nimport type { RichTextEditorLabelProps } from '@components/forms/rich-text-editor/components/rich-text-editor-label/types/RichTextEditorLabel.props.ts'\r\nimport { RichTextEditorContext } from '@components/forms/rich-text-editor/context/RichTextEditor.context.ts'\r\n\r\n/**\r\n * Visible `<label>` for the rich-text editor field. Reads `labelId` from\r\n * the `RichTextEditor` context to link the label to the editor control.\r\n */\r\nconst RichTextEditorLabel: FC<RichTextEditorLabelProps> = memo(({ id, disabled, children }) => {\r\n    const context = useContext(RichTextEditorContext)\r\n    const resolvedId = id ?? context?.labelId\r\n\r\n    return (\r\n        <label\r\n            id={resolvedId}\r\n            className={RICH_TEXT_EDITOR_LABEL_STYLES.root}\r\n            data-disabled={disabled ? '' : undefined}\r\n        >\r\n            {children}\r\n        </label>\r\n    )\r\n})\r\n\r\nRichTextEditorLabel.displayName = 'RichTextEditor.Label'\r\n\r\nexport default RichTextEditorLabel\r\n"],"names":["RichTextEditorLabel","memo","id","disabled","children","context","useContext","RichTextEditorContext","resolvedId","jsx","RICH_TEXT_EDITOR_LABEL_STYLES"],"mappings":"6KAUMA,EAAoDC,EAAAA,KAAK,CAAC,CAAE,GAAAC,EAAI,SAAAC,EAAU,SAAAC,KAAe,CAC3F,MAAMC,EAAUC,EAAAA,WAAWC,uBAAqB,EAC1CC,EAAaN,GAAMG,GAAS,QAElC,OACII,EAAAA,IAAC,QAAA,CACG,GAAID,EACJ,UAAWE,EAAAA,8BAA8B,KACzC,gBAAeP,EAAW,GAAK,OAE9B,SAAAC,CAAA,CAAA,CAGb,CAAC,EAEDJ,EAAoB,YAAc"}

package/dist/components/forms/rich-text-editor/components/rich-text-editor-label/RichTextEditorLabel.d.ts

@@ -1,4 +1,8 @@
 import { FC } from 'react';
 import { RichTextEditorLabelProps } from './types/RichTextEditorLabel.props.ts';
+/**
+ * Visible `<label>` for the rich-text editor field. Reads `labelId` from
+ * the `RichTextEditor` context to link the label to the editor control.
+ */
 declare const RichTextEditorLabel: FC<RichTextEditorLabelProps>;
 export default RichTextEditorLabel;

package/dist/components/forms/rich-text-editor/components/rich-text-editor-label/RichTextEditorLabel.js.map

@@ -1 +1 @@
-{"version":3,"file":"RichTextEditorLabel.js","sources":["../../../../../../src/components/forms/rich-text-editor/components/rich-text-editor-label/RichTextEditorLabel.tsx"],"sourcesContent":["import { memo, useContext, type FC } from 'react'\r\n\r\nimport { RICH_TEXT_EDITOR_LABEL_STYLES } from '@components/forms/rich-text-editor/components/rich-text-editor-label/styles/RichTextEditorLabel.css.ts'\r\nimport type { RichTextEditorLabelProps } from '@components/forms/rich-text-editor/components/rich-text-editor-label/types/RichTextEditorLabel.props.ts'\r\nimport { RichTextEditorContext } from '@components/forms/rich-text-editor/context/RichTextEditor.context.ts'\r\n\r\nconst RichTextEditorLabel: FC<RichTextEditorLabelProps> = memo(({ id, disabled, children }) => {\r\n    const context = useContext(RichTextEditorContext)\r\n    const resolvedId = id ?? context?.labelId\r\n\r\n    return (\r\n        <label\r\n            id={resolvedId}\r\n            className={RICH_TEXT_EDITOR_LABEL_STYLES.root}\r\n            data-disabled={disabled ? '' : undefined}\r\n        >\r\n            {children}\r\n        </label>\r\n    )\r\n})\r\n\r\nRichTextEditorLabel.displayName = 'RichTextEditor.Label'\r\n\r\nexport default RichTextEditorLabel\r\n"],"names":["RichTextEditorLabel","memo","id","disabled","children","context","useContext","RichTextEditorContext","resolvedId","jsx","RICH_TEXT_EDITOR_LABEL_STYLES"],"mappings":";;;;AAMA,MAAMA,IAAoDC,EAAK,CAAC,EAAE,IAAAC,GAAI,UAAAC,GAAU,UAAAC,QAAe;AAC3F,QAAMC,IAAUC,EAAWC,CAAqB,GAC1CC,IAAaN,KAAMG,GAAS;AAElC,SACI,gBAAAI;AAAA,IAAC;AAAA,IAAA;AAAA,MACG,IAAID;AAAA,MACJ,WAAWE,EAA8B;AAAA,MACzC,iBAAeP,IAAW,KAAK;AAAA,MAE9B,UAAAC;AAAA,IAAA;AAAA,EAAA;AAGb,CAAC;AAEDJ,EAAoB,cAAc;"}
+{"version":3,"file":"RichTextEditorLabel.js","sources":["../../../../../../src/components/forms/rich-text-editor/components/rich-text-editor-label/RichTextEditorLabel.tsx"],"sourcesContent":["import { memo, useContext, type FC } from 'react'\r\n\r\nimport { RICH_TEXT_EDITOR_LABEL_STYLES } from '@components/forms/rich-text-editor/components/rich-text-editor-label/styles/RichTextEditorLabel.css.ts'\r\nimport type { RichTextEditorLabelProps } from '@components/forms/rich-text-editor/components/rich-text-editor-label/types/RichTextEditorLabel.props.ts'\r\nimport { RichTextEditorContext } from '@components/forms/rich-text-editor/context/RichTextEditor.context.ts'\r\n\r\n/**\r\n * Visible `<label>` for the rich-text editor field. Reads `labelId` from\r\n * the `RichTextEditor` context to link the label to the editor control.\r\n */\r\nconst RichTextEditorLabel: FC<RichTextEditorLabelProps> = memo(({ id, disabled, children }) => {\r\n    const context = useContext(RichTextEditorContext)\r\n    const resolvedId = id ?? context?.labelId\r\n\r\n    return (\r\n        <label\r\n            id={resolvedId}\r\n            className={RICH_TEXT_EDITOR_LABEL_STYLES.root}\r\n            data-disabled={disabled ? '' : undefined}\r\n        >\r\n            {children}\r\n        </label>\r\n    )\r\n})\r\n\r\nRichTextEditorLabel.displayName = 'RichTextEditor.Label'\r\n\r\nexport default RichTextEditorLabel\r\n"],"names":["RichTextEditorLabel","memo","id","disabled","children","context","useContext","RichTextEditorContext","resolvedId","jsx","RICH_TEXT_EDITOR_LABEL_STYLES"],"mappings":";;;;AAUA,MAAMA,IAAoDC,EAAK,CAAC,EAAE,IAAAC,GAAI,UAAAC,GAAU,UAAAC,QAAe;AAC3F,QAAMC,IAAUC,EAAWC,CAAqB,GAC1CC,IAAaN,KAAMG,GAAS;AAElC,SACI,gBAAAI;AAAA,IAAC;AAAA,IAAA;AAAA,MACG,IAAID;AAAA,MACJ,WAAWE,EAA8B;AAAA,MACzC,iBAAeP,IAAW,KAAK;AAAA,MAE9B,UAAAC;AAAA,IAAA;AAAA,EAAA;AAGb,CAAC;AAEDJ,EAAoB,cAAc;"}

package/dist/components/forms/rich-text-editor/components/rich-text-editor-label/styles/RichTextEditorLabel.css.cjs

@@ -1,2 +1,2 @@
-"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});require('../../../../../../ui-kit105.css');require('../../../../../../ui-kit2.css');require('../../../../../../ui-kit.css');;/* empty css                                                    */;/* empty css                                                        */;/* empty css                                         */var e={root:"_9mb6yy0"};exports.RICH_TEXT_EDITOR_LABEL_STYLES=e;
+"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});require('../../../../../../ui-kit103.css');require('../../../../../../ui-kit2.css');require('../../../../../../ui-kit.css');;/* empty css                                                    */;/* empty css                                                        */;/* empty css                                         */var e={root:"_9mb6yy0"};exports.RICH_TEXT_EDITOR_LABEL_STYLES=e;
 //# sourceMappingURL=RichTextEditorLabel.css.cjs.map

package/dist/components/forms/rich-text-editor/components/rich-text-editor-label/styles/RichTextEditorLabel.css.js

@@ -1,4 +1,4 @@
-import '../../../../../../ui-kit105.css';import '../../../../../../ui-kit2.css';import '../../../../../../ui-kit.css';/* empty css                                                  */
+import '../../../../../../ui-kit103.css';import '../../../../../../ui-kit2.css';import '../../../../../../ui-kit.css';/* empty css                                                  */
 /* empty css                                                      */
 /* empty css                                       */
 var _ = { root: "_9mb6yy0" };

package/dist/components/forms/rich-text-editor/components/text-appearance-group/TextAppearanceGroup.cjs.map

@@ -1 +1 @@
-{"version":3,"file":"TextAppearanceGroup.cjs","sources":["../../../../../../src/components/forms/rich-text-editor/components/text-appearance-group/TextAppearanceGroup.tsx"],"sourcesContent":["import type { FC } from 'react'\r\n\r\nimport TextColorMenu from '@components/forms/rich-text-editor/components/text-appearance-group/TextColorMenu.tsx'\r\nimport TextSizeMenu from '@components/forms/rich-text-editor/components/text-appearance-group/TextSizeMenu.tsx'\r\nimport { TEXT_APPEARANCE_GROUP_STYLES } from '@components/forms/rich-text-editor/components/text-appearance-group/styles/TextAppearanceGroup.css.ts'\r\nimport { useRichTextEditorContext } from '@components/forms/rich-text-editor/context/RichTextEditor.context.ts'\r\nimport type { TextSizeMenuProps } from '@components/forms/rich-text-editor/components/text-appearance-group/types/TextSizeMenu.props.ts'\r\n\r\ntype TextAppearanceGroupCompound = FC & {\r\n    TextColorMenu: typeof TextColorMenu\r\n    TextSizeMenu: FC<TextSizeMenuProps>\r\n}\r\n\r\nconst TextAppearanceGroup = (() => {\r\n    const { labels } = useRichTextEditorContext()\r\n\r\n    return (\r\n        <div\r\n            className={TEXT_APPEARANCE_GROUP_STYLES.root}\r\n            role={'group'}\r\n            aria-label={labels.textAppearanceGroup}\r\n        >\r\n            <TextColorMenu />\r\n            <TextSizeMenu />\r\n        </div>\r\n    )\r\n}) as unknown as TextAppearanceGroupCompound\r\n\r\nTextAppearanceGroup.displayName = 'RichTextEditor.TextAppearanceGroup'\r\nTextAppearanceGroup.TextColorMenu = TextColorMenu\r\nTextAppearanceGroup.TextSizeMenu = TextSizeMenu\r\n\r\nexport default TextAppearanceGroup\r\nexport type { TextAppearanceGroupCompound }\r\n"],"names":["TextAppearanceGroup","labels","useRichTextEditorContext","jsxs","TEXT_APPEARANCE_GROUP_STYLES","jsx","TextColorMenu","TextSizeMenu"],"mappings":"2NAaMA,GAAuB,IAAM,CAC/B,KAAM,CAAE,OAAAC,CAAA,EAAWC,2BAAA,EAEnB,OACIC,EAAAA,KAAC,MAAA,CACG,UAAWC,EAAAA,6BAA6B,KACxC,KAAM,QACN,aAAYH,EAAO,oBAEnB,SAAA,CAAAI,EAAAA,IAACC,EAAA,EAAc,QACdC,EAAA,CAAA,CAAa,CAAA,CAAA,CAAA,CAG1B,GAEAP,EAAoB,YAAc,qCAClCA,EAAoB,cAAgBM,EACpCN,EAAoB,aAAeO"}
+{"version":3,"file":"TextAppearanceGroup.cjs","sources":["../../../../../../src/components/forms/rich-text-editor/components/text-appearance-group/TextAppearanceGroup.tsx"],"sourcesContent":["import type { FC } from 'react'\r\n\r\nimport TextColorMenu from '@components/forms/rich-text-editor/components/text-appearance-group/TextColorMenu.tsx'\r\nimport TextSizeMenu from '@components/forms/rich-text-editor/components/text-appearance-group/TextSizeMenu.tsx'\r\nimport { TEXT_APPEARANCE_GROUP_STYLES } from '@components/forms/rich-text-editor/components/text-appearance-group/styles/TextAppearanceGroup.css.ts'\r\nimport { useRichTextEditorContext } from '@components/forms/rich-text-editor/context/RichTextEditor.context.ts'\r\nimport type { TextSizeMenuProps } from '@components/forms/rich-text-editor/components/text-appearance-group/types/TextSizeMenu.props.ts'\r\n\r\ntype TextAppearanceGroupCompound = FC & {\r\n    TextColorMenu: typeof TextColorMenu\r\n    TextSizeMenu: FC<TextSizeMenuProps>\r\n}\r\n\r\n/**\r\n * Toolbar group that combines `TextColorMenu` and `TextSizeMenu` controls\r\n * for text appearance. Renders a `role=\"group\"` with an aria-label from\r\n * the editor's label context.\r\n *\r\n * Compound sub-components: `TextAppearanceGroup.TextColorMenu`,\r\n * `TextAppearanceGroup.TextSizeMenu`.\r\n */\r\nconst TextAppearanceGroup = (() => {\r\n    const { labels } = useRichTextEditorContext()\r\n\r\n    return (\r\n        <div\r\n            className={TEXT_APPEARANCE_GROUP_STYLES.root}\r\n            role={'group'}\r\n            aria-label={labels.textAppearanceGroup}\r\n        >\r\n            <TextColorMenu />\r\n            <TextSizeMenu />\r\n        </div>\r\n    )\r\n}) as unknown as TextAppearanceGroupCompound\r\n\r\nTextAppearanceGroup.displayName = 'RichTextEditor.TextAppearanceGroup'\r\nTextAppearanceGroup.TextColorMenu = TextColorMenu\r\nTextAppearanceGroup.TextSizeMenu = TextSizeMenu\r\n\r\nexport default TextAppearanceGroup\r\nexport type { TextAppearanceGroupCompound }\r\n"],"names":["TextAppearanceGroup","labels","useRichTextEditorContext","jsxs","TEXT_APPEARANCE_GROUP_STYLES","jsx","TextColorMenu","TextSizeMenu"],"mappings":"2NAqBMA,GAAuB,IAAM,CAC/B,KAAM,CAAE,OAAAC,CAAA,EAAWC,2BAAA,EAEnB,OACIC,EAAAA,KAAC,MAAA,CACG,UAAWC,EAAAA,6BAA6B,KACxC,KAAM,QACN,aAAYH,EAAO,oBAEnB,SAAA,CAAAI,EAAAA,IAACC,EAAA,EAAc,QACdC,EAAA,CAAA,CAAa,CAAA,CAAA,CAAA,CAG1B,GAEAP,EAAoB,YAAc,qCAClCA,EAAoB,cAAgBM,EACpCN,EAAoB,aAAeO"}

package/dist/components/forms/rich-text-editor/components/text-appearance-group/TextAppearanceGroup.d.ts

@@ -5,6 +5,14 @@ type TextAppearanceGroupCompound = FC & {
     TextColorMenu: typeof TextColorMenu;
     TextSizeMenu: FC<TextSizeMenuProps>;
 };
+/**
+ * Toolbar group that combines `TextColorMenu` and `TextSizeMenu` controls
+ * for text appearance. Renders a `role="group"` with an aria-label from
+ * the editor's label context.
+ *
+ * Compound sub-components: `TextAppearanceGroup.TextColorMenu`,
+ * `TextAppearanceGroup.TextSizeMenu`.
+ */
 declare const TextAppearanceGroup: TextAppearanceGroupCompound;
 export default TextAppearanceGroup;
 export type { TextAppearanceGroupCompound };

package/dist/components/forms/rich-text-editor/components/text-appearance-group/TextAppearanceGroup.js.map

@@ -1 +1 @@
-{"version":3,"file":"TextAppearanceGroup.js","sources":["../../../../../../src/components/forms/rich-text-editor/components/text-appearance-group/TextAppearanceGroup.tsx"],"sourcesContent":["import type { FC } from 'react'\r\n\r\nimport TextColorMenu from '@components/forms/rich-text-editor/components/text-appearance-group/TextColorMenu.tsx'\r\nimport TextSizeMenu from '@components/forms/rich-text-editor/components/text-appearance-group/TextSizeMenu.tsx'\r\nimport { TEXT_APPEARANCE_GROUP_STYLES } from '@components/forms/rich-text-editor/components/text-appearance-group/styles/TextAppearanceGroup.css.ts'\r\nimport { useRichTextEditorContext } from '@components/forms/rich-text-editor/context/RichTextEditor.context.ts'\r\nimport type { TextSizeMenuProps } from '@components/forms/rich-text-editor/components/text-appearance-group/types/TextSizeMenu.props.ts'\r\n\r\ntype TextAppearanceGroupCompound = FC & {\r\n    TextColorMenu: typeof TextColorMenu\r\n    TextSizeMenu: FC<TextSizeMenuProps>\r\n}\r\n\r\nconst TextAppearanceGroup = (() => {\r\n    const { labels } = useRichTextEditorContext()\r\n\r\n    return (\r\n        <div\r\n            className={TEXT_APPEARANCE_GROUP_STYLES.root}\r\n            role={'group'}\r\n            aria-label={labels.textAppearanceGroup}\r\n        >\r\n            <TextColorMenu />\r\n            <TextSizeMenu />\r\n        </div>\r\n    )\r\n}) as unknown as TextAppearanceGroupCompound\r\n\r\nTextAppearanceGroup.displayName = 'RichTextEditor.TextAppearanceGroup'\r\nTextAppearanceGroup.TextColorMenu = TextColorMenu\r\nTextAppearanceGroup.TextSizeMenu = TextSizeMenu\r\n\r\nexport default TextAppearanceGroup\r\nexport type { TextAppearanceGroupCompound }\r\n"],"names":["TextAppearanceGroup","labels","useRichTextEditorContext","jsxs","TEXT_APPEARANCE_GROUP_STYLES","jsx","TextColorMenu","TextSizeMenu"],"mappings":";;;;;AAaA,MAAMA,KAAuB,MAAM;AAC/B,QAAM,EAAE,QAAAC,EAAA,IAAWC,EAAA;AAEnB,SACI,gBAAAC;AAAA,IAAC;AAAA,IAAA;AAAA,MACG,WAAWC,EAA6B;AAAA,MACxC,MAAM;AAAA,MACN,cAAYH,EAAO;AAAA,MAEnB,UAAA;AAAA,QAAA,gBAAAI,EAACC,GAAA,EAAc;AAAA,0BACdC,GAAA,CAAA,CAAa;AAAA,MAAA;AAAA,IAAA;AAAA,EAAA;AAG1B;AAEAP,EAAoB,cAAc;AAClCA,EAAoB,gBAAgBM;AACpCN,EAAoB,eAAeO;"}
+{"version":3,"file":"TextAppearanceGroup.js","sources":["../../../../../../src/components/forms/rich-text-editor/components/text-appearance-group/TextAppearanceGroup.tsx"],"sourcesContent":["import type { FC } from 'react'\r\n\r\nimport TextColorMenu from '@components/forms/rich-text-editor/components/text-appearance-group/TextColorMenu.tsx'\r\nimport TextSizeMenu from '@components/forms/rich-text-editor/components/text-appearance-group/TextSizeMenu.tsx'\r\nimport { TEXT_APPEARANCE_GROUP_STYLES } from '@components/forms/rich-text-editor/components/text-appearance-group/styles/TextAppearanceGroup.css.ts'\r\nimport { useRichTextEditorContext } from '@components/forms/rich-text-editor/context/RichTextEditor.context.ts'\r\nimport type { TextSizeMenuProps } from '@components/forms/rich-text-editor/components/text-appearance-group/types/TextSizeMenu.props.ts'\r\n\r\ntype TextAppearanceGroupCompound = FC & {\r\n    TextColorMenu: typeof TextColorMenu\r\n    TextSizeMenu: FC<TextSizeMenuProps>\r\n}\r\n\r\n/**\r\n * Toolbar group that combines `TextColorMenu` and `TextSizeMenu` controls\r\n * for text appearance. Renders a `role=\"group\"` with an aria-label from\r\n * the editor's label context.\r\n *\r\n * Compound sub-components: `TextAppearanceGroup.TextColorMenu`,\r\n * `TextAppearanceGroup.TextSizeMenu`.\r\n */\r\nconst TextAppearanceGroup = (() => {\r\n    const { labels } = useRichTextEditorContext()\r\n\r\n    return (\r\n        <div\r\n            className={TEXT_APPEARANCE_GROUP_STYLES.root}\r\n            role={'group'}\r\n            aria-label={labels.textAppearanceGroup}\r\n        >\r\n            <TextColorMenu />\r\n            <TextSizeMenu />\r\n        </div>\r\n    )\r\n}) as unknown as TextAppearanceGroupCompound\r\n\r\nTextAppearanceGroup.displayName = 'RichTextEditor.TextAppearanceGroup'\r\nTextAppearanceGroup.TextColorMenu = TextColorMenu\r\nTextAppearanceGroup.TextSizeMenu = TextSizeMenu\r\n\r\nexport default TextAppearanceGroup\r\nexport type { TextAppearanceGroupCompound }\r\n"],"names":["TextAppearanceGroup","labels","useRichTextEditorContext","jsxs","TEXT_APPEARANCE_GROUP_STYLES","jsx","TextColorMenu","TextSizeMenu"],"mappings":";;;;;AAqBA,MAAMA,KAAuB,MAAM;AAC/B,QAAM,EAAE,QAAAC,EAAA,IAAWC,EAAA;AAEnB,SACI,gBAAAC;AAAA,IAAC;AAAA,IAAA;AAAA,MACG,WAAWC,EAA6B;AAAA,MACxC,MAAM;AAAA,MACN,cAAYH,EAAO;AAAA,MAEnB,UAAA;AAAA,QAAA,gBAAAI,EAACC,GAAA,EAAc;AAAA,0BACdC,GAAA,CAAA,CAAa;AAAA,MAAA;AAAA,IAAA;AAAA,EAAA;AAG1B;AAEAP,EAAoB,cAAc;AAClCA,EAAoB,gBAAgBM;AACpCN,EAAoB,eAAeO;"}

package/dist/components/forms/rich-text-editor/components/text-appearance-group/TextColorMenu.cjs

@@ -1,2 +1,2 @@
-"use strict";require('../../../../../ui-kit95.css');require('../../../../../ui-kit14.css');require('../../../../../ui-kit8.css');require('../../../../../ui-kit12.css');require('../../../../../ui-kit6.css');require('../../../../../ui-kit5.css');require('../../../../../ui-kit3.css');require('../../../../../ui-kit4.css');require('../../../../../ui-kit7.css');require('../../../../../ui-kit10.css');require('../../../../../ui-kit13.css');require('../../../../../ui-kit9.css');require('../../../../../ui-kit11.css');require('../../../../../ui-kit62.css');require('../../../../../ui-kit.css');const r=require("react/jsx-runtime"),O=require("../../../../actions/icon-button/IconButton.cjs");require("../../../../actions/icon-button/styles/IconButton.css.cjs");const f=require("../../../../overlay/tooltip/Tooltip.cjs");require("../../../../overlay/tooltip/components/tooltip-provider/TooltipProvider.cjs");;/* empty css                                                 */;/* empty css                                                              */const S=require("../../../../foundation/icon/Icon.cjs");require("../../../../foundation/icon/styles/Icon.css.cjs");const T=require("../../../../overlay/popover/Popover.cjs");;/* empty css                                                                   */;/* empty css                                                                    */;/* empty css                                                                            */;/* empty css                                                                         */;/* empty css                                                                          */;/* empty css                                                                       */;/* empty css                                                                        */;/* empty css                                                                          */;/* empty css                                                                           */;/* empty css                                                                         */;/* empty css                                                                          */;/* empty css                                                                          */;/* empty css                                                                                        */const C=require("../../constants/richTextColorPalettes.const.cjs"),L=require("../../context/RichTextEditor.context.cjs"),n=require("./styles/TextColorMenu.css.cjs"),R=require("../../../../../theme/contract.css.cjs"),c=require("react"),x=()=>{const d=c.useRef([]),[E,_]=c.useState(!1),{editor:u,disabled:m,labels:l}=L.useRichTextEditorContext(),h=c.useCallback((e,o)=>{d.current[e*3+o]?.focus()},[]),p=c.useCallback((e,o,s)=>{let t=o,i=s;if(e.key==="ArrowRight")t=Math.min(o+1,C.RICH_TEXT_COLOR_PALETTES.length-1);else if(e.key==="ArrowLeft")t=Math.max(o-1,0);else if(e.key==="ArrowDown")i=Math.min(s+1,2);else if(e.key==="ArrowUp")i=Math.max(s-1,0);else if(e.key==="Home")t=0;else if(e.key==="End")t=C.RICH_TEXT_COLOR_PALETTES.length-1;else return;e.preventDefault(),h(t,i)},[h]);if(!u)return null;const q=u.getAttributes("textStyle").color??R.vars.editorColors.neutral.dark;return r.jsxs(T,{open:E,onOpenChange:_,children:[r.jsx(f,{content:l.textColorTrigger,delayDuration:700,openOnFocus:!1,position:"top",children:r.jsx(T.Trigger,{children:r.jsx(O,{type:"button","aria-label":l.textColorTrigger,variant:"ghost",color:"primary",size:"sm",active:E,disabled:m,onMouseDown:e=>e.preventDefault(),children:r.jsx("span",{className:n.TEXT_COLOR_MENU_STYLES.selectedColor,style:{backgroundColor:q}})})})}),r.jsx(T.Content,{"aria-label":l.textColorPalette,side:"bottom",align:"start",children:r.jsx("div",{className:n.TEXT_COLOR_MENU_STYLES.colorPicker,children:r.jsx("div",{className:n.TEXT_COLOR_MENU_STYLES.paletteGrid,children:C.RICH_TEXT_COLOR_PALETTES.map((e,o)=>r.jsx("div",{className:n.TEXT_COLOR_MENU_STYLES.paletteColumn,role:"group","aria-label":l.textColorGroup(e.name),children:e.colors.map((s,t)=>{const i=q===s;return r.jsx("button",{ref:a=>{d.current[o*3+t]=a},type:"button",className:n.TEXT_COLOR_MENU_STYLES.colorSwatch,style:{backgroundColor:s},"aria-label":l.textColorSwatch(e.name,t),"aria-pressed":i,"data-selected":i||void 0,tabIndex:o===0&&t===0?0:-1,onKeyDown:a=>p(a,o,t),onMouseDown:a=>a.preventDefault(),onClick:()=>{u.chain().focus().setColor(s).run(),_(!1)},children:i&&r.jsx("span",{className:n.TEXT_COLOR_MENU_STYLES.colorCheck,children:r.jsx(S,{icon:"lucide:check",size:"sm"})})},s)})},e.name))})})})]})};x.displayName="RichTextEditor.TextAppearanceGroup.TextColorMenu";module.exports=x;
+"use strict";require('../../../../../ui-kit86.css');require('../../../../../ui-kit12.css');require('../../../../../ui-kit11.css');require('../../../../../ui-kit14.css');require('../../../../../ui-kit9.css');require('../../../../../ui-kit3.css');require('../../../../../ui-kit7.css');require('../../../../../ui-kit13.css');require('../../../../../ui-kit10.css');require('../../../../../ui-kit6.css');require('../../../../../ui-kit4.css');require('../../../../../ui-kit8.css');require('../../../../../ui-kit5.css');require('../../../../../ui-kit54.css');require('../../../../../ui-kit.css');const r=require("react/jsx-runtime"),O=require("../../../../actions/icon-button/IconButton.cjs");require("../../../../actions/icon-button/styles/IconButton.css.cjs");const f=require("../../../../overlay/tooltip/Tooltip.cjs");require("../../../../overlay/tooltip/components/tooltip-provider/TooltipProvider.cjs");;/* empty css                                                 */;/* empty css                                                              */const S=require("../../../../foundation/icon/Icon.cjs");require("../../../../foundation/icon/styles/Icon.css.cjs");const T=require("../../../../overlay/popover/Popover.cjs");;/* empty css                                                                   */;/* empty css                                                                    */;/* empty css                                                                            */;/* empty css                                                                         */;/* empty css                                                                          */;/* empty css                                                                       */;/* empty css                                                                        */;/* empty css                                                                          */;/* empty css                                                                           */;/* empty css                                                                         */;/* empty css                                                                          */;/* empty css                                                                          */;/* empty css                                                                                        */const C=require("../../constants/richTextColorPalettes.const.cjs"),L=require("../../context/RichTextEditor.context.cjs"),n=require("./styles/TextColorMenu.css.cjs"),R=require("../../../../../theme/contract.css.cjs"),c=require("react"),x=()=>{const d=c.useRef([]),[E,_]=c.useState(!1),{editor:u,disabled:m,labels:l}=L.useRichTextEditorContext(),h=c.useCallback((e,o)=>{d.current[e*3+o]?.focus()},[]),p=c.useCallback((e,o,s)=>{let t=o,i=s;if(e.key==="ArrowRight")t=Math.min(o+1,C.RICH_TEXT_COLOR_PALETTES.length-1);else if(e.key==="ArrowLeft")t=Math.max(o-1,0);else if(e.key==="ArrowDown")i=Math.min(s+1,2);else if(e.key==="ArrowUp")i=Math.max(s-1,0);else if(e.key==="Home")t=0;else if(e.key==="End")t=C.RICH_TEXT_COLOR_PALETTES.length-1;else return;e.preventDefault(),h(t,i)},[h]);if(!u)return null;const q=u.getAttributes("textStyle").color??R.vars.editorColors.neutral.dark;return r.jsxs(T,{open:E,onOpenChange:_,children:[r.jsx(f,{content:l.textColorTrigger,delayDuration:700,openOnFocus:!1,position:"top",children:r.jsx(T.Trigger,{children:r.jsx(O,{type:"button","aria-label":l.textColorTrigger,variant:"ghost",color:"primary",size:"sm",active:E,disabled:m,onMouseDown:e=>e.preventDefault(),children:r.jsx("span",{className:n.TEXT_COLOR_MENU_STYLES.selectedColor,style:{backgroundColor:q}})})})}),r.jsx(T.Content,{"aria-label":l.textColorPalette,side:"bottom",align:"start",children:r.jsx("div",{className:n.TEXT_COLOR_MENU_STYLES.colorPicker,children:r.jsx("div",{className:n.TEXT_COLOR_MENU_STYLES.paletteGrid,children:C.RICH_TEXT_COLOR_PALETTES.map((e,o)=>r.jsx("div",{className:n.TEXT_COLOR_MENU_STYLES.paletteColumn,role:"group","aria-label":l.textColorGroup(e.name),children:e.colors.map((s,t)=>{const i=q===s;return r.jsx("button",{ref:a=>{d.current[o*3+t]=a},type:"button",className:n.TEXT_COLOR_MENU_STYLES.colorSwatch,style:{backgroundColor:s},"aria-label":l.textColorSwatch(e.name,t),"aria-pressed":i,"data-selected":i||void 0,tabIndex:o===0&&t===0?0:-1,onKeyDown:a=>p(a,o,t),onMouseDown:a=>a.preventDefault(),onClick:()=>{u.chain().focus().setColor(s).run(),_(!1)},children:i&&r.jsx("span",{className:n.TEXT_COLOR_MENU_STYLES.colorCheck,children:r.jsx(S,{icon:"lucide:check",size:"sm"})})},s)})},e.name))})})})]})};x.displayName="RichTextEditor.TextAppearanceGroup.TextColorMenu";module.exports=x;
 //# sourceMappingURL=TextColorMenu.cjs.map

package/dist/components/forms/rich-text-editor/components/text-appearance-group/TextColorMenu.cjs.map

@@ -1 +1 @@
-{"version":3,"file":"TextColorMenu.cjs","sources":["../../../../../../src/components/forms/rich-text-editor/components/text-appearance-group/TextColorMenu.tsx"],"sourcesContent":["import { IconButton } from '@components/actions/icon-button'\r\nimport { Tooltip } from '@components/overlay/tooltip'\r\nimport { Icon } from '@components/foundation/icon'\r\nimport { Popover } from '@components/overlay/popover'\r\nimport { RICH_TEXT_COLOR_PALETTES } from '@components/forms/rich-text-editor/constants/richTextColorPalettes.const.ts'\r\nimport { useRichTextEditorContext } from '@components/forms/rich-text-editor/context/RichTextEditor.context.ts'\r\nimport { TEXT_COLOR_MENU_STYLES } from '@components/forms/rich-text-editor/components/text-appearance-group/styles/TextColorMenu.css.ts'\r\nimport { vars } from '@theme/contract.css.ts'\r\nimport { useCallback, useRef, useState, type KeyboardEvent } from 'react'\r\n\r\nconst TextColorMenu = () => {\r\n    const colorButtonRefs = useRef<Array<HTMLButtonElement | null>>([])\r\n    const [open, setOpen] = useState(false)\r\n    const { editor, disabled, labels } = useRichTextEditorContext()\r\n    const focusColor = useCallback((paletteIndex: number, colorIndex: number) => {\r\n        colorButtonRefs.current[paletteIndex * 3 + colorIndex]?.focus()\r\n    }, [])\r\n    const handleColorKeyDown = useCallback(\r\n        (\r\n            event: KeyboardEvent<HTMLButtonElement>,\r\n            paletteIndex: number,\r\n            colorIndex: number,\r\n        ) => {\r\n            let nextPaletteIndex = paletteIndex\r\n            let nextColorIndex = colorIndex\r\n            if (event.key === 'ArrowRight') {\r\n                nextPaletteIndex = Math.min(\r\n                    paletteIndex + 1,\r\n                    RICH_TEXT_COLOR_PALETTES.length - 1,\r\n                )\r\n            } else if (event.key === 'ArrowLeft') {\r\n                nextPaletteIndex = Math.max(paletteIndex - 1, 0)\r\n            } else if (event.key === 'ArrowDown') {\r\n                nextColorIndex = Math.min(colorIndex + 1, 2)\r\n            } else if (event.key === 'ArrowUp') {\r\n                nextColorIndex = Math.max(colorIndex - 1, 0)\r\n            } else if (event.key === 'Home') {\r\n                nextPaletteIndex = 0\r\n            } else if (event.key === 'End') {\r\n                nextPaletteIndex = RICH_TEXT_COLOR_PALETTES.length - 1\r\n            } else {\r\n                return\r\n            }\r\n            event.preventDefault()\r\n            focusColor(nextPaletteIndex, nextColorIndex)\r\n        },\r\n        [focusColor],\r\n    )\r\n\r\n    if (!editor) {\r\n        return null\r\n    }\r\n\r\n    const selectedColor =\r\n    editor.getAttributes('textStyle').color ?? vars.editorColors.neutral.dark\r\n    return (\r\n        <Popover\r\n            open={open}\r\n            onOpenChange={setOpen}\r\n        >\r\n            <Tooltip\r\n                content={labels.textColorTrigger}\r\n                delayDuration={700}\r\n                openOnFocus={false}\r\n                position={'top'}\r\n            >\r\n                <Popover.Trigger>\r\n                    <IconButton\r\n                        type={'button'}\r\n                        aria-label={labels.textColorTrigger}\r\n                        variant={'ghost'}\r\n                        color={'primary'}\r\n                        size={'sm'}\r\n                        active={open}\r\n                        disabled={disabled}\r\n                        onMouseDown={(event) => event.preventDefault()}\r\n                    >\r\n                        <span\r\n                            className={TEXT_COLOR_MENU_STYLES.selectedColor}\r\n                            style={{ backgroundColor: selectedColor }}\r\n                        />\r\n                    </IconButton>\r\n                </Popover.Trigger>\r\n            </Tooltip>\r\n            <Popover.Content\r\n                aria-label={labels.textColorPalette}\r\n                side={'bottom'}\r\n                align={'start'}\r\n            >\r\n                <div className={TEXT_COLOR_MENU_STYLES.colorPicker}>\r\n                    <div className={TEXT_COLOR_MENU_STYLES.paletteGrid}>\r\n                        {RICH_TEXT_COLOR_PALETTES.map((palette, paletteIndex) => (\r\n                            <div\r\n                                key={palette.name}\r\n                                className={TEXT_COLOR_MENU_STYLES.paletteColumn}\r\n                                role={'group'}\r\n                                aria-label={labels.textColorGroup(palette.name)}\r\n                            >\r\n                                {palette.colors.map((color, colorIndex) => {\r\n                                    const isSelected = selectedColor === color\r\n                                    return (\r\n                                        <button\r\n                                            key={color}\r\n                                            ref={(element) => {\r\n                                                colorButtonRefs.current[paletteIndex * 3 + colorIndex] =\r\n                          element\r\n                                            }}\r\n                                            type={'button'}\r\n                                            className={TEXT_COLOR_MENU_STYLES.colorSwatch}\r\n                                            style={{ backgroundColor: color }}\r\n                                            aria-label={labels.textColorSwatch(palette.name, colorIndex)}\r\n                                            aria-pressed={isSelected}\r\n                                            data-selected={isSelected || undefined}\r\n                                            tabIndex={paletteIndex === 0 && colorIndex === 0 ? 0 : -1}\r\n                                            onKeyDown={(event) =>\r\n                                                handleColorKeyDown(event, paletteIndex, colorIndex)\r\n                                            }\r\n                                            onMouseDown={(event) => event.preventDefault()}\r\n                                            onClick={() => {\r\n                                                editor.chain().focus().setColor(color).run()\r\n                                                setOpen(false)\r\n                                            }}\r\n                                        >\r\n                                            {isSelected && (\r\n                                                <span className={TEXT_COLOR_MENU_STYLES.colorCheck}>\r\n                                                    <Icon\r\n                                                        icon={'lucide:check'}\r\n                                                        size={'sm'}\r\n                                                    />\r\n                                                </span>\r\n                                            )}\r\n                                        </button>\r\n                                    )\r\n                                })}\r\n                            </div>\r\n                        ))}\r\n                    </div>\r\n                </div>\r\n            </Popover.Content>\r\n        </Popover>\r\n    )\r\n}\r\n\r\nTextColorMenu.displayName = 'RichTextEditor.TextAppearanceGroup.TextColorMenu'\r\n\r\nexport default TextColorMenu\r\n"],"names":["TextColorMenu","colorButtonRefs","useRef","open","setOpen","useState","editor","disabled","labels","useRichTextEditorContext","focusColor","useCallback","paletteIndex","colorIndex","handleColorKeyDown","event","nextPaletteIndex","nextColorIndex","RICH_TEXT_COLOR_PALETTES","selectedColor","vars","jsxs","Popover","jsx","Tooltip","IconButton","TEXT_COLOR_MENU_STYLES","palette","color","isSelected","element","Icon"],"mappings":"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"}
+{"version":3,"file":"TextColorMenu.cjs","sources":["../../../../../../src/components/forms/rich-text-editor/components/text-appearance-group/TextColorMenu.tsx"],"sourcesContent":["import { IconButton } from '@components/actions/icon-button'\r\nimport { Tooltip } from '@components/overlay/tooltip'\r\nimport { Icon } from '@components/foundation/icon'\r\nimport { Popover } from '@components/overlay/popover'\r\nimport { RICH_TEXT_COLOR_PALETTES } from '@components/forms/rich-text-editor/constants/richTextColorPalettes.const.ts'\r\nimport { useRichTextEditorContext } from '@components/forms/rich-text-editor/context/RichTextEditor.context.ts'\r\nimport { TEXT_COLOR_MENU_STYLES } from '@components/forms/rich-text-editor/components/text-appearance-group/styles/TextColorMenu.css.ts'\r\nimport { vars } from '@theme/contract.css.ts'\r\nimport { useCallback, useRef, useState, type KeyboardEvent } from 'react'\r\n\r\n/**\r\n * Color picker toolbar control for `TextAppearanceGroup`. Opens a\r\n * `Popover` with a palette grid. Uses keyboard arrow navigation within\r\n * the color swatches and applies the selected color as a TipTap\r\n * `textStyle` mark.\r\n */\r\nconst TextColorMenu = () => {\r\n    const colorButtonRefs = useRef<Array<HTMLButtonElement | null>>([])\r\n    const [open, setOpen] = useState(false)\r\n    const { editor, disabled, labels } = useRichTextEditorContext()\r\n    const focusColor = useCallback((paletteIndex: number, colorIndex: number) => {\r\n        colorButtonRefs.current[paletteIndex * 3 + colorIndex]?.focus()\r\n    }, [])\r\n    const handleColorKeyDown = useCallback(\r\n        (\r\n            event: KeyboardEvent<HTMLButtonElement>,\r\n            paletteIndex: number,\r\n            colorIndex: number,\r\n        ) => {\r\n            let nextPaletteIndex = paletteIndex\r\n            let nextColorIndex = colorIndex\r\n            if (event.key === 'ArrowRight') {\r\n                nextPaletteIndex = Math.min(\r\n                    paletteIndex + 1,\r\n                    RICH_TEXT_COLOR_PALETTES.length - 1,\r\n                )\r\n            } else if (event.key === 'ArrowLeft') {\r\n                nextPaletteIndex = Math.max(paletteIndex - 1, 0)\r\n            } else if (event.key === 'ArrowDown') {\r\n                nextColorIndex = Math.min(colorIndex + 1, 2)\r\n            } else if (event.key === 'ArrowUp') {\r\n                nextColorIndex = Math.max(colorIndex - 1, 0)\r\n            } else if (event.key === 'Home') {\r\n                nextPaletteIndex = 0\r\n            } else if (event.key === 'End') {\r\n                nextPaletteIndex = RICH_TEXT_COLOR_PALETTES.length - 1\r\n            } else {\r\n                return\r\n            }\r\n            event.preventDefault()\r\n            focusColor(nextPaletteIndex, nextColorIndex)\r\n        },\r\n        [focusColor],\r\n    )\r\n\r\n    if (!editor) {\r\n        return null\r\n    }\r\n\r\n    const selectedColor =\r\n    editor.getAttributes('textStyle').color ?? vars.editorColors.neutral.dark\r\n    return (\r\n        <Popover\r\n            open={open}\r\n            onOpenChange={setOpen}\r\n        >\r\n            <Tooltip\r\n                content={labels.textColorTrigger}\r\n                delayDuration={700}\r\n                openOnFocus={false}\r\n                position={'top'}\r\n            >\r\n                <Popover.Trigger>\r\n                    <IconButton\r\n                        type={'button'}\r\n                        aria-label={labels.textColorTrigger}\r\n                        variant={'ghost'}\r\n                        color={'primary'}\r\n                        size={'sm'}\r\n                        active={open}\r\n                        disabled={disabled}\r\n                        onMouseDown={(event) => event.preventDefault()}\r\n                    >\r\n                        <span\r\n                            className={TEXT_COLOR_MENU_STYLES.selectedColor}\r\n                            style={{ backgroundColor: selectedColor }}\r\n                        />\r\n                    </IconButton>\r\n                </Popover.Trigger>\r\n            </Tooltip>\r\n            <Popover.Content\r\n                aria-label={labels.textColorPalette}\r\n                side={'bottom'}\r\n                align={'start'}\r\n            >\r\n                <div className={TEXT_COLOR_MENU_STYLES.colorPicker}>\r\n                    <div className={TEXT_COLOR_MENU_STYLES.paletteGrid}>\r\n                        {RICH_TEXT_COLOR_PALETTES.map((palette, paletteIndex) => (\r\n                            <div\r\n                                key={palette.name}\r\n                                className={TEXT_COLOR_MENU_STYLES.paletteColumn}\r\n                                role={'group'}\r\n                                aria-label={labels.textColorGroup(palette.name)}\r\n                            >\r\n                                {palette.colors.map((color, colorIndex) => {\r\n                                    const isSelected = selectedColor === color\r\n                                    return (\r\n                                        <button\r\n                                            key={color}\r\n                                            ref={(element) => {\r\n                                                colorButtonRefs.current[paletteIndex * 3 + colorIndex] =\r\n                          element\r\n                                            }}\r\n                                            type={'button'}\r\n                                            className={TEXT_COLOR_MENU_STYLES.colorSwatch}\r\n                                            style={{ backgroundColor: color }}\r\n                                            aria-label={labels.textColorSwatch(palette.name, colorIndex)}\r\n                                            aria-pressed={isSelected}\r\n                                            data-selected={isSelected || undefined}\r\n                                            tabIndex={paletteIndex === 0 && colorIndex === 0 ? 0 : -1}\r\n                                            onKeyDown={(event) =>\r\n                                                handleColorKeyDown(event, paletteIndex, colorIndex)\r\n                                            }\r\n                                            onMouseDown={(event) => event.preventDefault()}\r\n                                            onClick={() => {\r\n                                                editor.chain().focus().setColor(color).run()\r\n                                                setOpen(false)\r\n                                            }}\r\n                                        >\r\n                                            {isSelected && (\r\n                                                <span className={TEXT_COLOR_MENU_STYLES.colorCheck}>\r\n                                                    <Icon\r\n                                                        icon={'lucide:check'}\r\n                                                        size={'sm'}\r\n                                                    />\r\n                                                </span>\r\n                                            )}\r\n                                        </button>\r\n                                    )\r\n                                })}\r\n                            </div>\r\n                        ))}\r\n                    </div>\r\n                </div>\r\n            </Popover.Content>\r\n        </Popover>\r\n    )\r\n}\r\n\r\nTextColorMenu.displayName = 'RichTextEditor.TextAppearanceGroup.TextColorMenu'\r\n\r\nexport default TextColorMenu\r\n"],"names":["TextColorMenu","colorButtonRefs","useRef","open","setOpen","useState","editor","disabled","labels","useRichTextEditorContext","focusColor","useCallback","paletteIndex","colorIndex","handleColorKeyDown","event","nextPaletteIndex","nextColorIndex","RICH_TEXT_COLOR_PALETTES","selectedColor","vars","jsxs","Popover","jsx","Tooltip","IconButton","TEXT_COLOR_MENU_STYLES","palette","color","isSelected","element","Icon"],"mappings":"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"}

package/dist/components/forms/rich-text-editor/components/text-appearance-group/TextColorMenu.d.ts

@@ -1,3 +1,9 @@
+/**
+ * Color picker toolbar control for `TextAppearanceGroup`. Opens a
+ * `Popover` with a palette grid. Uses keyboard arrow navigation within
+ * the color swatches and applies the selected color as a TipTap
+ * `textStyle` mark.
+ */
 declare const TextColorMenu: {
     (): import("react").JSX.Element | null;
     displayName: string;

package/dist/components/forms/rich-text-editor/components/text-appearance-group/TextColorMenu.js

@@ -3,7 +3,7 @@ import k from "../../../../actions/icon-button/IconButton.js";
 import "../../../../actions/icon-button/styles/IconButton.css.js";
 import x from "../../../../overlay/tooltip/Tooltip.js";
 import "../../../../overlay/tooltip/components/tooltip-provider/TooltipProvider.js";
-import '../../../../../ui-kit95.css';import '../../../../../ui-kit14.css';import '../../../../../ui-kit8.css';import '../../../../../ui-kit12.css';import '../../../../../ui-kit6.css';import '../../../../../ui-kit5.css';import '../../../../../ui-kit3.css';import '../../../../../ui-kit4.css';import '../../../../../ui-kit7.css';import '../../../../../ui-kit10.css';import '../../../../../ui-kit13.css';import '../../../../../ui-kit9.css';import '../../../../../ui-kit11.css';import '../../../../../ui-kit62.css';import '../../../../../ui-kit.css';/* empty css                                               */
+import '../../../../../ui-kit86.css';import '../../../../../ui-kit12.css';import '../../../../../ui-kit11.css';import '../../../../../ui-kit14.css';import '../../../../../ui-kit9.css';import '../../../../../ui-kit3.css';import '../../../../../ui-kit7.css';import '../../../../../ui-kit13.css';import '../../../../../ui-kit10.css';import '../../../../../ui-kit6.css';import '../../../../../ui-kit4.css';import '../../../../../ui-kit8.css';import '../../../../../ui-kit5.css';import '../../../../../ui-kit54.css';import '../../../../../ui-kit.css';/* empty css                                               */
 /* empty css                                                            */
 import w from "../../../../foundation/icon/Icon.js";
 import "../../../../foundation/icon/styles/Icon.css.js";

package/dist/components/forms/rich-text-editor/components/text-appearance-group/TextColorMenu.js.map

@@ -1 +1 @@
-{"version":3,"file":"TextColorMenu.js","sources":["../../../../../../src/components/forms/rich-text-editor/components/text-appearance-group/TextColorMenu.tsx"],"sourcesContent":["import { IconButton } from '@components/actions/icon-button'\r\nimport { Tooltip } from '@components/overlay/tooltip'\r\nimport { Icon } from '@components/foundation/icon'\r\nimport { Popover } from '@components/overlay/popover'\r\nimport { RICH_TEXT_COLOR_PALETTES } from '@components/forms/rich-text-editor/constants/richTextColorPalettes.const.ts'\r\nimport { useRichTextEditorContext } from '@components/forms/rich-text-editor/context/RichTextEditor.context.ts'\r\nimport { TEXT_COLOR_MENU_STYLES } from '@components/forms/rich-text-editor/components/text-appearance-group/styles/TextColorMenu.css.ts'\r\nimport { vars } from '@theme/contract.css.ts'\r\nimport { useCallback, useRef, useState, type KeyboardEvent } from 'react'\r\n\r\nconst TextColorMenu = () => {\r\n    const colorButtonRefs = useRef<Array<HTMLButtonElement | null>>([])\r\n    const [open, setOpen] = useState(false)\r\n    const { editor, disabled, labels } = useRichTextEditorContext()\r\n    const focusColor = useCallback((paletteIndex: number, colorIndex: number) => {\r\n        colorButtonRefs.current[paletteIndex * 3 + colorIndex]?.focus()\r\n    }, [])\r\n    const handleColorKeyDown = useCallback(\r\n        (\r\n            event: KeyboardEvent<HTMLButtonElement>,\r\n            paletteIndex: number,\r\n            colorIndex: number,\r\n        ) => {\r\n            let nextPaletteIndex = paletteIndex\r\n            let nextColorIndex = colorIndex\r\n            if (event.key === 'ArrowRight') {\r\n                nextPaletteIndex = Math.min(\r\n                    paletteIndex + 1,\r\n                    RICH_TEXT_COLOR_PALETTES.length - 1,\r\n                )\r\n            } else if (event.key === 'ArrowLeft') {\r\n                nextPaletteIndex = Math.max(paletteIndex - 1, 0)\r\n            } else if (event.key === 'ArrowDown') {\r\n                nextColorIndex = Math.min(colorIndex + 1, 2)\r\n            } else if (event.key === 'ArrowUp') {\r\n                nextColorIndex = Math.max(colorIndex - 1, 0)\r\n            } else if (event.key === 'Home') {\r\n                nextPaletteIndex = 0\r\n            } else if (event.key === 'End') {\r\n                nextPaletteIndex = RICH_TEXT_COLOR_PALETTES.length - 1\r\n            } else {\r\n                return\r\n            }\r\n            event.preventDefault()\r\n            focusColor(nextPaletteIndex, nextColorIndex)\r\n        },\r\n        [focusColor],\r\n    )\r\n\r\n    if (!editor) {\r\n        return null\r\n    }\r\n\r\n    const selectedColor =\r\n    editor.getAttributes('textStyle').color ?? vars.editorColors.neutral.dark\r\n    return (\r\n        <Popover\r\n            open={open}\r\n            onOpenChange={setOpen}\r\n        >\r\n            <Tooltip\r\n                content={labels.textColorTrigger}\r\n                delayDuration={700}\r\n                openOnFocus={false}\r\n                position={'top'}\r\n            >\r\n                <Popover.Trigger>\r\n                    <IconButton\r\n                        type={'button'}\r\n                        aria-label={labels.textColorTrigger}\r\n                        variant={'ghost'}\r\n                        color={'primary'}\r\n                        size={'sm'}\r\n                        active={open}\r\n                        disabled={disabled}\r\n                        onMouseDown={(event) => event.preventDefault()}\r\n                    >\r\n                        <span\r\n                            className={TEXT_COLOR_MENU_STYLES.selectedColor}\r\n                            style={{ backgroundColor: selectedColor }}\r\n                        />\r\n                    </IconButton>\r\n                </Popover.Trigger>\r\n            </Tooltip>\r\n            <Popover.Content\r\n                aria-label={labels.textColorPalette}\r\n                side={'bottom'}\r\n                align={'start'}\r\n            >\r\n                <div className={TEXT_COLOR_MENU_STYLES.colorPicker}>\r\n                    <div className={TEXT_COLOR_MENU_STYLES.paletteGrid}>\r\n                        {RICH_TEXT_COLOR_PALETTES.map((palette, paletteIndex) => (\r\n                            <div\r\n                                key={palette.name}\r\n                                className={TEXT_COLOR_MENU_STYLES.paletteColumn}\r\n                                role={'group'}\r\n                                aria-label={labels.textColorGroup(palette.name)}\r\n                            >\r\n                                {palette.colors.map((color, colorIndex) => {\r\n                                    const isSelected = selectedColor === color\r\n                                    return (\r\n                                        <button\r\n                                            key={color}\r\n                                            ref={(element) => {\r\n                                                colorButtonRefs.current[paletteIndex * 3 + colorIndex] =\r\n                          element\r\n                                            }}\r\n                                            type={'button'}\r\n                                            className={TEXT_COLOR_MENU_STYLES.colorSwatch}\r\n                                            style={{ backgroundColor: color }}\r\n                                            aria-label={labels.textColorSwatch(palette.name, colorIndex)}\r\n                                            aria-pressed={isSelected}\r\n                                            data-selected={isSelected || undefined}\r\n                                            tabIndex={paletteIndex === 0 && colorIndex === 0 ? 0 : -1}\r\n                                            onKeyDown={(event) =>\r\n                                                handleColorKeyDown(event, paletteIndex, colorIndex)\r\n                                            }\r\n                                            onMouseDown={(event) => event.preventDefault()}\r\n                                            onClick={() => {\r\n                                                editor.chain().focus().setColor(color).run()\r\n                                                setOpen(false)\r\n                                            }}\r\n                                        >\r\n                                            {isSelected && (\r\n                                                <span className={TEXT_COLOR_MENU_STYLES.colorCheck}>\r\n                                                    <Icon\r\n                                                        icon={'lucide:check'}\r\n                                                        size={'sm'}\r\n                                                    />\r\n                                                </span>\r\n                                            )}\r\n                                        </button>\r\n                                    )\r\n                                })}\r\n                            </div>\r\n                        ))}\r\n                    </div>\r\n                </div>\r\n            </Popover.Content>\r\n        </Popover>\r\n    )\r\n}\r\n\r\nTextColorMenu.displayName = 'RichTextEditor.TextAppearanceGroup.TextColorMenu'\r\n\r\nexport default TextColorMenu\r\n"],"names":["TextColorMenu","colorButtonRefs","useRef","open","setOpen","useState","editor","disabled","labels","useRichTextEditorContext","focusColor","useCallback","paletteIndex","colorIndex","handleColorKeyDown","event","nextPaletteIndex","nextColorIndex","RICH_TEXT_COLOR_PALETTES","selectedColor","vars","jsxs","Popover","jsx","Tooltip","IconButton","TEXT_COLOR_MENU_STYLES","palette","color","isSelected","element","Icon"],"mappings":"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"}
+{"version":3,"file":"TextColorMenu.js","sources":["../../../../../../src/components/forms/rich-text-editor/components/text-appearance-group/TextColorMenu.tsx"],"sourcesContent":["import { IconButton } from '@components/actions/icon-button'\r\nimport { Tooltip } from '@components/overlay/tooltip'\r\nimport { Icon } from '@components/foundation/icon'\r\nimport { Popover } from '@components/overlay/popover'\r\nimport { RICH_TEXT_COLOR_PALETTES } from '@components/forms/rich-text-editor/constants/richTextColorPalettes.const.ts'\r\nimport { useRichTextEditorContext } from '@components/forms/rich-text-editor/context/RichTextEditor.context.ts'\r\nimport { TEXT_COLOR_MENU_STYLES } from '@components/forms/rich-text-editor/components/text-appearance-group/styles/TextColorMenu.css.ts'\r\nimport { vars } from '@theme/contract.css.ts'\r\nimport { useCallback, useRef, useState, type KeyboardEvent } from 'react'\r\n\r\n/**\r\n * Color picker toolbar control for `TextAppearanceGroup`. Opens a\r\n * `Popover` with a palette grid. Uses keyboard arrow navigation within\r\n * the color swatches and applies the selected color as a TipTap\r\n * `textStyle` mark.\r\n */\r\nconst TextColorMenu = () => {\r\n    const colorButtonRefs = useRef<Array<HTMLButtonElement | null>>([])\r\n    const [open, setOpen] = useState(false)\r\n    const { editor, disabled, labels } = useRichTextEditorContext()\r\n    const focusColor = useCallback((paletteIndex: number, colorIndex: number) => {\r\n        colorButtonRefs.current[paletteIndex * 3 + colorIndex]?.focus()\r\n    }, [])\r\n    const handleColorKeyDown = useCallback(\r\n        (\r\n            event: KeyboardEvent<HTMLButtonElement>,\r\n            paletteIndex: number,\r\n            colorIndex: number,\r\n        ) => {\r\n            let nextPaletteIndex = paletteIndex\r\n            let nextColorIndex = colorIndex\r\n            if (event.key === 'ArrowRight') {\r\n                nextPaletteIndex = Math.min(\r\n                    paletteIndex + 1,\r\n                    RICH_TEXT_COLOR_PALETTES.length - 1,\r\n                )\r\n            } else if (event.key === 'ArrowLeft') {\r\n                nextPaletteIndex = Math.max(paletteIndex - 1, 0)\r\n            } else if (event.key === 'ArrowDown') {\r\n                nextColorIndex = Math.min(colorIndex + 1, 2)\r\n            } else if (event.key === 'ArrowUp') {\r\n                nextColorIndex = Math.max(colorIndex - 1, 0)\r\n            } else if (event.key === 'Home') {\r\n                nextPaletteIndex = 0\r\n            } else if (event.key === 'End') {\r\n                nextPaletteIndex = RICH_TEXT_COLOR_PALETTES.length - 1\r\n            } else {\r\n                return\r\n            }\r\n            event.preventDefault()\r\n            focusColor(nextPaletteIndex, nextColorIndex)\r\n        },\r\n        [focusColor],\r\n    )\r\n\r\n    if (!editor) {\r\n        return null\r\n    }\r\n\r\n    const selectedColor =\r\n    editor.getAttributes('textStyle').color ?? vars.editorColors.neutral.dark\r\n    return (\r\n        <Popover\r\n            open={open}\r\n            onOpenChange={setOpen}\r\n        >\r\n            <Tooltip\r\n                content={labels.textColorTrigger}\r\n                delayDuration={700}\r\n                openOnFocus={false}\r\n                position={'top'}\r\n            >\r\n                <Popover.Trigger>\r\n                    <IconButton\r\n                        type={'button'}\r\n                        aria-label={labels.textColorTrigger}\r\n                        variant={'ghost'}\r\n                        color={'primary'}\r\n                        size={'sm'}\r\n                        active={open}\r\n                        disabled={disabled}\r\n                        onMouseDown={(event) => event.preventDefault()}\r\n                    >\r\n                        <span\r\n                            className={TEXT_COLOR_MENU_STYLES.selectedColor}\r\n                            style={{ backgroundColor: selectedColor }}\r\n                        />\r\n                    </IconButton>\r\n                </Popover.Trigger>\r\n            </Tooltip>\r\n            <Popover.Content\r\n                aria-label={labels.textColorPalette}\r\n                side={'bottom'}\r\n                align={'start'}\r\n            >\r\n                <div className={TEXT_COLOR_MENU_STYLES.colorPicker}>\r\n                    <div className={TEXT_COLOR_MENU_STYLES.paletteGrid}>\r\n                        {RICH_TEXT_COLOR_PALETTES.map((palette, paletteIndex) => (\r\n                            <div\r\n                                key={palette.name}\r\n                                className={TEXT_COLOR_MENU_STYLES.paletteColumn}\r\n                                role={'group'}\r\n                                aria-label={labels.textColorGroup(palette.name)}\r\n                            >\r\n                                {palette.colors.map((color, colorIndex) => {\r\n                                    const isSelected = selectedColor === color\r\n                                    return (\r\n                                        <button\r\n                                            key={color}\r\n                                            ref={(element) => {\r\n                                                colorButtonRefs.current[paletteIndex * 3 + colorIndex] =\r\n                          element\r\n                                            }}\r\n                                            type={'button'}\r\n                                            className={TEXT_COLOR_MENU_STYLES.colorSwatch}\r\n                                            style={{ backgroundColor: color }}\r\n                                            aria-label={labels.textColorSwatch(palette.name, colorIndex)}\r\n                                            aria-pressed={isSelected}\r\n                                            data-selected={isSelected || undefined}\r\n                                            tabIndex={paletteIndex === 0 && colorIndex === 0 ? 0 : -1}\r\n                                            onKeyDown={(event) =>\r\n                                                handleColorKeyDown(event, paletteIndex, colorIndex)\r\n                                            }\r\n                                            onMouseDown={(event) => event.preventDefault()}\r\n                                            onClick={() => {\r\n                                                editor.chain().focus().setColor(color).run()\r\n                                                setOpen(false)\r\n                                            }}\r\n                                        >\r\n                                            {isSelected && (\r\n                                                <span className={TEXT_COLOR_MENU_STYLES.colorCheck}>\r\n                                                    <Icon\r\n                                                        icon={'lucide:check'}\r\n                                                        size={'sm'}\r\n                                                    />\r\n                                                </span>\r\n                                            )}\r\n                                        </button>\r\n                                    )\r\n                                })}\r\n                            </div>\r\n                        ))}\r\n                    </div>\r\n                </div>\r\n            </Popover.Content>\r\n        </Popover>\r\n    )\r\n}\r\n\r\nTextColorMenu.displayName = 'RichTextEditor.TextAppearanceGroup.TextColorMenu'\r\n\r\nexport default TextColorMenu\r\n"],"names":["TextColorMenu","colorButtonRefs","useRef","open","setOpen","useState","editor","disabled","labels","useRichTextEditorContext","focusColor","useCallback","paletteIndex","colorIndex","handleColorKeyDown","event","nextPaletteIndex","nextColorIndex","RICH_TEXT_COLOR_PALETTES","selectedColor","vars","jsxs","Popover","jsx","Tooltip","IconButton","TEXT_COLOR_MENU_STYLES","palette","color","isSelected","element","Icon"],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;AAgBA,MAAMA,IAAgB,MAAM;AACxB,QAAMC,IAAkBC,EAAwC,EAAE,GAC5D,CAACC,GAAMC,CAAO,IAAIC,EAAS,EAAK,GAChC,EAAE,QAAAC,GAAQ,UAAAC,GAAU,QAAAC,EAAA,IAAWC,EAAA,GAC/BC,IAAaC,EAAY,CAACC,GAAsBC,MAAuB;AACzE,IAAAZ,EAAgB,QAAQW,IAAe,IAAIC,CAAU,GAAG,MAAA;AAAA,EAC5D,GAAG,CAAA,CAAE,GACCC,IAAqBH;AAAA,IACvB,CACII,GACAH,GACAC,MACC;AACD,UAAIG,IAAmBJ,GACnBK,IAAiBJ;AACrB,UAAIE,EAAM,QAAQ;AACd,QAAAC,IAAmB,KAAK;AAAA,UACpBJ,IAAe;AAAA,UACfM,EAAyB,SAAS;AAAA,QAAA;AAAA,eAE/BH,EAAM,QAAQ;AACrB,QAAAC,IAAmB,KAAK,IAAIJ,IAAe,GAAG,CAAC;AAAA,eACxCG,EAAM,QAAQ;AACrB,QAAAE,IAAiB,KAAK,IAAIJ,IAAa,GAAG,CAAC;AAAA,eACpCE,EAAM,QAAQ;AACrB,QAAAE,IAAiB,KAAK,IAAIJ,IAAa,GAAG,CAAC;AAAA,eACpCE,EAAM,QAAQ;AACrB,QAAAC,IAAmB;AAAA,eACZD,EAAM,QAAQ;AACrB,QAAAC,IAAmBE,EAAyB,SAAS;AAAA;AAErD;AAEJ,MAAAH,EAAM,eAAA,GACNL,EAAWM,GAAkBC,CAAc;AAAA,IAC/C;AAAA,IACA,CAACP,CAAU;AAAA,EAAA;AAGf,MAAI,CAACJ;AACD,WAAO;AAGX,QAAMa,IACNb,EAAO,cAAc,WAAW,EAAE,SAASc,EAAK,aAAa,QAAQ;AACrE,SACI,gBAAAC;AAAA,IAACC;AAAA,IAAA;AAAA,MACG,MAAAnB;AAAA,MACA,cAAcC;AAAA,MAEd,UAAA;AAAA,QAAA,gBAAAmB;AAAA,UAACC;AAAA,UAAA;AAAA,YACG,SAAShB,EAAO;AAAA,YAChB,eAAe;AAAA,YACf,aAAa;AAAA,YACb,UAAU;AAAA,YAEV,UAAA,gBAAAe,EAACD,EAAQ,SAAR,EACG,UAAA,gBAAAC;AAAA,cAACE;AAAA,cAAA;AAAA,gBACG,MAAM;AAAA,gBACN,cAAYjB,EAAO;AAAA,gBACnB,SAAS;AAAA,gBACT,OAAO;AAAA,gBACP,MAAM;AAAA,gBACN,QAAQL;AAAA,gBACR,UAAAI;AAAA,gBACA,aAAa,CAACQ,MAAUA,EAAM,eAAA;AAAA,gBAE9B,UAAA,gBAAAQ;AAAA,kBAAC;AAAA,kBAAA;AAAA,oBACG,WAAWG,EAAuB;AAAA,oBAClC,OAAO,EAAE,iBAAiBP,EAAA;AAAA,kBAAc;AAAA,gBAAA;AAAA,cAC5C;AAAA,YAAA,EACJ,CACJ;AAAA,UAAA;AAAA,QAAA;AAAA,QAEJ,gBAAAI;AAAA,UAACD,EAAQ;AAAA,UAAR;AAAA,YACG,cAAYd,EAAO;AAAA,YACnB,MAAM;AAAA,YACN,OAAO;AAAA,YAEP,UAAA,gBAAAe,EAAC,OAAA,EAAI,WAAWG,EAAuB,aACnC,UAAA,gBAAAH,EAAC,OAAA,EAAI,WAAWG,EAAuB,aAClC,UAAAR,EAAyB,IAAI,CAACS,GAASf,MACpC,gBAAAW;AAAA,cAAC;AAAA,cAAA;AAAA,gBAEG,WAAWG,EAAuB;AAAA,gBAClC,MAAM;AAAA,gBACN,cAAYlB,EAAO,eAAemB,EAAQ,IAAI;AAAA,gBAE7C,UAAAA,EAAQ,OAAO,IAAI,CAACC,GAAOf,MAAe;AACvC,wBAAMgB,IAAaV,MAAkBS;AACrC,yBACI,gBAAAL;AAAA,oBAAC;AAAA,oBAAA;AAAA,sBAEG,KAAK,CAACO,MAAY;AACd,wBAAA7B,EAAgB,QAAQW,IAAe,IAAIC,CAAU,IAC3EiB;AAAA,sBACkB;AAAA,sBACA,MAAM;AAAA,sBACN,WAAWJ,EAAuB;AAAA,sBAClC,OAAO,EAAE,iBAAiBE,EAAA;AAAA,sBAC1B,cAAYpB,EAAO,gBAAgBmB,EAAQ,MAAMd,CAAU;AAAA,sBAC3D,gBAAcgB;AAAA,sBACd,iBAAeA,KAAc;AAAA,sBAC7B,UAAUjB,MAAiB,KAAKC,MAAe,IAAI,IAAI;AAAA,sBACvD,WAAW,CAACE,MACRD,EAAmBC,GAAOH,GAAcC,CAAU;AAAA,sBAEtD,aAAa,CAACE,MAAUA,EAAM,eAAA;AAAA,sBAC9B,SAAS,MAAM;AACX,wBAAAT,EAAO,QAAQ,MAAA,EAAQ,SAASsB,CAAK,EAAE,IAAA,GACvCxB,EAAQ,EAAK;AAAA,sBACjB;AAAA,sBAEC,UAAAyB,KACG,gBAAAN,EAAC,QAAA,EAAK,WAAWG,EAAuB,YACpC,UAAA,gBAAAH;AAAA,wBAACQ;AAAA,wBAAA;AAAA,0BACG,MAAM;AAAA,0BACN,MAAM;AAAA,wBAAA;AAAA,sBAAA,EACV,CACJ;AAAA,oBAAA;AAAA,oBA3BCH;AAAA,kBAAA;AAAA,gBA+BjB,CAAC;AAAA,cAAA;AAAA,cAxCID,EAAQ;AAAA,YAAA,CA0CpB,GACL,EAAA,CACJ;AAAA,UAAA;AAAA,QAAA;AAAA,MACJ;AAAA,IAAA;AAAA,EAAA;AAGZ;AAEA3B,EAAc,cAAc;"}

package/dist/components/forms/rich-text-editor/components/text-appearance-group/TextSizeMenu.cjs.map

@@ -1 +1 @@
-{"version":3,"file":"TextSizeMenu.cjs","sources":["../../../../../../src/components/forms/rich-text-editor/components/text-appearance-group/TextSizeMenu.tsx"],"sourcesContent":["import { Button } from '@components/actions/button'\r\nimport { RICH_TEXT_FONT_SIZES } from '@components/forms/rich-text-editor/constants'\r\nimport { RICH_TEXT_FONT_SIZE_LABELS } from '@components/forms/rich-text-editor/constants/richTextFontSizes.const.ts'\r\nimport type { RichTextFontSize } from '@components/forms/rich-text-editor/types'\r\nimport { IconButton } from '@components/actions/icon-button'\r\nimport { DropdownMenu } from '@components/overlay/dropdown-menu'\r\nimport { useRichTextEditorContext } from '@components/forms/rich-text-editor/context/RichTextEditor.context.ts'\r\nimport { useState } from 'react'\r\nimport type { TextSizeMenuProps } from '@components/forms/rich-text-editor/components/text-appearance-group/types/TextSizeMenu.props.ts'\r\nimport { TEXT_SIZE_MENU_STYLES } from '@components/forms/rich-text-editor/components/text-appearance-group/styles/TextSizeMenu.css.ts'\r\n\r\nconst TextSizeMenu = ({ presentation = 'select' }: TextSizeMenuProps) => {\r\n    const [open, setOpen] = useState(false)\r\n    const { editor, disabled, labels } = useRichTextEditorContext()\r\n\r\n    if (!editor) {\r\n        return null\r\n    }\r\n\r\n    const selectedFontSize =\r\n    editor.getAttributes('textStyle').fontSize ?? RICH_TEXT_FONT_SIZES.md\r\n    const selectedFontSizeKey = (\r\n    Object.keys(RICH_TEXT_FONT_SIZES) as RichTextFontSize[]\r\n    ).find((fontSize) => RICH_TEXT_FONT_SIZES[fontSize] === selectedFontSize)\r\n\r\n    const selectedFontSizeLabel = selectedFontSizeKey\r\n        ? RICH_TEXT_FONT_SIZE_LABELS[selectedFontSizeKey]\r\n        : RICH_TEXT_FONT_SIZE_LABELS.md\r\n\r\n    return (\r\n        <DropdownMenu\r\n            modal={false}\r\n            open={open}\r\n            onOpenChange={setOpen}\r\n        >\r\n            <DropdownMenu.Trigger>\r\n                {presentation === 'select' ? (\r\n                    <Button\r\n                        type={'button'}\r\n                        label={selectedFontSizeLabel}\r\n                        endIcon={'lucide:chevron-down'}\r\n                        aria-label={labels.textSizeTrigger}\r\n                        variant={'ghost'}\r\n                        color={'primary'}\r\n                        size={'sm'}\r\n                        className={TEXT_SIZE_MENU_STYLES.trigger}\r\n                        active={open}\r\n                        disabled={disabled}\r\n                    />\r\n                ) : (\r\n                    <IconButton\r\n                        type={'button'}\r\n                        icon={'lucide:text-cursor-input'}\r\n                        aria-label={labels.textSizeTrigger}\r\n                        variant={'ghost'}\r\n                        color={'primary'}\r\n                        size={'sm'}\r\n                        active={open}\r\n                        disabled={disabled}\r\n                    />\r\n                )}\r\n            </DropdownMenu.Trigger>\r\n            <DropdownMenu.Content\r\n                aria-label={labels.textSizeOptions}\r\n                side={'bottom'}\r\n                align={'start'}\r\n                width={'6rem'}\r\n            >\r\n                {(Object.keys(RICH_TEXT_FONT_SIZES) as RichTextFontSize[]).map(\r\n                    (fontSize) => (\r\n                        <DropdownMenu.Item\r\n                            key={fontSize}\r\n                            label={RICH_TEXT_FONT_SIZE_LABELS[fontSize]}\r\n                            active={fontSize === selectedFontSizeKey}\r\n                            onMouseDown={(event) => event.preventDefault()}\r\n                            onClick={() =>\r\n                                editor\r\n                                    .chain()\r\n                                    .focus()\r\n                                    .setFontSize(RICH_TEXT_FONT_SIZES[fontSize])\r\n                                    .run()\r\n                            }\r\n                        />\r\n                    ),\r\n                )}\r\n            </DropdownMenu.Content>\r\n        </DropdownMenu>\r\n    )\r\n}\r\n\r\nTextSizeMenu.displayName = 'RichTextEditor.TextAppearanceGroup.TextSizeMenu'\r\n\r\nexport default TextSizeMenu\r\n"],"names":["TextSizeMenu","presentation","open","setOpen","useState","editor","disabled","labels","useRichTextEditorContext","selectedFontSize","RICH_TEXT_FONT_SIZES","selectedFontSizeKey","fontSize","selectedFontSizeLabel","RICH_TEXT_FONT_SIZE_LABELS","jsxs","DropdownMenu","jsx","Button","TEXT_SIZE_MENU_STYLES","IconButton","event"],"mappings":"6oBAWMA,EAAe,CAAC,CAAE,aAAAC,EAAe,YAAkC,CACrE,KAAM,CAACC,EAAMC,CAAO,EAAIC,EAAAA,SAAS,EAAK,EAChC,CAAE,OAAAC,EAAQ,SAAAC,EAAU,OAAAC,CAAA,EAAWC,EAAAA,yBAAA,EAErC,GAAI,CAACH,EACD,OAAO,KAGX,MAAMI,EACNJ,EAAO,cAAc,WAAW,EAAE,UAAYK,EAAAA,qBAAqB,GAC7DC,EACN,OAAO,KAAKD,sBAAoB,EAC9B,KAAME,GAAaF,EAAAA,qBAAqBE,CAAQ,IAAMH,CAAgB,EAElEI,EAAwBF,EACxBG,EAAAA,2BAA2BH,CAAmB,EAC9CG,EAAAA,2BAA2B,GAEjC,OACIC,EAAAA,KAACC,EAAA,CACG,MAAO,GACP,KAAAd,EACA,aAAcC,EAEd,SAAA,CAAAc,EAAAA,IAACD,EAAa,QAAb,CACI,SAAAf,IAAiB,SACdgB,EAAAA,IAACC,EAAA,CACG,KAAM,SACN,MAAOL,EACP,QAAS,sBACT,aAAYN,EAAO,gBACnB,QAAS,QACT,MAAO,UACP,KAAM,KACN,UAAWY,EAAAA,sBAAsB,QACjC,OAAQjB,EACR,SAAAI,CAAA,CAAA,EAGJW,EAAAA,IAACG,EAAA,CACG,KAAM,SACN,KAAM,2BACN,aAAYb,EAAO,gBACnB,QAAS,QACT,MAAO,UACP,KAAM,KACN,OAAQL,EACR,SAAAI,CAAA,CAAA,EAGZ,EACAW,EAAAA,IAACD,EAAa,QAAb,CACG,aAAYT,EAAO,gBACnB,KAAM,SACN,MAAO,QACP,MAAO,OAEL,SAAA,OAAO,KAAKG,EAAAA,oBAAoB,EAAyB,IACtDE,GACGK,EAAAA,IAACD,EAAa,KAAb,CAEG,MAAOF,EAAAA,2BAA2BF,CAAQ,EAC1C,OAAQA,IAAaD,EACrB,YAAcU,GAAUA,EAAM,eAAA,EAC9B,QAAS,IACLhB,EACK,QACA,QACA,YAAYK,EAAAA,qBAAqBE,CAAQ,CAAC,EAC1C,IAAA,CAAI,EATRA,CAAA,CAWT,CAER,CAAA,CACJ,CAAA,CAAA,CAGZ,EAEAZ,EAAa,YAAc"}
+{"version":3,"file":"TextSizeMenu.cjs","sources":["../../../../../../src/components/forms/rich-text-editor/components/text-appearance-group/TextSizeMenu.tsx"],"sourcesContent":["import { Button } from '@components/actions/button'\r\nimport { RICH_TEXT_FONT_SIZES } from '@components/forms/rich-text-editor/constants'\r\nimport { RICH_TEXT_FONT_SIZE_LABELS } from '@components/forms/rich-text-editor/constants/richTextFontSizes.const.ts'\r\nimport type { RichTextFontSize } from '@components/forms/rich-text-editor/types'\r\nimport { IconButton } from '@components/actions/icon-button'\r\nimport { DropdownMenu } from '@components/overlay/dropdown-menu'\r\nimport { useRichTextEditorContext } from '@components/forms/rich-text-editor/context/RichTextEditor.context.ts'\r\nimport { useState } from 'react'\r\nimport type { TextSizeMenuProps } from '@components/forms/rich-text-editor/components/text-appearance-group/types/TextSizeMenu.props.ts'\r\nimport { TEXT_SIZE_MENU_STYLES } from '@components/forms/rich-text-editor/components/text-appearance-group/styles/TextSizeMenu.css.ts'\r\n\r\n/**\r\n * Font-size picker toolbar control for `TextAppearanceGroup`. Renders a\r\n * `DropdownMenu` showing available rich-text font sizes. Use\r\n * `presentation=\"select\"` (default) for a labeled button trigger or\r\n * `\"icon\"` for an icon-only trigger.\r\n */\r\nconst TextSizeMenu = ({ presentation = 'select' }: TextSizeMenuProps) => {\r\n    const [open, setOpen] = useState(false)\r\n    const { editor, disabled, labels } = useRichTextEditorContext()\r\n\r\n    if (!editor) {\r\n        return null\r\n    }\r\n\r\n    const selectedFontSize =\r\n    editor.getAttributes('textStyle').fontSize ?? RICH_TEXT_FONT_SIZES.md\r\n    const selectedFontSizeKey = (\r\n    Object.keys(RICH_TEXT_FONT_SIZES) as RichTextFontSize[]\r\n    ).find((fontSize) => RICH_TEXT_FONT_SIZES[fontSize] === selectedFontSize)\r\n\r\n    const selectedFontSizeLabel = selectedFontSizeKey\r\n        ? RICH_TEXT_FONT_SIZE_LABELS[selectedFontSizeKey]\r\n        : RICH_TEXT_FONT_SIZE_LABELS.md\r\n\r\n    return (\r\n        <DropdownMenu\r\n            modal={false}\r\n            open={open}\r\n            onOpenChange={setOpen}\r\n        >\r\n            <DropdownMenu.Trigger>\r\n                {presentation === 'select' ? (\r\n                    <Button\r\n                        type={'button'}\r\n                        label={selectedFontSizeLabel}\r\n                        endIcon={'lucide:chevron-down'}\r\n                        aria-label={labels.textSizeTrigger}\r\n                        variant={'ghost'}\r\n                        color={'primary'}\r\n                        size={'sm'}\r\n                        className={TEXT_SIZE_MENU_STYLES.trigger}\r\n                        active={open}\r\n                        disabled={disabled}\r\n                    />\r\n                ) : (\r\n                    <IconButton\r\n                        type={'button'}\r\n                        icon={'lucide:text-cursor-input'}\r\n                        aria-label={labels.textSizeTrigger}\r\n                        variant={'ghost'}\r\n                        color={'primary'}\r\n                        size={'sm'}\r\n                        active={open}\r\n                        disabled={disabled}\r\n                    />\r\n                )}\r\n            </DropdownMenu.Trigger>\r\n            <DropdownMenu.Content\r\n                aria-label={labels.textSizeOptions}\r\n                side={'bottom'}\r\n                align={'start'}\r\n                width={'6rem'}\r\n            >\r\n                {(Object.keys(RICH_TEXT_FONT_SIZES) as RichTextFontSize[]).map(\r\n                    (fontSize) => (\r\n                        <DropdownMenu.Item\r\n                            key={fontSize}\r\n                            label={RICH_TEXT_FONT_SIZE_LABELS[fontSize]}\r\n                            active={fontSize === selectedFontSizeKey}\r\n                            onMouseDown={(event) => event.preventDefault()}\r\n                            onClick={() =>\r\n                                editor\r\n                                    .chain()\r\n                                    .focus()\r\n                                    .setFontSize(RICH_TEXT_FONT_SIZES[fontSize])\r\n                                    .run()\r\n                            }\r\n                        />\r\n                    ),\r\n                )}\r\n            </DropdownMenu.Content>\r\n        </DropdownMenu>\r\n    )\r\n}\r\n\r\nTextSizeMenu.displayName = 'RichTextEditor.TextAppearanceGroup.TextSizeMenu'\r\n\r\nexport default TextSizeMenu\r\n"],"names":["TextSizeMenu","presentation","open","setOpen","useState","editor","disabled","labels","useRichTextEditorContext","selectedFontSize","RICH_TEXT_FONT_SIZES","selectedFontSizeKey","fontSize","selectedFontSizeLabel","RICH_TEXT_FONT_SIZE_LABELS","jsxs","DropdownMenu","jsx","Button","TEXT_SIZE_MENU_STYLES","IconButton","event"],"mappings":"6oBAiBMA,EAAe,CAAC,CAAE,aAAAC,EAAe,YAAkC,CACrE,KAAM,CAACC,EAAMC,CAAO,EAAIC,EAAAA,SAAS,EAAK,EAChC,CAAE,OAAAC,EAAQ,SAAAC,EAAU,OAAAC,CAAA,EAAWC,EAAAA,yBAAA,EAErC,GAAI,CAACH,EACD,OAAO,KAGX,MAAMI,EACNJ,EAAO,cAAc,WAAW,EAAE,UAAYK,EAAAA,qBAAqB,GAC7DC,EACN,OAAO,KAAKD,sBAAoB,EAC9B,KAAME,GAAaF,EAAAA,qBAAqBE,CAAQ,IAAMH,CAAgB,EAElEI,EAAwBF,EACxBG,EAAAA,2BAA2BH,CAAmB,EAC9CG,EAAAA,2BAA2B,GAEjC,OACIC,EAAAA,KAACC,EAAA,CACG,MAAO,GACP,KAAAd,EACA,aAAcC,EAEd,SAAA,CAAAc,EAAAA,IAACD,EAAa,QAAb,CACI,SAAAf,IAAiB,SACdgB,EAAAA,IAACC,EAAA,CACG,KAAM,SACN,MAAOL,EACP,QAAS,sBACT,aAAYN,EAAO,gBACnB,QAAS,QACT,MAAO,UACP,KAAM,KACN,UAAWY,EAAAA,sBAAsB,QACjC,OAAQjB,EACR,SAAAI,CAAA,CAAA,EAGJW,EAAAA,IAACG,EAAA,CACG,KAAM,SACN,KAAM,2BACN,aAAYb,EAAO,gBACnB,QAAS,QACT,MAAO,UACP,KAAM,KACN,OAAQL,EACR,SAAAI,CAAA,CAAA,EAGZ,EACAW,EAAAA,IAACD,EAAa,QAAb,CACG,aAAYT,EAAO,gBACnB,KAAM,SACN,MAAO,QACP,MAAO,OAEL,SAAA,OAAO,KAAKG,EAAAA,oBAAoB,EAAyB,IACtDE,GACGK,EAAAA,IAACD,EAAa,KAAb,CAEG,MAAOF,EAAAA,2BAA2BF,CAAQ,EAC1C,OAAQA,IAAaD,EACrB,YAAcU,GAAUA,EAAM,eAAA,EAC9B,QAAS,IACLhB,EACK,QACA,QACA,YAAYK,EAAAA,qBAAqBE,CAAQ,CAAC,EAC1C,IAAA,CAAI,EATRA,CAAA,CAWT,CAER,CAAA,CACJ,CAAA,CAAA,CAGZ,EAEAZ,EAAa,YAAc"}

package/dist/components/forms/rich-text-editor/components/text-appearance-group/TextSizeMenu.d.ts

@@ -1,4 +1,10 @@
 import { TextSizeMenuProps } from './types/TextSizeMenu.props.ts';
+/**
+ * Font-size picker toolbar control for `TextAppearanceGroup`. Renders a
+ * `DropdownMenu` showing available rich-text font sizes. Use
+ * `presentation="select"` (default) for a labeled button trigger or
+ * `"icon"` for an icon-only trigger.
+ */
 declare const TextSizeMenu: {
     ({ presentation }: TextSizeMenuProps): import("react").JSX.Element | null;
     displayName: string;

package/dist/components/forms/rich-text-editor/components/text-appearance-group/TextSizeMenu.js.map

@@ -1 +1 @@
-{"version":3,"file":"TextSizeMenu.js","sources":["../../../../../../src/components/forms/rich-text-editor/components/text-appearance-group/TextSizeMenu.tsx"],"sourcesContent":["import { Button } from '@components/actions/button'\r\nimport { RICH_TEXT_FONT_SIZES } from '@components/forms/rich-text-editor/constants'\r\nimport { RICH_TEXT_FONT_SIZE_LABELS } from '@components/forms/rich-text-editor/constants/richTextFontSizes.const.ts'\r\nimport type { RichTextFontSize } from '@components/forms/rich-text-editor/types'\r\nimport { IconButton } from '@components/actions/icon-button'\r\nimport { DropdownMenu } from '@components/overlay/dropdown-menu'\r\nimport { useRichTextEditorContext } from '@components/forms/rich-text-editor/context/RichTextEditor.context.ts'\r\nimport { useState } from 'react'\r\nimport type { TextSizeMenuProps } from '@components/forms/rich-text-editor/components/text-appearance-group/types/TextSizeMenu.props.ts'\r\nimport { TEXT_SIZE_MENU_STYLES } from '@components/forms/rich-text-editor/components/text-appearance-group/styles/TextSizeMenu.css.ts'\r\n\r\nconst TextSizeMenu = ({ presentation = 'select' }: TextSizeMenuProps) => {\r\n    const [open, setOpen] = useState(false)\r\n    const { editor, disabled, labels } = useRichTextEditorContext()\r\n\r\n    if (!editor) {\r\n        return null\r\n    }\r\n\r\n    const selectedFontSize =\r\n    editor.getAttributes('textStyle').fontSize ?? RICH_TEXT_FONT_SIZES.md\r\n    const selectedFontSizeKey = (\r\n    Object.keys(RICH_TEXT_FONT_SIZES) as RichTextFontSize[]\r\n    ).find((fontSize) => RICH_TEXT_FONT_SIZES[fontSize] === selectedFontSize)\r\n\r\n    const selectedFontSizeLabel = selectedFontSizeKey\r\n        ? RICH_TEXT_FONT_SIZE_LABELS[selectedFontSizeKey]\r\n        : RICH_TEXT_FONT_SIZE_LABELS.md\r\n\r\n    return (\r\n        <DropdownMenu\r\n            modal={false}\r\n            open={open}\r\n            onOpenChange={setOpen}\r\n        >\r\n            <DropdownMenu.Trigger>\r\n                {presentation === 'select' ? (\r\n                    <Button\r\n                        type={'button'}\r\n                        label={selectedFontSizeLabel}\r\n                        endIcon={'lucide:chevron-down'}\r\n                        aria-label={labels.textSizeTrigger}\r\n                        variant={'ghost'}\r\n                        color={'primary'}\r\n                        size={'sm'}\r\n                        className={TEXT_SIZE_MENU_STYLES.trigger}\r\n                        active={open}\r\n                        disabled={disabled}\r\n                    />\r\n                ) : (\r\n                    <IconButton\r\n                        type={'button'}\r\n                        icon={'lucide:text-cursor-input'}\r\n                        aria-label={labels.textSizeTrigger}\r\n                        variant={'ghost'}\r\n                        color={'primary'}\r\n                        size={'sm'}\r\n                        active={open}\r\n                        disabled={disabled}\r\n                    />\r\n                )}\r\n            </DropdownMenu.Trigger>\r\n            <DropdownMenu.Content\r\n                aria-label={labels.textSizeOptions}\r\n                side={'bottom'}\r\n                align={'start'}\r\n                width={'6rem'}\r\n            >\r\n                {(Object.keys(RICH_TEXT_FONT_SIZES) as RichTextFontSize[]).map(\r\n                    (fontSize) => (\r\n                        <DropdownMenu.Item\r\n                            key={fontSize}\r\n                            label={RICH_TEXT_FONT_SIZE_LABELS[fontSize]}\r\n                            active={fontSize === selectedFontSizeKey}\r\n                            onMouseDown={(event) => event.preventDefault()}\r\n                            onClick={() =>\r\n                                editor\r\n                                    .chain()\r\n                                    .focus()\r\n                                    .setFontSize(RICH_TEXT_FONT_SIZES[fontSize])\r\n                                    .run()\r\n                            }\r\n                        />\r\n                    ),\r\n                )}\r\n            </DropdownMenu.Content>\r\n        </DropdownMenu>\r\n    )\r\n}\r\n\r\nTextSizeMenu.displayName = 'RichTextEditor.TextAppearanceGroup.TextSizeMenu'\r\n\r\nexport default TextSizeMenu\r\n"],"names":["TextSizeMenu","presentation","open","setOpen","useState","editor","disabled","labels","useRichTextEditorContext","selectedFontSize","RICH_TEXT_FONT_SIZES","selectedFontSizeKey","fontSize","selectedFontSizeLabel","RICH_TEXT_FONT_SIZE_LABELS","jsxs","DropdownMenu","jsx","Button","TEXT_SIZE_MENU_STYLES","IconButton","event"],"mappings":";;;;;;;;;;;;AAWA,MAAMA,IAAe,CAAC,EAAE,cAAAC,IAAe,eAAkC;AACrE,QAAM,CAACC,GAAMC,CAAO,IAAIC,EAAS,EAAK,GAChC,EAAE,QAAAC,GAAQ,UAAAC,GAAU,QAAAC,EAAA,IAAWC,EAAA;AAErC,MAAI,CAACH;AACD,WAAO;AAGX,QAAMI,IACNJ,EAAO,cAAc,WAAW,EAAE,YAAYK,EAAqB,IAC7DC,IACN,OAAO,KAAKD,CAAoB,EAC9B,KAAK,CAACE,MAAaF,EAAqBE,CAAQ,MAAMH,CAAgB,GAElEI,IAAwBF,IACxBG,EAA2BH,CAAmB,IAC9CG,EAA2B;AAEjC,SACI,gBAAAC;AAAA,IAACC;AAAA,IAAA;AAAA,MACG,OAAO;AAAA,MACP,MAAAd;AAAA,MACA,cAAcC;AAAA,MAEd,UAAA;AAAA,QAAA,gBAAAc,EAACD,EAAa,SAAb,EACI,UAAAf,MAAiB,WACd,gBAAAgB;AAAA,UAACC;AAAA,UAAA;AAAA,YACG,MAAM;AAAA,YACN,OAAOL;AAAA,YACP,SAAS;AAAA,YACT,cAAYN,EAAO;AAAA,YACnB,SAAS;AAAA,YACT,OAAO;AAAA,YACP,MAAM;AAAA,YACN,WAAWY,EAAsB;AAAA,YACjC,QAAQjB;AAAA,YACR,UAAAI;AAAA,UAAA;AAAA,QAAA,IAGJ,gBAAAW;AAAA,UAACG;AAAA,UAAA;AAAA,YACG,MAAM;AAAA,YACN,MAAM;AAAA,YACN,cAAYb,EAAO;AAAA,YACnB,SAAS;AAAA,YACT,OAAO;AAAA,YACP,MAAM;AAAA,YACN,QAAQL;AAAA,YACR,UAAAI;AAAA,UAAA;AAAA,QAAA,GAGZ;AAAA,QACA,gBAAAW;AAAA,UAACD,EAAa;AAAA,UAAb;AAAA,YACG,cAAYT,EAAO;AAAA,YACnB,MAAM;AAAA,YACN,OAAO;AAAA,YACP,OAAO;AAAA,YAEL,UAAA,OAAO,KAAKG,CAAoB,EAAyB;AAAA,cACvD,CAACE,MACG,gBAAAK;AAAA,gBAACD,EAAa;AAAA,gBAAb;AAAA,kBAEG,OAAOF,EAA2BF,CAAQ;AAAA,kBAC1C,QAAQA,MAAaD;AAAA,kBACrB,aAAa,CAACU,MAAUA,EAAM,eAAA;AAAA,kBAC9B,SAAS,MACLhB,EACK,QACA,QACA,YAAYK,EAAqBE,CAAQ,CAAC,EAC1C,IAAA;AAAA,gBAAI;AAAA,gBATRA;AAAA,cAAA;AAAA,YAWT;AAAA,UAER;AAAA,QAAA;AAAA,MACJ;AAAA,IAAA;AAAA,EAAA;AAGZ;AAEAZ,EAAa,cAAc;"}
+{"version":3,"file":"TextSizeMenu.js","sources":["../../../../../../src/components/forms/rich-text-editor/components/text-appearance-group/TextSizeMenu.tsx"],"sourcesContent":["import { Button } from '@components/actions/button'\r\nimport { RICH_TEXT_FONT_SIZES } from '@components/forms/rich-text-editor/constants'\r\nimport { RICH_TEXT_FONT_SIZE_LABELS } from '@components/forms/rich-text-editor/constants/richTextFontSizes.const.ts'\r\nimport type { RichTextFontSize } from '@components/forms/rich-text-editor/types'\r\nimport { IconButton } from '@components/actions/icon-button'\r\nimport { DropdownMenu } from '@components/overlay/dropdown-menu'\r\nimport { useRichTextEditorContext } from '@components/forms/rich-text-editor/context/RichTextEditor.context.ts'\r\nimport { useState } from 'react'\r\nimport type { TextSizeMenuProps } from '@components/forms/rich-text-editor/components/text-appearance-group/types/TextSizeMenu.props.ts'\r\nimport { TEXT_SIZE_MENU_STYLES } from '@components/forms/rich-text-editor/components/text-appearance-group/styles/TextSizeMenu.css.ts'\r\n\r\n/**\r\n * Font-size picker toolbar control for `TextAppearanceGroup`. Renders a\r\n * `DropdownMenu` showing available rich-text font sizes. Use\r\n * `presentation=\"select\"` (default) for a labeled button trigger or\r\n * `\"icon\"` for an icon-only trigger.\r\n */\r\nconst TextSizeMenu = ({ presentation = 'select' }: TextSizeMenuProps) => {\r\n    const [open, setOpen] = useState(false)\r\n    const { editor, disabled, labels } = useRichTextEditorContext()\r\n\r\n    if (!editor) {\r\n        return null\r\n    }\r\n\r\n    const selectedFontSize =\r\n    editor.getAttributes('textStyle').fontSize ?? RICH_TEXT_FONT_SIZES.md\r\n    const selectedFontSizeKey = (\r\n    Object.keys(RICH_TEXT_FONT_SIZES) as RichTextFontSize[]\r\n    ).find((fontSize) => RICH_TEXT_FONT_SIZES[fontSize] === selectedFontSize)\r\n\r\n    const selectedFontSizeLabel = selectedFontSizeKey\r\n        ? RICH_TEXT_FONT_SIZE_LABELS[selectedFontSizeKey]\r\n        : RICH_TEXT_FONT_SIZE_LABELS.md\r\n\r\n    return (\r\n        <DropdownMenu\r\n            modal={false}\r\n            open={open}\r\n            onOpenChange={setOpen}\r\n        >\r\n            <DropdownMenu.Trigger>\r\n                {presentation === 'select' ? (\r\n                    <Button\r\n                        type={'button'}\r\n                        label={selectedFontSizeLabel}\r\n                        endIcon={'lucide:chevron-down'}\r\n                        aria-label={labels.textSizeTrigger}\r\n                        variant={'ghost'}\r\n                        color={'primary'}\r\n                        size={'sm'}\r\n                        className={TEXT_SIZE_MENU_STYLES.trigger}\r\n                        active={open}\r\n                        disabled={disabled}\r\n                    />\r\n                ) : (\r\n                    <IconButton\r\n                        type={'button'}\r\n                        icon={'lucide:text-cursor-input'}\r\n                        aria-label={labels.textSizeTrigger}\r\n                        variant={'ghost'}\r\n                        color={'primary'}\r\n                        size={'sm'}\r\n                        active={open}\r\n                        disabled={disabled}\r\n                    />\r\n                )}\r\n            </DropdownMenu.Trigger>\r\n            <DropdownMenu.Content\r\n                aria-label={labels.textSizeOptions}\r\n                side={'bottom'}\r\n                align={'start'}\r\n                width={'6rem'}\r\n            >\r\n                {(Object.keys(RICH_TEXT_FONT_SIZES) as RichTextFontSize[]).map(\r\n                    (fontSize) => (\r\n                        <DropdownMenu.Item\r\n                            key={fontSize}\r\n                            label={RICH_TEXT_FONT_SIZE_LABELS[fontSize]}\r\n                            active={fontSize === selectedFontSizeKey}\r\n                            onMouseDown={(event) => event.preventDefault()}\r\n                            onClick={() =>\r\n                                editor\r\n                                    .chain()\r\n                                    .focus()\r\n                                    .setFontSize(RICH_TEXT_FONT_SIZES[fontSize])\r\n                                    .run()\r\n                            }\r\n                        />\r\n                    ),\r\n                )}\r\n            </DropdownMenu.Content>\r\n        </DropdownMenu>\r\n    )\r\n}\r\n\r\nTextSizeMenu.displayName = 'RichTextEditor.TextAppearanceGroup.TextSizeMenu'\r\n\r\nexport default TextSizeMenu\r\n"],"names":["TextSizeMenu","presentation","open","setOpen","useState","editor","disabled","labels","useRichTextEditorContext","selectedFontSize","RICH_TEXT_FONT_SIZES","selectedFontSizeKey","fontSize","selectedFontSizeLabel","RICH_TEXT_FONT_SIZE_LABELS","jsxs","DropdownMenu","jsx","Button","TEXT_SIZE_MENU_STYLES","IconButton","event"],"mappings":";;;;;;;;;;;;AAiBA,MAAMA,IAAe,CAAC,EAAE,cAAAC,IAAe,eAAkC;AACrE,QAAM,CAACC,GAAMC,CAAO,IAAIC,EAAS,EAAK,GAChC,EAAE,QAAAC,GAAQ,UAAAC,GAAU,QAAAC,EAAA,IAAWC,EAAA;AAErC,MAAI,CAACH;AACD,WAAO;AAGX,QAAMI,IACNJ,EAAO,cAAc,WAAW,EAAE,YAAYK,EAAqB,IAC7DC,IACN,OAAO,KAAKD,CAAoB,EAC9B,KAAK,CAACE,MAAaF,EAAqBE,CAAQ,MAAMH,CAAgB,GAElEI,IAAwBF,IACxBG,EAA2BH,CAAmB,IAC9CG,EAA2B;AAEjC,SACI,gBAAAC;AAAA,IAACC;AAAA,IAAA;AAAA,MACG,OAAO;AAAA,MACP,MAAAd;AAAA,MACA,cAAcC;AAAA,MAEd,UAAA;AAAA,QAAA,gBAAAc,EAACD,EAAa,SAAb,EACI,UAAAf,MAAiB,WACd,gBAAAgB;AAAA,UAACC;AAAA,UAAA;AAAA,YACG,MAAM;AAAA,YACN,OAAOL;AAAA,YACP,SAAS;AAAA,YACT,cAAYN,EAAO;AAAA,YACnB,SAAS;AAAA,YACT,OAAO;AAAA,YACP,MAAM;AAAA,YACN,WAAWY,EAAsB;AAAA,YACjC,QAAQjB;AAAA,YACR,UAAAI;AAAA,UAAA;AAAA,QAAA,IAGJ,gBAAAW;AAAA,UAACG;AAAA,UAAA;AAAA,YACG,MAAM;AAAA,YACN,MAAM;AAAA,YACN,cAAYb,EAAO;AAAA,YACnB,SAAS;AAAA,YACT,OAAO;AAAA,YACP,MAAM;AAAA,YACN,QAAQL;AAAA,YACR,UAAAI;AAAA,UAAA;AAAA,QAAA,GAGZ;AAAA,QACA,gBAAAW;AAAA,UAACD,EAAa;AAAA,UAAb;AAAA,YACG,cAAYT,EAAO;AAAA,YACnB,MAAM;AAAA,YACN,OAAO;AAAA,YACP,OAAO;AAAA,YAEL,UAAA,OAAO,KAAKG,CAAoB,EAAyB;AAAA,cACvD,CAACE,MACG,gBAAAK;AAAA,gBAACD,EAAa;AAAA,gBAAb;AAAA,kBAEG,OAAOF,EAA2BF,CAAQ;AAAA,kBAC1C,QAAQA,MAAaD;AAAA,kBACrB,aAAa,CAACU,MAAUA,EAAM,eAAA;AAAA,kBAC9B,SAAS,MACLhB,EACK,QACA,QACA,YAAYK,EAAqBE,CAAQ,CAAC,EAC1C,IAAA;AAAA,gBAAI;AAAA,gBATRA;AAAA,cAAA;AAAA,YAWT;AAAA,UAER;AAAA,QAAA;AAAA,MACJ;AAAA,IAAA;AAAA,EAAA;AAGZ;AAEAZ,EAAa,cAAc;"}

package/dist/components/forms/rich-text-editor/components/text-appearance-group/styles/TextAppearanceGroup.css.cjs

@@ -1,2 +1,2 @@
-"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});require('../../../../../../ui-kit125.css');require('../../../../../../ui-kit.css');;/* empty css                                                    */;/* empty css                                         */var e={root:"_1e8qzt90"};exports.TEXT_APPEARANCE_GROUP_STYLES=e;
+"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});require('../../../../../../ui-kit119.css');require('../../../../../../ui-kit.css');;/* empty css                                                    */;/* empty css                                         */var e={root:"_1e8qzt90"};exports.TEXT_APPEARANCE_GROUP_STYLES=e;
 //# sourceMappingURL=TextAppearanceGroup.css.cjs.map

package/dist/components/forms/rich-text-editor/components/text-appearance-group/styles/TextAppearanceGroup.css.js

@@ -1,4 +1,4 @@
-import '../../../../../../ui-kit125.css';import '../../../../../../ui-kit.css';/* empty css                                                  */
+import '../../../../../../ui-kit119.css';import '../../../../../../ui-kit.css';/* empty css                                                  */
 /* empty css                                       */
 var t = { root: "_1e8qzt90" };
 export {

package/dist/components/forms/rich-text-editor/components/text-appearance-group/styles/TextColorMenu.css.cjs

@@ -1,2 +1,2 @@
-"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});require('../../../../../../ui-kit145.css');require('../../../../../../ui-kit.css');;/* empty css                                                    */;/* empty css                                   */var e={colorPicker:"pv8jx80",paletteGrid:"pv8jx81",paletteColumn:"pv8jx82",colorSwatch:"pv8jx83",colorCheck:"pv8jx84",selectedColor:"pv8jx85"};exports.TEXT_COLOR_MENU_STYLES=e;
+"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});require('../../../../../../ui-kit146.css');require('../../../../../../ui-kit.css');;/* empty css                                                    */;/* empty css                                   */var e={colorPicker:"pv8jx80",paletteGrid:"pv8jx81",paletteColumn:"pv8jx82",colorSwatch:"pv8jx83",colorCheck:"pv8jx84",selectedColor:"pv8jx85"};exports.TEXT_COLOR_MENU_STYLES=e;
 //# sourceMappingURL=TextColorMenu.css.cjs.map