@frontify/fondue 12.0.0-beta.12 → 12.0.0-beta.14
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
- package/dist/components/AssetInput/AssetInput.d.ts +2 -0
- package/dist/components/AssetInput/AssetInput.es.js +33 -29
- package/dist/components/AssetInput/AssetInput.es.js.map +1 -1
- package/dist/components/AssetInput/SingleAsset/AssetSubline.d.ts +1 -1
- package/dist/components/AssetInput/SingleAsset/AssetSubline.es.js +25 -16
- package/dist/components/AssetInput/SingleAsset/AssetSubline.es.js.map +1 -1
- package/dist/components/AssetInput/SingleAsset/SelectedAsset.d.ts +2 -2
- package/dist/components/AssetInput/SingleAsset/SelectedAsset.es.js +46 -44
- package/dist/components/AssetInput/SingleAsset/SelectedAsset.es.js.map +1 -1
- package/dist/components/RichTextEditor/Plugins/GeneratePlugins.es.js +17 -21
- package/dist/components/RichTextEditor/Plugins/GeneratePlugins.es.js.map +1 -1
- package/dist/components/RichTextEditor/RichTextEditor.d.ts +0 -1
- package/dist/components/RichTextEditor/RichTextEditor.es.js +54 -76
- package/dist/components/RichTextEditor/RichTextEditor.es.js.map +1 -1
- package/dist/components/RichTextEditor/Toolbar/index.d.ts +1 -1
- package/dist/components/RichTextEditor/Toolbar/index.es.js +19 -18
- package/dist/components/RichTextEditor/Toolbar/index.es.js.map +1 -1
- package/dist/components/RichTextEditor/Toolbar/types.d.ts +0 -2
- package/dist/components/RichTextEditor/context/EditorResizeContext.es.js +13 -25
- package/dist/components/RichTextEditor/context/EditorResizeContext.es.js.map +1 -1
- package/dist/components/RichTextEditor/context/RichTextEditorContext.d.ts +1 -1
- package/dist/components/RichTextEditor/context/RichTextEditorContext.es.js +16 -17
- package/dist/components/RichTextEditor/context/RichTextEditorContext.es.js.map +1 -1
- package/dist/components/RichTextEditor/hooks/useEditorState.d.ts +4 -1
- package/dist/components/RichTextEditor/hooks/useEditorState.es.js +12 -11
- package/dist/components/RichTextEditor/hooks/useEditorState.es.js.map +1 -1
- package/dist/components/RichTextEditor/serializer/serializeToHtml.es.js +1 -1
- package/dist/components/RichTextEditor/serializer/serializeToHtml.es.js.map +1 -1
- package/dist/components/RichTextEditor/utils/parseRawValue.d.ts +6 -1
- package/dist/components/RichTextEditor/utils/parseRawValue.es.js +11 -11
- package/dist/components/RichTextEditor/utils/parseRawValue.es.js.map +1 -1
- package/dist/components/ScrollWrapper/ScrollWrapper.es.js +1 -1
- package/dist/components/Table/TableCell.es.js +1 -1
- package/dist/components/Table/TableColumnHeader.es.js +1 -1
- package/dist/components/Tree/utils/mocks.es.js +1 -1
- package/dist/index.cjs.js +4 -4
- package/dist/index.cjs.js.map +1 -1
- package/dist/index.umd.js +4 -4
- package/dist/index.umd.js.map +1 -1
- package/dist/styles.css +1 -1
- package/package.json +1 -1
|
@@ -48,6 +48,8 @@ export declare type AssetInputProps = {
|
|
|
48
48
|
numberOfLocations?: number;
|
|
49
49
|
actions?: ActionMenuProps['menuBlocks'];
|
|
50
50
|
isLoading?: boolean;
|
|
51
|
+
hideSize?: boolean;
|
|
52
|
+
hideExtension?: boolean;
|
|
51
53
|
onUploadClick?: (files: FileList) => void;
|
|
52
54
|
onLibraryClick?: () => void;
|
|
53
55
|
onMultiAssetClick?: () => void;
|
|
@@ -1,5 +1,5 @@
|
|
|
1
|
-
import { Button as
|
|
2
|
-
import { ButtonStyle as
|
|
1
|
+
import { Button as g } from "../Button/Button.es.js";
|
|
2
|
+
import { ButtonStyle as v, ButtonEmphasis as x } from "../Button/ButtonTypes.es.js";
|
|
3
3
|
import "../../foundation/Icon/Generated/IconAdobeCreativeCloud.es.js";
|
|
4
4
|
import "../../foundation/Icon/Generated/IconAdobeCreativeCloud12.es.js";
|
|
5
5
|
import "../../foundation/Icon/Generated/IconAdobeCreativeCloud16.es.js";
|
|
@@ -84,7 +84,7 @@ import "../../foundation/Icon/Generated/IconArrowCircleDown16.es.js";
|
|
|
84
84
|
import "../../foundation/Icon/Generated/IconArrowCircleDown20.es.js";
|
|
85
85
|
import "../../foundation/Icon/Generated/IconArrowCircleDown24.es.js";
|
|
86
86
|
import "../../foundation/Icon/Generated/IconArrowCircleDown32.es.js";
|
|
87
|
-
import
|
|
87
|
+
import E from "../../foundation/Icon/Generated/IconArrowCircleUp.es.js";
|
|
88
88
|
import "../../foundation/Icon/Generated/IconArrowCircleUp12.es.js";
|
|
89
89
|
import "../../foundation/Icon/Generated/IconArrowCircleUp16.es.js";
|
|
90
90
|
import "../../foundation/Icon/Generated/IconArrowCircleUp20.es.js";
|
|
@@ -820,7 +820,7 @@ import "../../foundation/Icon/Generated/IconImage16.es.js";
|
|
|
820
820
|
import "../../foundation/Icon/Generated/IconImage20.es.js";
|
|
821
821
|
import "../../foundation/Icon/Generated/IconImage24.es.js";
|
|
822
822
|
import "../../foundation/Icon/Generated/IconImage32.es.js";
|
|
823
|
-
import
|
|
823
|
+
import k from "../../foundation/Icon/Generated/IconImageStack.es.js";
|
|
824
824
|
import "../../foundation/Icon/Generated/IconImageStack12.es.js";
|
|
825
825
|
import "../../foundation/Icon/Generated/IconImageStack16.es.js";
|
|
826
826
|
import "../../foundation/Icon/Generated/IconImageStack20.es.js";
|
|
@@ -1662,33 +1662,37 @@ import "../../foundation/Icon/Generated/IconWorkflowShapes24.es.js";
|
|
|
1662
1662
|
import "../../foundation/Icon/Generated/IconWorkflowShapes32.es.js";
|
|
1663
1663
|
import t from "react";
|
|
1664
1664
|
import "../../foundation/Icon/IconsMap.es.js";
|
|
1665
|
-
import { IconSize as
|
|
1666
|
-
import { useMemoizedId as
|
|
1665
|
+
import { IconSize as S } from "../../foundation/Icon/IconSize.es.js";
|
|
1666
|
+
import { useMemoizedId as N } from "../../hooks/useMemoizedId.es.js";
|
|
1667
1667
|
import { merge as p } from "../../utilities/merge.es.js";
|
|
1668
|
-
import { MultiAssetPreview as
|
|
1669
|
-
import { SelectedAsset as
|
|
1670
|
-
var
|
|
1671
|
-
const
|
|
1668
|
+
import { MultiAssetPreview as I } from "./MultiAssetPreview/MultiAssetPreview.es.js";
|
|
1669
|
+
import { SelectedAsset as B } from "./SingleAsset/SelectedAsset.es.js";
|
|
1670
|
+
var z = /* @__PURE__ */ ((r) => (r.Small = "Small", r.Large = "Large", r))(z || {});
|
|
1671
|
+
const B3 = ({
|
|
1672
1672
|
assets: r = [],
|
|
1673
1673
|
numberOfLocations: c = 1,
|
|
1674
1674
|
actions: e = [],
|
|
1675
1675
|
size: n = "Small",
|
|
1676
1676
|
isLoading: a = !1,
|
|
1677
|
+
hideSize: d = !1,
|
|
1678
|
+
hideExtension: f = !1,
|
|
1677
1679
|
onLibraryClick: o,
|
|
1678
1680
|
onUploadClick: m,
|
|
1679
1681
|
onMultiAssetClick: i,
|
|
1680
|
-
acceptFileType:
|
|
1682
|
+
acceptFileType: u
|
|
1681
1683
|
}) => {
|
|
1682
|
-
const l = r.length,
|
|
1683
|
-
const
|
|
1684
|
-
|
|
1684
|
+
const l = r.length, s = N(), h = (b) => {
|
|
1685
|
+
const w = b.target.files;
|
|
1686
|
+
w && m && m(w);
|
|
1685
1687
|
};
|
|
1686
|
-
return (a || l === 1) && e ? /* @__PURE__ */ t.createElement(
|
|
1688
|
+
return (a || l === 1) && e ? /* @__PURE__ */ t.createElement(B, {
|
|
1687
1689
|
asset: r[0],
|
|
1688
1690
|
size: n,
|
|
1689
1691
|
actions: e,
|
|
1690
|
-
isLoading: a
|
|
1691
|
-
|
|
1692
|
+
isLoading: a,
|
|
1693
|
+
hideExtension: f,
|
|
1694
|
+
hideSize: d
|
|
1695
|
+
}) : l > 1 && i ? /* @__PURE__ */ t.createElement(I, {
|
|
1692
1696
|
assets: r,
|
|
1693
1697
|
onClick: i,
|
|
1694
1698
|
numberOfLocations: c
|
|
@@ -1703,30 +1707,30 @@ const N3 = ({
|
|
|
1703
1707
|
"data-test-id": "asset-input-upload"
|
|
1704
1708
|
}, /* @__PURE__ */ t.createElement("label", {
|
|
1705
1709
|
className: "tw-relative tw-cursor-pointer tw-rounded tw-flex tw-items-center tw-justify-center tw-px-4 tw-h-9 tw-text-s tw-bg-transparent hover:tw-bg-black-10 hover:tw-text-black active:tw-bg-black-20 active:tw-text-black dark:tw-text-white dark:hover:tw-bg-black-superdark dark:active:tw-bg-black-superdark dark:hover:tw-text-white tw-font-medium tw-text-black",
|
|
1706
|
-
htmlFor:
|
|
1710
|
+
htmlFor: s
|
|
1707
1711
|
}, /* @__PURE__ */ t.createElement("span", {
|
|
1708
1712
|
className: "tw--ml-1 tw-mr-1.5"
|
|
1709
|
-
}, /* @__PURE__ */ t.createElement(
|
|
1710
|
-
size:
|
|
1713
|
+
}, /* @__PURE__ */ t.createElement(E, {
|
|
1714
|
+
size: S.Size20
|
|
1711
1715
|
})), "Upload"), /* @__PURE__ */ t.createElement("input", {
|
|
1712
|
-
id:
|
|
1716
|
+
id: s,
|
|
1713
1717
|
className: "tw-hidden",
|
|
1714
1718
|
type: "file",
|
|
1715
|
-
accept:
|
|
1719
|
+
accept: u,
|
|
1716
1720
|
multiple: !!i,
|
|
1717
|
-
onChange:
|
|
1721
|
+
onChange: h
|
|
1718
1722
|
})), o && /* @__PURE__ */ t.createElement("div", {
|
|
1719
1723
|
className: p(["tw-flex tw-flex-col tw-h-8", m && "tw-pl-3"]),
|
|
1720
1724
|
"data-test-id": "asset-input-library"
|
|
1721
|
-
}, /* @__PURE__ */ t.createElement(
|
|
1722
|
-
style:
|
|
1725
|
+
}, /* @__PURE__ */ t.createElement(g, {
|
|
1726
|
+
style: v.Default,
|
|
1723
1727
|
onClick: o,
|
|
1724
|
-
emphasis:
|
|
1725
|
-
icon: /* @__PURE__ */ t.createElement(
|
|
1728
|
+
emphasis: x.Weak,
|
|
1729
|
+
icon: /* @__PURE__ */ t.createElement(k, null)
|
|
1726
1730
|
}, "Browse")));
|
|
1727
1731
|
};
|
|
1728
1732
|
export {
|
|
1729
|
-
|
|
1730
|
-
|
|
1733
|
+
B3 as AssetInput,
|
|
1734
|
+
z as AssetInputSize
|
|
1731
1735
|
};
|
|
1732
1736
|
//# sourceMappingURL=AssetInput.es.js.map
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"AssetInput.es.js","sources":["../../../src/components/AssetInput/AssetInput.tsx"],"sourcesContent":["/* (c) Copyright Frontify Ltd., all rights reserved. */\n\nimport { ActionMenuProps } from '@components/ActionMenu/ActionMenu/ActionMenu';\nimport { Button, ButtonEmphasis, ButtonStyle } from '@components/Button';\nimport { IconArrowCircleUp, IconImageStack } from '@foundation/Icon/';\nimport { IconProps } from '@foundation/Icon/IconProps';\nimport { IconSize } from '@foundation/Icon/IconSize';\nimport { useMemoizedId } from '@hooks/useMemoizedId';\nimport { merge } from '@utilities/merge';\nimport React, { ChangeEvent, FC, ReactElement } from 'react';\nimport { MultiAssetPreview } from './MultiAssetPreview';\nimport { SelectedAsset } from './SingleAsset/SelectedAsset';\n\ntype BaseAsset = {\n name: string;\n};\n\nexport type ImageAsset = {\n type: 'image' | 'logo';\n name: string;\n extension: string;\n src?: string;\n alt?: string;\n icon?: undefined;\n size: number;\n};\n\ntype OtherAsset = BaseAsset & {\n type: 'audio';\n extension: string;\n src?: undefined;\n alt?: undefined;\n icon?: undefined;\n size: number;\n};\n\ntype IconAsset = BaseAsset & {\n type: 'icon';\n extension?: undefined;\n src?: undefined;\n alt?: undefined;\n icon: ReactElement<IconProps>;\n size?: undefined;\n};\n\nexport type UploadSource = { source: 'upload'; sourceName?: undefined };\nexport type LibrarySource = { source: 'library'; sourceName: string };\n\nexport enum AssetInputSize {\n Small = 'Small',\n Large = 'Large',\n}\n\nexport type AssetType =\n | (ImageAsset & UploadSource)\n | (ImageAsset & LibrarySource)\n | (IconAsset & UploadSource)\n | (IconAsset & LibrarySource)\n | (OtherAsset & UploadSource)\n | (OtherAsset & LibrarySource);\n\nexport type AssetInputProps = {\n assets?: AssetType[];\n size: AssetInputSize;\n numberOfLocations?: number;\n actions?: ActionMenuProps['menuBlocks'];\n isLoading?: boolean;\n onUploadClick?: (files: FileList) => void;\n onLibraryClick?: () => void;\n onMultiAssetClick?: () => void;\n acceptFileType?: string;\n};\n\nexport const AssetInput: FC<AssetInputProps> = ({\n assets = [],\n numberOfLocations = 1,\n actions = [],\n size = AssetInputSize.Small,\n isLoading = false,\n onLibraryClick,\n onUploadClick,\n onMultiAssetClick,\n acceptFileType,\n}) => {\n const assetsLength = assets.length;\n const id = useMemoizedId();\n\n const onFileChange = (event: ChangeEvent<HTMLInputElement>) => {\n const files = event.target.files;\n\n if (files && onUploadClick) {\n onUploadClick(files);\n }\n };\n\n if ((isLoading || assetsLength === 1) && actions) {\n return <SelectedAsset
|
|
1
|
+
{"version":3,"file":"AssetInput.es.js","sources":["../../../src/components/AssetInput/AssetInput.tsx"],"sourcesContent":["/* (c) Copyright Frontify Ltd., all rights reserved. */\n\nimport { ActionMenuProps } from '@components/ActionMenu/ActionMenu/ActionMenu';\nimport { Button, ButtonEmphasis, ButtonStyle } from '@components/Button';\nimport { IconArrowCircleUp, IconImageStack } from '@foundation/Icon/';\nimport { IconProps } from '@foundation/Icon/IconProps';\nimport { IconSize } from '@foundation/Icon/IconSize';\nimport { useMemoizedId } from '@hooks/useMemoizedId';\nimport { merge } from '@utilities/merge';\nimport React, { ChangeEvent, FC, ReactElement } from 'react';\nimport { MultiAssetPreview } from './MultiAssetPreview';\nimport { SelectedAsset } from './SingleAsset/SelectedAsset';\n\ntype BaseAsset = {\n name: string;\n};\n\nexport type ImageAsset = {\n type: 'image' | 'logo';\n name: string;\n extension: string;\n src?: string;\n alt?: string;\n icon?: undefined;\n size: number;\n};\n\ntype OtherAsset = BaseAsset & {\n type: 'audio';\n extension: string;\n src?: undefined;\n alt?: undefined;\n icon?: undefined;\n size: number;\n};\n\ntype IconAsset = BaseAsset & {\n type: 'icon';\n extension?: undefined;\n src?: undefined;\n alt?: undefined;\n icon: ReactElement<IconProps>;\n size?: undefined;\n};\n\nexport type UploadSource = { source: 'upload'; sourceName?: undefined };\nexport type LibrarySource = { source: 'library'; sourceName: string };\n\nexport enum AssetInputSize {\n Small = 'Small',\n Large = 'Large',\n}\n\nexport type AssetType =\n | (ImageAsset & UploadSource)\n | (ImageAsset & LibrarySource)\n | (IconAsset & UploadSource)\n | (IconAsset & LibrarySource)\n | (OtherAsset & UploadSource)\n | (OtherAsset & LibrarySource);\n\nexport type AssetInputProps = {\n assets?: AssetType[];\n size: AssetInputSize;\n numberOfLocations?: number;\n actions?: ActionMenuProps['menuBlocks'];\n isLoading?: boolean;\n hideSize?: boolean;\n hideExtension?: boolean;\n onUploadClick?: (files: FileList) => void;\n onLibraryClick?: () => void;\n onMultiAssetClick?: () => void;\n acceptFileType?: string;\n};\n\nexport const AssetInput: FC<AssetInputProps> = ({\n assets = [],\n numberOfLocations = 1,\n actions = [],\n size = AssetInputSize.Small,\n isLoading = false,\n hideSize = false,\n hideExtension = false,\n onLibraryClick,\n onUploadClick,\n onMultiAssetClick,\n acceptFileType,\n}) => {\n const assetsLength = assets.length;\n const id = useMemoizedId();\n\n const onFileChange = (event: ChangeEvent<HTMLInputElement>) => {\n const files = event.target.files;\n\n if (files && onUploadClick) {\n onUploadClick(files);\n }\n };\n\n if ((isLoading || assetsLength === 1) && actions) {\n return (\n <SelectedAsset\n asset={assets[0]}\n size={size}\n actions={actions}\n isLoading={isLoading}\n hideExtension={hideExtension}\n hideSize={hideSize}\n />\n );\n }\n\n if (assetsLength > 1 && onMultiAssetClick) {\n return <MultiAssetPreview assets={assets} onClick={onMultiAssetClick} numberOfLocations={numberOfLocations} />;\n }\n\n return (\n <div\n data-test-id=\"asset-input-placeholder\"\n className={merge([\n 'tw-grid tw-p-3 tw-border tw-border-dashed tw-border-black-10 tw-rounded',\n onUploadClick && onLibraryClick ? 'tw-grid-cols-2 tw-divide-x tw-divide-black-10' : 'tw-grid-cols-1',\n ])}\n >\n {onUploadClick && (\n <div\n className={merge(['tw-flex tw-flex-col tw-h-8', onLibraryClick && 'tw-pr-3'])}\n data-test-id=\"asset-input-upload\"\n >\n <label\n className=\"tw-relative tw-cursor-pointer tw-rounded tw-flex tw-items-center tw-justify-center tw-px-4 tw-h-9 tw-text-s tw-bg-transparent hover:tw-bg-black-10 hover:tw-text-black active:tw-bg-black-20 active:tw-text-black dark:tw-text-white dark:hover:tw-bg-black-superdark dark:active:tw-bg-black-superdark dark:hover:tw-text-white tw-font-medium tw-text-black\"\n htmlFor={id}\n >\n <span className=\"tw--ml-1 tw-mr-1.5\">\n <IconArrowCircleUp size={IconSize.Size20} />\n </span>\n Upload\n </label>\n <input\n id={id}\n className=\"tw-hidden\"\n type=\"file\"\n accept={acceptFileType}\n multiple={!!onMultiAssetClick}\n onChange={onFileChange}\n />\n </div>\n )}\n {onLibraryClick && (\n <div\n className={merge(['tw-flex tw-flex-col tw-h-8', onUploadClick && 'tw-pl-3'])}\n data-test-id=\"asset-input-library\"\n >\n <Button\n style={ButtonStyle.Default}\n onClick={onLibraryClick}\n emphasis={ButtonEmphasis.Weak}\n icon={<IconImageStack />}\n >\n Browse\n </Button>\n </div>\n )}\n </div>\n );\n};\n"],"names":[],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;AAgDY,IAAA,sBAAA,MACA,GAAA,QAAA,SACA,EAAA,QAAA,SAFA,IAAA,KAAA,CAAA,CAAA;AA2BL,MAAM,KAAkC,CAAC;AAAA,EAC5C,YAAS,CAAC;AAAA,EACV,uBAAoB;AAAA,EACpB,aAAU,CAAC;AAAA,EACX,UAAO;AAAA,EACP,eAAY;AAAA,EACZ,cAAW;AAAA,EACX,mBAAgB;AAAA,EAChB;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,MACE;AACF,QAAM,IAAe,EAAO,QACtB,IAAK,KAEL,IAAe,CAAC,MAAyC;AACrD,UAAA,IAAQ,EAAM,OAAO;AAE3B,IAAI,KAAS,KACT,EAAc,CAAK;AAAA,EACvB;AAGC,SAAA,MAAa,MAAiB,MAAM,IAEhC,kBAAA,cAAA,GAAA;AAAA,IACG,OAAO,EAAO;AAAA,IACd;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,EAAA,CACJ,IAIJ,IAAe,KAAK,IACZ,kBAAA,cAAA,GAAA;AAAA,IAAkB;AAAA,IAAgB,SAAS;AAAA,IAAmB;AAAA,EAAA,CAAsC,IAI3G,kBAAA,cAAA,OAAA;AAAA,IACG,gBAAa;AAAA,IACb,WAAW,EAAM;AAAA,MACb;AAAA,MACA,KAAiB,IAAiB,kDAAkD;AAAA,IAAA,CACvF;AAAA,EAAA,GAEA,KACI,kBAAA,cAAA,OAAA;AAAA,IACG,WAAW,EAAM,CAAC,8BAA8B,KAAkB,SAAS,CAAC;AAAA,IAC5E,gBAAa;AAAA,EAAA,GAEZ,kBAAA,cAAA,SAAA;AAAA,IACG,WAAU;AAAA,IACV,SAAS;AAAA,EAAA,GAER,kBAAA,cAAA,QAAA;AAAA,IAAK,WAAU;AAAA,EAAA,GACX,kBAAA,cAAA,GAAA;AAAA,IAAkB,MAAM,EAAS;AAAA,EAAQ,CAAA,CAC9C,GAAO,QAEX,GACC,kBAAA,cAAA,SAAA;AAAA,IACG;AAAA,IACA,WAAU;AAAA,IACV,MAAK;AAAA,IACL,QAAQ;AAAA,IACR,UAAU,CAAC,CAAC;AAAA,IACZ,UAAU;AAAA,EACd,CAAA,CACJ,GAEH,KACI,kBAAA,cAAA,OAAA;AAAA,IACG,WAAW,EAAM,CAAC,8BAA8B,KAAiB,SAAS,CAAC;AAAA,IAC3E,gBAAa;AAAA,EAAA,GAEZ,kBAAA,cAAA,GAAA;AAAA,IACG,OAAO,EAAY;AAAA,IACnB,SAAS;AAAA,IACT,UAAU,EAAe;AAAA,IACzB,sCAAO,GAAe,IAAA;AAAA,EAAA,GACzB,QAED,CACJ,CAER;AAER;"}
|
|
@@ -1,6 +1,6 @@
|
|
|
1
1
|
import { FC } from 'react';
|
|
2
2
|
import { AssetInputProps } from '../AssetInput';
|
|
3
3
|
import { SelectedAssetProps } from './SelectedAsset';
|
|
4
|
-
declare type AssetSublineProps = Pick<AssetInputProps, 'isLoading'> & Pick<SelectedAssetProps, 'asset'>;
|
|
4
|
+
declare type AssetSublineProps = Pick<AssetInputProps, 'isLoading' | 'hideSize' | 'hideExtension'> & Pick<SelectedAssetProps, 'asset'>;
|
|
5
5
|
export declare const AssetSubline: FC<AssetSublineProps>;
|
|
6
6
|
export {};
|
|
@@ -1,4 +1,4 @@
|
|
|
1
|
-
import r, { Fragment as
|
|
1
|
+
import r, { Fragment as l } from "react";
|
|
2
2
|
import "../../../foundation/Icon/Generated/IconAdobeCreativeCloud.es.js";
|
|
3
3
|
import "../../../foundation/Icon/Generated/IconAdobeCreativeCloud12.es.js";
|
|
4
4
|
import "../../../foundation/Icon/Generated/IconAdobeCreativeCloud16.es.js";
|
|
@@ -83,7 +83,7 @@ import "../../../foundation/Icon/Generated/IconArrowCircleDown16.es.js";
|
|
|
83
83
|
import "../../../foundation/Icon/Generated/IconArrowCircleDown20.es.js";
|
|
84
84
|
import "../../../foundation/Icon/Generated/IconArrowCircleDown24.es.js";
|
|
85
85
|
import "../../../foundation/Icon/Generated/IconArrowCircleDown32.es.js";
|
|
86
|
-
import
|
|
86
|
+
import n from "../../../foundation/Icon/Generated/IconArrowCircleUp.es.js";
|
|
87
87
|
import "../../../foundation/Icon/Generated/IconArrowCircleUp12.es.js";
|
|
88
88
|
import "../../../foundation/Icon/Generated/IconArrowCircleUp16.es.js";
|
|
89
89
|
import "../../../foundation/Icon/Generated/IconArrowCircleUp20.es.js";
|
|
@@ -819,7 +819,7 @@ import "../../../foundation/Icon/Generated/IconImage16.es.js";
|
|
|
819
819
|
import "../../../foundation/Icon/Generated/IconImage20.es.js";
|
|
820
820
|
import "../../../foundation/Icon/Generated/IconImage24.es.js";
|
|
821
821
|
import "../../../foundation/Icon/Generated/IconImage32.es.js";
|
|
822
|
-
import
|
|
822
|
+
import c from "../../../foundation/Icon/Generated/IconImageStack.es.js";
|
|
823
823
|
import "../../../foundation/Icon/Generated/IconImageStack12.es.js";
|
|
824
824
|
import "../../../foundation/Icon/Generated/IconImageStack16.es.js";
|
|
825
825
|
import "../../../foundation/Icon/Generated/IconImageStack20.es.js";
|
|
@@ -1660,23 +1660,32 @@ import "../../../foundation/Icon/Generated/IconWorkflowShapes20.es.js";
|
|
|
1660
1660
|
import "../../../foundation/Icon/Generated/IconWorkflowShapes24.es.js";
|
|
1661
1661
|
import "../../../foundation/Icon/Generated/IconWorkflowShapes32.es.js";
|
|
1662
1662
|
import "../../../foundation/Icon/IconsMap.es.js";
|
|
1663
|
-
const
|
|
1664
|
-
|
|
1665
|
-
|
|
1663
|
+
const rA = ({
|
|
1664
|
+
asset: t,
|
|
1665
|
+
isLoading: m = !1,
|
|
1666
|
+
hideSize: p = !1,
|
|
1667
|
+
hideExtension: e = !1
|
|
1668
|
+
}) => {
|
|
1669
|
+
let i = m ? "Uploading" : "Uploaded";
|
|
1670
|
+
return (t == null ? void 0 : t.source) === "library" && (i = t.sourceName), /* @__PURE__ */ r.createElement("span", {
|
|
1666
1671
|
className: "tw-max-w-full tw-flex tw-flex-row tw-items-center tw-gap-1 tw-text-black-80 tw-text-xxs tw-overflow-hidden"
|
|
1667
1672
|
}, /* @__PURE__ */ r.createElement("div", {
|
|
1668
1673
|
className: "tw-flex-none tw-inline-flex tw-items-center tw-justify-center"
|
|
1669
|
-
}, (t == null ? void 0 : t.source) === "library" ? /* @__PURE__ */ r.createElement(
|
|
1674
|
+
}, (t == null ? void 0 : t.source) === "library" ? /* @__PURE__ */ r.createElement(c, null) : /* @__PURE__ */ r.createElement(n, null)), i && /* @__PURE__ */ r.createElement("span", {
|
|
1670
1675
|
className: "tw-whitespace-nowrap"
|
|
1671
|
-
},
|
|
1672
|
-
|
|
1673
|
-
|
|
1674
|
-
|
|
1675
|
-
|
|
1676
|
-
|
|
1677
|
-
}
|
|
1678
|
-
}
|
|
1676
|
+
}, i), t && !m && /* @__PURE__ */ r.createElement(r.Fragment, null, /* @__PURE__ */ r.createElement(o, {
|
|
1677
|
+
label: t.extension,
|
|
1678
|
+
hide: e
|
|
1679
|
+
}), /* @__PURE__ */ r.createElement(o, {
|
|
1680
|
+
label: t.size,
|
|
1681
|
+
hide: p
|
|
1682
|
+
})));
|
|
1683
|
+
}, o = ({ label: t, hide: m }) => m || !t ? null : /* @__PURE__ */ r.createElement(l, null, /* @__PURE__ */ r.createElement("span", {
|
|
1684
|
+
className: "tw-text-m tw-text-black-20 tw-h-4 tw-flex tw-items-center"
|
|
1685
|
+
}, "\u2022"), /* @__PURE__ */ r.createElement("span", {
|
|
1686
|
+
className: "tw-whitespace-nowrap"
|
|
1687
|
+
}, t));
|
|
1679
1688
|
export {
|
|
1680
|
-
|
|
1689
|
+
rA as AssetSubline
|
|
1681
1690
|
};
|
|
1682
1691
|
//# sourceMappingURL=AssetSubline.es.js.map
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"AssetSubline.es.js","sources":["../../../../src/components/AssetInput/SingleAsset/AssetSubline.tsx"],"sourcesContent":["import React, { FC, Fragment } from 'react';\nimport { AssetInputProps } from '../AssetInput';\nimport { SelectedAssetProps } from './SelectedAsset';\nimport { IconArrowCircleUp, IconImageStack } from '@foundation/Icon';\n\ntype AssetSublineProps = Pick<AssetInputProps, 'isLoading'>
|
|
1
|
+
{"version":3,"file":"AssetSubline.es.js","sources":["../../../../src/components/AssetInput/SingleAsset/AssetSubline.tsx"],"sourcesContent":["import React, { FC, Fragment } from 'react';\nimport { AssetInputProps } from '../AssetInput';\nimport { SelectedAssetProps } from './SelectedAsset';\nimport { IconArrowCircleUp, IconImageStack } from '@foundation/Icon';\n\ntype AssetSublineProps = Pick<AssetInputProps, 'isLoading' | 'hideSize' | 'hideExtension'> &\n Pick<SelectedAssetProps, 'asset'>;\n\nexport const AssetSubline: FC<AssetSublineProps> = ({\n asset,\n isLoading = false,\n hideSize = false,\n hideExtension = false,\n}) => {\n let title = isLoading ? 'Uploading' : 'Uploaded';\n if (asset?.source === 'library') {\n title = asset.sourceName;\n }\n\n return (\n <span className=\"tw-max-w-full tw-flex tw-flex-row tw-items-center tw-gap-1 tw-text-black-80 tw-text-xxs tw-overflow-hidden\">\n <div className=\"tw-flex-none tw-inline-flex tw-items-center tw-justify-center\">\n {asset?.source === 'library' ? <IconImageStack /> : <IconArrowCircleUp />}\n </div>\n {title && <span className=\"tw-whitespace-nowrap\">{title}</span>}\n {asset && !isLoading && (\n <>\n <FileInfo label={asset.extension} hide={hideExtension} />\n <FileInfo label={asset.size} hide={hideSize} />\n </>\n )}\n </span>\n );\n};\n\nconst FileInfo: FC<{ label?: string | number; hide: boolean }> = ({ label, hide }) => {\n if (hide || !label) {\n return null;\n }\n\n return (\n <Fragment>\n <span className=\"tw-text-m tw-text-black-20 tw-h-4 tw-flex tw-items-center\">•</span>\n <span className=\"tw-whitespace-nowrap\">{label}</span>\n </Fragment>\n );\n};\n"],"names":[],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;AAQO,MAAM,KAAsC,CAAC;AAAA,EAChD;AAAA,EACA,eAAY;AAAA,EACZ,cAAW;AAAA,EACX,mBAAgB;AAAA,MACd;AACE,MAAA,IAAQ,IAAY,cAAc;AAClC,SAAA,wBAAO,YAAW,aAClB,KAAQ,EAAM,aAIb,kBAAA,cAAA,QAAA;AAAA,IAAK,WAAU;AAAA,EAAA,GACX,kBAAA,cAAA,OAAA;AAAA,IAAI,WAAU;AAAA,EAAA,GACV,wBAAO,YAAW,YAAa,kBAAA,cAAA,GAAA,IAAe,IAAK,kBAAA,cAAC,GAAkB,IAAA,CAC3E,GACC,KAAU,kBAAA,cAAA,QAAA;AAAA,IAAK,WAAU;AAAA,EAAA,GAAwB,CAAM,GACvD,KAAS,CAAC,uDAEF,kBAAA,cAAA,GAAA;AAAA,IAAS,OAAO,EAAM;AAAA,IAAW,MAAM;AAAA,EAAA,CAAe,GACtD,kBAAA,cAAA,GAAA;AAAA,IAAS,OAAO,EAAM;AAAA,IAAM,MAAM;AAAA,EAAU,CAAA,CACjD,CAER;AAER,GAEM,IAA2D,CAAC,EAAE,UAAO,cACnE,KAAQ,CAAC,IACF,OAIP,kBAAA,cAAC,SACI,kBAAA,cAAA,QAAA;AAAA,EAAK,WAAU;AAA4D,GAAA,QAAC,GAC5E,kBAAA,cAAA,QAAA;AAAA,EAAK,WAAU;AAAA,GAAwB,CAAM,CAClD;"}
|
|
@@ -1,6 +1,6 @@
|
|
|
1
1
|
import { FC } from 'react';
|
|
2
2
|
import { AssetInputProps, AssetType } from '../AssetInput';
|
|
3
|
-
export declare type SelectedAssetProps = Pick<AssetInputProps, 'actions' | 'isLoading' | 'size'> & {
|
|
3
|
+
export declare type SelectedAssetProps = Pick<AssetInputProps, 'actions' | 'isLoading' | 'size' | 'hideSize' | 'hideExtension'> & {
|
|
4
4
|
asset: AssetType;
|
|
5
5
|
};
|
|
6
|
-
export declare const SelectedAsset: FC<Required<SelectedAssetProps>>;
|
|
6
|
+
export declare const SelectedAsset: FC<Required<Omit<SelectedAssetProps, 'hideSize' | 'hideExtension'>> & Pick<SelectedAssetProps, 'hideSize' | 'hideExtension'>>;
|
|
@@ -1,32 +1,32 @@
|
|
|
1
|
-
import { ActionMenu as
|
|
2
|
-
import
|
|
3
|
-
import { IconSize as
|
|
1
|
+
import { ActionMenu as P } from "../../ActionMenu/ActionMenu/ActionMenu.es.js";
|
|
2
|
+
import B from "../../../foundation/Icon/Generated/IconCaretDown.es.js";
|
|
3
|
+
import { IconSize as D } from "../../../foundation/Icon/IconSize.es.js";
|
|
4
4
|
import { useMemoizedId as h } from "../../../hooks/useMemoizedId.es.js";
|
|
5
|
-
import { useButton as
|
|
6
|
-
import { useFocusRing as
|
|
7
|
-
import { useMenuTrigger as
|
|
8
|
-
import { useOverlay as
|
|
9
|
-
import { mergeProps as
|
|
10
|
-
import { useMenuTriggerState as
|
|
11
|
-
import { FOCUS_STYLE as
|
|
5
|
+
import { useButton as z } from "@react-aria/button";
|
|
6
|
+
import { useFocusRing as M, FocusScope as W } from "@react-aria/focus";
|
|
7
|
+
import { useMenuTrigger as j } from "@react-aria/menu";
|
|
8
|
+
import { useOverlay as L, DismissButton as g } from "@react-aria/overlays";
|
|
9
|
+
import { mergeProps as Y } from "@react-aria/utils";
|
|
10
|
+
import { useMenuTriggerState as U } from "@react-stately/menu";
|
|
11
|
+
import { FOCUS_STYLE as V } from "../../../utilities/focusStyle.es.js";
|
|
12
12
|
import { merge as s } from "../../../utilities/merge.es.js";
|
|
13
|
-
import { AnimatePresence as
|
|
14
|
-
import t, { useRef as x, useState as
|
|
15
|
-
import { AssetInputSize as
|
|
16
|
-
import { AssetThumbnail as
|
|
17
|
-
import { AssetSubline as
|
|
18
|
-
import { SpinningCircle as
|
|
19
|
-
const
|
|
20
|
-
const
|
|
21
|
-
return
|
|
22
|
-
let
|
|
23
|
-
const
|
|
13
|
+
import { AnimatePresence as _, motion as $ } from "framer-motion";
|
|
14
|
+
import t, { useRef as x, useState as q, useEffect as G } from "react";
|
|
15
|
+
import { AssetInputSize as c } from "../AssetInput.es.js";
|
|
16
|
+
import { AssetThumbnail as H } from "../AssetThumbnail.es.js";
|
|
17
|
+
import { AssetSubline as J } from "./AssetSubline.es.js";
|
|
18
|
+
import { SpinningCircle as K } from "./SpinningCircle.es.js";
|
|
19
|
+
const bt = ({ asset: e, size: n, actions: E, isLoading: m, hideSize: v = !1, hideExtension: k = !1 }) => {
|
|
20
|
+
const y = h(), w = h(), r = x(null), o = U({ closeOnSelect: !0 }), { isOpen: l, focusStrategy: S } = o, { menuTriggerProps: N } = j({}, o, r), { buttonProps: A } = z(N, r), { isFocusVisible: i, focusProps: C } = M(), u = x(null), { overlayProps: F } = L({ onClose: () => o.close(), shouldCloseOnBlur: !0, isOpen: l, isDismissable: !0 }, u), f = (e == null ? void 0 : e.name) || "Your Asset", [O, R] = q(0);
|
|
21
|
+
return G(() => {
|
|
22
|
+
let a = null;
|
|
23
|
+
const T = () => {
|
|
24
24
|
var b, p;
|
|
25
|
-
const
|
|
26
|
-
|
|
27
|
-
}, d = new ResizeObserver(
|
|
25
|
+
const I = (p = (b = r.current) == null ? void 0 : b.getBoundingClientRect().width) != null ? p : 0;
|
|
26
|
+
a = setTimeout(() => R(I), 0);
|
|
27
|
+
}, d = new ResizeObserver(T);
|
|
28
28
|
return r.current && d.observe(r.current), () => {
|
|
29
|
-
|
|
29
|
+
a && clearTimeout(a), d.disconnect();
|
|
30
30
|
};
|
|
31
31
|
}, []), /* @__PURE__ */ t.createElement("div", {
|
|
32
32
|
className: "tw-font-sans tw-w-full tw-text-s tw-bg-transparent tw-font-normal tw-min-w-0",
|
|
@@ -34,29 +34,29 @@ const ft = ({ asset: e, size: n, actions: E, isLoading: m }) => {
|
|
|
34
34
|
title: f,
|
|
35
35
|
"data-test-id": "asset-single-input"
|
|
36
36
|
}, /* @__PURE__ */ t.createElement("button", {
|
|
37
|
-
...
|
|
37
|
+
...Y(A, C),
|
|
38
38
|
ref: r,
|
|
39
39
|
className: s([
|
|
40
40
|
"tw-w-full tw-flex tw-border tw-rounded tw-overflow-hidden hover:tw-border-black-90 dark:hover:tw-border-black-40 focus-visible:tw-outline-none",
|
|
41
|
-
i &&
|
|
42
|
-
n ===
|
|
41
|
+
i && V,
|
|
42
|
+
n === c.Large ? "tw-h-[11.5rem] tw-flex-col" : "tw-h-14",
|
|
43
43
|
l || i ? "tw-border-black-90 dark:tw-border-black-10" : "tw-border-black-20 dark:tw-border-black-80"
|
|
44
44
|
])
|
|
45
45
|
}, m && !e && /* @__PURE__ */ t.createElement("div", {
|
|
46
46
|
className: s([
|
|
47
47
|
"tw-flex tw-justify-center tw-items-center",
|
|
48
|
-
n ===
|
|
48
|
+
n === c.Large ? "tw-w-full tw-h-32" : "tw-w-14 tw-h-full"
|
|
49
49
|
])
|
|
50
|
-
}, /* @__PURE__ */ t.createElement(
|
|
50
|
+
}, /* @__PURE__ */ t.createElement(K, {
|
|
51
51
|
size: n
|
|
52
|
-
})), e && /* @__PURE__ */ t.createElement(
|
|
52
|
+
})), e && /* @__PURE__ */ t.createElement(H, {
|
|
53
53
|
asset: e,
|
|
54
54
|
size: n,
|
|
55
55
|
isActive: l || i
|
|
56
56
|
}), /* @__PURE__ */ t.createElement("div", {
|
|
57
57
|
className: s([
|
|
58
58
|
"tw-min-w-0 tw-max-w-full tw-flex tw-flex-auto tw-self-stretch tw-border-black-100 tw-border-opacity-25",
|
|
59
|
-
n ===
|
|
59
|
+
n === c.Large ? "tw-h-14 tw-border-t" : "tw-h-full tw-border-l"
|
|
60
60
|
])
|
|
61
61
|
}, /* @__PURE__ */ t.createElement("div", {
|
|
62
62
|
className: "tw-min-w-0 tw-pr-3 tw-pl-4 tw-flex tw-flex-auto tw-flex-col tw-items-start tw-justify-center tw-h-full"
|
|
@@ -66,9 +66,11 @@ const ft = ({ asset: e, size: n, actions: E, isLoading: m }) => {
|
|
|
66
66
|
"tw-max-w-full tw-text-black-100 tw-text-s tw-truncate dark:tw-text-white",
|
|
67
67
|
(l || i) && "tw-font-medium"
|
|
68
68
|
])
|
|
69
|
-
}, f), /* @__PURE__ */ t.createElement(
|
|
69
|
+
}, f), /* @__PURE__ */ t.createElement(J, {
|
|
70
70
|
asset: e,
|
|
71
|
-
isLoading: m
|
|
71
|
+
isLoading: m,
|
|
72
|
+
hideSize: v,
|
|
73
|
+
hideExtension: k
|
|
72
74
|
})), /* @__PURE__ */ t.createElement("div", {
|
|
73
75
|
className: "tw-p-4 tw-flex tw-flex-none tw-items-center tw-justify-center"
|
|
74
76
|
}, /* @__PURE__ */ t.createElement("span", {
|
|
@@ -76,35 +78,35 @@ const ft = ({ asset: e, size: n, actions: E, isLoading: m }) => {
|
|
|
76
78
|
"tw-transition-transform",
|
|
77
79
|
l ? "tw-rotate-180 tw-text-black-90" : "tw-text-black-60"
|
|
78
80
|
])
|
|
79
|
-
}, /* @__PURE__ */ t.createElement(
|
|
80
|
-
size:
|
|
81
|
-
}))))), /* @__PURE__ */ t.createElement(
|
|
81
|
+
}, /* @__PURE__ */ t.createElement(B, {
|
|
82
|
+
size: D.Size16
|
|
83
|
+
}))))), /* @__PURE__ */ t.createElement(_, null, l && /* @__PURE__ */ t.createElement($.div, {
|
|
82
84
|
style: {
|
|
83
|
-
width:
|
|
85
|
+
width: O
|
|
84
86
|
},
|
|
85
87
|
className: "tw-absolute tw-left-auto tw-w-full tw-overflow-hidden tw-box-border tw-p-0 tw-shadow-mid tw-list-none tw-m-0 tw-mt-2 tw-z-20",
|
|
86
88
|
"data-test-id": "asset-single-input-flyout",
|
|
87
|
-
key: `asset-input-menu-${
|
|
89
|
+
key: `asset-input-menu-${y}`,
|
|
88
90
|
initial: { height: 0 },
|
|
89
91
|
animate: { height: "auto" },
|
|
90
92
|
exit: { height: 0 },
|
|
91
93
|
transition: { ease: [0.04, 0.62, 0.23, 0.98], duration: 0.5 }
|
|
92
|
-
}, /* @__PURE__ */ t.createElement(
|
|
94
|
+
}, /* @__PURE__ */ t.createElement(W, {
|
|
93
95
|
restoreFocus: !0
|
|
94
96
|
}, /* @__PURE__ */ t.createElement("div", {
|
|
95
|
-
...
|
|
97
|
+
...F,
|
|
96
98
|
ref: u
|
|
97
99
|
}, /* @__PURE__ */ t.createElement(g, {
|
|
98
100
|
onDismiss: () => o.close()
|
|
99
|
-
}), /* @__PURE__ */ t.createElement(
|
|
101
|
+
}), /* @__PURE__ */ t.createElement(P, {
|
|
100
102
|
menuBlocks: E,
|
|
101
|
-
focus:
|
|
103
|
+
focus: S,
|
|
102
104
|
onClick: () => o.close()
|
|
103
105
|
}), /* @__PURE__ */ t.createElement(g, {
|
|
104
106
|
onDismiss: () => o.close()
|
|
105
107
|
}))))));
|
|
106
108
|
};
|
|
107
109
|
export {
|
|
108
|
-
|
|
110
|
+
bt as SelectedAsset
|
|
109
111
|
};
|
|
110
112
|
//# sourceMappingURL=SelectedAsset.es.js.map
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"SelectedAsset.es.js","sources":["../../../../src/components/AssetInput/SingleAsset/SelectedAsset.tsx"],"sourcesContent":["import { ActionMenu } from '@components/ActionMenu/ActionMenu/ActionMenu';\nimport IconCaretDown from '@foundation/Icon/Generated/IconCaretDown';\nimport { IconSize } from '@foundation/Icon/IconSize';\nimport { useMemoizedId } from '@hooks/useMemoizedId';\nimport { useButton } from '@react-aria/button';\nimport { FocusScope, useFocusRing } from '@react-aria/focus';\nimport { useMenuTrigger } from '@react-aria/menu';\nimport { DismissButton, useOverlay } from '@react-aria/overlays';\nimport { mergeProps } from '@react-aria/utils';\nimport { useMenuTriggerState } from '@react-stately/menu';\nimport { FOCUS_STYLE } from '@utilities/focusStyle';\nimport { merge } from '@utilities/merge';\nimport { AnimatePresence, motion } from 'framer-motion';\nimport React, { FC, useEffect, useRef, useState } from 'react';\nimport { AssetInputProps, AssetInputSize, AssetType } from '../AssetInput';\nimport { AssetThumbnail } from '../AssetThumbnail';\nimport { AssetSubline } from './AssetSubline';\nimport { SpinningCircle } from './SpinningCircle';\n\nexport type SelectedAssetProps = Pick<AssetInputProps, 'actions' | 'isLoading' | 'size'> & {\n asset: AssetType;\n};\n\nexport const SelectedAsset: FC<Required<SelectedAssetProps>> = ({ asset, size, actions, isLoading }) => {\n const menuId = useMemoizedId();\n const labelId = useMemoizedId();\n const buttonRef = useRef<HTMLButtonElement | null>(null);\n const menuState = useMenuTriggerState({ closeOnSelect: true });\n const { isOpen, focusStrategy } = menuState;\n const { menuTriggerProps } = useMenuTrigger({}, menuState, buttonRef);\n const { buttonProps } = useButton(menuTriggerProps, buttonRef);\n const { isFocusVisible, focusProps } = useFocusRing();\n const overlayRef = useRef<HTMLDivElement | null>(null);\n const { overlayProps } = useOverlay(\n { onClose: () => menuState.close(), shouldCloseOnBlur: true, isOpen, isDismissable: true },\n overlayRef,\n );\n const title = asset?.name || 'Your Asset';\n\n const [flyoutWidth, setFlyoutWidth] = useState(0);\n\n useEffect(() => {\n let timer: NodeJS.Timeout | null = null;\n const calculateFlyoutWidth = () => {\n const calculatedWidth = buttonRef.current?.getBoundingClientRect().width ?? 0;\n timer = setTimeout(() => setFlyoutWidth(calculatedWidth), 0);\n };\n const resizeObserver = new ResizeObserver(calculateFlyoutWidth);\n if (buttonRef.current) {\n resizeObserver.observe(buttonRef.current);\n }\n\n return () => {\n timer && clearTimeout(timer);\n resizeObserver.disconnect();\n };\n }, []);\n\n return (\n <div\n className=\"tw-font-sans tw-w-full tw-text-s tw-bg-transparent tw-font-normal tw-min-w-0\"\n aria-labelledby={labelId}\n title={title}\n data-test-id=\"asset-single-input\"\n >\n <button\n {...mergeProps(buttonProps, focusProps)}\n ref={buttonRef}\n className={merge([\n 'tw-w-full tw-flex tw-border tw-rounded tw-overflow-hidden hover:tw-border-black-90 dark:hover:tw-border-black-40 focus-visible:tw-outline-none',\n isFocusVisible && FOCUS_STYLE,\n size === AssetInputSize.Large ? 'tw-h-[11.5rem] tw-flex-col' : 'tw-h-14',\n isOpen || isFocusVisible\n ? 'tw-border-black-90 dark:tw-border-black-10'\n : 'tw-border-black-20 dark:tw-border-black-80',\n ])}\n >\n {isLoading && !asset && (\n <div\n className={merge([\n 'tw-flex tw-justify-center tw-items-center',\n size === AssetInputSize.Large ? 'tw-w-full tw-h-32' : 'tw-w-14 tw-h-full',\n ])}\n >\n <SpinningCircle size={size} />\n </div>\n )}\n {asset && <AssetThumbnail asset={asset} size={size} isActive={isOpen || isFocusVisible} />}\n <div\n className={merge([\n 'tw-min-w-0 tw-max-w-full tw-flex tw-flex-auto tw-self-stretch tw-border-black-100 tw-border-opacity-25',\n size === AssetInputSize.Large ? 'tw-h-14 tw-border-t' : 'tw-h-full tw-border-l',\n ])}\n >\n <div className=\"tw-min-w-0 tw-pr-3 tw-pl-4 tw-flex tw-flex-auto tw-flex-col tw-items-start tw-justify-center tw-h-full\">\n <span\n id={labelId}\n className={merge([\n 'tw-max-w-full tw-text-black-100 tw-text-s tw-truncate dark:tw-text-white',\n (isOpen || isFocusVisible) && 'tw-font-medium',\n ])}\n >\n {title}\n </span>\n <AssetSubline asset={asset} isLoading={isLoading} />\n </div>\n <div className=\"tw-p-4 tw-flex tw-flex-none tw-items-center tw-justify-center\">\n <span\n className={merge([\n 'tw-transition-transform',\n isOpen ? 'tw-rotate-180 tw-text-black-90' : 'tw-text-black-60',\n ])}\n >\n <IconCaretDown size={IconSize.Size16} />\n </span>\n </div>\n </div>\n </button>\n\n <AnimatePresence>\n {isOpen && (\n <motion.div\n style={{\n width: flyoutWidth,\n }}\n className=\"tw-absolute tw-left-auto tw-w-full tw-overflow-hidden tw-box-border tw-p-0 tw-shadow-mid tw-list-none tw-m-0 tw-mt-2 tw-z-20\"\n data-test-id=\"asset-single-input-flyout\"\n key={`asset-input-menu-${menuId}`}\n initial={{ height: 0 }}\n animate={{ height: 'auto' }}\n exit={{ height: 0 }}\n transition={{ ease: [0.04, 0.62, 0.23, 0.98], duration: 0.5 }}\n >\n <FocusScope restoreFocus>\n <div {...overlayProps} ref={overlayRef}>\n <DismissButton onDismiss={() => menuState.close()} />\n <ActionMenu\n menuBlocks={actions}\n focus={focusStrategy}\n onClick={() => menuState.close()}\n />\n <DismissButton onDismiss={() => menuState.close()} />\n </div>\n </FocusScope>\n </motion.div>\n )}\n </AnimatePresence>\n </div>\n );\n};\n"],"names":[],"mappings":"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"}
|
|
1
|
+
{"version":3,"file":"SelectedAsset.es.js","sources":["../../../../src/components/AssetInput/SingleAsset/SelectedAsset.tsx"],"sourcesContent":["import { ActionMenu } from '@components/ActionMenu/ActionMenu/ActionMenu';\nimport IconCaretDown from '@foundation/Icon/Generated/IconCaretDown';\nimport { IconSize } from '@foundation/Icon/IconSize';\nimport { useMemoizedId } from '@hooks/useMemoizedId';\nimport { useButton } from '@react-aria/button';\nimport { FocusScope, useFocusRing } from '@react-aria/focus';\nimport { useMenuTrigger } from '@react-aria/menu';\nimport { DismissButton, useOverlay } from '@react-aria/overlays';\nimport { mergeProps } from '@react-aria/utils';\nimport { useMenuTriggerState } from '@react-stately/menu';\nimport { FOCUS_STYLE } from '@utilities/focusStyle';\nimport { merge } from '@utilities/merge';\nimport { AnimatePresence, motion } from 'framer-motion';\nimport React, { FC, useEffect, useRef, useState } from 'react';\nimport { AssetInputProps, AssetInputSize, AssetType } from '../AssetInput';\nimport { AssetThumbnail } from '../AssetThumbnail';\nimport { AssetSubline } from './AssetSubline';\nimport { SpinningCircle } from './SpinningCircle';\n\nexport type SelectedAssetProps = Pick<\n AssetInputProps,\n 'actions' | 'isLoading' | 'size' | 'hideSize' | 'hideExtension'\n> & {\n asset: AssetType;\n};\n\nexport const SelectedAsset: FC<\n Required<Omit<SelectedAssetProps, 'hideSize' | 'hideExtension'>> &\n Pick<SelectedAssetProps, 'hideSize' | 'hideExtension'>\n> = ({ asset, size, actions, isLoading, hideSize = false, hideExtension = false }) => {\n const menuId = useMemoizedId();\n const labelId = useMemoizedId();\n const buttonRef = useRef<HTMLButtonElement | null>(null);\n const menuState = useMenuTriggerState({ closeOnSelect: true });\n const { isOpen, focusStrategy } = menuState;\n const { menuTriggerProps } = useMenuTrigger({}, menuState, buttonRef);\n const { buttonProps } = useButton(menuTriggerProps, buttonRef);\n const { isFocusVisible, focusProps } = useFocusRing();\n const overlayRef = useRef<HTMLDivElement | null>(null);\n const { overlayProps } = useOverlay(\n { onClose: () => menuState.close(), shouldCloseOnBlur: true, isOpen, isDismissable: true },\n overlayRef,\n );\n const title = asset?.name || 'Your Asset';\n\n const [flyoutWidth, setFlyoutWidth] = useState(0);\n\n useEffect(() => {\n let timer: NodeJS.Timeout | null = null;\n const calculateFlyoutWidth = () => {\n const calculatedWidth = buttonRef.current?.getBoundingClientRect().width ?? 0;\n timer = setTimeout(() => setFlyoutWidth(calculatedWidth), 0);\n };\n const resizeObserver = new ResizeObserver(calculateFlyoutWidth);\n if (buttonRef.current) {\n resizeObserver.observe(buttonRef.current);\n }\n\n return () => {\n timer && clearTimeout(timer);\n resizeObserver.disconnect();\n };\n }, []);\n\n return (\n <div\n className=\"tw-font-sans tw-w-full tw-text-s tw-bg-transparent tw-font-normal tw-min-w-0\"\n aria-labelledby={labelId}\n title={title}\n data-test-id=\"asset-single-input\"\n >\n <button\n {...mergeProps(buttonProps, focusProps)}\n ref={buttonRef}\n className={merge([\n 'tw-w-full tw-flex tw-border tw-rounded tw-overflow-hidden hover:tw-border-black-90 dark:hover:tw-border-black-40 focus-visible:tw-outline-none',\n isFocusVisible && FOCUS_STYLE,\n size === AssetInputSize.Large ? 'tw-h-[11.5rem] tw-flex-col' : 'tw-h-14',\n isOpen || isFocusVisible\n ? 'tw-border-black-90 dark:tw-border-black-10'\n : 'tw-border-black-20 dark:tw-border-black-80',\n ])}\n >\n {isLoading && !asset && (\n <div\n className={merge([\n 'tw-flex tw-justify-center tw-items-center',\n size === AssetInputSize.Large ? 'tw-w-full tw-h-32' : 'tw-w-14 tw-h-full',\n ])}\n >\n <SpinningCircle size={size} />\n </div>\n )}\n {asset && <AssetThumbnail asset={asset} size={size} isActive={isOpen || isFocusVisible} />}\n <div\n className={merge([\n 'tw-min-w-0 tw-max-w-full tw-flex tw-flex-auto tw-self-stretch tw-border-black-100 tw-border-opacity-25',\n size === AssetInputSize.Large ? 'tw-h-14 tw-border-t' : 'tw-h-full tw-border-l',\n ])}\n >\n <div className=\"tw-min-w-0 tw-pr-3 tw-pl-4 tw-flex tw-flex-auto tw-flex-col tw-items-start tw-justify-center tw-h-full\">\n <span\n id={labelId}\n className={merge([\n 'tw-max-w-full tw-text-black-100 tw-text-s tw-truncate dark:tw-text-white',\n (isOpen || isFocusVisible) && 'tw-font-medium',\n ])}\n >\n {title}\n </span>\n <AssetSubline\n asset={asset}\n isLoading={isLoading}\n hideSize={hideSize}\n hideExtension={hideExtension}\n />\n </div>\n <div className=\"tw-p-4 tw-flex tw-flex-none tw-items-center tw-justify-center\">\n <span\n className={merge([\n 'tw-transition-transform',\n isOpen ? 'tw-rotate-180 tw-text-black-90' : 'tw-text-black-60',\n ])}\n >\n <IconCaretDown size={IconSize.Size16} />\n </span>\n </div>\n </div>\n </button>\n\n <AnimatePresence>\n {isOpen && (\n <motion.div\n style={{\n width: flyoutWidth,\n }}\n className=\"tw-absolute tw-left-auto tw-w-full tw-overflow-hidden tw-box-border tw-p-0 tw-shadow-mid tw-list-none tw-m-0 tw-mt-2 tw-z-20\"\n data-test-id=\"asset-single-input-flyout\"\n key={`asset-input-menu-${menuId}`}\n initial={{ height: 0 }}\n animate={{ height: 'auto' }}\n exit={{ height: 0 }}\n transition={{ ease: [0.04, 0.62, 0.23, 0.98], duration: 0.5 }}\n >\n <FocusScope restoreFocus>\n <div {...overlayProps} ref={overlayRef}>\n <DismissButton onDismiss={() => menuState.close()} />\n <ActionMenu\n menuBlocks={actions}\n focus={focusStrategy}\n onClick={() => menuState.close()}\n />\n <DismissButton onDismiss={() => menuState.close()} />\n </div>\n </FocusScope>\n </motion.div>\n )}\n </AnimatePresence>\n </div>\n );\n};\n"],"names":[],"mappings":";;;;;;;;;;;;;;;;;;AA0Ba,MAAA,KAGT,CAAC,EAAE,UAAO,SAAM,YAAS,cAAW,cAAW,IAAO,mBAAgB,SAAY;AAClF,QAAM,IAAS,KACT,IAAU,KACV,IAAY,EAAiC,IAAI,GACjD,IAAY,EAAoB,EAAE,eAAe,GAAM,CAAA,GACvD,EAAE,WAAQ,qBAAkB,GAC5B,EAAE,wBAAqB,EAAe,CAAA,GAAI,GAAW,CAAS,GAC9D,EAAE,mBAAgB,EAAU,GAAkB,CAAS,GACvD,EAAE,mBAAgB,kBAAe,EAAa,GAC9C,IAAa,EAA8B,IAAI,GAC/C,EAAE,oBAAiB,EACrB,EAAE,SAAS,MAAM,EAAU,MAAM,GAAG,mBAAmB,IAAM,WAAQ,eAAe,GAAA,GACpF,CACJ,GACM,IAAQ,wBAAO,SAAQ,cAEvB,CAAC,GAAa,KAAkB,EAAS,CAAC;AAEhD,WAAU,MAAM;AACZ,QAAI,IAA+B;AACnC,UAAM,IAAuB,MAAM;;AAC/B,YAAM,IAAkB,YAAU,YAAV,kBAAmB,wBAAwB,UAA3C,WAAoD;AAC5E,UAAQ,WAAW,MAAM,EAAe,CAAe,GAAG,CAAC;AAAA,IAAA,GAEzD,IAAiB,IAAI,eAAe,CAAoB;AAC9D,WAAI,EAAU,WACK,EAAA,QAAQ,EAAU,OAAO,GAGrC,MAAM;AACT,WAAS,aAAa,CAAK,GAC3B,EAAe,WAAW;AAAA,IAAA;AAAA,EAElC,GAAG,CAAE,CAAA,GAGA,kBAAA,cAAA,OAAA;AAAA,IACG,WAAU;AAAA,IACV,mBAAiB;AAAA,IACjB;AAAA,IACA,gBAAa;AAAA,EAAA,GAEZ,kBAAA,cAAA,UAAA;AAAA,IACI,GAAG,EAAW,GAAa,CAAU;AAAA,IACtC,KAAK;AAAA,IACL,WAAW,EAAM;AAAA,MACb;AAAA,MACA,KAAkB;AAAA,MAClB,MAAS,EAAe,QAAQ,+BAA+B;AAAA,MAC/D,KAAU,IACJ,+CACA;AAAA,IAAA,CACT;AAAA,EAEA,GAAA,KAAa,CAAC,KACV,kBAAA,cAAA,OAAA;AAAA,IACG,WAAW,EAAM;AAAA,MACb;AAAA,MACA,MAAS,EAAe,QAAQ,sBAAsB;AAAA,IAAA,CACzD;AAAA,EAAA,GAEA,kBAAA,cAAA,GAAA;AAAA,IAAe;AAAA,EAAY,CAAA,CAChC,GAEH,KAAU,kBAAA,cAAA,GAAA;AAAA,IAAe;AAAA,IAAc;AAAA,IAAY,UAAU,KAAU;AAAA,EAAA,CAAgB,GACvF,kBAAA,cAAA,OAAA;AAAA,IACG,WAAW,EAAM;AAAA,MACb;AAAA,MACA,MAAS,EAAe,QAAQ,wBAAwB;AAAA,IAAA,CAC3D;AAAA,EAAA,GAEA,kBAAA,cAAA,OAAA;AAAA,IAAI,WAAU;AAAA,EAAA,GACV,kBAAA,cAAA,QAAA;AAAA,IACG,IAAI;AAAA,IACJ,WAAW,EAAM;AAAA,MACb;AAAA,YACW,MAAmB;AAAA,IAAA,CACjC;AAAA,EAEA,GAAA,CACL,GACC,kBAAA,cAAA,GAAA;AAAA,IACG;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,EACJ,CAAA,CACJ,GACC,kBAAA,cAAA,OAAA;AAAA,IAAI,WAAU;AAAA,EAAA,GACV,kBAAA,cAAA,QAAA;AAAA,IACG,WAAW,EAAM;AAAA,MACb;AAAA,MACA,IAAS,mCAAmC;AAAA,IAAA,CAC/C;AAAA,EAAA,GAEA,kBAAA,cAAA,GAAA;AAAA,IAAc,MAAM,EAAS;AAAA,EAAQ,CAAA,CAC1C,CACJ,CACJ,CACJ,mCAEC,GACI,MAAA,KACI,kBAAA,cAAA,EAAO,KAAP;AAAA,IACG,OAAO;AAAA,MACH,OAAO;AAAA,IACX;AAAA,IACA,WAAU;AAAA,IACV,gBAAa;AAAA,IACb,KAAK,oBAAoB;AAAA,IACzB,SAAS,EAAE,QAAQ,EAAE;AAAA,IACrB,SAAS,EAAE,QAAQ,OAAO;AAAA,IAC1B,MAAM,EAAE,QAAQ,EAAE;AAAA,IAClB,YAAY,EAAE,MAAM,CAAC,MAAM,MAAM,MAAM,IAAI,GAAG,UAAU,IAAI;AAAA,EAAA,GAE3D,kBAAA,cAAA,GAAA;AAAA,IAAW,cAAY;AAAA,EAAA,GACnB,kBAAA,cAAA,OAAA;AAAA,IAAK,GAAG;AAAA,IAAc,KAAK;AAAA,EAAA,GACvB,kBAAA,cAAA,GAAA;AAAA,IAAc,WAAW,MAAM,EAAU,MAAM;AAAA,EAAA,CAAG,GAClD,kBAAA,cAAA,GAAA;AAAA,IACG,YAAY;AAAA,IACZ,OAAO;AAAA,IACP,SAAS,MAAM,EAAU,MAAM;AAAA,EAAA,CACnC,GACC,kBAAA,cAAA,GAAA;AAAA,IAAc,WAAW,MAAM,EAAU,MAAM;AAAA,EAAA,CAAG,CACvD,CACJ,CACJ,CAER,CACJ;AAER;"}
|
|
@@ -1,24 +1,20 @@
|
|
|
1
|
-
import
|
|
2
|
-
import { createPlugins as
|
|
3
|
-
import { Toolbar as
|
|
4
|
-
const
|
|
5
|
-
components:
|
|
6
|
-
}),
|
|
7
|
-
|
|
8
|
-
|
|
9
|
-
|
|
10
|
-
|
|
11
|
-
|
|
12
|
-
|
|
13
|
-
|
|
14
|
-
|
|
15
|
-
|
|
16
|
-
key: l
|
|
17
|
-
})))
|
|
18
|
-
} : null;
|
|
19
|
-
};
|
|
1
|
+
import n from "react";
|
|
2
|
+
import { createPlugins as l, createPlateUI as c } from "@udecode/plate";
|
|
3
|
+
import { Toolbar as m } from "../Toolbar/index.es.js";
|
|
4
|
+
const o = (e) => l(e.plugins, {
|
|
5
|
+
components: c(e.elements)
|
|
6
|
+
}), P = (e, t) => t ? {
|
|
7
|
+
create: () => o(t),
|
|
8
|
+
toolbar: () => /* @__PURE__ */ n.createElement(m, {
|
|
9
|
+
buttons: t.buttons,
|
|
10
|
+
editorId: e
|
|
11
|
+
}),
|
|
12
|
+
inline: () => /* @__PURE__ */ n.createElement(n.Fragment, null, t.inline.map((r, a) => /* @__PURE__ */ n.createElement(r, {
|
|
13
|
+
key: a
|
|
14
|
+
})))
|
|
15
|
+
} : null;
|
|
20
16
|
export {
|
|
21
|
-
|
|
22
|
-
|
|
17
|
+
P as GeneratePlugins,
|
|
18
|
+
o as createPlatePlugins
|
|
23
19
|
};
|
|
24
20
|
//# sourceMappingURL=GeneratePlugins.es.js.map
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"GeneratePlugins.es.js","sources":["../../../../src/components/RichTextEditor/Plugins/GeneratePlugins.tsx"],"sourcesContent":["/* (c) Copyright Frontify Ltd., all rights reserved. */\n\nimport React, { ReactNode } from 'react';\nimport { AnyObject, PlatePlugin, createPlateUI, createPlugins
|
|
1
|
+
{"version":3,"file":"GeneratePlugins.es.js","sources":["../../../../src/components/RichTextEditor/Plugins/GeneratePlugins.tsx"],"sourcesContent":["/* (c) Copyright Frontify Ltd., all rights reserved. */\n\nimport React, { ReactNode } from 'react';\nimport { AnyObject, PlatePlugin, createPlateUI, createPlugins } from '@udecode/plate';\nimport { Toolbar } from '../Toolbar';\nimport type { PluginComposer } from './PluginComposer';\n\ntype GeneratePluginsReturn = {\n create: () => PlatePlugin<AnyObject>[];\n toolbar: () => ReactNode;\n inline: () => ReactNode;\n};\n\nexport const createPlatePlugins = (pluginComposer: PluginComposer) =>\n createPlugins(pluginComposer.plugins, {\n components: createPlateUI(pluginComposer.elements),\n });\n\nexport const GeneratePlugins = (editorId: string, pluginComposer?: PluginComposer): GeneratePluginsReturn | null => {\n if (!pluginComposer) {\n return null;\n }\n\n return {\n create: () => createPlatePlugins(pluginComposer),\n toolbar: () => <Toolbar buttons={pluginComposer.buttons} editorId={editorId} />,\n inline: () => (\n <>\n {pluginComposer.inline.map((Inline, index) => (\n <Inline key={index} />\n ))}\n </>\n ),\n };\n};\n"],"names":[],"mappings":";;;AAaO,MAAM,IAAqB,CAAC,MAC/B,EAAc,EAAe,SAAS;AAAA,EAClC,YAAY,EAAc,EAAe,QAAQ;AACrD,CAAC,GAEQ,IAAkB,CAAC,GAAkB,MACzC,IAIE;AAAA,EACH,QAAQ,MAAM,EAAmB,CAAc;AAAA,EAC/C,SAAS,MAAO,kBAAA,cAAA,GAAA;AAAA,IAAQ,SAAS,EAAe;AAAA,IAAS;AAAA,EAAA,CAAoB;AAAA,EAC7E,QAAQ,MAEC,kBAAA,cAAA,EAAA,UAAA,MAAA,EAAe,OAAO,IAAI,CAAC,GAAQ,MAC/B,kBAAA,cAAA,GAAA;AAAA,IAAO,KAAK;AAAA,EAAO,CAAA,CACvB,CACL;AAAA,IAXG;"}
|