@pie-lib/drag 2.0.2 → 2.0.3-next.12
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/lib/placeholder.js +13 -2
- package/lib/placeholder.js.map +1 -1
- package/package.json +2 -2
- package/src/placeholder.jsx +12 -2
package/lib/placeholder.js
CHANGED
|
@@ -24,7 +24,8 @@ var PlaceHolder = function PlaceHolder(props) {
|
|
|
24
24
|
isOver = props.isOver,
|
|
25
25
|
type = props.type,
|
|
26
26
|
grid = props.grid,
|
|
27
|
-
disabled = props.disabled
|
|
27
|
+
disabled = props.disabled,
|
|
28
|
+
choiceBoard = props.choiceBoard;
|
|
28
29
|
var names = (0, _classnames["default"])(classes.placeholder, disabled && classes.disabled, isOver && classes.over, classes[type], className);
|
|
29
30
|
var style = {};
|
|
30
31
|
|
|
@@ -39,7 +40,7 @@ var PlaceHolder = function PlaceHolder(props) {
|
|
|
39
40
|
|
|
40
41
|
return /*#__PURE__*/_react["default"].createElement("div", {
|
|
41
42
|
style: style,
|
|
42
|
-
className: names
|
|
43
|
+
className: choiceBoard ? classes.board : names
|
|
43
44
|
}, children);
|
|
44
45
|
};
|
|
45
46
|
|
|
@@ -81,6 +82,16 @@ var styles = function styles(theme) {
|
|
|
81
82
|
over: {
|
|
82
83
|
border: "1px solid ".concat(_grey["default"][500]),
|
|
83
84
|
backgroundColor: "".concat(_grey["default"][300])
|
|
85
|
+
},
|
|
86
|
+
board: {
|
|
87
|
+
border: '1px solid #D1D1D1',
|
|
88
|
+
padding: '4px',
|
|
89
|
+
display: 'flex',
|
|
90
|
+
flexWrap: 'wrap',
|
|
91
|
+
alignItems: 'center',
|
|
92
|
+
justifyContent: 'center',
|
|
93
|
+
marginLeft: '20px',
|
|
94
|
+
minHeight: '200px'
|
|
84
95
|
}
|
|
85
96
|
};
|
|
86
97
|
};
|
package/lib/placeholder.js.map
CHANGED
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"sources":["../src/placeholder.jsx"],"names":["PlaceHolder","props","children","classes","className","isOver","type","grid","disabled","names","placeholder","over","style","columns","gridTemplateColumns","rows","repeatValue","rowsRepeatValue","gridTemplateRows","propTypes","PropTypes","object","isRequired","shape","number","string","oneOfType","arrayOf","node","bool","index","styles","theme","width","height","background","border","transition","boxSizing","display","gridRowGap","spacing","unit","gridColumnGap","padding","boxShadow","grey","backgroundColor"],"mappings":";;;;;;;;;AAAA;;AACA;;AACA;;AACA;;AACA;;AAEO,IAAMA,WAAW,GAAG,SAAdA,WAAc,CAACC,KAAD,EAAW;AACpC,MAAQC,QAAR,
|
|
1
|
+
{"version":3,"sources":["../src/placeholder.jsx"],"names":["PlaceHolder","props","children","classes","className","isOver","type","grid","disabled","choiceBoard","names","placeholder","over","style","columns","gridTemplateColumns","rows","repeatValue","rowsRepeatValue","gridTemplateRows","board","propTypes","PropTypes","object","isRequired","shape","number","string","oneOfType","arrayOf","node","bool","index","styles","theme","width","height","background","border","transition","boxSizing","display","gridRowGap","spacing","unit","gridColumnGap","padding","boxShadow","grey","backgroundColor","flexWrap","alignItems","justifyContent","marginLeft","minHeight"],"mappings":"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","sourcesContent":["import React from 'react';\nimport { withStyles } from '@material-ui/core/styles';\nimport classNames from 'classnames';\nimport PropTypes from 'prop-types';\nimport grey from '@material-ui/core/colors/grey';\n\nexport const PlaceHolder = (props) => {\n const { children, classes, className, isOver, type, grid, disabled, choiceBoard } = props;\n const names = classNames(\n classes.placeholder,\n disabled && classes.disabled,\n isOver && classes.over,\n classes[type],\n className,\n );\n\n const style = {};\n\n if (grid && grid.columns) {\n style.gridTemplateColumns = `repeat(${grid.columns}, 1fr)`;\n }\n if (grid && grid.rows) {\n const repeatValue = grid.rowsRepeatValue || '1fr';\n\n style.gridTemplateRows = `repeat(${grid.rows}, ${repeatValue})`;\n }\n\n return (\n <div style={style} className={choiceBoard ? classes.board : names}>\n {children}\n </div>\n );\n};\n\nPlaceHolder.propTypes = {\n classes: PropTypes.object.isRequired,\n grid: PropTypes.shape({\n columns: PropTypes.number,\n rows: PropTypes.number,\n // if a different value then 1fr is wanted\n rowsRepeatValue: PropTypes.string,\n }),\n children: PropTypes.oneOfType([PropTypes.arrayOf(PropTypes.node), PropTypes.node]).isRequired,\n className: PropTypes.string,\n isOver: PropTypes.bool,\n index: PropTypes.number,\n type: PropTypes.string,\n disabled: PropTypes.bool,\n};\n\nconst styles = (theme) => ({\n placeholder: {\n width: '100%',\n height: '100%',\n background: '#EEEEEE',\n border: '1px solid #D1D1D1',\n transition: 'background-color 200ms linear, border-color 200ms linear',\n boxSizing: 'border-box',\n display: 'grid',\n gridRowGap: `${theme.spacing.unit}px`,\n gridColumnGap: `${theme.spacing.unit}px`,\n padding: theme.spacing.unit * 1,\n },\n disabled: {\n boxShadow: 'none',\n background: 'white',\n },\n over: {\n border: `1px solid ${grey[500]}`,\n backgroundColor: `${grey[300]}`,\n },\n board: {\n border: '1px solid #D1D1D1',\n padding: '4px',\n display: 'flex',\n flexWrap: 'wrap',\n alignItems: 'center',\n justifyContent: 'center',\n marginLeft: '20px',\n minHeight: '200px',\n },\n});\n\nexport default withStyles(styles)(PlaceHolder);\n"],"file":"placeholder.js"}
|
package/package.json
CHANGED
|
@@ -1,6 +1,6 @@
|
|
|
1
1
|
{
|
|
2
2
|
"name": "@pie-lib/drag",
|
|
3
|
-
"version": "2.0.
|
|
3
|
+
"version": "2.0.3-next.12+1791d878",
|
|
4
4
|
"description": "",
|
|
5
5
|
"main": "lib/index.js",
|
|
6
6
|
"module": "src/index.js",
|
|
@@ -17,5 +17,5 @@
|
|
|
17
17
|
"scripts": {},
|
|
18
18
|
"author": "",
|
|
19
19
|
"license": "ISC",
|
|
20
|
-
"gitHead": "
|
|
20
|
+
"gitHead": "1791d878a49d25eedc2ff2cdf47d57c30b4276b3"
|
|
21
21
|
}
|
package/src/placeholder.jsx
CHANGED
|
@@ -5,7 +5,7 @@ import PropTypes from 'prop-types';
|
|
|
5
5
|
import grey from '@material-ui/core/colors/grey';
|
|
6
6
|
|
|
7
7
|
export const PlaceHolder = (props) => {
|
|
8
|
-
const { children, classes, className, isOver, type, grid, disabled } = props;
|
|
8
|
+
const { children, classes, className, isOver, type, grid, disabled, choiceBoard } = props;
|
|
9
9
|
const names = classNames(
|
|
10
10
|
classes.placeholder,
|
|
11
11
|
disabled && classes.disabled,
|
|
@@ -26,7 +26,7 @@ export const PlaceHolder = (props) => {
|
|
|
26
26
|
}
|
|
27
27
|
|
|
28
28
|
return (
|
|
29
|
-
<div style={style} className={names}>
|
|
29
|
+
<div style={style} className={choiceBoard ? classes.board : names}>
|
|
30
30
|
{children}
|
|
31
31
|
</div>
|
|
32
32
|
);
|
|
@@ -69,6 +69,16 @@ const styles = (theme) => ({
|
|
|
69
69
|
border: `1px solid ${grey[500]}`,
|
|
70
70
|
backgroundColor: `${grey[300]}`,
|
|
71
71
|
},
|
|
72
|
+
board: {
|
|
73
|
+
border: '1px solid #D1D1D1',
|
|
74
|
+
padding: '4px',
|
|
75
|
+
display: 'flex',
|
|
76
|
+
flexWrap: 'wrap',
|
|
77
|
+
alignItems: 'center',
|
|
78
|
+
justifyContent: 'center',
|
|
79
|
+
marginLeft: '20px',
|
|
80
|
+
minHeight: '200px',
|
|
81
|
+
},
|
|
72
82
|
});
|
|
73
83
|
|
|
74
84
|
export default withStyles(styles)(PlaceHolder);
|