@contentful/f36-drag-handle 4.1.0 → 4.1.4
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/CHANGELOG.md +32 -0
- package/dist/main.js +8 -1
- package/dist/main.js.map +1 -1
- package/dist/module.js +8 -1
- package/dist/module.js.map +1 -1
- package/dist/types.d.ts.map +1 -1
- package/package.json +4 -4
package/CHANGELOG.md
CHANGED
|
@@ -3,6 +3,38 @@
|
|
|
3
3
|
All notable changes to this project will be documented in this file.
|
|
4
4
|
See [Conventional Commits](https://conventionalcommits.org) for commit guidelines.
|
|
5
5
|
|
|
6
|
+
## [4.1.4](https://github.com/contentful/forma-36/compare/@contentful/f36-drag-handle@4.1.3...@contentful/f36-drag-handle@4.1.4) (2022-02-09)
|
|
7
|
+
|
|
8
|
+
**Note:** Version bump only for package @contentful/f36-drag-handle
|
|
9
|
+
|
|
10
|
+
|
|
11
|
+
|
|
12
|
+
|
|
13
|
+
|
|
14
|
+
## [4.1.3](https://github.com/contentful/forma-36/compare/@contentful/f36-drag-handle@4.1.2...@contentful/f36-drag-handle@4.1.3) (2022-02-07)
|
|
15
|
+
|
|
16
|
+
**Note:** Version bump only for package @contentful/f36-drag-handle
|
|
17
|
+
|
|
18
|
+
|
|
19
|
+
|
|
20
|
+
|
|
21
|
+
|
|
22
|
+
## [4.1.2](https://github.com/contentful/forma-36/compare/@contentful/f36-drag-handle@4.1.1...@contentful/f36-drag-handle@4.1.2) (2022-02-04)
|
|
23
|
+
|
|
24
|
+
**Note:** Version bump only for package @contentful/f36-drag-handle
|
|
25
|
+
|
|
26
|
+
|
|
27
|
+
|
|
28
|
+
|
|
29
|
+
|
|
30
|
+
## [4.1.1](https://github.com/contentful/forma-36/compare/@contentful/f36-drag-handle@4.1.0...@contentful/f36-drag-handle@4.1.1) (2022-01-31)
|
|
31
|
+
|
|
32
|
+
**Note:** Version bump only for package @contentful/f36-drag-handle
|
|
33
|
+
|
|
34
|
+
|
|
35
|
+
|
|
36
|
+
|
|
37
|
+
|
|
6
38
|
# [4.1.0](https://github.com/contentful/forma-36/compare/@contentful/f36-drag-handle@4.0.1...@contentful/f36-drag-handle@4.1.0) (2022-01-31)
|
|
7
39
|
|
|
8
40
|
|
package/dist/main.js
CHANGED
|
@@ -77,7 +77,14 @@ const $7340ff11beb99de7$export$a0c24614540b0efb = /*#__PURE__*/ $9zqHf$react.for
|
|
|
77
77
|
}, [
|
|
78
78
|
onMouseLeave
|
|
79
79
|
]);
|
|
80
|
-
return(//
|
|
80
|
+
return(//
|
|
81
|
+
// The other alternative way to fix it was to pass a custom `shouldCancelStart` callback,
|
|
82
|
+
// in every place where we use this component with react-sortable-hoc.
|
|
83
|
+
// (the custom callback with all the logic from default callback, but without button event cancelation).
|
|
84
|
+
// So we decided that just changing it to the div, as it was in v3, is a better fix.
|
|
85
|
+
//
|
|
86
|
+
// default shouldCancelStart callback:
|
|
87
|
+
// https://github.com/clauderic/react-sortable-hoc/blob/d94ba3cc67cfc7d6d460b585e7723bdb50015e53/src/SortableContainer/defaultShouldCancelStart.js
|
|
81
88
|
/*#__PURE__*/ ($parcel$interopDefault($9zqHf$react)).createElement("div", {
|
|
82
89
|
role: "button",
|
|
83
90
|
tabIndex: 0,
|
package/dist/main.js.map
CHANGED
|
@@ -1 +1 @@
|
|
|
1
|
-
{"mappings":"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
|
|
1
|
+
{"mappings":"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","sources":["packages/components/drag-handle/src/index.ts","packages/components/drag-handle/src/DragHandle.tsx","packages/components/drag-handle/src/DragHandle.styles.ts"],"sourcesContent":["export { DragHandle } from './DragHandle';\nexport type { DragHandleProps } from './DragHandle';\n","import React, {\n forwardRef,\n useCallback,\n useState,\n FocusEventHandler,\n MouseEventHandler,\n} from 'react';\nimport { cx } from 'emotion';\nimport type { PropsWithHTMLElement } from '@contentful/f36-core';\nimport type { CommonProps, ExpandProps } from '@contentful/f36-core';\nimport { DragIcon } from '@contentful/f36-icons';\nimport { getStyles } from './DragHandle.styles';\n\nexport type DragHandleInternalProps = CommonProps & {\n /**\n * Applies styling for when the component is actively being dragged by\n * the user\n */\n isActive?: boolean;\n /**\n * Applies focus styling\n */\n isFocused?: boolean;\n /**\n * Applies hover styling\n */\n isHovered?: boolean;\n /**\n * Label rendered in DragHandle - not visible on screen as its purpose\n * is for screen readers only\n */\n label: string;\n /**\n * Set type button for div element\n */\n type?: string;\n};\n\nexport type DragHandleProps = PropsWithHTMLElement<\n DragHandleInternalProps,\n 'div'\n>;\n\nexport const DragHandle = forwardRef<\n HTMLDivElement,\n ExpandProps<DragHandleProps>\n>(\n (\n {\n className,\n isActive,\n isFocused: isFocusedProp,\n isHovered: isHoveredProp,\n label,\n onBlur,\n onFocus,\n onMouseEnter,\n onMouseLeave,\n testId = 'cf-ui-drag-handle',\n style,\n ...otherProps\n },\n forwardedRef,\n ) => {\n const styles = getStyles();\n const [isFocused, setisFocused] = useState(isFocusedProp);\n const [isHovered, setisHovered] = useState(isHoveredProp);\n\n const handleFocus = useCallback<FocusEventHandler<HTMLDivElement>>(\n (event) => {\n setisFocused(true);\n\n if (onFocus) {\n onFocus(event);\n }\n },\n [onFocus],\n );\n\n const handleBlur = useCallback<FocusEventHandler<HTMLDivElement>>(\n (event) => {\n setisFocused(false);\n\n if (onBlur) {\n onBlur(event);\n }\n },\n [onBlur],\n );\n\n const handleMouseEnter = useCallback<MouseEventHandler<HTMLDivElement>>(\n (event) => {\n setisHovered(true);\n\n if (onMouseEnter) {\n onMouseEnter(event);\n }\n },\n [onMouseEnter],\n );\n\n const handleMouseLeave = useCallback<MouseEventHandler<HTMLDivElement>>(\n (event) => {\n setisHovered(false);\n\n if (onMouseLeave) {\n onMouseLeave(event);\n }\n },\n [onMouseLeave],\n );\n\n return (\n // We use div instead of a button because react-sortable-hoc lib cancels sorting if the event target is button.\n //\n // The other alternative way to fix it was to pass a custom `shouldCancelStart` callback,\n // in every place where we use this component with react-sortable-hoc.\n // (the custom callback with all the logic from default callback, but without button event cancelation).\n // So we decided that just changing it to the div, as it was in v3, is a better fix.\n //\n // default shouldCancelStart callback:\n // https://github.com/clauderic/react-sortable-hoc/blob/d94ba3cc67cfc7d6d460b585e7723bdb50015e53/src/SortableContainer/defaultShouldCancelStart.js\n <div\n role=\"button\"\n tabIndex={0}\n type=\"button\"\n {...otherProps}\n className={cx(\n styles.root({ isActive, isFocused, isHovered }),\n className,\n )}\n onBlur={handleBlur}\n onFocus={handleFocus}\n onMouseEnter={handleMouseEnter}\n onMouseLeave={handleMouseLeave}\n data-test-id={testId}\n ref={forwardedRef}\n style={style}\n >\n <DragIcon variant=\"muted\" />\n <span className={styles.label}>{label}</span>\n </div>\n );\n },\n);\n\nDragHandle.displayName = 'DragHandle';\n","import { cx, css } from 'emotion';\nimport tokens from '@contentful/f36-tokens';\n\nexport const getStyles = () => ({\n label: css({\n position: 'absolute',\n width: '1px',\n height: '1px',\n padding: 0,\n margin: '-1px',\n overflow: 'hidden',\n clip: 'rect(0, 0, 0, 0)',\n border: 0,\n }),\n root: ({\n isActive,\n isFocused,\n isHovered,\n }: {\n isActive: boolean;\n isFocused: boolean;\n isHovered: boolean;\n }) => {\n return cx(\n css({\n alignItems: 'center',\n backgroundColor: tokens.gray100,\n border: 0,\n borderBottomLeftRadius: tokens.borderRadiusMedium,\n borderRight: `1px solid ${tokens.gray200}`,\n borderTopLeftRadius: tokens.borderRadiusMedium,\n boxSizing: 'border-box',\n display: 'flex',\n justifyContent: 'center',\n padding: 0,\n position: 'relative',\n transition: `background-color ${tokens.transitionDurationDefault} ${tokens.transitionEasingDefault}`,\n width: tokens.spacingL,\n '&:hover, &:focus': {\n backgroundColor: tokens.colorElementLight,\n },\n }),\n (isActive || isFocused || isHovered) &&\n css({\n backgroundColor: tokens.gray200,\n cursor: isActive ? 'grabbing' : 'grab',\n }),\n );\n },\n});\n"],"names":["DragHandle","DragHandleProps","React","forwardRef","useCallback","useState","FocusEventHandler","MouseEventHandler","PropsWithHTMLElement","CommonProps","ExpandProps","DragIcon","getStyles","DragHandleInternalProps","isActive","isFocused","isHovered","label","type","HTMLDivElement","className","isFocusedProp","isHoveredProp","onBlur","onFocus","onMouseEnter","onMouseLeave","testId","style","otherProps","forwardedRef","styles","setisFocused","setisHovered","handleFocus","event","handleBlur","handleMouseEnter","handleMouseLeave","root","displayName","tokens","alignItems","backgroundColor","gray100","border","borderBottomLeftRadius","borderRadiusMedium","borderRight","gray200","borderTopLeftRadius","boxSizing","display","justifyContent","padding","position","transition","transitionDurationDefault","transitionEasingDefault","width","spacingL","colorElementLight","cursor"],"version":3,"file":"main.js.map"}
|
package/dist/module.js
CHANGED
|
@@ -69,7 +69,14 @@ const $0d6e001a91dc675e$export$a0c24614540b0efb = /*#__PURE__*/ $8USmO$forwardRe
|
|
|
69
69
|
}, [
|
|
70
70
|
onMouseLeave
|
|
71
71
|
]);
|
|
72
|
-
return(//
|
|
72
|
+
return(//
|
|
73
|
+
// The other alternative way to fix it was to pass a custom `shouldCancelStart` callback,
|
|
74
|
+
// in every place where we use this component with react-sortable-hoc.
|
|
75
|
+
// (the custom callback with all the logic from default callback, but without button event cancelation).
|
|
76
|
+
// So we decided that just changing it to the div, as it was in v3, is a better fix.
|
|
77
|
+
//
|
|
78
|
+
// default shouldCancelStart callback:
|
|
79
|
+
// https://github.com/clauderic/react-sortable-hoc/blob/d94ba3cc67cfc7d6d460b585e7723bdb50015e53/src/SortableContainer/defaultShouldCancelStart.js
|
|
73
80
|
/*#__PURE__*/ $8USmO$react.createElement("div", {
|
|
74
81
|
role: "button",
|
|
75
82
|
tabIndex: 0,
|
package/dist/module.js.map
CHANGED
|
@@ -1 +1 @@
|
|
|
1
|
-
{"mappings":"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
|
|
1
|
+
{"mappings":"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","sources":["packages/components/drag-handle/src/index.ts","packages/components/drag-handle/src/DragHandle.tsx","packages/components/drag-handle/src/DragHandle.styles.ts"],"sourcesContent":["export { DragHandle } from './DragHandle';\nexport type { DragHandleProps } from './DragHandle';\n","import React, {\n forwardRef,\n useCallback,\n useState,\n FocusEventHandler,\n MouseEventHandler,\n} from 'react';\nimport { cx } from 'emotion';\nimport type { PropsWithHTMLElement } from '@contentful/f36-core';\nimport type { CommonProps, ExpandProps } from '@contentful/f36-core';\nimport { DragIcon } from '@contentful/f36-icons';\nimport { getStyles } from './DragHandle.styles';\n\nexport type DragHandleInternalProps = CommonProps & {\n /**\n * Applies styling for when the component is actively being dragged by\n * the user\n */\n isActive?: boolean;\n /**\n * Applies focus styling\n */\n isFocused?: boolean;\n /**\n * Applies hover styling\n */\n isHovered?: boolean;\n /**\n * Label rendered in DragHandle - not visible on screen as its purpose\n * is for screen readers only\n */\n label: string;\n /**\n * Set type button for div element\n */\n type?: string;\n};\n\nexport type DragHandleProps = PropsWithHTMLElement<\n DragHandleInternalProps,\n 'div'\n>;\n\nexport const DragHandle = forwardRef<\n HTMLDivElement,\n ExpandProps<DragHandleProps>\n>(\n (\n {\n className,\n isActive,\n isFocused: isFocusedProp,\n isHovered: isHoveredProp,\n label,\n onBlur,\n onFocus,\n onMouseEnter,\n onMouseLeave,\n testId = 'cf-ui-drag-handle',\n style,\n ...otherProps\n },\n forwardedRef,\n ) => {\n const styles = getStyles();\n const [isFocused, setisFocused] = useState(isFocusedProp);\n const [isHovered, setisHovered] = useState(isHoveredProp);\n\n const handleFocus = useCallback<FocusEventHandler<HTMLDivElement>>(\n (event) => {\n setisFocused(true);\n\n if (onFocus) {\n onFocus(event);\n }\n },\n [onFocus],\n );\n\n const handleBlur = useCallback<FocusEventHandler<HTMLDivElement>>(\n (event) => {\n setisFocused(false);\n\n if (onBlur) {\n onBlur(event);\n }\n },\n [onBlur],\n );\n\n const handleMouseEnter = useCallback<MouseEventHandler<HTMLDivElement>>(\n (event) => {\n setisHovered(true);\n\n if (onMouseEnter) {\n onMouseEnter(event);\n }\n },\n [onMouseEnter],\n );\n\n const handleMouseLeave = useCallback<MouseEventHandler<HTMLDivElement>>(\n (event) => {\n setisHovered(false);\n\n if (onMouseLeave) {\n onMouseLeave(event);\n }\n },\n [onMouseLeave],\n );\n\n return (\n // We use div instead of a button because react-sortable-hoc lib cancels sorting if the event target is button.\n //\n // The other alternative way to fix it was to pass a custom `shouldCancelStart` callback,\n // in every place where we use this component with react-sortable-hoc.\n // (the custom callback with all the logic from default callback, but without button event cancelation).\n // So we decided that just changing it to the div, as it was in v3, is a better fix.\n //\n // default shouldCancelStart callback:\n // https://github.com/clauderic/react-sortable-hoc/blob/d94ba3cc67cfc7d6d460b585e7723bdb50015e53/src/SortableContainer/defaultShouldCancelStart.js\n <div\n role=\"button\"\n tabIndex={0}\n type=\"button\"\n {...otherProps}\n className={cx(\n styles.root({ isActive, isFocused, isHovered }),\n className,\n )}\n onBlur={handleBlur}\n onFocus={handleFocus}\n onMouseEnter={handleMouseEnter}\n onMouseLeave={handleMouseLeave}\n data-test-id={testId}\n ref={forwardedRef}\n style={style}\n >\n <DragIcon variant=\"muted\" />\n <span className={styles.label}>{label}</span>\n </div>\n );\n },\n);\n\nDragHandle.displayName = 'DragHandle';\n","import { cx, css } from 'emotion';\nimport tokens from '@contentful/f36-tokens';\n\nexport const getStyles = () => ({\n label: css({\n position: 'absolute',\n width: '1px',\n height: '1px',\n padding: 0,\n margin: '-1px',\n overflow: 'hidden',\n clip: 'rect(0, 0, 0, 0)',\n border: 0,\n }),\n root: ({\n isActive,\n isFocused,\n isHovered,\n }: {\n isActive: boolean;\n isFocused: boolean;\n isHovered: boolean;\n }) => {\n return cx(\n css({\n alignItems: 'center',\n backgroundColor: tokens.gray100,\n border: 0,\n borderBottomLeftRadius: tokens.borderRadiusMedium,\n borderRight: `1px solid ${tokens.gray200}`,\n borderTopLeftRadius: tokens.borderRadiusMedium,\n boxSizing: 'border-box',\n display: 'flex',\n justifyContent: 'center',\n padding: 0,\n position: 'relative',\n transition: `background-color ${tokens.transitionDurationDefault} ${tokens.transitionEasingDefault}`,\n width: tokens.spacingL,\n '&:hover, &:focus': {\n backgroundColor: tokens.colorElementLight,\n },\n }),\n (isActive || isFocused || isHovered) &&\n css({\n backgroundColor: tokens.gray200,\n cursor: isActive ? 'grabbing' : 'grab',\n }),\n );\n },\n});\n"],"names":["DragHandle","DragHandleProps","React","forwardRef","useCallback","useState","FocusEventHandler","MouseEventHandler","PropsWithHTMLElement","CommonProps","ExpandProps","DragIcon","getStyles","DragHandleInternalProps","isActive","isFocused","isHovered","label","type","HTMLDivElement","className","isFocusedProp","isHoveredProp","onBlur","onFocus","onMouseEnter","onMouseLeave","testId","style","otherProps","forwardedRef","styles","setisFocused","setisHovered","handleFocus","event","handleBlur","handleMouseEnter","handleMouseLeave","root","displayName","tokens","alignItems","backgroundColor","gray100","border","borderBottomLeftRadius","borderRadiusMedium","borderRight","gray200","borderTopLeftRadius","boxSizing","display","justifyContent","padding","position","transition","transitionDurationDefault","transitionEasingDefault","width","spacingL","colorElementLight","cursor"],"version":3,"file":"module.js.map"}
|
package/dist/types.d.ts.map
CHANGED
|
@@ -1 +1 @@
|
|
|
1
|
-
{"mappings":";;ACaA,+BAAsC,WAAW,GAAG;IAClD;;;OAGG;IACH,QAAQ,CAAC,EAAE,OAAO,CAAC;IACnB;;OAEG;IACH,SAAS,CAAC,EAAE,OAAO,CAAC;IACpB;;OAEG;IACH,SAAS,CAAC,EAAE,OAAO,CAAC;IACpB;;;OAGG;IACH,KAAK,EAAE,MAAM,CAAC;IACd;;OAEG;IACH,IAAI,CAAC,EAAE,MAAM,CAAC;CACf,CAAC;AAEF,8BAA8B,qBAC5B,uBAAuB,EACvB,KAAK,CACN,CAAC;AAEF,OAAO,MAAM;IA7BX;;;OAGG;eACQ,OAAO;IAClB;;OAEG;gBACS,OAAO;IACnB;;OAEG;gBACS,OAAO;IACnB;;;OAGG;WACI,MAAM;IACb;;OAEG;WACI,MAAM;
|
|
1
|
+
{"mappings":";;ACaA,+BAAsC,WAAW,GAAG;IAClD;;;OAGG;IACH,QAAQ,CAAC,EAAE,OAAO,CAAC;IACnB;;OAEG;IACH,SAAS,CAAC,EAAE,OAAO,CAAC;IACpB;;OAEG;IACH,SAAS,CAAC,EAAE,OAAO,CAAC;IACpB;;;OAGG;IACH,KAAK,EAAE,MAAM,CAAC;IACd;;OAEG;IACH,IAAI,CAAC,EAAE,MAAM,CAAC;CACf,CAAC;AAEF,8BAA8B,qBAC5B,uBAAuB,EACvB,KAAK,CACN,CAAC;AAEF,OAAO,MAAM;IA7BX;;;OAGG;eACQ,OAAO;IAClB;;OAEG;gBACS,OAAO;IACnB;;OAEG;gBACS,OAAO;IACnB;;;OAGG;WACI,MAAM;IACb;;OAEG;WACI,MAAM;wCA6Gd,CAAC","sources":["packages/components/drag-handle/src/src/DragHandle.styles.ts","packages/components/drag-handle/src/src/DragHandle.tsx","packages/components/drag-handle/src/src/index.ts","packages/components/drag-handle/src/index.ts"],"sourcesContent":[null,null,null,"export { DragHandle } from './DragHandle';\nexport type { DragHandleProps } from './DragHandle';\n"],"names":[],"version":3,"file":"types.d.ts.map"}
|
package/package.json
CHANGED
|
@@ -1,14 +1,14 @@
|
|
|
1
1
|
{
|
|
2
2
|
"name": "@contentful/f36-drag-handle",
|
|
3
|
-
"version": "4.1.
|
|
3
|
+
"version": "4.1.4",
|
|
4
4
|
"description": "Forma 36: DragHandle component",
|
|
5
5
|
"scripts": {
|
|
6
6
|
"build": "parcel build"
|
|
7
7
|
},
|
|
8
8
|
"dependencies": {
|
|
9
9
|
"@babel/runtime": "^7.6.2",
|
|
10
|
-
"@contentful/f36-core": "^4.1.
|
|
11
|
-
"@contentful/f36-icons": "^4.0
|
|
10
|
+
"@contentful/f36-core": "^4.1.1",
|
|
11
|
+
"@contentful/f36-icons": "^4.1.0",
|
|
12
12
|
"@contentful/f36-tokens": "^4.0.0",
|
|
13
13
|
"emotion": "^10.0.17"
|
|
14
14
|
},
|
|
@@ -32,5 +32,5 @@
|
|
|
32
32
|
"publishConfig": {
|
|
33
33
|
"access": "public"
|
|
34
34
|
},
|
|
35
|
-
"gitHead": "
|
|
35
|
+
"gitHead": "4033d5c2d365609e33bc0d7f293959acdcdd8c65"
|
|
36
36
|
}
|