@frontify/guideline-blocks-settings 0.36.12 → 0.36.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/BlockItemWrapper/BlockItemWrapper.es.js +1 -1
- package/dist/components/BlockItemWrapper/BlockItemWrapper.es.js.map +1 -1
- package/dist/components/RichTextEditor/plugins/ButtonPlugin/utils/styles.es.js +14 -10
- package/dist/components/RichTextEditor/plugins/ButtonPlugin/utils/styles.es.js.map +1 -1
- package/dist/index.cjs.js +16 -16
- package/dist/index.cjs.js.map +1 -1
- package/dist/index.umd.js +15 -15
- package/dist/index.umd.js.map +1 -1
- package/package.json +1 -1
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"BlockItemWrapper.es.js","sources":["../../../src/components/BlockItemWrapper/BlockItemWrapper.tsx"],"sourcesContent":["/* (c) Copyright Frontify Ltd., all rights reserved. */\n\nimport { type ReactElement, memo, useRef, useState } from 'react';\n\nimport { joinClassNames } from '../../utilities';\n\nimport { DEFAULT_MENU_BUTTON_ID, Toolbar, type ToolbarItem } from './Toolbar';\nimport { DragPreviewContextProvider } from './Toolbar/context/DragPreviewContext';\nimport { MultiFlyoutContextProvider } from './Toolbar/context/MultiFlyoutContext';\nimport { type BlockItemWrapperProps } from './types';\n\nexport const BlockItemWrapper = memo(\n ({\n children,\n toolbarItems,\n shouldHideWrapper,\n shouldHideComponent = false,\n isDragging = false,\n shouldFillContainer,\n outlineOffset =
|
|
1
|
+
{"version":3,"file":"BlockItemWrapper.es.js","sources":["../../../src/components/BlockItemWrapper/BlockItemWrapper.tsx"],"sourcesContent":["/* (c) Copyright Frontify Ltd., all rights reserved. */\n\nimport { type ReactElement, memo, useRef, useState } from 'react';\n\nimport { joinClassNames } from '../../utilities';\n\nimport { DEFAULT_MENU_BUTTON_ID, Toolbar, type ToolbarItem } from './Toolbar';\nimport { DragPreviewContextProvider } from './Toolbar/context/DragPreviewContext';\nimport { MultiFlyoutContextProvider } from './Toolbar/context/MultiFlyoutContext';\nimport { type BlockItemWrapperProps } from './types';\n\nexport const BlockItemWrapper = memo(\n ({\n children,\n toolbarItems,\n shouldHideWrapper,\n shouldHideComponent = false,\n isDragging = false,\n shouldFillContainer,\n outlineOffset = 0,\n shouldBeShown = false,\n showAttachments = false,\n }: BlockItemWrapperProps): ReactElement => {\n const [openFlyoutIds, setOpenFlyoutIds] = useState<string[]>(shouldBeShown ? [DEFAULT_MENU_BUTTON_ID] : []);\n const wrapperRef = useRef<HTMLDivElement>(null);\n\n if (shouldHideWrapper) {\n // eslint-disable-next-line react/jsx-no-useless-fragment\n return <>{children}</>;\n }\n\n const items = toolbarItems?.filter((item): item is ToolbarItem => item !== undefined);\n\n const shouldToolbarBeVisible = openFlyoutIds.length > 0 || shouldBeShown;\n\n return (\n <DragPreviewContextProvider isDragPreview={isDragging}>\n <MultiFlyoutContextProvider openFlyoutIds={openFlyoutIds} setOpenFlyoutIds={setOpenFlyoutIds}>\n <div\n ref={wrapperRef}\n data-test-id=\"block-item-wrapper\"\n style={{\n outlineOffset,\n }}\n className={joinClassNames([\n 'tw-relative tw-group tw-outline-1 tw-outline-box-selected-inverse',\n shouldFillContainer && 'tw-flex-1 tw-h-full tw-w-full',\n 'hover:tw-outline focus-within:tw-outline',\n shouldToolbarBeVisible && 'tw-outline',\n shouldHideComponent && 'tw-opacity-0',\n ])}\n >\n <div\n style={{\n right: -1 - outlineOffset,\n bottom: `calc(100% - ${2 + outlineOffset}px)`,\n }}\n className={joinClassNames([\n 'tw-pointer-events-none tw-absolute tw-bottom-[calc(100%-4px)] tw-right-[-3px] tw-w-full tw-opacity-0 tw-z-[60]',\n 'group-hover:tw-opacity-100 group-focus:tw-opacity-100 focus-within:tw-opacity-100',\n 'tw-flex tw-justify-end',\n shouldToolbarBeVisible && 'tw-opacity-100',\n ])}\n >\n <Toolbar\n attachments={{\n isEnabled: showAttachments,\n }}\n items={items}\n />\n </div>\n {children}\n </div>\n </MultiFlyoutContextProvider>\n </DragPreviewContextProvider>\n );\n },\n);\n\nBlockItemWrapper.displayName = 'BlockItemWrapper';\n"],"names":["BlockItemWrapper","memo","children","toolbarItems","shouldHideWrapper","shouldHideComponent","isDragging","shouldFillContainer","outlineOffset","shouldBeShown","showAttachments","openFlyoutIds","setOpenFlyoutIds","useState","DEFAULT_MENU_BUTTON_ID","wrapperRef","useRef","items","item","shouldToolbarBeVisible","DragPreviewContextProvider","jsx","MultiFlyoutContextProvider","jsxs","joinClassNames","Toolbar"],"mappings":";;;;;;;AAWO,MAAMA,IAAmBC;AAAA,EAC5B,CAAC;AAAA,IACG,UAAAC;AAAA,IACA,cAAAC;AAAA,IACA,mBAAAC;AAAA,IACA,qBAAAC,IAAsB;AAAA,IACtB,YAAAC,IAAa;AAAA,IACb,qBAAAC;AAAA,IACA,eAAAC,IAAgB;AAAA,IAChB,eAAAC,IAAgB;AAAA,IAChB,iBAAAC,IAAkB;AAAA,EAAA,MACqB;AACjC,UAAA,CAACC,GAAeC,CAAgB,IAAIC,EAAmBJ,IAAgB,CAACK,CAAsB,IAAI,CAAA,CAAE,GACpGC,IAAaC,EAAuB,IAAI;AAE9C,QAAIZ;AAEA,oCAAU,UAAAF,EAAS,CAAA;AAGvB,UAAMe,IAAQd,KAAA,gBAAAA,EAAc,OAAO,CAACe,MAA8BA,MAAS,SAErEC,IAAyBR,EAAc,SAAS,KAAKF;AAE3D,6BACKW,GAA2B,EAAA,eAAed,GACvC,UAAC,gBAAAe,EAAAC,GAAA,EAA2B,eAAAX,GAA8B,kBAAAC,GACtD,UAAA,gBAAAW;AAAA,MAAC;AAAA,MAAA;AAAA,QACG,KAAKR;AAAA,QACL,gBAAa;AAAA,QACb,OAAO;AAAA,UACH,eAAAP;AAAA,QACJ;AAAA,QACA,WAAWgB,EAAe;AAAA,UACtB;AAAA,UACAjB,KAAuB;AAAA,UACvB;AAAA,UACAY,KAA0B;AAAA,UAC1Bd,KAAuB;AAAA,QAAA,CAC1B;AAAA,QAED,UAAA;AAAA,UAAA,gBAAAgB;AAAA,YAAC;AAAA,YAAA;AAAA,cACG,OAAO;AAAA,gBACH,OAAO,KAAKb;AAAA,gBACZ,QAAQ,eAAe,IAAIA,CAAa;AAAA,cAC5C;AAAA,cACA,WAAWgB,EAAe;AAAA,gBACtB;AAAA,gBACA;AAAA,gBACA;AAAA,gBACAL,KAA0B;AAAA,cAAA,CAC7B;AAAA,cAED,UAAA,gBAAAE;AAAA,gBAACI;AAAA,gBAAA;AAAA,kBACG,aAAa;AAAA,oBACT,WAAWf;AAAA,kBACf;AAAA,kBACA,OAAAO;AAAA,gBAAA;AAAA,cACJ;AAAA,YAAA;AAAA,UACJ;AAAA,UACCf;AAAA,QAAA;AAAA,MAAA;AAAA,IAAA,EAET,CAAA,EACJ,CAAA;AAAA,EAER;AACJ;AAEAF,EAAiB,cAAc;"}
|
|
@@ -1,5 +1,16 @@
|
|
|
1
1
|
const t = {
|
|
2
|
+
marginTop: "10px",
|
|
3
|
+
marginBottom: "10px",
|
|
4
|
+
display: "inline-block",
|
|
5
|
+
overflow: "hidden",
|
|
6
|
+
textOverflow: "ellipsis",
|
|
7
|
+
maxWidth: "100%",
|
|
8
|
+
verticalAlign: "middle",
|
|
9
|
+
boxSizing: "border-box",
|
|
10
|
+
overflowWrap: "normal"
|
|
11
|
+
}, e = {
|
|
2
12
|
buttonPrimary: {
|
|
13
|
+
...t,
|
|
3
14
|
fontFamily: "var(--f-theme-settings-button-primary-font-family)",
|
|
4
15
|
fontSize: "var(--f-theme-settings-button-primary-font-size)",
|
|
5
16
|
fontWeight: "var(--f-theme-settings-button-primary-font-weight)",
|
|
@@ -15,9 +26,6 @@ const t = {
|
|
|
15
26
|
borderRadius: "var(--f-theme-settings-button-primary-border-radius)",
|
|
16
27
|
borderWidth: "var(--f-theme-settings-button-primary-border-width)",
|
|
17
28
|
color: "var(--f-theme-settings-button-primary-color)",
|
|
18
|
-
marginTop: "10px",
|
|
19
|
-
marginBottom: "10px",
|
|
20
|
-
display: "inline-block",
|
|
21
29
|
hover: {
|
|
22
30
|
backgroundColor: "var(--f-theme-settings-button-primary-background-color-hover)",
|
|
23
31
|
borderColor: "var(--f-theme-settings-button-primary-border-color-hover)",
|
|
@@ -25,6 +33,7 @@ const t = {
|
|
|
25
33
|
}
|
|
26
34
|
},
|
|
27
35
|
buttonSecondary: {
|
|
36
|
+
...t,
|
|
28
37
|
fontFamily: "var(--f-theme-settings-button-secondary-font-family)",
|
|
29
38
|
fontSize: "var(--f-theme-settings-button-secondary-font-size)",
|
|
30
39
|
fontWeight: "var(--f-theme-settings-button-secondary-font-weight)",
|
|
@@ -40,9 +49,6 @@ const t = {
|
|
|
40
49
|
borderRadius: "var(--f-theme-settings-button-secondary-border-radius)",
|
|
41
50
|
borderWidth: "var(--f-theme-settings-button-secondary-border-width)",
|
|
42
51
|
color: "var(--f-theme-settings-button-secondary-color)",
|
|
43
|
-
display: "inline-block",
|
|
44
|
-
marginTop: "10px",
|
|
45
|
-
marginBottom: "10px",
|
|
46
52
|
hover: {
|
|
47
53
|
backgroundColor: "var(--f-theme-settings-button-secondary-background-color-hover)",
|
|
48
54
|
borderColor: "var(--f-theme-settings-button-secondary-border-color-hover)",
|
|
@@ -50,6 +56,7 @@ const t = {
|
|
|
50
56
|
}
|
|
51
57
|
},
|
|
52
58
|
buttonTertiary: {
|
|
59
|
+
...t,
|
|
53
60
|
fontFamily: "var(--f-theme-settings-button-tertiary-font-family)",
|
|
54
61
|
fontSize: "var(--f-theme-settings-button-tertiary-font-size)",
|
|
55
62
|
fontWeight: "var(--f-theme-settings-button-tertiary-font-weight)",
|
|
@@ -65,9 +72,6 @@ const t = {
|
|
|
65
72
|
borderRadius: "var(--f-theme-settings-button-tertiary-border-radius)",
|
|
66
73
|
borderWidth: "var(--f-theme-settings-button-tertiary-border-width)",
|
|
67
74
|
color: "var(--f-theme-settings-button-tertiary-color)",
|
|
68
|
-
display: "inline-block",
|
|
69
|
-
marginTop: "10px",
|
|
70
|
-
marginBottom: "10px",
|
|
71
75
|
hover: {
|
|
72
76
|
backgroundColor: "var(--f-theme-settings-button-tertiary-background-color-hover)",
|
|
73
77
|
borderColor: "var(--f-theme-settings-button-tertiary-border-color-hover)",
|
|
@@ -76,6 +80,6 @@ const t = {
|
|
|
76
80
|
}
|
|
77
81
|
};
|
|
78
82
|
export {
|
|
79
|
-
|
|
83
|
+
e as BlockButtonStyles
|
|
80
84
|
};
|
|
81
85
|
//# sourceMappingURL=styles.es.js.map
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"styles.es.js","sources":["../../../../../../src/components/RichTextEditor/plugins/ButtonPlugin/utils/styles.ts"],"sourcesContent":["/* (c) Copyright Frontify Ltd., all rights reserved. */\n\nimport { type CSSProperties } from 'react';\n\nexport const BlockButtonStyles: Record<string, CSSProperties & { hover?: CSSProperties }> = {\n buttonPrimary: {\n fontFamily: 'var(--f-theme-settings-button-primary-font-family)',\n fontSize: 'var(--f-theme-settings-button-primary-font-size)',\n fontWeight: 'var(--f-theme-settings-button-primary-font-weight)',\n lineHeight: 'var(--f-theme-settings-button-primary-line-height)',\n paddingTop: 'var(--f-theme-settings-button-primary-padding-top)',\n paddingRight: 'var(--f-theme-settings-button-primary-padding-right)',\n paddingBottom: 'var(--f-theme-settings-button-primary-padding-bottom)',\n paddingLeft: 'var(--f-theme-settings-button-primary-padding-left)',\n fontStyle: 'var(--f-theme-settings-button-primary-font-style)',\n textTransform: 'var(--f-theme-settings-button-primary-text-transform)' as CSSProperties['textTransform'],\n backgroundColor: 'var(--f-theme-settings-button-primary-background-color)',\n borderColor: 'var(--f-theme-settings-button-primary-border-color)',\n borderRadius: 'var(--f-theme-settings-button-primary-border-radius)',\n borderWidth: 'var(--f-theme-settings-button-primary-border-width)',\n color: 'var(--f-theme-settings-button-primary-color)',\n
|
|
1
|
+
{"version":3,"file":"styles.es.js","sources":["../../../../../../src/components/RichTextEditor/plugins/ButtonPlugin/utils/styles.ts"],"sourcesContent":["/* (c) Copyright Frontify Ltd., all rights reserved. */\n\nimport { type CSSProperties } from 'react';\n\nconst DefaultButtonStyles: CSSProperties = {\n marginTop: '10px',\n marginBottom: '10px',\n display: 'inline-block',\n overflow: 'hidden',\n textOverflow: 'ellipsis',\n maxWidth: '100%',\n verticalAlign: 'middle',\n boxSizing: 'border-box',\n overflowWrap: 'normal',\n};\n\nexport const BlockButtonStyles: Record<string, CSSProperties & { hover?: CSSProperties }> = {\n buttonPrimary: {\n ...DefaultButtonStyles,\n fontFamily: 'var(--f-theme-settings-button-primary-font-family)',\n fontSize: 'var(--f-theme-settings-button-primary-font-size)',\n fontWeight: 'var(--f-theme-settings-button-primary-font-weight)',\n lineHeight: 'var(--f-theme-settings-button-primary-line-height)',\n paddingTop: 'var(--f-theme-settings-button-primary-padding-top)',\n paddingRight: 'var(--f-theme-settings-button-primary-padding-right)',\n paddingBottom: 'var(--f-theme-settings-button-primary-padding-bottom)',\n paddingLeft: 'var(--f-theme-settings-button-primary-padding-left)',\n fontStyle: 'var(--f-theme-settings-button-primary-font-style)',\n textTransform: 'var(--f-theme-settings-button-primary-text-transform)' as CSSProperties['textTransform'],\n backgroundColor: 'var(--f-theme-settings-button-primary-background-color)',\n borderColor: 'var(--f-theme-settings-button-primary-border-color)',\n borderRadius: 'var(--f-theme-settings-button-primary-border-radius)',\n borderWidth: 'var(--f-theme-settings-button-primary-border-width)',\n color: 'var(--f-theme-settings-button-primary-color)',\n\n hover: {\n backgroundColor: 'var(--f-theme-settings-button-primary-background-color-hover)',\n borderColor: 'var(--f-theme-settings-button-primary-border-color-hover)',\n color: 'var(--f-theme-settings-button-primary-color-hover)',\n },\n },\n\n buttonSecondary: {\n ...DefaultButtonStyles,\n fontFamily: 'var(--f-theme-settings-button-secondary-font-family)',\n fontSize: 'var(--f-theme-settings-button-secondary-font-size)',\n fontWeight: 'var(--f-theme-settings-button-secondary-font-weight)',\n lineHeight: 'var(--f-theme-settings-button-secondary-line-height)',\n paddingTop: 'var(--f-theme-settings-button-secondary-padding-top)',\n paddingRight: 'var(--f-theme-settings-button-secondary-padding-right)',\n paddingBottom: 'var(--f-theme-settings-button-secondary-padding-bottom)',\n paddingLeft: 'var(--f-theme-settings-button-secondary-padding-left)',\n fontStyle: 'var(--f-theme-settings-button-secondary-font-style)',\n textTransform: 'var(--f-theme-settings-button-secondary-text-transform)' as CSSProperties['textTransform'],\n backgroundColor: 'var(--f-theme-settings-button-secondary-background-color)',\n borderColor: 'var(--f-theme-settings-button-secondary-border-color)',\n borderRadius: 'var(--f-theme-settings-button-secondary-border-radius)',\n borderWidth: 'var(--f-theme-settings-button-secondary-border-width)',\n color: 'var(--f-theme-settings-button-secondary-color)',\n hover: {\n backgroundColor: 'var(--f-theme-settings-button-secondary-background-color-hover)',\n borderColor: 'var(--f-theme-settings-button-secondary-border-color-hover)',\n color: 'var(--f-theme-settings-button-secondary-color-hover)',\n },\n },\n\n buttonTertiary: {\n ...DefaultButtonStyles,\n fontFamily: 'var(--f-theme-settings-button-tertiary-font-family)',\n fontSize: 'var(--f-theme-settings-button-tertiary-font-size)',\n fontWeight: 'var(--f-theme-settings-button-tertiary-font-weight)',\n lineHeight: 'var(--f-theme-settings-button-tertiary-line-height)',\n paddingTop: 'var(--f-theme-settings-button-tertiary-padding-top)',\n paddingRight: 'var(--f-theme-settings-button-tertiary-padding-right)',\n paddingBottom: 'var(--f-theme-settings-button-tertiary-padding-bottom)',\n paddingLeft: 'var(--f-theme-settings-button-tertiary-padding-left)',\n fontStyle: 'var(--f-theme-settings-button-tertiary-font-style)',\n textTransform: 'var(--f-theme-settings-button-tertiary-text-transform)' as CSSProperties['textTransform'],\n backgroundColor: 'var(--f-theme-settings-button-tertiary-background-color)',\n borderColor: 'var(--f-theme-settings-button-tertiary-border-color)',\n borderRadius: 'var(--f-theme-settings-button-tertiary-border-radius)',\n borderWidth: 'var(--f-theme-settings-button-tertiary-border-width)',\n color: 'var(--f-theme-settings-button-tertiary-color)',\n hover: {\n backgroundColor: 'var(--f-theme-settings-button-tertiary-background-color-hover)',\n borderColor: 'var(--f-theme-settings-button-tertiary-border-color-hover)',\n color: 'var(--f-theme-settings-button-tertiary-color-hover)',\n },\n },\n};\n"],"names":["DefaultButtonStyles","BlockButtonStyles"],"mappings":"AAIA,MAAMA,IAAqC;AAAA,EACvC,WAAW;AAAA,EACX,cAAc;AAAA,EACd,SAAS;AAAA,EACT,UAAU;AAAA,EACV,cAAc;AAAA,EACd,UAAU;AAAA,EACV,eAAe;AAAA,EACf,WAAW;AAAA,EACX,cAAc;AAClB,GAEaC,IAA+E;AAAA,EACxF,eAAe;AAAA,IACX,GAAGD;AAAA,IACH,YAAY;AAAA,IACZ,UAAU;AAAA,IACV,YAAY;AAAA,IACZ,YAAY;AAAA,IACZ,YAAY;AAAA,IACZ,cAAc;AAAA,IACd,eAAe;AAAA,IACf,aAAa;AAAA,IACb,WAAW;AAAA,IACX,eAAe;AAAA,IACf,iBAAiB;AAAA,IACjB,aAAa;AAAA,IACb,cAAc;AAAA,IACd,aAAa;AAAA,IACb,OAAO;AAAA,IAEP,OAAO;AAAA,MACH,iBAAiB;AAAA,MACjB,aAAa;AAAA,MACb,OAAO;AAAA,IACX;AAAA,EACJ;AAAA,EAEA,iBAAiB;AAAA,IACb,GAAGA;AAAA,IACH,YAAY;AAAA,IACZ,UAAU;AAAA,IACV,YAAY;AAAA,IACZ,YAAY;AAAA,IACZ,YAAY;AAAA,IACZ,cAAc;AAAA,IACd,eAAe;AAAA,IACf,aAAa;AAAA,IACb,WAAW;AAAA,IACX,eAAe;AAAA,IACf,iBAAiB;AAAA,IACjB,aAAa;AAAA,IACb,cAAc;AAAA,IACd,aAAa;AAAA,IACb,OAAO;AAAA,IACP,OAAO;AAAA,MACH,iBAAiB;AAAA,MACjB,aAAa;AAAA,MACb,OAAO;AAAA,IACX;AAAA,EACJ;AAAA,EAEA,gBAAgB;AAAA,IACZ,GAAGA;AAAA,IACH,YAAY;AAAA,IACZ,UAAU;AAAA,IACV,YAAY;AAAA,IACZ,YAAY;AAAA,IACZ,YAAY;AAAA,IACZ,cAAc;AAAA,IACd,eAAe;AAAA,IACf,aAAa;AAAA,IACb,WAAW;AAAA,IACX,eAAe;AAAA,IACf,iBAAiB;AAAA,IACjB,aAAa;AAAA,IACb,cAAc;AAAA,IACd,aAAa;AAAA,IACb,OAAO;AAAA,IACP,OAAO;AAAA,MACH,iBAAiB;AAAA,MACjB,aAAa;AAAA,MACb,OAAO;AAAA,IACX;AAAA,EACJ;AACJ;"}
|