@spark-web/columns 2.0.5 → 2.1.0

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.
Files changed (7) hide show
  1. package/CHANGELOG.md +17 -0
  2. package/dist/declarations/src/alignment.d.ts +5 -5
  3. package/dist/declarations/src/columns.d.ts +1 -1
  4. package/dist/spark-web-columns.cjs.dev.js +13 -16
  5. package/dist/spark-web-columns.cjs.prod.js +13 -16
  6. package/dist/spark-web-columns.esm.js +13 -16
  7. package/package.json +6 -6
package/CHANGELOG.md CHANGED
@@ -1,5 +1,22 @@
1
1
  # @spark-web/columns
2
2
 
3
+ ## 2.1.0
4
+
5
+ ### Minor Changes
6
+
7
+ - [#382](https://github.com/brighte-labs/spark-web/pull/382)
8
+ [`955bf5d`](https://github.com/brighte-labs/spark-web/commit/955bf5d7698bfdf45e7f317aa3e726c81d3444c0)
9
+ Thanks [@dilipt-brighte](https://github.com/dilipt-brighte)! - Updates React
10
+ version to latest (18.2.0)
11
+
12
+ ### Patch Changes
13
+
14
+ - Updated dependencies
15
+ [[`955bf5d`](https://github.com/brighte-labs/spark-web/commit/955bf5d7698bfdf45e7f317aa3e726c81d3444c0)]:
16
+ - @spark-web/box@1.2.0
17
+ - @spark-web/theme@3.2.0
18
+ - @spark-web/utils@1.3.0
19
+
3
20
  ## 2.0.5
4
21
 
5
22
  ### Patch Changes
package/dist/declarations/src/alignment.d.ts CHANGED
@@ -5,10 +5,10 @@ declare const alignYLookup: {
5
5
  readonly stretch: "stretch";
6
6
  };
7
7
  export declare type AlignY = keyof typeof alignYLookup;
8
- export declare const alignYToAlignItems: (prop?: import("@spark-web/theme").ResponsiveProp<"bottom" | "top" | "center" | "stretch"> | undefined) => "start" | "center" | "stretch" | "end" | {
9
- mobile: "start" | "center" | "stretch" | "end" | undefined;
10
- tablet: "start" | "center" | "stretch" | "end" | undefined;
11
- desktop: "start" | "center" | "stretch" | "end" | undefined;
12
- wide: "start" | "center" | "stretch" | "end" | undefined;
8
+ export declare const alignYToAlignItems: (prop?: import("@spark-web/theme").ResponsiveProp<"bottom" | "top" | "center" | "stretch"> | undefined) => "center" | "stretch" | "start" | "end" | {
9
+ mobile: "center" | "stretch" | "start" | "end" | undefined;
10
+ tablet: "center" | "stretch" | "start" | "end" | undefined;
11
+ desktop: "center" | "stretch" | "start" | "end" | undefined;
12
+ wide: "center" | "stretch" | "start" | "end" | undefined;
13
13
  } | undefined;
14
14
  export {};
package/dist/declarations/src/columns.d.ts CHANGED
@@ -21,7 +21,7 @@ export declare type ColumnsProps = {
21
21
  } & ValidBoxProps;
22
22
  export declare const Columns: <Comp extends import("react").ElementType<any> = "div">(props: {
23
23
  as?: Comp | undefined;
24
- ref?: import("react").Ref<Comp extends "symbol" | "svg" | "animate" | "animateMotion" | "animateTransform" | "circle" | "clipPath" | "defs" | "desc" | "ellipse" | "feBlend" | "feColorMatrix" | "feComponentTransfer" | "feComposite" | "feConvolveMatrix" | "feDiffuseLighting" | "feDisplacementMap" | "feDistantLight" | "feDropShadow" | "feFlood" | "feFuncA" | "feFuncB" | "feFuncG" | "feFuncR" | "feGaussianBlur" | "feImage" | "feMerge" | "feMergeNode" | "feMorphology" | "feOffset" | "fePointLight" | "feSpecularLighting" | "feSpotLight" | "feTile" | "feTurbulence" | "filter" | "foreignObject" | "g" | "image" | "line" | "linearGradient" | "marker" | "mask" | "metadata" | "mpath" | "path" | "pattern" | "polygon" | "polyline" | "radialGradient" | "rect" | "stop" | "switch" | "text" | "textPath" | "tspan" | "use" | "view" | "set" | keyof HTMLElementTagNameMap ? (HTMLElementTagNameMap & Pick<SVGElementTagNameMap, "symbol" | "svg" | "animate" | "animateMotion" | "animateTransform" | "circle" | "clipPath" | "defs" | "desc" | "ellipse" | "feBlend" | "feColorMatrix" | "feComponentTransfer" | "feComposite" | "feConvolveMatrix" | "feDiffuseLighting" | "feDisplacementMap" | "feDistantLight" | "feDropShadow" | "feFlood" | "feFuncA" | "feFuncB" | "feFuncG" | "feFuncR" | "feGaussianBlur" | "feImage" | "feMerge" | "feMergeNode" | "feMorphology" | "feOffset" | "fePointLight" | "feSpecularLighting" | "feSpotLight" | "feTile" | "feTurbulence" | "filter" | "foreignObject" | "g" | "image" | "line" | "linearGradient" | "marker" | "mask" | "metadata" | "mpath" | "path" | "pattern" | "polygon" | "polyline" | "radialGradient" | "rect" | "stop" | "switch" | "text" | "textPath" | "tspan" | "use" | "view" | "set">)[Comp] : Comp extends new (...args: any) => any ? InstanceType<Comp> : undefined> | undefined;
24
+ ref?: import("react").Ref<Comp extends "symbol" | "clipPath" | "filter" | "mask" | "marker" | "svg" | "animate" | "animateMotion" | "animateTransform" | "circle" | "defs" | "desc" | "ellipse" | "feBlend" | "feColorMatrix" | "feComponentTransfer" | "feComposite" | "feConvolveMatrix" | "feDiffuseLighting" | "feDisplacementMap" | "feDistantLight" | "feDropShadow" | "feFlood" | "feFuncA" | "feFuncB" | "feFuncG" | "feFuncR" | "feGaussianBlur" | "feImage" | "feMerge" | "feMergeNode" | "feMorphology" | "feOffset" | "fePointLight" | "feSpecularLighting" | "feSpotLight" | "feTile" | "feTurbulence" | "foreignObject" | "g" | "image" | "line" | "linearGradient" | "metadata" | "mpath" | "path" | "pattern" | "polygon" | "polyline" | "radialGradient" | "rect" | "stop" | "switch" | "text" | "textPath" | "tspan" | "use" | "view" | keyof HTMLElementTagNameMap | "set" ? (HTMLElementTagNameMap & Pick<SVGElementTagNameMap, "symbol" | "clipPath" | "filter" | "mask" | "marker" | "svg" | "animate" | "animateMotion" | "animateTransform" | "circle" | "defs" | "desc" | "ellipse" | "feBlend" | "feColorMatrix" | "feComponentTransfer" | "feComposite" | "feConvolveMatrix" | "feDiffuseLighting" | "feDisplacementMap" | "feDistantLight" | "feDropShadow" | "feFlood" | "feFuncA" | "feFuncB" | "feFuncG" | "feFuncR" | "feGaussianBlur" | "feImage" | "feMerge" | "feMergeNode" | "feMorphology" | "feOffset" | "fePointLight" | "feSpecularLighting" | "feSpotLight" | "feTile" | "feTurbulence" | "foreignObject" | "g" | "image" | "line" | "linearGradient" | "metadata" | "mpath" | "path" | "pattern" | "polygon" | "polyline" | "radialGradient" | "rect" | "stop" | "switch" | "text" | "textPath" | "tspan" | "use" | "view" | "set">)[Comp] : Comp extends new (...args: any) => any ? InstanceType<Comp> : undefined> | undefined;
25
25
  } & Omit<import("react").PropsWithoutRef<import("react").ComponentProps<Comp>>, "as"> & {
26
26
  /** Vertically align items within the container. */
27
27
  alignY?: ResponsiveProp<"bottom" | "top" | "center" | "stretch"> | undefined;
package/dist/spark-web-columns.cjs.dev.js CHANGED
@@ -23,29 +23,26 @@ var alignYToAlignItems = theme.createResponsiveMapFn(alignYLookup);
23
23
  var _excluded = ["alignY", "collapseBelow", "data", "gap", "template"];
24
24
  var Columns = ts.forwardRefWithAs(function (_ref, forwardedRef) {
25
25
  var _ref$alignY = _ref.alignY,
26
- alignY = _ref$alignY === void 0 ? 'top' : _ref$alignY,
27
- collapseBelow = _ref.collapseBelow,
28
- data = _ref.data,
29
- gap = _ref.gap,
30
- template = _ref.template,
31
- props = _objectWithoutProperties(_ref, _excluded);
32
-
26
+ alignY = _ref$alignY === void 0 ? 'top' : _ref$alignY,
27
+ collapseBelow = _ref.collapseBelow,
28
+ data = _ref.data,
29
+ gap = _ref.gap,
30
+ template = _ref.template,
31
+ props = _objectWithoutProperties(_ref, _excluded);
33
32
  var theme$1 = theme.useTheme();
34
33
  var alignItems = alignYToAlignItems(alignY);
35
34
  var count = react.Children.count(props.children);
36
35
  var gridTemplateColumns = template ? template.map(function (c) {
37
36
  return "".concat(c, "fr");
38
37
  }).join(' ') : "repeat(".concat(count, ", 1fr)");
39
-
40
38
  var _theme$utils$responsi = theme$1.utils.responsiveRange({
41
- below: collapseBelow
42
- }),
43
- _theme$utils$responsi2 = _slicedToArray(_theme$utils$responsi, 4),
44
- collapseOnMobile = _theme$utils$responsi2[0],
45
- collapseOnTablet = _theme$utils$responsi2[1],
46
- collapseOnDesktop = _theme$utils$responsi2[2],
47
- collapseOnWide = _theme$utils$responsi2[3];
48
-
39
+ below: collapseBelow
40
+ }),
41
+ _theme$utils$responsi2 = _slicedToArray(_theme$utils$responsi, 4),
42
+ collapseOnMobile = _theme$utils$responsi2[0],
43
+ collapseOnTablet = _theme$utils$responsi2[1],
44
+ collapseOnDesktop = _theme$utils$responsi2[2],
45
+ collapseOnWide = _theme$utils$responsi2[3];
49
46
  return /*#__PURE__*/jsxRuntime.jsx(box.Box, _objectSpread({
50
47
  ref: forwardedRef,
51
48
  className: css.css(theme$1.utils.resolveResponsiveProps({
package/dist/spark-web-columns.cjs.prod.js CHANGED
@@ -23,29 +23,26 @@ var alignYToAlignItems = theme.createResponsiveMapFn(alignYLookup);
23
23
  var _excluded = ["alignY", "collapseBelow", "data", "gap", "template"];
24
24
  var Columns = ts.forwardRefWithAs(function (_ref, forwardedRef) {
25
25
  var _ref$alignY = _ref.alignY,
26
- alignY = _ref$alignY === void 0 ? 'top' : _ref$alignY,
27
- collapseBelow = _ref.collapseBelow,
28
- data = _ref.data,
29
- gap = _ref.gap,
30
- template = _ref.template,
31
- props = _objectWithoutProperties(_ref, _excluded);
32
-
26
+ alignY = _ref$alignY === void 0 ? 'top' : _ref$alignY,
27
+ collapseBelow = _ref.collapseBelow,
28
+ data = _ref.data,
29
+ gap = _ref.gap,
30
+ template = _ref.template,
31
+ props = _objectWithoutProperties(_ref, _excluded);
33
32
  var theme$1 = theme.useTheme();
34
33
  var alignItems = alignYToAlignItems(alignY);
35
34
  var count = react.Children.count(props.children);
36
35
  var gridTemplateColumns = template ? template.map(function (c) {
37
36
  return "".concat(c, "fr");
38
37
  }).join(' ') : "repeat(".concat(count, ", 1fr)");
39
-
40
38
  var _theme$utils$responsi = theme$1.utils.responsiveRange({
41
- below: collapseBelow
42
- }),
43
- _theme$utils$responsi2 = _slicedToArray(_theme$utils$responsi, 4),
44
- collapseOnMobile = _theme$utils$responsi2[0],
45
- collapseOnTablet = _theme$utils$responsi2[1],
46
- collapseOnDesktop = _theme$utils$responsi2[2],
47
- collapseOnWide = _theme$utils$responsi2[3];
48
-
39
+ below: collapseBelow
40
+ }),
41
+ _theme$utils$responsi2 = _slicedToArray(_theme$utils$responsi, 4),
42
+ collapseOnMobile = _theme$utils$responsi2[0],
43
+ collapseOnTablet = _theme$utils$responsi2[1],
44
+ collapseOnDesktop = _theme$utils$responsi2[2],
45
+ collapseOnWide = _theme$utils$responsi2[3];
49
46
  return /*#__PURE__*/jsxRuntime.jsx(box.Box, _objectSpread({
50
47
  ref: forwardedRef,
51
48
  className: css.css(theme$1.utils.resolveResponsiveProps({
package/dist/spark-web-columns.esm.js CHANGED
@@ -19,29 +19,26 @@ var alignYToAlignItems = createResponsiveMapFn(alignYLookup);
19
19
  var _excluded = ["alignY", "collapseBelow", "data", "gap", "template"];
20
20
  var Columns = forwardRefWithAs(function (_ref, forwardedRef) {
21
21
  var _ref$alignY = _ref.alignY,
22
- alignY = _ref$alignY === void 0 ? 'top' : _ref$alignY,
23
- collapseBelow = _ref.collapseBelow,
24
- data = _ref.data,
25
- gap = _ref.gap,
26
- template = _ref.template,
27
- props = _objectWithoutProperties(_ref, _excluded);
28
-
22
+ alignY = _ref$alignY === void 0 ? 'top' : _ref$alignY,
23
+ collapseBelow = _ref.collapseBelow,
24
+ data = _ref.data,
25
+ gap = _ref.gap,
26
+ template = _ref.template,
27
+ props = _objectWithoutProperties(_ref, _excluded);
29
28
  var theme = useTheme();
30
29
  var alignItems = alignYToAlignItems(alignY);
31
30
  var count = Children.count(props.children);
32
31
  var gridTemplateColumns = template ? template.map(function (c) {
33
32
  return "".concat(c, "fr");
34
33
  }).join(' ') : "repeat(".concat(count, ", 1fr)");
35
-
36
34
  var _theme$utils$responsi = theme.utils.responsiveRange({
37
- below: collapseBelow
38
- }),
39
- _theme$utils$responsi2 = _slicedToArray(_theme$utils$responsi, 4),
40
- collapseOnMobile = _theme$utils$responsi2[0],
41
- collapseOnTablet = _theme$utils$responsi2[1],
42
- collapseOnDesktop = _theme$utils$responsi2[2],
43
- collapseOnWide = _theme$utils$responsi2[3];
44
-
35
+ below: collapseBelow
36
+ }),
37
+ _theme$utils$responsi2 = _slicedToArray(_theme$utils$responsi, 4),
38
+ collapseOnMobile = _theme$utils$responsi2[0],
39
+ collapseOnTablet = _theme$utils$responsi2[1],
40
+ collapseOnDesktop = _theme$utils$responsi2[2],
41
+ collapseOnWide = _theme$utils$responsi2[3];
45
42
  return /*#__PURE__*/jsx(Box, _objectSpread({
46
43
  ref: forwardedRef,
47
44
  className: css(theme.utils.resolveResponsiveProps({
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "@spark-web/columns",
3
- "version": "2.0.5",
3
+ "version": "2.1.0",
4
4
  "homepage": "https://github.com/brighte-labs/spark-web#readme",
5
5
  "repository": {
6
6
  "type": "git",
@@ -17,13 +17,13 @@
17
17
  "dependencies": {
18
18
  "@babel/runtime": "^7.19.0",
19
19
  "@emotion/css": "^11.9.0",
20
- "@spark-web/box": "^1.1.0",
21
- "@spark-web/theme": "^3.1.0",
22
- "@spark-web/utils": "^1.2.3"
20
+ "@spark-web/box": "^1.2.0",
21
+ "@spark-web/theme": "^3.2.0",
22
+ "@spark-web/utils": "^1.3.0"
23
23
  },
24
24
  "devDependencies": {
25
- "@types/react": "^17.0.12",
26
- "react": "^17.0.2"
25
+ "@types/react": "^18.2.0",
26
+ "react": "^18.2.0"
27
27
  },
28
28
  "peerDependencies": {
29
29
  "react": ">=17.0.2"