@purpurds/grid 4.6.0 → 5.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.
- package/dist/grid.cjs.js +2 -2
- package/dist/grid.cjs.js.map +1 -1
- package/dist/grid.d.ts +14 -8
- package/dist/grid.d.ts.map +1 -1
- package/dist/grid.es.js +94 -94
- package/dist/grid.es.js.map +1 -1
- package/dist/grid.item.d.ts +16 -0
- package/dist/grid.item.d.ts.map +1 -0
- package/dist/styles.css +1 -1
- package/package.json +3 -2
- package/readme.mdx +67 -19
- package/src/grid.item.module.scss +43 -0
- package/src/grid.item.stories.tsx +47 -0
- package/src/grid.item.tsx +68 -0
- package/src/grid.module.scss +68 -8
- package/src/grid.stories.tsx +92 -33
- package/src/grid.tsx +39 -15
- package/dist/col.d.ts +0 -13
- package/dist/col.d.ts.map +0 -1
- package/dist/row.d.ts +0 -18
- package/dist/row.d.ts.map +0 -1
- package/src/col.module.scss +0 -62
- package/src/col.tsx +0 -43
- package/src/grid.col.stories.tsx +0 -79
- package/src/grid.row.stories.tsx +0 -67
- package/src/row.module.scss +0 -58
- package/src/row.tsx +0 -47
package/dist/grid.cjs.js
CHANGED
|
@@ -1,6 +1,6 @@
|
|
|
1
|
-
"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const
|
|
1
|
+
"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const c=require("react/jsx-runtime"),e=require("react");function f(p){return p&&p.__esModule&&Object.prototype.hasOwnProperty.call(p,"default")?p.default:p}var n={exports:{}};/*!
|
|
2
2
|
Copyright (c) 2018 Jed Watson.
|
|
3
3
|
Licensed under the MIT License (MIT), see
|
|
4
4
|
http://jedwatson.github.io/classnames
|
|
5
|
-
*/(function(p){(function(){var _={}.hasOwnProperty;function o(){for(var r="",u=0;u<arguments.length;u++){var
|
|
5
|
+
*/(function(p){(function(){var _={}.hasOwnProperty;function o(){for(var r="",u=0;u<arguments.length;u++){var i=arguments[u];i&&(r=l(r,d.call(this,i)))}return r}function d(r){if(typeof r=="string"||typeof r=="number")return this&&this[r]||r;if(typeof r!="object")return"";if(Array.isArray(r))return o.apply(this,r);if(r.toString!==Object.prototype.toString&&!r.toString.toString().includes("[native code]"))return r.toString();var u="";for(var i in r)_.call(r,i)&&r[i]&&(u=l(u,this&&this[i]||i));return u}function l(r,u){return u?r?r+" "+u:r+u:r}p.exports?(o.default=o,p.exports=o):window.classNames=o})()})(n);var $=n.exports;const m=f($),y={"purpur-grid-item":"_purpur-grid-item_1o8x1_1","purpur-grid-item-colspan-sm-4":"_purpur-grid-item-colspan-sm-4_1o8x1_21","purpur-grid-item-colspan-sm-3":"_purpur-grid-item-colspan-sm-3_1o8x1_24","purpur-grid-item-colspan-sm-2":"_purpur-grid-item-colspan-sm-2_1o8x1_27","purpur-grid-item-colspan-sm-1":"_purpur-grid-item-colspan-sm-1_1o8x1_30","purpur-grid-item-colspan-md-8":"_purpur-grid-item-colspan-md-8_1o8x1_34","purpur-grid-item-colspan-md-7":"_purpur-grid-item-colspan-md-7_1o8x1_39","purpur-grid-item-colspan-md-6":"_purpur-grid-item-colspan-md-6_1o8x1_44","purpur-grid-item-colspan-md-5":"_purpur-grid-item-colspan-md-5_1o8x1_49","purpur-grid-item-colspan-md-4":"_purpur-grid-item-colspan-md-4_1o8x1_54","purpur-grid-item-colspan-md-3":"_purpur-grid-item-colspan-md-3_1o8x1_59","purpur-grid-item-colspan-md-2":"_purpur-grid-item-colspan-md-2_1o8x1_64","purpur-grid-item-colspan-md-1":"_purpur-grid-item-colspan-md-1_1o8x1_69","purpur-grid-item-colspan-lg-12":"_purpur-grid-item-colspan-lg-12_1o8x1_74","purpur-grid-item-colspan-lg-11":"_purpur-grid-item-colspan-lg-11_1o8x1_79","purpur-grid-item-colspan-lg-10":"_purpur-grid-item-colspan-lg-10_1o8x1_84","purpur-grid-item-colspan-lg-9":"_purpur-grid-item-colspan-lg-9_1o8x1_89","purpur-grid-item-colspan-lg-8":"_purpur-grid-item-colspan-lg-8_1o8x1_94","purpur-grid-item-colspan-lg-7":"_purpur-grid-item-colspan-lg-7_1o8x1_99","purpur-grid-item-colspan-lg-6":"_purpur-grid-item-colspan-lg-6_1o8x1_104","purpur-grid-item-colspan-lg-5":"_purpur-grid-item-colspan-lg-5_1o8x1_109","purpur-grid-item-colspan-lg-4":"_purpur-grid-item-colspan-lg-4_1o8x1_114","purpur-grid-item-colspan-lg-3":"_purpur-grid-item-colspan-lg-3_1o8x1_119","purpur-grid-item-colspan-lg-2":"_purpur-grid-item-colspan-lg-2_1o8x1_124","purpur-grid-item-colspan-lg-1":"_purpur-grid-item-colspan-lg-1_1o8x1_74"},j=m.bind(y),s="purpur-grid-item",a=({children:p,className:_,["data-testid"]:o,colSpanSm:d=4,colSpanMd:l=8,colSpanLg:r=12})=>{const u=j([_,s,{[`${s}-colspan-sm-${d}`]:d,[`${s}-colspan-md-${l}`]:l,[`${s}-colspan-lg-${r}`]:r}]);return c.jsx("div",{className:u,"data-testid":o,children:p})},C=p=>!!p&&e.isValidElement(p)&&(!!p.props.colSpanSm||!!p.props.colSpanMd||!!p.props.colSpanLg),N={"purpur-grid":"_purpur-grid_1vbh2_1","purpur-grid--grid":"_purpur-grid--grid_1vbh2_33","purpur-grid-col-sm-4":"_purpur-grid-col-sm-4_1vbh2_37","purpur-grid-col-sm-3":"_purpur-grid-col-sm-3_1vbh2_40","purpur-grid-col-sm-2":"_purpur-grid-col-sm-2_1vbh2_43","purpur-grid-col-md-8":"_purpur-grid-col-md-8_1vbh2_47","purpur-grid-col-md-7":"_purpur-grid-col-md-7_1vbh2_52","purpur-grid-col-md-6":"_purpur-grid-col-md-6_1vbh2_57","purpur-grid-col-md-5":"_purpur-grid-col-md-5_1vbh2_62","purpur-grid-col-md-4":"_purpur-grid-col-md-4_1vbh2_67","purpur-grid-col-md-3":"_purpur-grid-col-md-3_1vbh2_72","purpur-grid-col-md-2":"_purpur-grid-col-md-2_1vbh2_77","purpur-grid-col-lg-12":"_purpur-grid-col-lg-12_1vbh2_82","purpur-grid-col-lg-11":"_purpur-grid-col-lg-11_1vbh2_87","purpur-grid-col-lg-10":"_purpur-grid-col-lg-10_1vbh2_92","purpur-grid-col-lg-9":"_purpur-grid-col-lg-9_1vbh2_97","purpur-grid-col-lg-8":"_purpur-grid-col-lg-8_1vbh2_102","purpur-grid-col-lg-7":"_purpur-grid-col-lg-7_1vbh2_107","purpur-grid-col-lg-6":"_purpur-grid-col-lg-6_1vbh2_112","purpur-grid-col-lg-5":"_purpur-grid-col-lg-5_1vbh2_117","purpur-grid-col-lg-4":"_purpur-grid-col-lg-4_1vbh2_122","purpur-grid-col-lg-3":"_purpur-grid-col-lg-3_1vbh2_127","purpur-grid-col-lg-2":"_purpur-grid-col-lg-2_1vbh2_132","purpur-grid--flex":"_purpur-grid--flex_1vbh2_136"},O=m.bind(N),g="purpur-grid",h=({children:p,className:_,["data-testid"]:o,colsSm:d=1,colsMd:l=1,colsLg:r=1,...u})=>{const i=e.Children.toArray(p).filter(C),t=i.length,x=O([_,g,{[`${g}--grid`]:!t,[`${g}--flex`]:t,[`${g}-col-sm-${d}`]:d>1&&!t,[`${g}-col-md-${l}`]:l>1&&!t,[`${g}-col-lg-${r}`]:r>1&&!t}]);return c.jsx("div",{className:x,"data-testid":o,...u,children:t?e.Children.map(i,({props:{children:b,...v}})=>c.jsx(a,{...v,children:b})):p})};h.Item=a;exports.Grid=h;
|
|
6
6
|
//# sourceMappingURL=grid.cjs.js.map
|
package/dist/grid.cjs.js.map
CHANGED
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"grid.cjs.js","sources":["../../../common/temp/node_modules/.pnpm/classnames@2.5.1/node_modules/classnames/
|
|
1
|
+
{"version":3,"file":"grid.cjs.js","sources":["../../../common/temp/node_modules/.pnpm/classnames@2.5.1/node_modules/classnames/bind.js","../src/grid.item.tsx","../src/grid.tsx"],"sourcesContent":["/*!\n\tCopyright (c) 2018 Jed Watson.\n\tLicensed under the MIT License (MIT), see\n\thttp://jedwatson.github.io/classnames\n*/\n/* global define */\n\n(function () {\n\t'use strict';\n\n\tvar hasOwn = {}.hasOwnProperty;\n\n\tfunction classNames () {\n\t\tvar classes = '';\n\n\t\tfor (var i = 0; i < arguments.length; i++) {\n\t\t\tvar arg = arguments[i];\n\t\t\tif (arg) {\n\t\t\t\tclasses = appendClass(classes, parseValue.call(this, arg));\n\t\t\t}\n\t\t}\n\n\t\treturn classes;\n\t}\n\n\tfunction parseValue (arg) {\n\t\tif (typeof arg === 'string' || typeof arg === 'number') {\n\t\t\treturn this && this[arg] || arg;\n\t\t}\n\n\t\tif (typeof arg !== 'object') {\n\t\t\treturn '';\n\t\t}\n\n\t\tif (Array.isArray(arg)) {\n\t\t\treturn classNames.apply(this, arg);\n\t\t}\n\n\t\tif (arg.toString !== Object.prototype.toString && !arg.toString.toString().includes('[native code]')) {\n\t\t\treturn arg.toString();\n\t\t}\n\n\t\tvar classes = '';\n\n\t\tfor (var key in arg) {\n\t\t\tif (hasOwn.call(arg, key) && arg[key]) {\n\t\t\t\tclasses = appendClass(classes, this && this[key] || key);\n\t\t\t}\n\t\t}\n\n\t\treturn classes;\n\t}\n\n\tfunction appendClass (value, newClass) {\n\t\tif (!newClass) {\n\t\t\treturn value;\n\t\t}\n\t\n\t\tif (value) {\n\t\t\treturn value + ' ' + newClass;\n\t\t}\n\t\n\t\treturn value + newClass;\n\t}\n\n\tif (typeof module !== 'undefined' && module.exports) {\n\t\tclassNames.default = classNames;\n\t\tmodule.exports = classNames;\n\t} else if (typeof define === 'function' && typeof define.amd === 'object' && define.amd) {\n\t\t// register as 'classnames', consistent with npm package name\n\t\tdefine('classnames', [], function () {\n\t\t\treturn classNames;\n\t\t});\n\t} else {\n\t\twindow.classNames = classNames;\n\t}\n}());\n","import React, {\n isValidElement,\n ReactChild,\n ReactElement,\n ReactFragment,\n ReactNode,\n ReactPortal,\n} from \"react\";\nimport c from \"classnames/bind\";\n\nimport styles from \"./grid.item.module.scss\";\n\nconst cx = c.bind(styles);\n\nexport type ItemProps = {\n children: ReactNode;\n [\"data-testid\"]?: string;\n className?: string;\n /** The number of columns that the item spans on small screens. */\n colSpanSm?: 1 | 2 | 3 | 4;\n /** The number of columns that the item spans on medium screens. */\n colSpanMd?: 1 | 2 | 3 | 4 | 5 | 6 | 7 | 8;\n /** The number of columns that the item spans on large screens. */\n colSpanLg?: 1 | 2 | 3 | 4 | 5 | 6 | 7 | 8 | 9 | 10 | 11 | 12;\n};\n\nconst rootClassName = \"purpur-grid-item\";\n\nexport const Item = ({\n children,\n className,\n [\"data-testid\"]: dataTestId,\n colSpanSm = 4,\n colSpanMd = 8,\n colSpanLg = 12,\n}: ItemProps) => {\n const classes = cx([\n className,\n rootClassName,\n {\n [`${rootClassName}-colspan-sm-${colSpanSm}`]: colSpanSm,\n [`${rootClassName}-colspan-md-${colSpanMd}`]: colSpanMd,\n [`${rootClassName}-colspan-lg-${colSpanLg}`]: colSpanLg,\n },\n ]);\n\n return (\n <div className={classes} data-testid={dataTestId}>\n {children}\n </div>\n );\n};\n\nexport const isItem = (\n child:\n | ReactChild\n | ReactElement\n | ReactFragment\n | ReactPortal\n | string\n | number\n | boolean\n | null\n | undefined\n): child is ReactElement<ItemProps> =>\n !!child &&\n isValidElement<ItemProps>(child) &&\n (!!child.props.colSpanSm || !!child.props.colSpanMd || !!child.props.colSpanLg);\n","import React, { Children, ReactNode } from \"react\";\nimport c from \"classnames/bind\";\n\nimport { isItem, Item } from \"./grid.item\";\nimport styles from \"./grid.module.scss\";\n\nconst cx = c.bind(styles);\n\nexport type GridProps = {\n children: ReactNode;\n [\"data-testid\"]?: string;\n className?: string;\n /** The number of columns on small screens. */\n colsSm?: 1 | 2 | 3 | 4;\n /** The number of columns on medium screens. */\n colsMd?: 1 | 2 | 3 | 4 | 5 | 6 | 7 | 8;\n /** The number of columns on large screens. */\n colsLg?: 1 | 2 | 3 | 4 | 5 | 6 | 7 | 8 | 9 | 10 | 11 | 12;\n};\n\nexport type GridCmp<P> = React.FunctionComponent<P> & {\n Item: typeof Item;\n};\n\nconst rootClassName = \"purpur-grid\";\n\nexport const Grid = ({\n children,\n className,\n [\"data-testid\"]: dataTestId,\n colsSm = 1,\n colsMd = 1,\n colsLg = 1,\n ...props\n}: GridProps) => {\n const gridItemChildren = Children.toArray(children).filter(isItem);\n const hasItemChildren = gridItemChildren.length;\n\n const classes = cx([\n className,\n rootClassName,\n {\n [`${rootClassName}--grid`]: !hasItemChildren,\n [`${rootClassName}--flex`]: hasItemChildren,\n [`${rootClassName}-col-sm-${colsSm}`]: colsSm > 1 && !hasItemChildren,\n [`${rootClassName}-col-md-${colsMd}`]: colsMd > 1 && !hasItemChildren,\n [`${rootClassName}-col-lg-${colsLg}`]: colsLg > 1 && !hasItemChildren,\n },\n ]);\n\n return (\n <div className={classes} data-testid={dataTestId} {...props}>\n {hasItemChildren\n ? Children.map(gridItemChildren, ({ props: { children, ...colProps } }) => (\n <Item {...colProps}>{children}</Item>\n ))\n : children}\n </div>\n );\n};\n\nGrid.Item = Item;\n"],"names":["hasOwn","classNames","classes","i","arg","appendClass","parseValue","key","value","newClass","module","cx","c","styles","rootClassName","Item","children","className","dataTestId","colSpanSm","colSpanMd","colSpanLg","isItem","child","isValidElement","Grid","colsSm","colsMd","colsLg","props","gridItemChildren","Children","hasItemChildren","jsx","colProps"],"mappings":"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","x_google_ignoreList":[0]}
|
package/dist/grid.d.ts
CHANGED
|
@@ -1,16 +1,22 @@
|
|
|
1
|
-
import {
|
|
2
|
-
import { Col } from './col';
|
|
1
|
+
import { Item } from './grid.item';
|
|
3
2
|
import { default as React, ReactNode } from 'react';
|
|
4
3
|
|
|
5
|
-
type GridCmp<P> = React.FunctionComponent<P> & {
|
|
6
|
-
Row: typeof Row;
|
|
7
|
-
Col: typeof Col;
|
|
8
|
-
};
|
|
9
4
|
export type GridProps = {
|
|
10
5
|
children: ReactNode;
|
|
11
6
|
["data-testid"]?: string;
|
|
12
7
|
className?: string;
|
|
8
|
+
/** The number of columns on small screens. */
|
|
9
|
+
colsSm?: 1 | 2 | 3 | 4;
|
|
10
|
+
/** The number of columns on medium screens. */
|
|
11
|
+
colsMd?: 1 | 2 | 3 | 4 | 5 | 6 | 7 | 8;
|
|
12
|
+
/** The number of columns on large screens. */
|
|
13
|
+
colsLg?: 1 | 2 | 3 | 4 | 5 | 6 | 7 | 8 | 9 | 10 | 11 | 12;
|
|
14
|
+
};
|
|
15
|
+
export type GridCmp<P> = React.FunctionComponent<P> & {
|
|
16
|
+
Item: typeof Item;
|
|
17
|
+
};
|
|
18
|
+
export declare const Grid: {
|
|
19
|
+
({ children, className, ["data-testid"]: dataTestId, colsSm, colsMd, colsLg, ...props }: GridProps): React.JSX.Element;
|
|
20
|
+
Item: ({ children, className, ["data-testid"]: dataTestId, colSpanSm, colSpanMd, colSpanLg, }: import('./grid.item').ItemProps) => React.JSX.Element;
|
|
13
21
|
};
|
|
14
|
-
export type { ColumnWidthType } from './col';
|
|
15
|
-
export declare const Grid: GridCmp<GridProps>;
|
|
16
22
|
//# sourceMappingURL=grid.d.ts.map
|
package/dist/grid.d.ts.map
CHANGED
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"grid.d.ts","sourceRoot":"","sources":["../src/grid.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,EAAE,
|
|
1
|
+
{"version":3,"file":"grid.d.ts","sourceRoot":"","sources":["../src/grid.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,EAAE,EAAY,SAAS,EAAE,MAAM,OAAO,CAAC;AAGnD,OAAO,EAAU,IAAI,EAAE,MAAM,aAAa,CAAC;AAK3C,MAAM,MAAM,SAAS,GAAG;IACtB,QAAQ,EAAE,SAAS,CAAC;IACpB,CAAC,aAAa,CAAC,CAAC,EAAE,MAAM,CAAC;IACzB,SAAS,CAAC,EAAE,MAAM,CAAC;IACnB,8CAA8C;IAC9C,MAAM,CAAC,EAAE,CAAC,GAAG,CAAC,GAAG,CAAC,GAAG,CAAC,CAAC;IACvB,+CAA+C;IAC/C,MAAM,CAAC,EAAE,CAAC,GAAG,CAAC,GAAG,CAAC,GAAG,CAAC,GAAG,CAAC,GAAG,CAAC,GAAG,CAAC,GAAG,CAAC,CAAC;IACvC,8CAA8C;IAC9C,MAAM,CAAC,EAAE,CAAC,GAAG,CAAC,GAAG,CAAC,GAAG,CAAC,GAAG,CAAC,GAAG,CAAC,GAAG,CAAC,GAAG,CAAC,GAAG,CAAC,GAAG,EAAE,GAAG,EAAE,GAAG,EAAE,CAAC;CAC3D,CAAC;AAEF,MAAM,MAAM,OAAO,CAAC,CAAC,IAAI,KAAK,CAAC,iBAAiB,CAAC,CAAC,CAAC,GAAG;IACpD,IAAI,EAAE,OAAO,IAAI,CAAC;CACnB,CAAC;AAIF,eAAO,MAAM,IAAI;6FAQd,SAAS;;CAyBX,CAAC"}
|
package/dist/grid.es.js
CHANGED
|
@@ -1,8 +1,9 @@
|
|
|
1
|
-
import { jsx as
|
|
1
|
+
import { jsx as c } from "react/jsx-runtime";
|
|
2
|
+
import { isValidElement as v, Children as e } from "react";
|
|
2
3
|
function f(p) {
|
|
3
4
|
return p && p.__esModule && Object.prototype.hasOwnProperty.call(p, "default") ? p.default : p;
|
|
4
5
|
}
|
|
5
|
-
var
|
|
6
|
+
var m = { exports: {} };
|
|
6
7
|
/*!
|
|
7
8
|
Copyright (c) 2018 Jed Watson.
|
|
8
9
|
Licensed under the MIT License (MIT), see
|
|
@@ -13,23 +14,23 @@ var i = { exports: {} };
|
|
|
13
14
|
var _ = {}.hasOwnProperty;
|
|
14
15
|
function o() {
|
|
15
16
|
for (var r = "", u = 0; u < arguments.length; u++) {
|
|
16
|
-
var
|
|
17
|
-
|
|
17
|
+
var i = arguments[u];
|
|
18
|
+
i && (r = l(r, d.call(this, i)));
|
|
18
19
|
}
|
|
19
20
|
return r;
|
|
20
21
|
}
|
|
21
|
-
function
|
|
22
|
+
function d(r) {
|
|
22
23
|
if (typeof r == "string" || typeof r == "number")
|
|
23
|
-
return r;
|
|
24
|
+
return this && this[r] || r;
|
|
24
25
|
if (typeof r != "object")
|
|
25
26
|
return "";
|
|
26
27
|
if (Array.isArray(r))
|
|
27
|
-
return o.apply(
|
|
28
|
+
return o.apply(this, r);
|
|
28
29
|
if (r.toString !== Object.prototype.toString && !r.toString.toString().includes("[native code]"))
|
|
29
30
|
return r.toString();
|
|
30
31
|
var u = "";
|
|
31
|
-
for (var
|
|
32
|
-
_.call(r,
|
|
32
|
+
for (var i in r)
|
|
33
|
+
_.call(r, i) && r[i] && (u = l(u, this && this[i] || i));
|
|
33
34
|
return u;
|
|
34
35
|
}
|
|
35
36
|
function l(r, u) {
|
|
@@ -37,102 +38,101 @@ var i = { exports: {} };
|
|
|
37
38
|
}
|
|
38
39
|
p.exports ? (o.default = o, p.exports = o) : window.classNames = o;
|
|
39
40
|
})();
|
|
40
|
-
})(
|
|
41
|
-
var $ =
|
|
42
|
-
const
|
|
43
|
-
"purpur-
|
|
44
|
-
"purpur-
|
|
45
|
-
"purpur-
|
|
46
|
-
"purpur-
|
|
47
|
-
"purpur-
|
|
48
|
-
"purpur-
|
|
49
|
-
"purpur-
|
|
50
|
-
"purpur-
|
|
51
|
-
"purpur-
|
|
52
|
-
"purpur-
|
|
53
|
-
"purpur-
|
|
54
|
-
"purpur-
|
|
55
|
-
"purpur-
|
|
56
|
-
"purpur-
|
|
57
|
-
"purpur-
|
|
58
|
-
"purpur-
|
|
59
|
-
"purpur-
|
|
60
|
-
"purpur-
|
|
61
|
-
"purpur-
|
|
62
|
-
"purpur-
|
|
63
|
-
"purpur-
|
|
64
|
-
"purpur-
|
|
65
|
-
"purpur-
|
|
66
|
-
"purpur-
|
|
67
|
-
"purpur-
|
|
68
|
-
|
|
69
|
-
"purpur-col-md-4": "_purpur-col-md-4_13t6m_244",
|
|
70
|
-
"purpur-col-lg-4": "_purpur-col-lg-4_13t6m_249",
|
|
71
|
-
"purpur-col-3": "_purpur-col-3_13t6m_253",
|
|
72
|
-
"purpur-col-md-3": "_purpur-col-md-3_13t6m_272",
|
|
73
|
-
"purpur-col-lg-3": "_purpur-col-lg-3_13t6m_277",
|
|
74
|
-
"purpur-col-2": "_purpur-col-2_13t6m_281",
|
|
75
|
-
"purpur-col-md-2": "_purpur-col-md-2_13t6m_300",
|
|
76
|
-
"purpur-col-lg-2": "_purpur-col-lg-2_13t6m_305",
|
|
77
|
-
"purpur-col-1": "_purpur-col-1_13t6m_1",
|
|
78
|
-
"purpur-col-md-1": "_purpur-col-md-1_13t6m_20",
|
|
79
|
-
"purpur-col-lg-1": "_purpur-col-lg-1_13t6m_25"
|
|
80
|
-
}, m = "purpur-col", w = ({
|
|
41
|
+
})(m);
|
|
42
|
+
var $ = m.exports;
|
|
43
|
+
const n = /* @__PURE__ */ f($), y = {
|
|
44
|
+
"purpur-grid-item": "_purpur-grid-item_1o8x1_1",
|
|
45
|
+
"purpur-grid-item-colspan-sm-4": "_purpur-grid-item-colspan-sm-4_1o8x1_21",
|
|
46
|
+
"purpur-grid-item-colspan-sm-3": "_purpur-grid-item-colspan-sm-3_1o8x1_24",
|
|
47
|
+
"purpur-grid-item-colspan-sm-2": "_purpur-grid-item-colspan-sm-2_1o8x1_27",
|
|
48
|
+
"purpur-grid-item-colspan-sm-1": "_purpur-grid-item-colspan-sm-1_1o8x1_30",
|
|
49
|
+
"purpur-grid-item-colspan-md-8": "_purpur-grid-item-colspan-md-8_1o8x1_34",
|
|
50
|
+
"purpur-grid-item-colspan-md-7": "_purpur-grid-item-colspan-md-7_1o8x1_39",
|
|
51
|
+
"purpur-grid-item-colspan-md-6": "_purpur-grid-item-colspan-md-6_1o8x1_44",
|
|
52
|
+
"purpur-grid-item-colspan-md-5": "_purpur-grid-item-colspan-md-5_1o8x1_49",
|
|
53
|
+
"purpur-grid-item-colspan-md-4": "_purpur-grid-item-colspan-md-4_1o8x1_54",
|
|
54
|
+
"purpur-grid-item-colspan-md-3": "_purpur-grid-item-colspan-md-3_1o8x1_59",
|
|
55
|
+
"purpur-grid-item-colspan-md-2": "_purpur-grid-item-colspan-md-2_1o8x1_64",
|
|
56
|
+
"purpur-grid-item-colspan-md-1": "_purpur-grid-item-colspan-md-1_1o8x1_69",
|
|
57
|
+
"purpur-grid-item-colspan-lg-12": "_purpur-grid-item-colspan-lg-12_1o8x1_74",
|
|
58
|
+
"purpur-grid-item-colspan-lg-11": "_purpur-grid-item-colspan-lg-11_1o8x1_79",
|
|
59
|
+
"purpur-grid-item-colspan-lg-10": "_purpur-grid-item-colspan-lg-10_1o8x1_84",
|
|
60
|
+
"purpur-grid-item-colspan-lg-9": "_purpur-grid-item-colspan-lg-9_1o8x1_89",
|
|
61
|
+
"purpur-grid-item-colspan-lg-8": "_purpur-grid-item-colspan-lg-8_1o8x1_94",
|
|
62
|
+
"purpur-grid-item-colspan-lg-7": "_purpur-grid-item-colspan-lg-7_1o8x1_99",
|
|
63
|
+
"purpur-grid-item-colspan-lg-6": "_purpur-grid-item-colspan-lg-6_1o8x1_104",
|
|
64
|
+
"purpur-grid-item-colspan-lg-5": "_purpur-grid-item-colspan-lg-5_1o8x1_109",
|
|
65
|
+
"purpur-grid-item-colspan-lg-4": "_purpur-grid-item-colspan-lg-4_1o8x1_114",
|
|
66
|
+
"purpur-grid-item-colspan-lg-3": "_purpur-grid-item-colspan-lg-3_1o8x1_119",
|
|
67
|
+
"purpur-grid-item-colspan-lg-2": "_purpur-grid-item-colspan-lg-2_1o8x1_124",
|
|
68
|
+
"purpur-grid-item-colspan-lg-1": "_purpur-grid-item-colspan-lg-1_1o8x1_74"
|
|
69
|
+
}, N = n.bind(y), s = "purpur-grid-item", a = ({
|
|
81
70
|
children: p,
|
|
82
|
-
|
|
83
|
-
|
|
84
|
-
|
|
85
|
-
|
|
86
|
-
|
|
87
|
-
...u
|
|
71
|
+
className: _,
|
|
72
|
+
["data-testid"]: o,
|
|
73
|
+
colSpanSm: d = 4,
|
|
74
|
+
colSpanMd: l = 8,
|
|
75
|
+
colSpanLg: r = 12
|
|
88
76
|
}) => {
|
|
89
|
-
const
|
|
90
|
-
|
|
91
|
-
s
|
|
77
|
+
const u = N([
|
|
78
|
+
_,
|
|
79
|
+
s,
|
|
92
80
|
{
|
|
93
|
-
[
|
|
94
|
-
[
|
|
95
|
-
[
|
|
81
|
+
[`${s}-colspan-sm-${d}`]: d,
|
|
82
|
+
[`${s}-colspan-md-${l}`]: l,
|
|
83
|
+
[`${s}-colspan-lg-${r}`]: r
|
|
96
84
|
}
|
|
97
85
|
]);
|
|
98
|
-
return /* @__PURE__ */
|
|
99
|
-
},
|
|
100
|
-
"purpur-grid": "_purpur-
|
|
101
|
-
|
|
102
|
-
"purpur-
|
|
103
|
-
"purpur-
|
|
104
|
-
"purpur-
|
|
105
|
-
"purpur-
|
|
106
|
-
"purpur-
|
|
107
|
-
|
|
86
|
+
return /* @__PURE__ */ c("div", { className: u, "data-testid": o, children: p });
|
|
87
|
+
}, j = (p) => !!p && v(p) && (!!p.props.colSpanSm || !!p.props.colSpanMd || !!p.props.colSpanLg), C = {
|
|
88
|
+
"purpur-grid": "_purpur-grid_1vbh2_1",
|
|
89
|
+
"purpur-grid--grid": "_purpur-grid--grid_1vbh2_33",
|
|
90
|
+
"purpur-grid-col-sm-4": "_purpur-grid-col-sm-4_1vbh2_37",
|
|
91
|
+
"purpur-grid-col-sm-3": "_purpur-grid-col-sm-3_1vbh2_40",
|
|
92
|
+
"purpur-grid-col-sm-2": "_purpur-grid-col-sm-2_1vbh2_43",
|
|
93
|
+
"purpur-grid-col-md-8": "_purpur-grid-col-md-8_1vbh2_47",
|
|
94
|
+
"purpur-grid-col-md-7": "_purpur-grid-col-md-7_1vbh2_52",
|
|
95
|
+
"purpur-grid-col-md-6": "_purpur-grid-col-md-6_1vbh2_57",
|
|
96
|
+
"purpur-grid-col-md-5": "_purpur-grid-col-md-5_1vbh2_62",
|
|
97
|
+
"purpur-grid-col-md-4": "_purpur-grid-col-md-4_1vbh2_67",
|
|
98
|
+
"purpur-grid-col-md-3": "_purpur-grid-col-md-3_1vbh2_72",
|
|
99
|
+
"purpur-grid-col-md-2": "_purpur-grid-col-md-2_1vbh2_77",
|
|
100
|
+
"purpur-grid-col-lg-12": "_purpur-grid-col-lg-12_1vbh2_82",
|
|
101
|
+
"purpur-grid-col-lg-11": "_purpur-grid-col-lg-11_1vbh2_87",
|
|
102
|
+
"purpur-grid-col-lg-10": "_purpur-grid-col-lg-10_1vbh2_92",
|
|
103
|
+
"purpur-grid-col-lg-9": "_purpur-grid-col-lg-9_1vbh2_97",
|
|
104
|
+
"purpur-grid-col-lg-8": "_purpur-grid-col-lg-8_1vbh2_102",
|
|
105
|
+
"purpur-grid-col-lg-7": "_purpur-grid-col-lg-7_1vbh2_107",
|
|
106
|
+
"purpur-grid-col-lg-6": "_purpur-grid-col-lg-6_1vbh2_112",
|
|
107
|
+
"purpur-grid-col-lg-5": "_purpur-grid-col-lg-5_1vbh2_117",
|
|
108
|
+
"purpur-grid-col-lg-4": "_purpur-grid-col-lg-4_1vbh2_122",
|
|
109
|
+
"purpur-grid-col-lg-3": "_purpur-grid-col-lg-3_1vbh2_127",
|
|
110
|
+
"purpur-grid-col-lg-2": "_purpur-grid-col-lg-2_1vbh2_132",
|
|
111
|
+
"purpur-grid--flex": "_purpur-grid--flex_1vbh2_136"
|
|
112
|
+
}, I = n.bind(C), g = "purpur-grid", O = ({
|
|
108
113
|
children: p,
|
|
109
|
-
|
|
110
|
-
|
|
111
|
-
|
|
112
|
-
|
|
113
|
-
|
|
114
|
+
className: _,
|
|
115
|
+
["data-testid"]: o,
|
|
116
|
+
colsSm: d = 1,
|
|
117
|
+
colsMd: l = 1,
|
|
118
|
+
colsLg: r = 1,
|
|
119
|
+
...u
|
|
114
120
|
}) => {
|
|
115
|
-
const
|
|
116
|
-
|
|
117
|
-
|
|
121
|
+
const i = e.toArray(p).filter(j), t = i.length, h = I([
|
|
122
|
+
_,
|
|
123
|
+
g,
|
|
118
124
|
{
|
|
119
|
-
[
|
|
120
|
-
[
|
|
125
|
+
[`${g}--grid`]: !t,
|
|
126
|
+
[`${g}--flex`]: t,
|
|
127
|
+
[`${g}-col-sm-${d}`]: d > 1 && !t,
|
|
128
|
+
[`${g}-col-md-${l}`]: l > 1 && !t,
|
|
129
|
+
[`${g}-col-lg-${r}`]: r > 1 && !t
|
|
121
130
|
}
|
|
122
131
|
]);
|
|
123
|
-
return /* @__PURE__ */
|
|
124
|
-
}, N = "purpur-grid", g = ({
|
|
125
|
-
children: p,
|
|
126
|
-
className: _,
|
|
127
|
-
["data-testid"]: o,
|
|
128
|
-
...c
|
|
129
|
-
}) => {
|
|
130
|
-
const l = a([_, y[N]]);
|
|
131
|
-
return /* @__PURE__ */ d("div", { className: l, "data-testid": o, ...c, children: p });
|
|
132
|
+
return /* @__PURE__ */ c("div", { className: h, "data-testid": o, ...u, children: t ? e.map(i, ({ props: { children: x, ...b } }) => /* @__PURE__ */ c(a, { ...b, children: x })) : p });
|
|
132
133
|
};
|
|
133
|
-
|
|
134
|
-
g.Row = v;
|
|
134
|
+
O.Item = a;
|
|
135
135
|
export {
|
|
136
|
-
|
|
136
|
+
O as Grid
|
|
137
137
|
};
|
|
138
138
|
//# sourceMappingURL=grid.es.js.map
|
package/dist/grid.es.js.map
CHANGED
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"grid.es.js","sources":["../../../common/temp/node_modules/.pnpm/classnames@2.5.1/node_modules/classnames/
|
|
1
|
+
{"version":3,"file":"grid.es.js","sources":["../../../common/temp/node_modules/.pnpm/classnames@2.5.1/node_modules/classnames/bind.js","../src/grid.item.tsx","../src/grid.tsx"],"sourcesContent":["/*!\n\tCopyright (c) 2018 Jed Watson.\n\tLicensed under the MIT License (MIT), see\n\thttp://jedwatson.github.io/classnames\n*/\n/* global define */\n\n(function () {\n\t'use strict';\n\n\tvar hasOwn = {}.hasOwnProperty;\n\n\tfunction classNames () {\n\t\tvar classes = '';\n\n\t\tfor (var i = 0; i < arguments.length; i++) {\n\t\t\tvar arg = arguments[i];\n\t\t\tif (arg) {\n\t\t\t\tclasses = appendClass(classes, parseValue.call(this, arg));\n\t\t\t}\n\t\t}\n\n\t\treturn classes;\n\t}\n\n\tfunction parseValue (arg) {\n\t\tif (typeof arg === 'string' || typeof arg === 'number') {\n\t\t\treturn this && this[arg] || arg;\n\t\t}\n\n\t\tif (typeof arg !== 'object') {\n\t\t\treturn '';\n\t\t}\n\n\t\tif (Array.isArray(arg)) {\n\t\t\treturn classNames.apply(this, arg);\n\t\t}\n\n\t\tif (arg.toString !== Object.prototype.toString && !arg.toString.toString().includes('[native code]')) {\n\t\t\treturn arg.toString();\n\t\t}\n\n\t\tvar classes = '';\n\n\t\tfor (var key in arg) {\n\t\t\tif (hasOwn.call(arg, key) && arg[key]) {\n\t\t\t\tclasses = appendClass(classes, this && this[key] || key);\n\t\t\t}\n\t\t}\n\n\t\treturn classes;\n\t}\n\n\tfunction appendClass (value, newClass) {\n\t\tif (!newClass) {\n\t\t\treturn value;\n\t\t}\n\t\n\t\tif (value) {\n\t\t\treturn value + ' ' + newClass;\n\t\t}\n\t\n\t\treturn value + newClass;\n\t}\n\n\tif (typeof module !== 'undefined' && module.exports) {\n\t\tclassNames.default = classNames;\n\t\tmodule.exports = classNames;\n\t} else if (typeof define === 'function' && typeof define.amd === 'object' && define.amd) {\n\t\t// register as 'classnames', consistent with npm package name\n\t\tdefine('classnames', [], function () {\n\t\t\treturn classNames;\n\t\t});\n\t} else {\n\t\twindow.classNames = classNames;\n\t}\n}());\n","import React, {\n isValidElement,\n ReactChild,\n ReactElement,\n ReactFragment,\n ReactNode,\n ReactPortal,\n} from \"react\";\nimport c from \"classnames/bind\";\n\nimport styles from \"./grid.item.module.scss\";\n\nconst cx = c.bind(styles);\n\nexport type ItemProps = {\n children: ReactNode;\n [\"data-testid\"]?: string;\n className?: string;\n /** The number of columns that the item spans on small screens. */\n colSpanSm?: 1 | 2 | 3 | 4;\n /** The number of columns that the item spans on medium screens. */\n colSpanMd?: 1 | 2 | 3 | 4 | 5 | 6 | 7 | 8;\n /** The number of columns that the item spans on large screens. */\n colSpanLg?: 1 | 2 | 3 | 4 | 5 | 6 | 7 | 8 | 9 | 10 | 11 | 12;\n};\n\nconst rootClassName = \"purpur-grid-item\";\n\nexport const Item = ({\n children,\n className,\n [\"data-testid\"]: dataTestId,\n colSpanSm = 4,\n colSpanMd = 8,\n colSpanLg = 12,\n}: ItemProps) => {\n const classes = cx([\n className,\n rootClassName,\n {\n [`${rootClassName}-colspan-sm-${colSpanSm}`]: colSpanSm,\n [`${rootClassName}-colspan-md-${colSpanMd}`]: colSpanMd,\n [`${rootClassName}-colspan-lg-${colSpanLg}`]: colSpanLg,\n },\n ]);\n\n return (\n <div className={classes} data-testid={dataTestId}>\n {children}\n </div>\n );\n};\n\nexport const isItem = (\n child:\n | ReactChild\n | ReactElement\n | ReactFragment\n | ReactPortal\n | string\n | number\n | boolean\n | null\n | undefined\n): child is ReactElement<ItemProps> =>\n !!child &&\n isValidElement<ItemProps>(child) &&\n (!!child.props.colSpanSm || !!child.props.colSpanMd || !!child.props.colSpanLg);\n","import React, { Children, ReactNode } from \"react\";\nimport c from \"classnames/bind\";\n\nimport { isItem, Item } from \"./grid.item\";\nimport styles from \"./grid.module.scss\";\n\nconst cx = c.bind(styles);\n\nexport type GridProps = {\n children: ReactNode;\n [\"data-testid\"]?: string;\n className?: string;\n /** The number of columns on small screens. */\n colsSm?: 1 | 2 | 3 | 4;\n /** The number of columns on medium screens. */\n colsMd?: 1 | 2 | 3 | 4 | 5 | 6 | 7 | 8;\n /** The number of columns on large screens. */\n colsLg?: 1 | 2 | 3 | 4 | 5 | 6 | 7 | 8 | 9 | 10 | 11 | 12;\n};\n\nexport type GridCmp<P> = React.FunctionComponent<P> & {\n Item: typeof Item;\n};\n\nconst rootClassName = \"purpur-grid\";\n\nexport const Grid = ({\n children,\n className,\n [\"data-testid\"]: dataTestId,\n colsSm = 1,\n colsMd = 1,\n colsLg = 1,\n ...props\n}: GridProps) => {\n const gridItemChildren = Children.toArray(children).filter(isItem);\n const hasItemChildren = gridItemChildren.length;\n\n const classes = cx([\n className,\n rootClassName,\n {\n [`${rootClassName}--grid`]: !hasItemChildren,\n [`${rootClassName}--flex`]: hasItemChildren,\n [`${rootClassName}-col-sm-${colsSm}`]: colsSm > 1 && !hasItemChildren,\n [`${rootClassName}-col-md-${colsMd}`]: colsMd > 1 && !hasItemChildren,\n [`${rootClassName}-col-lg-${colsLg}`]: colsLg > 1 && !hasItemChildren,\n },\n ]);\n\n return (\n <div className={classes} data-testid={dataTestId} {...props}>\n {hasItemChildren\n ? Children.map(gridItemChildren, ({ props: { children, ...colProps } }) => (\n <Item {...colProps}>{children}</Item>\n ))\n : children}\n </div>\n );\n};\n\nGrid.Item = Item;\n"],"names":["hasOwn","classNames","classes","i","arg","appendClass","parseValue","key","value","newClass","module","cx","c","styles","rootClassName","Item","children","className","dataTestId","colSpanSm","colSpanMd","colSpanLg","isItem","child","isValidElement","Grid","colsSm","colsMd","colsLg","props","gridItemChildren","Children","hasItemChildren","jsx","colProps"],"mappings":"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","x_google_ignoreList":[0]}
|
|
@@ -0,0 +1,16 @@
|
|
|
1
|
+
import { default as React, ReactChild, ReactElement, ReactFragment, ReactNode, ReactPortal } from 'react';
|
|
2
|
+
|
|
3
|
+
export type ItemProps = {
|
|
4
|
+
children: ReactNode;
|
|
5
|
+
["data-testid"]?: string;
|
|
6
|
+
className?: string;
|
|
7
|
+
/** The number of columns that the item spans on small screens. */
|
|
8
|
+
colSpanSm?: 1 | 2 | 3 | 4;
|
|
9
|
+
/** The number of columns that the item spans on medium screens. */
|
|
10
|
+
colSpanMd?: 1 | 2 | 3 | 4 | 5 | 6 | 7 | 8;
|
|
11
|
+
/** The number of columns that the item spans on large screens. */
|
|
12
|
+
colSpanLg?: 1 | 2 | 3 | 4 | 5 | 6 | 7 | 8 | 9 | 10 | 11 | 12;
|
|
13
|
+
};
|
|
14
|
+
export declare const Item: ({ children, className, ["data-testid"]: dataTestId, colSpanSm, colSpanMd, colSpanLg, }: ItemProps) => React.JSX.Element;
|
|
15
|
+
export declare const isItem: (child: ReactChild | ReactElement | ReactFragment | ReactPortal | string | number | boolean | null | undefined) => child is React.ReactElement<ItemProps, string | React.JSXElementConstructor<any>>;
|
|
16
|
+
//# sourceMappingURL=grid.item.d.ts.map
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"file":"grid.item.d.ts","sourceRoot":"","sources":["../src/grid.item.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,EAAE,EAEZ,UAAU,EACV,YAAY,EACZ,aAAa,EACb,SAAS,EACT,WAAW,EACZ,MAAM,OAAO,CAAC;AAOf,MAAM,MAAM,SAAS,GAAG;IACtB,QAAQ,EAAE,SAAS,CAAC;IACpB,CAAC,aAAa,CAAC,CAAC,EAAE,MAAM,CAAC;IACzB,SAAS,CAAC,EAAE,MAAM,CAAC;IACnB,kEAAkE;IAClE,SAAS,CAAC,EAAE,CAAC,GAAG,CAAC,GAAG,CAAC,GAAG,CAAC,CAAC;IAC1B,mEAAmE;IACnE,SAAS,CAAC,EAAE,CAAC,GAAG,CAAC,GAAG,CAAC,GAAG,CAAC,GAAG,CAAC,GAAG,CAAC,GAAG,CAAC,GAAG,CAAC,CAAC;IAC1C,kEAAkE;IAClE,SAAS,CAAC,EAAE,CAAC,GAAG,CAAC,GAAG,CAAC,GAAG,CAAC,GAAG,CAAC,GAAG,CAAC,GAAG,CAAC,GAAG,CAAC,GAAG,CAAC,GAAG,EAAE,GAAG,EAAE,GAAG,EAAE,CAAC;CAC9D,CAAC;AAIF,eAAO,MAAM,IAAI,2FAOd,SAAS,sBAgBX,CAAC;AAEF,eAAO,MAAM,MAAM,UAEb,UAAU,GACV,YAAY,GACZ,aAAa,GACb,WAAW,GACX,MAAM,GACN,MAAM,GACN,OAAO,GACP,IAAI,GACJ,SAAS,sFAIkE,CAAC"}
|
package/dist/styles.css
CHANGED
|
@@ -1 +1 @@
|
|
|
1
|
-
._purpur-col_13t6m_1._purpur-col-12_13t6m_1{--padding-col: var(--purpur-spacing-gutter-sm);box-sizing:border-box;display:block;padding-left:calc(var(--padding-col) / 2);padding-right:calc(var(--padding-col) / 2);width:calc((100% - 1px)*1)}@media screen and (min-width: 600px){._purpur-col_13t6m_1._purpur-col-12_13t6m_1{--padding-col: var(--purpur-spacing-gutter-md)}}@media screen and (min-width: 1024px){._purpur-col_13t6m_1._purpur-col-12_13t6m_1{--padding-col: var(--purpur-spacing-gutter-lg)}}@media screen and (min-width: 600px) and (min-width: 600px){._purpur-col_13t6m_1._purpur-col-md-12_13t6m_20{width:calc((100% - 1px)*1)}}@media screen and (min-width: 1024px) and (min-width: 1024px){._purpur-col_13t6m_1._purpur-col-lg-12_13t6m_25{width:calc((100% - 1px)*1)}}._purpur-col_13t6m_1._purpur-col-11_13t6m_29{--padding-col: var(--purpur-spacing-gutter-sm);box-sizing:border-box;display:block;padding-left:calc(var(--padding-col) / 2);padding-right:calc(var(--padding-col) / 2);width:calc((100% - 1px) / 12 * 11)}@media screen and (min-width: 600px){._purpur-col_13t6m_1._purpur-col-11_13t6m_29{--padding-col: var(--purpur-spacing-gutter-md)}}@media screen and (min-width: 1024px){._purpur-col_13t6m_1._purpur-col-11_13t6m_29{--padding-col: var(--purpur-spacing-gutter-lg)}}@media screen and (min-width: 600px) and (min-width: 600px){._purpur-col_13t6m_1._purpur-col-md-11_13t6m_48{width:calc((100% - 1px) / 12 * 11)}}@media screen and (min-width: 1024px) and (min-width: 1024px){._purpur-col_13t6m_1._purpur-col-lg-11_13t6m_53{width:calc((100% - 1px) / 12 * 11)}}._purpur-col_13t6m_1._purpur-col-10_13t6m_57{--padding-col: var(--purpur-spacing-gutter-sm);box-sizing:border-box;display:block;padding-left:calc(var(--padding-col) / 2);padding-right:calc(var(--padding-col) / 2);width:calc((100% - 1px) / 12 * 10)}@media screen and (min-width: 600px){._purpur-col_13t6m_1._purpur-col-10_13t6m_57{--padding-col: var(--purpur-spacing-gutter-md)}}@media screen and (min-width: 1024px){._purpur-col_13t6m_1._purpur-col-10_13t6m_57{--padding-col: var(--purpur-spacing-gutter-lg)}}@media screen and (min-width: 600px) and (min-width: 600px){._purpur-col_13t6m_1._purpur-col-md-10_13t6m_76{width:calc((100% - 1px) / 12 * 10)}}@media screen and (min-width: 1024px) and (min-width: 1024px){._purpur-col_13t6m_1._purpur-col-lg-10_13t6m_81{width:calc((100% - 1px) / 12 * 10)}}._purpur-col_13t6m_1._purpur-col-9_13t6m_85{--padding-col: var(--purpur-spacing-gutter-sm);box-sizing:border-box;display:block;padding-left:calc(var(--padding-col) / 2);padding-right:calc(var(--padding-col) / 2);width:calc((100% - 1px)*.75)}@media screen and (min-width: 600px){._purpur-col_13t6m_1._purpur-col-9_13t6m_85{--padding-col: var(--purpur-spacing-gutter-md)}}@media screen and (min-width: 1024px){._purpur-col_13t6m_1._purpur-col-9_13t6m_85{--padding-col: var(--purpur-spacing-gutter-lg)}}@media screen and (min-width: 600px) and (min-width: 600px){._purpur-col_13t6m_1._purpur-col-md-9_13t6m_104{width:calc((100% - 1px)*.75)}}@media screen and (min-width: 1024px) and (min-width: 1024px){._purpur-col_13t6m_1._purpur-col-lg-9_13t6m_109{width:calc((100% - 1px)*.75)}}._purpur-col_13t6m_1._purpur-col-8_13t6m_113{--padding-col: var(--purpur-spacing-gutter-sm);box-sizing:border-box;display:block;padding-left:calc(var(--padding-col) / 2);padding-right:calc(var(--padding-col) / 2);width:calc((100% - 1px) / 12 * 8)}@media screen and (min-width: 600px){._purpur-col_13t6m_1._purpur-col-8_13t6m_113{--padding-col: var(--purpur-spacing-gutter-md)}}@media screen and (min-width: 1024px){._purpur-col_13t6m_1._purpur-col-8_13t6m_113{--padding-col: var(--purpur-spacing-gutter-lg)}}@media screen and (min-width: 600px) and (min-width: 600px){._purpur-col_13t6m_1._purpur-col-md-8_13t6m_132{width:calc((100% - 1px) / 12 * 8)}}@media screen and (min-width: 1024px) and (min-width: 1024px){._purpur-col_13t6m_1._purpur-col-lg-8_13t6m_137{width:calc((100% - 1px) / 12 * 8)}}._purpur-col_13t6m_1._purpur-col-7_13t6m_141{--padding-col: var(--purpur-spacing-gutter-sm);box-sizing:border-box;display:block;padding-left:calc(var(--padding-col) / 2);padding-right:calc(var(--padding-col) / 2);width:calc((100% - 1px) / 12 * 7)}@media screen and (min-width: 600px){._purpur-col_13t6m_1._purpur-col-7_13t6m_141{--padding-col: var(--purpur-spacing-gutter-md)}}@media screen and (min-width: 1024px){._purpur-col_13t6m_1._purpur-col-7_13t6m_141{--padding-col: var(--purpur-spacing-gutter-lg)}}@media screen and (min-width: 600px) and (min-width: 600px){._purpur-col_13t6m_1._purpur-col-md-7_13t6m_160{width:calc((100% - 1px) / 12 * 7)}}@media screen and (min-width: 1024px) and (min-width: 1024px){._purpur-col_13t6m_1._purpur-col-lg-7_13t6m_165{width:calc((100% - 1px) / 12 * 7)}}._purpur-col_13t6m_1._purpur-col-6_13t6m_169{--padding-col: var(--purpur-spacing-gutter-sm);box-sizing:border-box;display:block;padding-left:calc(var(--padding-col) / 2);padding-right:calc(var(--padding-col) / 2);width:calc((100% - 1px)/2)}@media screen and (min-width: 600px){._purpur-col_13t6m_1._purpur-col-6_13t6m_169{--padding-col: var(--purpur-spacing-gutter-md)}}@media screen and (min-width: 1024px){._purpur-col_13t6m_1._purpur-col-6_13t6m_169{--padding-col: var(--purpur-spacing-gutter-lg)}}@media screen and (min-width: 600px) and (min-width: 600px){._purpur-col_13t6m_1._purpur-col-md-6_13t6m_188{width:calc((100% - 1px)/2)}}@media screen and (min-width: 1024px) and (min-width: 1024px){._purpur-col_13t6m_1._purpur-col-lg-6_13t6m_193{width:calc((100% - 1px)/2)}}._purpur-col_13t6m_1._purpur-col-5_13t6m_197{--padding-col: var(--purpur-spacing-gutter-sm);box-sizing:border-box;display:block;padding-left:calc(var(--padding-col) / 2);padding-right:calc(var(--padding-col) / 2);width:calc((100% - 1px) / 12 * 5)}@media screen and (min-width: 600px){._purpur-col_13t6m_1._purpur-col-5_13t6m_197{--padding-col: var(--purpur-spacing-gutter-md)}}@media screen and (min-width: 1024px){._purpur-col_13t6m_1._purpur-col-5_13t6m_197{--padding-col: var(--purpur-spacing-gutter-lg)}}@media screen and (min-width: 600px) and (min-width: 600px){._purpur-col_13t6m_1._purpur-col-md-5_13t6m_216{width:calc((100% - 1px) / 12 * 5)}}@media screen and (min-width: 1024px) and (min-width: 1024px){._purpur-col_13t6m_1._purpur-col-lg-5_13t6m_221{width:calc((100% - 1px) / 12 * 5)}}._purpur-col_13t6m_1._purpur-col-4_13t6m_225{--padding-col: var(--purpur-spacing-gutter-sm);box-sizing:border-box;display:block;padding-left:calc(var(--padding-col) / 2);padding-right:calc(var(--padding-col) / 2);width:calc((100% - 1px) / 12 * 4)}@media screen and (min-width: 600px){._purpur-col_13t6m_1._purpur-col-4_13t6m_225{--padding-col: var(--purpur-spacing-gutter-md)}}@media screen and (min-width: 1024px){._purpur-col_13t6m_1._purpur-col-4_13t6m_225{--padding-col: var(--purpur-spacing-gutter-lg)}}@media screen and (min-width: 600px) and (min-width: 600px){._purpur-col_13t6m_1._purpur-col-md-4_13t6m_244{width:calc((100% - 1px) / 12 * 4)}}@media screen and (min-width: 1024px) and (min-width: 1024px){._purpur-col_13t6m_1._purpur-col-lg-4_13t6m_249{width:calc((100% - 1px) / 12 * 4)}}._purpur-col_13t6m_1._purpur-col-3_13t6m_253{--padding-col: var(--purpur-spacing-gutter-sm);box-sizing:border-box;display:block;padding-left:calc(var(--padding-col) / 2);padding-right:calc(var(--padding-col) / 2);width:calc((100% - 1px)/4)}@media screen and (min-width: 600px){._purpur-col_13t6m_1._purpur-col-3_13t6m_253{--padding-col: var(--purpur-spacing-gutter-md)}}@media screen and (min-width: 1024px){._purpur-col_13t6m_1._purpur-col-3_13t6m_253{--padding-col: var(--purpur-spacing-gutter-lg)}}@media screen and (min-width: 600px) and (min-width: 600px){._purpur-col_13t6m_1._purpur-col-md-3_13t6m_272{width:calc((100% - 1px)/4)}}@media screen and (min-width: 1024px) and (min-width: 1024px){._purpur-col_13t6m_1._purpur-col-lg-3_13t6m_277{width:calc((100% - 1px)/4)}}._purpur-col_13t6m_1._purpur-col-2_13t6m_281{--padding-col: var(--purpur-spacing-gutter-sm);box-sizing:border-box;display:block;padding-left:calc(var(--padding-col) / 2);padding-right:calc(var(--padding-col) / 2);width:calc((100% - 1px) / 12 * 2)}@media screen and (min-width: 600px){._purpur-col_13t6m_1._purpur-col-2_13t6m_281{--padding-col: var(--purpur-spacing-gutter-md)}}@media screen and (min-width: 1024px){._purpur-col_13t6m_1._purpur-col-2_13t6m_281{--padding-col: var(--purpur-spacing-gutter-lg)}}@media screen and (min-width: 600px) and (min-width: 600px){._purpur-col_13t6m_1._purpur-col-md-2_13t6m_300{width:calc((100% - 1px) / 12 * 2)}}@media screen and (min-width: 1024px) and (min-width: 1024px){._purpur-col_13t6m_1._purpur-col-lg-2_13t6m_305{width:calc((100% - 1px) / 12 * 2)}}._purpur-col_13t6m_1._purpur-col-1_13t6m_1{--padding-col: var(--purpur-spacing-gutter-sm);box-sizing:border-box;display:block;padding-left:calc(var(--padding-col) / 2);padding-right:calc(var(--padding-col) / 2);width:calc((100% - 1px) / 12 * 1)}@media screen and (min-width: 600px){._purpur-col_13t6m_1._purpur-col-1_13t6m_1{--padding-col: var(--purpur-spacing-gutter-md)}}@media screen and (min-width: 1024px){._purpur-col_13t6m_1._purpur-col-1_13t6m_1{--padding-col: var(--purpur-spacing-gutter-lg)}}@media screen and (min-width: 600px) and (min-width: 600px){._purpur-col_13t6m_1._purpur-col-md-1_13t6m_20{width:calc((100% - 1px) / 12 * 1)}}@media screen and (min-width: 1024px) and (min-width: 1024px){._purpur-col_13t6m_1._purpur-col-lg-1_13t6m_25{width:calc((100% - 1px) / 12 * 1)}}._purpur-grid_6ht8d_1{--padding: var(--purpur-spacing-page-padding-sm);box-sizing:border-box;display:block;margin-left:auto;margin-right:auto;max-width:var(--purpur-breakpoint-xl);padding:0 var(--padding);width:100%}@media screen and (min-width: 600px){._purpur-grid_6ht8d_1{--padding: var(--purpur-spacing-page-padding-md)}}@media screen and (min-width: 1024px){._purpur-grid_6ht8d_1{--padding: var(--purpur-spacing-page-padding-lg)}}@media screen and (min-width: 1440px){._purpur-grid_6ht8d_1{--padding: var(--purpur-spacing-page-padding-xl)}}._purpur-row_13nch_1{--margin: var(--purpur-spacing-gutter-sm);box-sizing:border-box;display:flex;flex-wrap:wrap;justify-content:left;margin-left:calc(-1 * var(--margin) / 2);margin-right:calc(-1 * var(--margin) / 2)}@media screen and (min-width: 600px){._purpur-row_13nch_1{--margin: var(--purpur-spacing-gutter-md)}}@media screen and (min-width: 1024px){._purpur-row_13nch_1{--margin: var(--purpur-spacing-gutter-lg)}}@media screen and (min-width: 1440px){._purpur-row_13nch_1{--margin: var(--purpur-spacing-gutter-xl)}}._purpur-row_13nch_1:last-of-type{margin-bottom:0}._purpur-row--sm_13nch_28{margin-bottom:var(--purpur-spacing-gutter-sm)}._purpur-row--md_13nch_31,._purpur-row--lg_13nch_34{margin-bottom:var(--purpur-spacing-gutter-md)}@media screen and (min-width: 1024px){._purpur-row--lg_13nch_34{margin-bottom:var(--purpur-spacing-gutter-lg)}}._purpur-row--col-gap_13nch_42{margin-top:calc(-1 * var(--purpur-spacing-gutter-sm))}@media screen and (min-width: 600px){._purpur-row--col-gap_13nch_42{margin-top:calc(-1 * var(--purpur-spacing-gutter-md))}}._purpur-row--col-gap_13nch_42>.purpur-col{margin-top:var(--purpur-spacing-gutter-sm)}@media screen and (min-width: 600px){._purpur-row--col-gap_13nch_42>.purpur-col{margin-top:var(--purpur-spacing-gutter-md)}}
|
|
1
|
+
._purpur-grid-item_1o8x1_1{--padding: calc(var(--purpur-spacing-gutter-sm) / 2);padding:0 var(--padding);box-sizing:border-box}@media screen and (min-width: 600px){._purpur-grid-item_1o8x1_1{--padding: calc(var(--purpur-spacing-gutter-md) / 2)}}@media screen and (min-width: 1024px){._purpur-grid-item_1o8x1_1{--padding: calc(var(--purpur-spacing-gutter-lg) / 2)}}@media screen and (min-width: 1440px){._purpur-grid-item_1o8x1_1{--padding: calc(var(--purpur-spacing-gutter-xl) / 2)}}._purpur-grid-item_1o8x1_1._purpur-grid-item-colspan-sm-4_1o8x1_21{width:100%}._purpur-grid-item_1o8x1_1._purpur-grid-item-colspan-sm-3_1o8x1_24{width:75%}._purpur-grid-item_1o8x1_1._purpur-grid-item-colspan-sm-2_1o8x1_27{width:50%}._purpur-grid-item_1o8x1_1._purpur-grid-item-colspan-sm-1_1o8x1_30{width:25%}@media screen and (min-width: 600px){._purpur-grid-item_1o8x1_1._purpur-grid-item-colspan-md-8_1o8x1_34{width:100%}}@media screen and (min-width: 600px){._purpur-grid-item_1o8x1_1._purpur-grid-item-colspan-md-7_1o8x1_39{width:87.5%}}@media screen and (min-width: 600px){._purpur-grid-item_1o8x1_1._purpur-grid-item-colspan-md-6_1o8x1_44{width:75%}}@media screen and (min-width: 600px){._purpur-grid-item_1o8x1_1._purpur-grid-item-colspan-md-5_1o8x1_49{width:62.5%}}@media screen and (min-width: 600px){._purpur-grid-item_1o8x1_1._purpur-grid-item-colspan-md-4_1o8x1_54{width:50%}}@media screen and (min-width: 600px){._purpur-grid-item_1o8x1_1._purpur-grid-item-colspan-md-3_1o8x1_59{width:37.5%}}@media screen and (min-width: 600px){._purpur-grid-item_1o8x1_1._purpur-grid-item-colspan-md-2_1o8x1_64{width:25%}}@media screen and (min-width: 600px){._purpur-grid-item_1o8x1_1._purpur-grid-item-colspan-md-1_1o8x1_69{width:12.5%}}@media screen and (min-width: 1024px){._purpur-grid-item_1o8x1_1._purpur-grid-item-colspan-lg-12_1o8x1_74{width:100%}}@media screen and (min-width: 1024px){._purpur-grid-item_1o8x1_1._purpur-grid-item-colspan-lg-11_1o8x1_79{width:91.6666666667%}}@media screen and (min-width: 1024px){._purpur-grid-item_1o8x1_1._purpur-grid-item-colspan-lg-10_1o8x1_84{width:83.3333333333%}}@media screen and (min-width: 1024px){._purpur-grid-item_1o8x1_1._purpur-grid-item-colspan-lg-9_1o8x1_89{width:75%}}@media screen and (min-width: 1024px){._purpur-grid-item_1o8x1_1._purpur-grid-item-colspan-lg-8_1o8x1_94{width:66.6666666667%}}@media screen and (min-width: 1024px){._purpur-grid-item_1o8x1_1._purpur-grid-item-colspan-lg-7_1o8x1_99{width:58.3333333333%}}@media screen and (min-width: 1024px){._purpur-grid-item_1o8x1_1._purpur-grid-item-colspan-lg-6_1o8x1_104{width:50%}}@media screen and (min-width: 1024px){._purpur-grid-item_1o8x1_1._purpur-grid-item-colspan-lg-5_1o8x1_109{width:41.6666666667%}}@media screen and (min-width: 1024px){._purpur-grid-item_1o8x1_1._purpur-grid-item-colspan-lg-4_1o8x1_114{width:33.3333333333%}}@media screen and (min-width: 1024px){._purpur-grid-item_1o8x1_1._purpur-grid-item-colspan-lg-3_1o8x1_119{width:25%}}@media screen and (min-width: 1024px){._purpur-grid-item_1o8x1_1._purpur-grid-item-colspan-lg-2_1o8x1_124{width:16.6666666667%}}@media screen and (min-width: 1024px){._purpur-grid-item_1o8x1_1._purpur-grid-item-colspan-lg-1_1o8x1_74{width:8.3333333333%}}._purpur-grid_1vbh2_1{--gap: var(--purpur-spacing-gutter-sm);--padding: var(--purpur-spacing-page-padding-sm);box-sizing:border-box;row-gap:var(--gap);width:100%;max-width:var(--purpur-breakpoint-xl);margin:0 auto;padding:0 var(--padding)}._purpur-grid_1vbh2_1 ._purpur-grid_1vbh2_1{padding:0}@media screen and (min-width: 600px){._purpur-grid_1vbh2_1{--gap: var(--purpur-spacing-gutter-md);--padding: var(--purpur-spacing-page-padding-md)}}@media screen and (min-width: 1024px){._purpur-grid_1vbh2_1{--gap: var(--purpur-spacing-gutter-lg);--padding: var(--purpur-spacing-page-padding-lg)}}@media screen and (min-width: 1440px){._purpur-grid_1vbh2_1{--gap: var(--purpur-spacing-gutter-xl);--padding: var(--purpur-spacing-page-padding-xl)}}._purpur-grid--grid_1vbh2_33{display:grid;column-gap:var(--gap)}._purpur-grid--grid_1vbh2_33._purpur-grid-col-sm-4_1vbh2_37{grid-template-columns:repeat(4,1fr)}._purpur-grid--grid_1vbh2_33._purpur-grid-col-sm-3_1vbh2_40{grid-template-columns:repeat(3,1fr)}._purpur-grid--grid_1vbh2_33._purpur-grid-col-sm-2_1vbh2_43{grid-template-columns:repeat(2,1fr)}@media screen and (min-width: 600px){._purpur-grid--grid_1vbh2_33._purpur-grid-col-md-8_1vbh2_47{grid-template-columns:repeat(8,1fr)}}@media screen and (min-width: 600px){._purpur-grid--grid_1vbh2_33._purpur-grid-col-md-7_1vbh2_52{grid-template-columns:repeat(7,1fr)}}@media screen and (min-width: 600px){._purpur-grid--grid_1vbh2_33._purpur-grid-col-md-6_1vbh2_57{grid-template-columns:repeat(6,1fr)}}@media screen and (min-width: 600px){._purpur-grid--grid_1vbh2_33._purpur-grid-col-md-5_1vbh2_62{grid-template-columns:repeat(5,1fr)}}@media screen and (min-width: 600px){._purpur-grid--grid_1vbh2_33._purpur-grid-col-md-4_1vbh2_67{grid-template-columns:repeat(4,1fr)}}@media screen and (min-width: 600px){._purpur-grid--grid_1vbh2_33._purpur-grid-col-md-3_1vbh2_72{grid-template-columns:repeat(3,1fr)}}@media screen and (min-width: 600px){._purpur-grid--grid_1vbh2_33._purpur-grid-col-md-2_1vbh2_77{grid-template-columns:repeat(2,1fr)}}@media screen and (min-width: 1024px){._purpur-grid--grid_1vbh2_33._purpur-grid-col-lg-12_1vbh2_82{grid-template-columns:repeat(12,1fr)}}@media screen and (min-width: 1024px){._purpur-grid--grid_1vbh2_33._purpur-grid-col-lg-11_1vbh2_87{grid-template-columns:repeat(11,1fr)}}@media screen and (min-width: 1024px){._purpur-grid--grid_1vbh2_33._purpur-grid-col-lg-10_1vbh2_92{grid-template-columns:repeat(10,1fr)}}@media screen and (min-width: 1024px){._purpur-grid--grid_1vbh2_33._purpur-grid-col-lg-9_1vbh2_97{grid-template-columns:repeat(9,1fr)}}@media screen and (min-width: 1024px){._purpur-grid--grid_1vbh2_33._purpur-grid-col-lg-8_1vbh2_102{grid-template-columns:repeat(8,1fr)}}@media screen and (min-width: 1024px){._purpur-grid--grid_1vbh2_33._purpur-grid-col-lg-7_1vbh2_107{grid-template-columns:repeat(7,1fr)}}@media screen and (min-width: 1024px){._purpur-grid--grid_1vbh2_33._purpur-grid-col-lg-6_1vbh2_112{grid-template-columns:repeat(6,1fr)}}@media screen and (min-width: 1024px){._purpur-grid--grid_1vbh2_33._purpur-grid-col-lg-5_1vbh2_117{grid-template-columns:repeat(5,1fr)}}@media screen and (min-width: 1024px){._purpur-grid--grid_1vbh2_33._purpur-grid-col-lg-4_1vbh2_122{grid-template-columns:repeat(4,1fr)}}@media screen and (min-width: 1024px){._purpur-grid--grid_1vbh2_33._purpur-grid-col-lg-3_1vbh2_127{grid-template-columns:repeat(3,1fr)}}@media screen and (min-width: 1024px){._purpur-grid--grid_1vbh2_33._purpur-grid-col-lg-2_1vbh2_132{grid-template-columns:repeat(2,1fr)}}._purpur-grid--flex_1vbh2_136{--gutter: var(--purpur-spacing-gutter-sm);display:flex;flex-wrap:wrap;width:calc(100% + var(--gutter));margin:0 calc(-1 * var(--gutter) / 2)}@media screen and (min-width: 600px){._purpur-grid--flex_1vbh2_136{--gutter: var(--purpur-spacing-gutter-md)}}@media screen and (min-width: 1024px){._purpur-grid--flex_1vbh2_136{--gutter: var(--purpur-spacing-gutter-lg)}}@media screen and (min-width: 1440px){._purpur-grid--flex_1vbh2_136{--gutter: var(--purpur-spacing-gutter-xl)}}
|
package/package.json
CHANGED
|
@@ -1,6 +1,6 @@
|
|
|
1
1
|
{
|
|
2
2
|
"name": "@purpurds/grid",
|
|
3
|
-
"version": "
|
|
3
|
+
"version": "5.1.0",
|
|
4
4
|
"license": "AGPL-3.0-only",
|
|
5
5
|
"main": "./dist/grid.cjs.js",
|
|
6
6
|
"types": "./dist/grid.d.ts",
|
|
@@ -15,7 +15,7 @@
|
|
|
15
15
|
"source": "src/grid.tsx",
|
|
16
16
|
"dependencies": {
|
|
17
17
|
"classnames": "~2.5.0",
|
|
18
|
-
"@purpurds/tokens": "
|
|
18
|
+
"@purpurds/tokens": "5.1.0"
|
|
19
19
|
},
|
|
20
20
|
"devDependencies": {
|
|
21
21
|
"@rushstack/eslint-patch": "~1.10.0",
|
|
@@ -40,6 +40,7 @@
|
|
|
40
40
|
"typescript": "~5.4.2",
|
|
41
41
|
"vite": "~5.2.2",
|
|
42
42
|
"vitest": "~1.5.0",
|
|
43
|
+
"@purpurds/link": "5.1.0",
|
|
43
44
|
"@purpurds/component-rig": "1.0.0"
|
|
44
45
|
},
|
|
45
46
|
"scripts": {
|