@purpurds/grid 5.24.0 → 5.24.2

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 (6) hide show
  1. package/dist/grid.cjs.js +2 -2
  2. package/dist/grid.cjs.js.map +1 -1
  3. package/dist/grid.es.js +77 -77
  4. package/dist/styles.css +1 -1
  5. package/package.json +3 -3
  6. package/src/grid.module.scss +20 -11
package/dist/grid.cjs.js CHANGED
@@ -1,6 +1,6 @@
1
- "use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const g=require("react/jsx-runtime"),s=require("react");function C(p){return p&&p.__esModule&&Object.prototype.hasOwnProperty.call(p,"default")?p.default:p}var f={exports:{}};/*!
1
+ "use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const g=require("react/jsx-runtime"),s=require("react");function N(p){return p&&p.__esModule&&Object.prototype.hasOwnProperty.call(p,"default")?p.default:p}var v={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 l={}.hasOwnProperty;function _(){for(var r="",i=0;i<arguments.length;i++){var u=arguments[i];u&&(r=d(r,e.call(this,u)))}return r}function e(r){if(typeof r=="string"||typeof r=="number")return this&&this[r]||r;if(typeof r!="object")return"";if(Array.isArray(r))return _.apply(this,r);if(r.toString!==Object.prototype.toString&&!r.toString.toString().includes("[native code]"))return r.toString();var i="";for(var u in r)l.call(r,u)&&r[u]&&(i=d(i,this&&this[u]||u));return i}function d(r,i){return i?r?r+" "+i:r+i:r}p.exports?(_.default=_,p.exports=_):window.classNames=_})()})(f);var w=f.exports;const $=C(w),I={"purpur-grid-item":"_purpur-grid-item_zx9tz_1","purpur-grid-item--no-col-gap":"_purpur-grid-item--no-col-gap_zx9tz_6","purpur-grid-item-colspan-sm-4":"_purpur-grid-item-colspan-sm-4_zx9tz_24","purpur-grid-item-colspan-sm-3":"_purpur-grid-item-colspan-sm-3_zx9tz_27","purpur-grid-item-colspan-sm-2":"_purpur-grid-item-colspan-sm-2_zx9tz_30","purpur-grid-item-colspan-sm-1":"_purpur-grid-item-colspan-sm-1_zx9tz_33","purpur-grid-item-colspan-md-8":"_purpur-grid-item-colspan-md-8_zx9tz_37","purpur-grid-item-colspan-md-7":"_purpur-grid-item-colspan-md-7_zx9tz_42","purpur-grid-item-colspan-md-6":"_purpur-grid-item-colspan-md-6_zx9tz_47","purpur-grid-item-colspan-md-5":"_purpur-grid-item-colspan-md-5_zx9tz_52","purpur-grid-item-colspan-md-4":"_purpur-grid-item-colspan-md-4_zx9tz_57","purpur-grid-item-colspan-md-3":"_purpur-grid-item-colspan-md-3_zx9tz_62","purpur-grid-item-colspan-md-2":"_purpur-grid-item-colspan-md-2_zx9tz_67","purpur-grid-item-colspan-md-1":"_purpur-grid-item-colspan-md-1_zx9tz_72","purpur-grid-item-colspan-lg-12":"_purpur-grid-item-colspan-lg-12_zx9tz_77","purpur-grid-item-colspan-lg-11":"_purpur-grid-item-colspan-lg-11_zx9tz_82","purpur-grid-item-colspan-lg-10":"_purpur-grid-item-colspan-lg-10_zx9tz_87","purpur-grid-item-colspan-lg-9":"_purpur-grid-item-colspan-lg-9_zx9tz_92","purpur-grid-item-colspan-lg-8":"_purpur-grid-item-colspan-lg-8_zx9tz_97","purpur-grid-item-colspan-lg-7":"_purpur-grid-item-colspan-lg-7_zx9tz_102","purpur-grid-item-colspan-lg-6":"_purpur-grid-item-colspan-lg-6_zx9tz_107","purpur-grid-item-colspan-lg-5":"_purpur-grid-item-colspan-lg-5_zx9tz_112","purpur-grid-item-colspan-lg-4":"_purpur-grid-item-colspan-lg-4_zx9tz_117","purpur-grid-item-colspan-lg-3":"_purpur-grid-item-colspan-lg-3_zx9tz_122","purpur-grid-item-colspan-lg-2":"_purpur-grid-item-colspan-lg-2_zx9tz_127","purpur-grid-item-colspan-lg-1":"_purpur-grid-item-colspan-lg-1_zx9tz_77"},O=$.bind(I),o="purpur-grid-item",c=({children:p,className:l,["data-testid"]:_,colSpanSm:e=4,colSpanMd:d=8,colSpanLg:r=12,noColGap:i=!1})=>{const u=O([l,o,{[`${o}--no-col-gap`]:i,[`${o}-colspan-sm-${e}`]:e,[`${o}-colspan-md-${d}`]:d,[`${o}-colspan-lg-${r}`]:r}]);return g.jsx("div",{className:u,"data-testid":_,children:p})},S=p=>!!p&&s.isValidElement(p)&&(!!p.props.colSpanSm||!!p.props.colSpanMd||!!p.props.colSpanLg);c.displayName="Grid.Item";const A={"purpur-grid":"_purpur-grid_113du_1","purpur-grid__inner":"_purpur-grid__inner_113du_7","purpur-grid__inner--no-gap":"_purpur-grid__inner--no-gap_113du_14","purpur-grid__inner--no-row-gap":"_purpur-grid__inner--no-row-gap_113du_14","purpur-grid__inner--grid":"_purpur-grid__inner--grid_113du_38","purpur-grid__inner--no-col-gap":"_purpur-grid__inner--no-col-gap_113du_42","purpur-grid__inner-col-sm-4":"_purpur-grid__inner-col-sm-4_113du_45","purpur-grid__inner-col-sm-3":"_purpur-grid__inner-col-sm-3_113du_48","purpur-grid__inner-col-sm-2":"_purpur-grid__inner-col-sm-2_113du_51","purpur-grid__inner-col-md-8":"_purpur-grid__inner-col-md-8_113du_55","purpur-grid__inner-col-md-7":"_purpur-grid__inner-col-md-7_113du_60","purpur-grid__inner-col-md-6":"_purpur-grid__inner-col-md-6_113du_65","purpur-grid__inner-col-md-5":"_purpur-grid__inner-col-md-5_113du_70","purpur-grid__inner-col-md-4":"_purpur-grid__inner-col-md-4_113du_75","purpur-grid__inner-col-md-3":"_purpur-grid__inner-col-md-3_113du_80","purpur-grid__inner-col-md-2":"_purpur-grid__inner-col-md-2_113du_85","purpur-grid__inner-col-lg-12":"_purpur-grid__inner-col-lg-12_113du_90","purpur-grid__inner-col-lg-11":"_purpur-grid__inner-col-lg-11_113du_95","purpur-grid__inner-col-lg-10":"_purpur-grid__inner-col-lg-10_113du_100","purpur-grid__inner-col-lg-9":"_purpur-grid__inner-col-lg-9_113du_105","purpur-grid__inner-col-lg-8":"_purpur-grid__inner-col-lg-8_113du_110","purpur-grid__inner-col-lg-7":"_purpur-grid__inner-col-lg-7_113du_115","purpur-grid__inner-col-lg-6":"_purpur-grid__inner-col-lg-6_113du_120","purpur-grid__inner-col-lg-5":"_purpur-grid__inner-col-lg-5_113du_125","purpur-grid__inner-col-lg-4":"_purpur-grid__inner-col-lg-4_113du_130","purpur-grid__inner-col-lg-3":"_purpur-grid__inner-col-lg-3_113du_135","purpur-grid__inner-col-lg-2":"_purpur-grid__inner-col-lg-2_113du_140","purpur-grid__inner--flex":"_purpur-grid__inner--flex_113du_144"},x=$.bind(A),E="purpur-grid",n="purpur-grid__inner",m=({children:p,className:l,containerClassName:_,["data-testid"]:e,colsSm:d=1,colsMd:r=1,colsLg:i=1,noGap:u=!1,noColGap:a=!1,noRowGap:h=!1,...y})=>{const z=s.Children.toArray(p).filter(S),t=z.length,b=x([_,E]),j=x([l,n,{[`${n}--grid`]:!t,[`${n}--flex`]:t,[`${n}--no-gap`]:u,[`${n}--no-col-gap`]:a,[`${n}--no-row-gap`]:h,[`${n}-col-sm-${d}`]:d>1&&!t,[`${n}-col-md-${r}`]:r>1&&!t,[`${n}-col-lg-${i}`]:i>1&&!t}]);return g.jsx("div",{className:b,"data-testid":e,...y,children:g.jsx("div",{className:j,children:t?s.Children.map(z,({props:{children:v,...N}})=>g.jsx(c,{...N,noColGap:u||a,children:v})):p})})};m.displayName="Grid";m.Item=c;exports.Grid=m;
5
+ */(function(p){(function(){var d={}.hasOwnProperty;function u(){for(var r="",i=0;i<arguments.length;i++){var _=arguments[i];_&&(r=e(r,t.call(this,_)))}return r}function t(r){if(typeof r=="string"||typeof r=="number")return this&&this[r]||r;if(typeof r!="object")return"";if(Array.isArray(r))return u.apply(this,r);if(r.toString!==Object.prototype.toString&&!r.toString.toString().includes("[native code]"))return r.toString();var i="";for(var _ in r)d.call(r,_)&&r[_]&&(i=e(i,this&&this[_]||_));return i}function e(r,i){return i?r?r+" "+i:r+i:r}p.exports?(u.default=u,p.exports=u):window.classNames=u})()})(v);var C=v.exports;const x=N(C),w={"purpur-grid-item":"_purpur-grid-item_zx9tz_1","purpur-grid-item--no-col-gap":"_purpur-grid-item--no-col-gap_zx9tz_6","purpur-grid-item-colspan-sm-4":"_purpur-grid-item-colspan-sm-4_zx9tz_24","purpur-grid-item-colspan-sm-3":"_purpur-grid-item-colspan-sm-3_zx9tz_27","purpur-grid-item-colspan-sm-2":"_purpur-grid-item-colspan-sm-2_zx9tz_30","purpur-grid-item-colspan-sm-1":"_purpur-grid-item-colspan-sm-1_zx9tz_33","purpur-grid-item-colspan-md-8":"_purpur-grid-item-colspan-md-8_zx9tz_37","purpur-grid-item-colspan-md-7":"_purpur-grid-item-colspan-md-7_zx9tz_42","purpur-grid-item-colspan-md-6":"_purpur-grid-item-colspan-md-6_zx9tz_47","purpur-grid-item-colspan-md-5":"_purpur-grid-item-colspan-md-5_zx9tz_52","purpur-grid-item-colspan-md-4":"_purpur-grid-item-colspan-md-4_zx9tz_57","purpur-grid-item-colspan-md-3":"_purpur-grid-item-colspan-md-3_zx9tz_62","purpur-grid-item-colspan-md-2":"_purpur-grid-item-colspan-md-2_zx9tz_67","purpur-grid-item-colspan-md-1":"_purpur-grid-item-colspan-md-1_zx9tz_72","purpur-grid-item-colspan-lg-12":"_purpur-grid-item-colspan-lg-12_zx9tz_77","purpur-grid-item-colspan-lg-11":"_purpur-grid-item-colspan-lg-11_zx9tz_82","purpur-grid-item-colspan-lg-10":"_purpur-grid-item-colspan-lg-10_zx9tz_87","purpur-grid-item-colspan-lg-9":"_purpur-grid-item-colspan-lg-9_zx9tz_92","purpur-grid-item-colspan-lg-8":"_purpur-grid-item-colspan-lg-8_zx9tz_97","purpur-grid-item-colspan-lg-7":"_purpur-grid-item-colspan-lg-7_zx9tz_102","purpur-grid-item-colspan-lg-6":"_purpur-grid-item-colspan-lg-6_zx9tz_107","purpur-grid-item-colspan-lg-5":"_purpur-grid-item-colspan-lg-5_zx9tz_112","purpur-grid-item-colspan-lg-4":"_purpur-grid-item-colspan-lg-4_zx9tz_117","purpur-grid-item-colspan-lg-3":"_purpur-grid-item-colspan-lg-3_zx9tz_122","purpur-grid-item-colspan-lg-2":"_purpur-grid-item-colspan-lg-2_zx9tz_127","purpur-grid-item-colspan-lg-1":"_purpur-grid-item-colspan-lg-1_zx9tz_77"},I=x.bind(w),o="purpur-grid-item",c=({children:p,className:d,["data-testid"]:u,colSpanSm:t=4,colSpanMd:e=8,colSpanLg:r=12,noColGap:i=!1})=>{const _=I([d,o,{[`${o}--no-col-gap`]:i,[`${o}-colspan-sm-${t}`]:t,[`${o}-colspan-md-${e}`]:e,[`${o}-colspan-lg-${r}`]:r}]);return g.jsx("div",{className:_,"data-testid":u,children:p})},O=p=>!!p&&s.isValidElement(p)&&(!!p.props.colSpanSm||!!p.props.colSpanMd||!!p.props.colSpanLg);c.displayName="Grid.Item";const S={"purpur-grid":"_purpur-grid_8kjv6_1","purpur-grid__inner":"_purpur-grid__inner_8kjv6_27","purpur-grid__inner--no-gap":"_purpur-grid__inner--no-gap_8kjv6_32","purpur-grid__inner--no-row-gap":"_purpur-grid__inner--no-row-gap_8kjv6_32","purpur-grid__inner--grid":"_purpur-grid__inner--grid_8kjv6_50","purpur-grid__inner--no-col-gap":"_purpur-grid__inner--no-col-gap_8kjv6_54","purpur-grid__inner-col-sm-4":"_purpur-grid__inner-col-sm-4_8kjv6_57","purpur-grid__inner-col-sm-3":"_purpur-grid__inner-col-sm-3_8kjv6_60","purpur-grid__inner-col-sm-2":"_purpur-grid__inner-col-sm-2_8kjv6_63","purpur-grid__inner-col-md-8":"_purpur-grid__inner-col-md-8_8kjv6_67","purpur-grid__inner-col-md-7":"_purpur-grid__inner-col-md-7_8kjv6_72","purpur-grid__inner-col-md-6":"_purpur-grid__inner-col-md-6_8kjv6_77","purpur-grid__inner-col-md-5":"_purpur-grid__inner-col-md-5_8kjv6_82","purpur-grid__inner-col-md-4":"_purpur-grid__inner-col-md-4_8kjv6_87","purpur-grid__inner-col-md-3":"_purpur-grid__inner-col-md-3_8kjv6_92","purpur-grid__inner-col-md-2":"_purpur-grid__inner-col-md-2_8kjv6_97","purpur-grid__inner-col-lg-12":"_purpur-grid__inner-col-lg-12_8kjv6_102","purpur-grid__inner-col-lg-11":"_purpur-grid__inner-col-lg-11_8kjv6_107","purpur-grid__inner-col-lg-10":"_purpur-grid__inner-col-lg-10_8kjv6_112","purpur-grid__inner-col-lg-9":"_purpur-grid__inner-col-lg-9_8kjv6_117","purpur-grid__inner-col-lg-8":"_purpur-grid__inner-col-lg-8_8kjv6_122","purpur-grid__inner-col-lg-7":"_purpur-grid__inner-col-lg-7_8kjv6_127","purpur-grid__inner-col-lg-6":"_purpur-grid__inner-col-lg-6_8kjv6_132","purpur-grid__inner-col-lg-5":"_purpur-grid__inner-col-lg-5_8kjv6_137","purpur-grid__inner-col-lg-4":"_purpur-grid__inner-col-lg-4_8kjv6_142","purpur-grid__inner-col-lg-3":"_purpur-grid__inner-col-lg-3_8kjv6_147","purpur-grid__inner-col-lg-2":"_purpur-grid__inner-col-lg-2_8kjv6_152","purpur-grid__inner--flex":"_purpur-grid__inner--flex_8kjv6_156"},j=x.bind(S),A="purpur-grid",n="purpur-grid__inner",m=({children:p,className:d,containerClassName:u,["data-testid"]:t,colsSm:e=1,colsMd:r=1,colsLg:i=1,noGap:_=!1,noColGap:a=!1,noRowGap:f=!1,...k})=>{const z=s.Children.toArray(p).filter(O),l=z.length,$=j([u,A]),h=j([d,n,{[`${n}--grid`]:!l,[`${n}--flex`]:l,[`${n}--no-gap`]:_,[`${n}--no-col-gap`]:a,[`${n}--no-row-gap`]:f,[`${n}-col-sm-${e}`]:e>1&&!l,[`${n}-col-md-${r}`]:r>1&&!l,[`${n}-col-lg-${i}`]:i>1&&!l}]);return g.jsx("div",{className:$,"data-testid":t,...k,children:g.jsx("div",{className:h,children:l?s.Children.map(z,({props:{children:y,...b}})=>g.jsx(c,{...b,noColGap:_||a,children:y})):p})})};m.displayName="Grid";m.Item=c;exports.Grid=m;
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/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 /** This will be passed from the parent component. */\n noColGap?: boolean;\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 noColGap = false,\n}: ItemProps) => {\n const classes = cx([\n className,\n rootClassName,\n {\n [`${rootClassName}--no-col-gap`]: noColGap,\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\nItem.displayName = \"Grid.Item\";\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 containerClassName?: 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 /** Eliminates gaps between columns and rows. */\n noGap?: boolean;\n /** Eliminates gaps between columns. */\n noColGap?: boolean;\n /** Eliminates gaps between rows. */\n noRowGap?: boolean;\n};\n\nexport type GridCmp<P> = React.FunctionComponent<P> & {\n Item: typeof Item;\n};\n\nconst rootClassName = \"purpur-grid\";\nconst innerClassName = \"purpur-grid__inner\";\n\nexport const Grid = ({\n children,\n className,\n containerClassName,\n [\"data-testid\"]: dataTestId,\n colsSm = 1,\n colsMd = 1,\n colsLg = 1,\n noGap = false,\n noColGap = false,\n noRowGap = false,\n ...props\n}: GridProps) => {\n const gridItemChildren = Children.toArray(children).filter(isItem);\n const hasItemChildren = gridItemChildren.length;\n\n const containerClasses = cx([containerClassName, rootClassName]);\n\n const classes = cx([\n className,\n innerClassName,\n {\n [`${innerClassName}--grid`]: !hasItemChildren,\n [`${innerClassName}--flex`]: hasItemChildren,\n [`${innerClassName}--no-gap`]: noGap,\n [`${innerClassName}--no-col-gap`]: noColGap,\n [`${innerClassName}--no-row-gap`]: noRowGap,\n [`${innerClassName}-col-sm-${colsSm}`]: colsSm > 1 && !hasItemChildren,\n [`${innerClassName}-col-md-${colsMd}`]: colsMd > 1 && !hasItemChildren,\n [`${innerClassName}-col-lg-${colsLg}`]: colsLg > 1 && !hasItemChildren,\n },\n ]);\n\n return (\n <div className={containerClasses} data-testid={dataTestId} {...props}>\n <div className={classes}>\n {hasItemChildren\n ? Children.map(gridItemChildren, ({ props: { children, ...colProps } }) => (\n <Item {...colProps} noColGap={noGap || noColGap}>\n {children}\n </Item>\n ))\n : children}\n </div>\n </div>\n );\n};\n\nGrid.displayName = \"Grid\";\n\nGrid.Item = Item;\n"],"names":["hasOwn","classNames","classes","arg","appendClass","parseValue","key","value","newClass","module","cx","c","styles","rootClassName","Item","children","className","dataTestId","colSpanSm","colSpanMd","colSpanLg","noColGap","isItem","child","isValidElement","innerClassName","Grid","containerClassName","colsSm","colsMd","colsLg","noGap","noRowGap","props","gridItemChildren","Children","hasItemChildren","containerClasses","jsx","colProps"],"mappings":"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","x_google_ignoreList":[0]}
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 /** This will be passed from the parent component. */\n noColGap?: boolean;\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 noColGap = false,\n}: ItemProps) => {\n const classes = cx([\n className,\n rootClassName,\n {\n [`${rootClassName}--no-col-gap`]: noColGap,\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\nItem.displayName = \"Grid.Item\";\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 containerClassName?: 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 /** Eliminates gaps between columns and rows. */\n noGap?: boolean;\n /** Eliminates gaps between columns. */\n noColGap?: boolean;\n /** Eliminates gaps between rows. */\n noRowGap?: boolean;\n};\n\nexport type GridCmp<P> = React.FunctionComponent<P> & {\n Item: typeof Item;\n};\n\nconst rootClassName = \"purpur-grid\";\nconst innerClassName = \"purpur-grid__inner\";\n\nexport const Grid = ({\n children,\n className,\n containerClassName,\n [\"data-testid\"]: dataTestId,\n colsSm = 1,\n colsMd = 1,\n colsLg = 1,\n noGap = false,\n noColGap = false,\n noRowGap = false,\n ...props\n}: GridProps) => {\n const gridItemChildren = Children.toArray(children).filter(isItem);\n const hasItemChildren = gridItemChildren.length;\n\n const containerClasses = cx([containerClassName, rootClassName]);\n\n const classes = cx([\n className,\n innerClassName,\n {\n [`${innerClassName}--grid`]: !hasItemChildren,\n [`${innerClassName}--flex`]: hasItemChildren,\n [`${innerClassName}--no-gap`]: noGap,\n [`${innerClassName}--no-col-gap`]: noColGap,\n [`${innerClassName}--no-row-gap`]: noRowGap,\n [`${innerClassName}-col-sm-${colsSm}`]: colsSm > 1 && !hasItemChildren,\n [`${innerClassName}-col-md-${colsMd}`]: colsMd > 1 && !hasItemChildren,\n [`${innerClassName}-col-lg-${colsLg}`]: colsLg > 1 && !hasItemChildren,\n },\n ]);\n\n return (\n <div className={containerClasses} data-testid={dataTestId} {...props}>\n <div className={classes}>\n {hasItemChildren\n ? Children.map(gridItemChildren, ({ props: { children, ...colProps } }) => (\n <Item {...colProps} noColGap={noGap || noColGap}>\n {children}\n </Item>\n ))\n : children}\n </div>\n </div>\n );\n};\n\nGrid.displayName = \"Grid\";\n\nGrid.Item = Item;\n"],"names":["hasOwn","classNames","classes","arg","appendClass","parseValue","key","value","newClass","module","cx","c","styles","rootClassName","Item","children","className","dataTestId","colSpanSm","colSpanMd","colSpanLg","noColGap","isItem","child","isValidElement","innerClassName","Grid","containerClassName","colsSm","colsMd","colsLg","noGap","noRowGap","props","gridItemChildren","Children","hasItemChildren","containerClasses","jsx","colProps"],"mappings":"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","x_google_ignoreList":[0]}
package/dist/grid.es.js CHANGED
@@ -1,9 +1,9 @@
1
1
  import { jsx as g } from "react/jsx-runtime";
2
- import { isValidElement as w, Children as a } from "react";
3
- function I(p) {
2
+ import { isValidElement as b, Children as a } from "react";
3
+ function C(p) {
4
4
  return p && p.__esModule && Object.prototype.hasOwnProperty.call(p, "default") ? p.default : p;
5
5
  }
6
- var x = { exports: {} };
6
+ var v = { exports: {} };
7
7
  /*!
8
8
  Copyright (c) 2018 Jed Watson.
9
9
  Licensed under the MIT License (MIT), see
@@ -11,36 +11,36 @@ var x = { exports: {} };
11
11
  */
12
12
  (function(p) {
13
13
  (function() {
14
- var t = {}.hasOwnProperty;
15
- function _() {
14
+ var d = {}.hasOwnProperty;
15
+ function u() {
16
16
  for (var r = "", i = 0; i < arguments.length; i++) {
17
- var u = arguments[i];
18
- u && (r = d(r, e.call(this, u)));
17
+ var _ = arguments[i];
18
+ _ && (r = e(r, l.call(this, _)));
19
19
  }
20
20
  return r;
21
21
  }
22
- function e(r) {
22
+ function l(r) {
23
23
  if (typeof r == "string" || typeof r == "number")
24
24
  return this && this[r] || r;
25
25
  if (typeof r != "object")
26
26
  return "";
27
27
  if (Array.isArray(r))
28
- return _.apply(this, r);
28
+ return u.apply(this, r);
29
29
  if (r.toString !== Object.prototype.toString && !r.toString.toString().includes("[native code]"))
30
30
  return r.toString();
31
31
  var i = "";
32
- for (var u in r)
33
- t.call(r, u) && r[u] && (i = d(i, this && this[u] || u));
32
+ for (var _ in r)
33
+ d.call(r, _) && r[_] && (i = e(i, this && this[_] || _));
34
34
  return i;
35
35
  }
36
- function d(r, i) {
36
+ function e(r, i) {
37
37
  return i ? r ? r + " " + i : r + i : r;
38
38
  }
39
- p.exports ? (_.default = _, p.exports = _) : window.classNames = _;
39
+ p.exports ? (u.default = u, p.exports = u) : window.classNames = u;
40
40
  })();
41
- })(x);
42
- var j = x.exports;
43
- const f = /* @__PURE__ */ I(j), O = {
41
+ })(v);
42
+ var w = v.exports;
43
+ const x = /* @__PURE__ */ C(w), I = {
44
44
  "purpur-grid-item": "_purpur-grid-item_zx9tz_1",
45
45
  "purpur-grid-item--no-col-gap": "_purpur-grid-item--no-col-gap_zx9tz_6",
46
46
  "purpur-grid-item-colspan-sm-4": "_purpur-grid-item-colspan-sm-4_zx9tz_24",
@@ -67,89 +67,89 @@ const f = /* @__PURE__ */ I(j), O = {
67
67
  "purpur-grid-item-colspan-lg-3": "_purpur-grid-item-colspan-lg-3_zx9tz_122",
68
68
  "purpur-grid-item-colspan-lg-2": "_purpur-grid-item-colspan-lg-2_zx9tz_127",
69
69
  "purpur-grid-item-colspan-lg-1": "_purpur-grid-item-colspan-lg-1_zx9tz_77"
70
- }, S = f.bind(O), o = "purpur-grid-item", s = ({
70
+ }, O = x.bind(I), o = "purpur-grid-item", s = ({
71
71
  children: p,
72
- className: t,
73
- ["data-testid"]: _,
74
- colSpanSm: e = 4,
75
- colSpanMd: d = 8,
72
+ className: d,
73
+ ["data-testid"]: u,
74
+ colSpanSm: l = 4,
75
+ colSpanMd: e = 8,
76
76
  colSpanLg: r = 12,
77
77
  noColGap: i = !1
78
78
  }) => {
79
- const u = S([
80
- t,
79
+ const _ = O([
80
+ d,
81
81
  o,
82
82
  {
83
83
  [`${o}--no-col-gap`]: i,
84
- [`${o}-colspan-sm-${e}`]: e,
85
- [`${o}-colspan-md-${d}`]: d,
84
+ [`${o}-colspan-sm-${l}`]: l,
85
+ [`${o}-colspan-md-${e}`]: e,
86
86
  [`${o}-colspan-lg-${r}`]: r
87
87
  }
88
88
  ]);
89
- return /* @__PURE__ */ g("div", { className: u, "data-testid": _, children: p });
90
- }, A = (p) => !!p && w(p) && (!!p.props.colSpanSm || !!p.props.colSpanMd || !!p.props.colSpanLg);
89
+ return /* @__PURE__ */ g("div", { className: _, "data-testid": u, children: p });
90
+ }, S = (p) => !!p && b(p) && (!!p.props.colSpanSm || !!p.props.colSpanMd || !!p.props.colSpanLg);
91
91
  s.displayName = "Grid.Item";
92
- const E = {
93
- "purpur-grid": "_purpur-grid_113du_1",
94
- "purpur-grid__inner": "_purpur-grid__inner_113du_7",
95
- "purpur-grid__inner--no-gap": "_purpur-grid__inner--no-gap_113du_14",
96
- "purpur-grid__inner--no-row-gap": "_purpur-grid__inner--no-row-gap_113du_14",
97
- "purpur-grid__inner--grid": "_purpur-grid__inner--grid_113du_38",
98
- "purpur-grid__inner--no-col-gap": "_purpur-grid__inner--no-col-gap_113du_42",
99
- "purpur-grid__inner-col-sm-4": "_purpur-grid__inner-col-sm-4_113du_45",
100
- "purpur-grid__inner-col-sm-3": "_purpur-grid__inner-col-sm-3_113du_48",
101
- "purpur-grid__inner-col-sm-2": "_purpur-grid__inner-col-sm-2_113du_51",
102
- "purpur-grid__inner-col-md-8": "_purpur-grid__inner-col-md-8_113du_55",
103
- "purpur-grid__inner-col-md-7": "_purpur-grid__inner-col-md-7_113du_60",
104
- "purpur-grid__inner-col-md-6": "_purpur-grid__inner-col-md-6_113du_65",
105
- "purpur-grid__inner-col-md-5": "_purpur-grid__inner-col-md-5_113du_70",
106
- "purpur-grid__inner-col-md-4": "_purpur-grid__inner-col-md-4_113du_75",
107
- "purpur-grid__inner-col-md-3": "_purpur-grid__inner-col-md-3_113du_80",
108
- "purpur-grid__inner-col-md-2": "_purpur-grid__inner-col-md-2_113du_85",
109
- "purpur-grid__inner-col-lg-12": "_purpur-grid__inner-col-lg-12_113du_90",
110
- "purpur-grid__inner-col-lg-11": "_purpur-grid__inner-col-lg-11_113du_95",
111
- "purpur-grid__inner-col-lg-10": "_purpur-grid__inner-col-lg-10_113du_100",
112
- "purpur-grid__inner-col-lg-9": "_purpur-grid__inner-col-lg-9_113du_105",
113
- "purpur-grid__inner-col-lg-8": "_purpur-grid__inner-col-lg-8_113du_110",
114
- "purpur-grid__inner-col-lg-7": "_purpur-grid__inner-col-lg-7_113du_115",
115
- "purpur-grid__inner-col-lg-6": "_purpur-grid__inner-col-lg-6_113du_120",
116
- "purpur-grid__inner-col-lg-5": "_purpur-grid__inner-col-lg-5_113du_125",
117
- "purpur-grid__inner-col-lg-4": "_purpur-grid__inner-col-lg-4_113du_130",
118
- "purpur-grid__inner-col-lg-3": "_purpur-grid__inner-col-lg-3_113du_135",
119
- "purpur-grid__inner-col-lg-2": "_purpur-grid__inner-col-lg-2_113du_140",
120
- "purpur-grid__inner--flex": "_purpur-grid__inner--flex_113du_144"
121
- }, z = f.bind(E), G = "purpur-grid", n = "purpur-grid__inner", $ = ({
92
+ const A = {
93
+ "purpur-grid": "_purpur-grid_8kjv6_1",
94
+ "purpur-grid__inner": "_purpur-grid__inner_8kjv6_27",
95
+ "purpur-grid__inner--no-gap": "_purpur-grid__inner--no-gap_8kjv6_32",
96
+ "purpur-grid__inner--no-row-gap": "_purpur-grid__inner--no-row-gap_8kjv6_32",
97
+ "purpur-grid__inner--grid": "_purpur-grid__inner--grid_8kjv6_50",
98
+ "purpur-grid__inner--no-col-gap": "_purpur-grid__inner--no-col-gap_8kjv6_54",
99
+ "purpur-grid__inner-col-sm-4": "_purpur-grid__inner-col-sm-4_8kjv6_57",
100
+ "purpur-grid__inner-col-sm-3": "_purpur-grid__inner-col-sm-3_8kjv6_60",
101
+ "purpur-grid__inner-col-sm-2": "_purpur-grid__inner-col-sm-2_8kjv6_63",
102
+ "purpur-grid__inner-col-md-8": "_purpur-grid__inner-col-md-8_8kjv6_67",
103
+ "purpur-grid__inner-col-md-7": "_purpur-grid__inner-col-md-7_8kjv6_72",
104
+ "purpur-grid__inner-col-md-6": "_purpur-grid__inner-col-md-6_8kjv6_77",
105
+ "purpur-grid__inner-col-md-5": "_purpur-grid__inner-col-md-5_8kjv6_82",
106
+ "purpur-grid__inner-col-md-4": "_purpur-grid__inner-col-md-4_8kjv6_87",
107
+ "purpur-grid__inner-col-md-3": "_purpur-grid__inner-col-md-3_8kjv6_92",
108
+ "purpur-grid__inner-col-md-2": "_purpur-grid__inner-col-md-2_8kjv6_97",
109
+ "purpur-grid__inner-col-lg-12": "_purpur-grid__inner-col-lg-12_8kjv6_102",
110
+ "purpur-grid__inner-col-lg-11": "_purpur-grid__inner-col-lg-11_8kjv6_107",
111
+ "purpur-grid__inner-col-lg-10": "_purpur-grid__inner-col-lg-10_8kjv6_112",
112
+ "purpur-grid__inner-col-lg-9": "_purpur-grid__inner-col-lg-9_8kjv6_117",
113
+ "purpur-grid__inner-col-lg-8": "_purpur-grid__inner-col-lg-8_8kjv6_122",
114
+ "purpur-grid__inner-col-lg-7": "_purpur-grid__inner-col-lg-7_8kjv6_127",
115
+ "purpur-grid__inner-col-lg-6": "_purpur-grid__inner-col-lg-6_8kjv6_132",
116
+ "purpur-grid__inner-col-lg-5": "_purpur-grid__inner-col-lg-5_8kjv6_137",
117
+ "purpur-grid__inner-col-lg-4": "_purpur-grid__inner-col-lg-4_8kjv6_142",
118
+ "purpur-grid__inner-col-lg-3": "_purpur-grid__inner-col-lg-3_8kjv6_147",
119
+ "purpur-grid__inner-col-lg-2": "_purpur-grid__inner-col-lg-2_8kjv6_152",
120
+ "purpur-grid__inner--flex": "_purpur-grid__inner--flex_8kjv6_156"
121
+ }, z = x.bind(A), E = "purpur-grid", n = "purpur-grid__inner", f = ({
122
122
  children: p,
123
- className: t,
124
- containerClassName: _,
125
- ["data-testid"]: e,
126
- colsSm: d = 1,
123
+ className: d,
124
+ containerClassName: u,
125
+ ["data-testid"]: l,
126
+ colsSm: e = 1,
127
127
  colsMd: r = 1,
128
128
  colsLg: i = 1,
129
- noGap: u = !1,
129
+ noGap: _ = !1,
130
130
  noColGap: c = !1,
131
- noRowGap: h = !1,
132
- ...y
131
+ noRowGap: j = !1,
132
+ ...k
133
133
  }) => {
134
- const m = a.toArray(p).filter(A), l = m.length, N = z([_, G]), v = z([
135
- t,
134
+ const m = a.toArray(p).filter(S), t = m.length, $ = z([u, E]), h = z([
135
+ d,
136
136
  n,
137
137
  {
138
- [`${n}--grid`]: !l,
139
- [`${n}--flex`]: l,
140
- [`${n}--no-gap`]: u,
138
+ [`${n}--grid`]: !t,
139
+ [`${n}--flex`]: t,
140
+ [`${n}--no-gap`]: _,
141
141
  [`${n}--no-col-gap`]: c,
142
- [`${n}--no-row-gap`]: h,
143
- [`${n}-col-sm-${d}`]: d > 1 && !l,
144
- [`${n}-col-md-${r}`]: r > 1 && !l,
145
- [`${n}-col-lg-${i}`]: i > 1 && !l
142
+ [`${n}--no-row-gap`]: j,
143
+ [`${n}-col-sm-${e}`]: e > 1 && !t,
144
+ [`${n}-col-md-${r}`]: r > 1 && !t,
145
+ [`${n}-col-lg-${i}`]: i > 1 && !t
146
146
  }
147
147
  ]);
148
- return /* @__PURE__ */ g("div", { className: N, "data-testid": e, ...y, children: /* @__PURE__ */ g("div", { className: v, children: l ? a.map(m, ({ props: { children: b, ...C } }) => /* @__PURE__ */ g(s, { ...C, noColGap: u || c, children: b })) : p }) });
148
+ return /* @__PURE__ */ g("div", { className: $, "data-testid": l, ...k, children: /* @__PURE__ */ g("div", { className: h, children: t ? a.map(m, ({ props: { children: y, ...N } }) => /* @__PURE__ */ g(s, { ...N, noColGap: _ || c, children: y })) : p }) });
149
149
  };
150
- $.displayName = "Grid";
151
- $.Item = s;
150
+ f.displayName = "Grid";
151
+ f.Item = s;
152
152
  export {
153
- $ as Grid
153
+ f as Grid
154
154
  };
155
155
  //# sourceMappingURL=grid.es.js.map
package/dist/styles.css CHANGED
@@ -1 +1 @@
1
- ._purpur-grid-item_zx9tz_1{--padding: calc(var(--purpur-spacing-gutter-sm) / 2);padding:0 var(--padding);box-sizing:border-box}._purpur-grid-item--no-col-gap_zx9tz_6{padding:0}@media screen and (min-width: 600px){._purpur-grid-item_zx9tz_1{--padding: calc(var(--purpur-spacing-gutter-md) / 2)}}@media screen and (min-width: 1024px){._purpur-grid-item_zx9tz_1{--padding: calc(var(--purpur-spacing-gutter-lg) / 2)}}@media screen and (min-width: 1440px){._purpur-grid-item_zx9tz_1{--padding: calc(var(--purpur-spacing-gutter-xl) / 2)}}._purpur-grid-item_zx9tz_1._purpur-grid-item-colspan-sm-4_zx9tz_24{width:100%}._purpur-grid-item_zx9tz_1._purpur-grid-item-colspan-sm-3_zx9tz_27{width:75%}._purpur-grid-item_zx9tz_1._purpur-grid-item-colspan-sm-2_zx9tz_30{width:50%}._purpur-grid-item_zx9tz_1._purpur-grid-item-colspan-sm-1_zx9tz_33{width:25%}@media screen and (min-width: 600px){._purpur-grid-item_zx9tz_1._purpur-grid-item-colspan-md-8_zx9tz_37{width:100%}}@media screen and (min-width: 600px){._purpur-grid-item_zx9tz_1._purpur-grid-item-colspan-md-7_zx9tz_42{width:87.5%}}@media screen and (min-width: 600px){._purpur-grid-item_zx9tz_1._purpur-grid-item-colspan-md-6_zx9tz_47{width:75%}}@media screen and (min-width: 600px){._purpur-grid-item_zx9tz_1._purpur-grid-item-colspan-md-5_zx9tz_52{width:62.5%}}@media screen and (min-width: 600px){._purpur-grid-item_zx9tz_1._purpur-grid-item-colspan-md-4_zx9tz_57{width:50%}}@media screen and (min-width: 600px){._purpur-grid-item_zx9tz_1._purpur-grid-item-colspan-md-3_zx9tz_62{width:37.5%}}@media screen and (min-width: 600px){._purpur-grid-item_zx9tz_1._purpur-grid-item-colspan-md-2_zx9tz_67{width:25%}}@media screen and (min-width: 600px){._purpur-grid-item_zx9tz_1._purpur-grid-item-colspan-md-1_zx9tz_72{width:12.5%}}@media screen and (min-width: 1024px){._purpur-grid-item_zx9tz_1._purpur-grid-item-colspan-lg-12_zx9tz_77{width:100%}}@media screen and (min-width: 1024px){._purpur-grid-item_zx9tz_1._purpur-grid-item-colspan-lg-11_zx9tz_82{width:91.6666666667%}}@media screen and (min-width: 1024px){._purpur-grid-item_zx9tz_1._purpur-grid-item-colspan-lg-10_zx9tz_87{width:83.3333333333%}}@media screen and (min-width: 1024px){._purpur-grid-item_zx9tz_1._purpur-grid-item-colspan-lg-9_zx9tz_92{width:75%}}@media screen and (min-width: 1024px){._purpur-grid-item_zx9tz_1._purpur-grid-item-colspan-lg-8_zx9tz_97{width:66.6666666667%}}@media screen and (min-width: 1024px){._purpur-grid-item_zx9tz_1._purpur-grid-item-colspan-lg-7_zx9tz_102{width:58.3333333333%}}@media screen and (min-width: 1024px){._purpur-grid-item_zx9tz_1._purpur-grid-item-colspan-lg-6_zx9tz_107{width:50%}}@media screen and (min-width: 1024px){._purpur-grid-item_zx9tz_1._purpur-grid-item-colspan-lg-5_zx9tz_112{width:41.6666666667%}}@media screen and (min-width: 1024px){._purpur-grid-item_zx9tz_1._purpur-grid-item-colspan-lg-4_zx9tz_117{width:33.3333333333%}}@media screen and (min-width: 1024px){._purpur-grid-item_zx9tz_1._purpur-grid-item-colspan-lg-3_zx9tz_122{width:25%}}@media screen and (min-width: 1024px){._purpur-grid-item_zx9tz_1._purpur-grid-item-colspan-lg-2_zx9tz_127{width:16.6666666667%}}@media screen and (min-width: 1024px){._purpur-grid-item_zx9tz_1._purpur-grid-item-colspan-lg-1_zx9tz_77{width:8.3333333333%}}._purpur-grid_113du_1{box-sizing:border-box;width:100%;max-width:var(--purpur-breakpoint-xl);margin:0 auto}._purpur-grid__inner_113du_7{--gap: var(--purpur-spacing-gutter-sm);--padding: var(--purpur-spacing-page-padding-sm);row-gap:var(--gap);padding:0 var(--padding)}._purpur-grid__inner--no-gap_113du_14,._purpur-grid__inner--no-row-gap_113du_14{row-gap:0}._purpur-grid__inner_113du_7 ._purpur-grid__inner_113du_7{padding:0}@media screen and (min-width: 600px){._purpur-grid__inner_113du_7{--gap: var(--purpur-spacing-gutter-md);--padding: var(--purpur-spacing-page-padding-md)}}@media screen and (min-width: 1024px){._purpur-grid__inner_113du_7{--gap: var(--purpur-spacing-gutter-lg);--padding: var(--purpur-spacing-page-padding-lg)}}@media screen and (min-width: 1440px){._purpur-grid__inner_113du_7{--gap: var(--purpur-spacing-gutter-xl);--padding: var(--purpur-spacing-page-padding-xl)}}._purpur-grid__inner--grid_113du_38{display:grid;column-gap:var(--gap)}._purpur-grid__inner--grid_113du_38._purpur-grid__inner--no-gap_113du_14,._purpur-grid__inner--grid_113du_38._purpur-grid__inner--no-col-gap_113du_42{column-gap:0}._purpur-grid__inner--grid_113du_38._purpur-grid__inner-col-sm-4_113du_45{grid-template-columns:repeat(4,1fr)}._purpur-grid__inner--grid_113du_38._purpur-grid__inner-col-sm-3_113du_48{grid-template-columns:repeat(3,1fr)}._purpur-grid__inner--grid_113du_38._purpur-grid__inner-col-sm-2_113du_51{grid-template-columns:repeat(2,1fr)}@media screen and (min-width: 600px){._purpur-grid__inner--grid_113du_38._purpur-grid__inner-col-md-8_113du_55{grid-template-columns:repeat(8,1fr)}}@media screen and (min-width: 600px){._purpur-grid__inner--grid_113du_38._purpur-grid__inner-col-md-7_113du_60{grid-template-columns:repeat(7,1fr)}}@media screen and (min-width: 600px){._purpur-grid__inner--grid_113du_38._purpur-grid__inner-col-md-6_113du_65{grid-template-columns:repeat(6,1fr)}}@media screen and (min-width: 600px){._purpur-grid__inner--grid_113du_38._purpur-grid__inner-col-md-5_113du_70{grid-template-columns:repeat(5,1fr)}}@media screen and (min-width: 600px){._purpur-grid__inner--grid_113du_38._purpur-grid__inner-col-md-4_113du_75{grid-template-columns:repeat(4,1fr)}}@media screen and (min-width: 600px){._purpur-grid__inner--grid_113du_38._purpur-grid__inner-col-md-3_113du_80{grid-template-columns:repeat(3,1fr)}}@media screen and (min-width: 600px){._purpur-grid__inner--grid_113du_38._purpur-grid__inner-col-md-2_113du_85{grid-template-columns:repeat(2,1fr)}}@media screen and (min-width: 1024px){._purpur-grid__inner--grid_113du_38._purpur-grid__inner-col-lg-12_113du_90{grid-template-columns:repeat(12,1fr)}}@media screen and (min-width: 1024px){._purpur-grid__inner--grid_113du_38._purpur-grid__inner-col-lg-11_113du_95{grid-template-columns:repeat(11,1fr)}}@media screen and (min-width: 1024px){._purpur-grid__inner--grid_113du_38._purpur-grid__inner-col-lg-10_113du_100{grid-template-columns:repeat(10,1fr)}}@media screen and (min-width: 1024px){._purpur-grid__inner--grid_113du_38._purpur-grid__inner-col-lg-9_113du_105{grid-template-columns:repeat(9,1fr)}}@media screen and (min-width: 1024px){._purpur-grid__inner--grid_113du_38._purpur-grid__inner-col-lg-8_113du_110{grid-template-columns:repeat(8,1fr)}}@media screen and (min-width: 1024px){._purpur-grid__inner--grid_113du_38._purpur-grid__inner-col-lg-7_113du_115{grid-template-columns:repeat(7,1fr)}}@media screen and (min-width: 1024px){._purpur-grid__inner--grid_113du_38._purpur-grid__inner-col-lg-6_113du_120{grid-template-columns:repeat(6,1fr)}}@media screen and (min-width: 1024px){._purpur-grid__inner--grid_113du_38._purpur-grid__inner-col-lg-5_113du_125{grid-template-columns:repeat(5,1fr)}}@media screen and (min-width: 1024px){._purpur-grid__inner--grid_113du_38._purpur-grid__inner-col-lg-4_113du_130{grid-template-columns:repeat(4,1fr)}}@media screen and (min-width: 1024px){._purpur-grid__inner--grid_113du_38._purpur-grid__inner-col-lg-3_113du_135{grid-template-columns:repeat(3,1fr)}}@media screen and (min-width: 1024px){._purpur-grid__inner--grid_113du_38._purpur-grid__inner-col-lg-2_113du_140{grid-template-columns:repeat(2,1fr)}}._purpur-grid__inner--flex_113du_144{--gutter: var(--purpur-spacing-gutter-sm);display:flex;flex-wrap:wrap;width:calc(100% + var(--gutter));margin:0 calc(-1 * var(--gutter) / 2);box-sizing:border-box}._purpur-grid__inner--flex_113du_144._purpur-grid__inner--no-gap_113du_14,._purpur-grid__inner--flex_113du_144._purpur-grid__inner--no-col-gap_113du_42{width:100%;margin:0}@media screen and (min-width: 600px){._purpur-grid__inner--flex_113du_144{--gutter: var(--purpur-spacing-gutter-md)}}@media screen and (min-width: 1024px){._purpur-grid__inner--flex_113du_144{--gutter: var(--purpur-spacing-gutter-lg)}}@media screen and (min-width: 1440px){._purpur-grid__inner--flex_113du_144{--gutter: var(--purpur-spacing-gutter-xl)}}
1
+ ._purpur-grid-item_zx9tz_1{--padding: calc(var(--purpur-spacing-gutter-sm) / 2);padding:0 var(--padding);box-sizing:border-box}._purpur-grid-item--no-col-gap_zx9tz_6{padding:0}@media screen and (min-width: 600px){._purpur-grid-item_zx9tz_1{--padding: calc(var(--purpur-spacing-gutter-md) / 2)}}@media screen and (min-width: 1024px){._purpur-grid-item_zx9tz_1{--padding: calc(var(--purpur-spacing-gutter-lg) / 2)}}@media screen and (min-width: 1440px){._purpur-grid-item_zx9tz_1{--padding: calc(var(--purpur-spacing-gutter-xl) / 2)}}._purpur-grid-item_zx9tz_1._purpur-grid-item-colspan-sm-4_zx9tz_24{width:100%}._purpur-grid-item_zx9tz_1._purpur-grid-item-colspan-sm-3_zx9tz_27{width:75%}._purpur-grid-item_zx9tz_1._purpur-grid-item-colspan-sm-2_zx9tz_30{width:50%}._purpur-grid-item_zx9tz_1._purpur-grid-item-colspan-sm-1_zx9tz_33{width:25%}@media screen and (min-width: 600px){._purpur-grid-item_zx9tz_1._purpur-grid-item-colspan-md-8_zx9tz_37{width:100%}}@media screen and (min-width: 600px){._purpur-grid-item_zx9tz_1._purpur-grid-item-colspan-md-7_zx9tz_42{width:87.5%}}@media screen and (min-width: 600px){._purpur-grid-item_zx9tz_1._purpur-grid-item-colspan-md-6_zx9tz_47{width:75%}}@media screen and (min-width: 600px){._purpur-grid-item_zx9tz_1._purpur-grid-item-colspan-md-5_zx9tz_52{width:62.5%}}@media screen and (min-width: 600px){._purpur-grid-item_zx9tz_1._purpur-grid-item-colspan-md-4_zx9tz_57{width:50%}}@media screen and (min-width: 600px){._purpur-grid-item_zx9tz_1._purpur-grid-item-colspan-md-3_zx9tz_62{width:37.5%}}@media screen and (min-width: 600px){._purpur-grid-item_zx9tz_1._purpur-grid-item-colspan-md-2_zx9tz_67{width:25%}}@media screen and (min-width: 600px){._purpur-grid-item_zx9tz_1._purpur-grid-item-colspan-md-1_zx9tz_72{width:12.5%}}@media screen and (min-width: 1024px){._purpur-grid-item_zx9tz_1._purpur-grid-item-colspan-lg-12_zx9tz_77{width:100%}}@media screen and (min-width: 1024px){._purpur-grid-item_zx9tz_1._purpur-grid-item-colspan-lg-11_zx9tz_82{width:91.6666666667%}}@media screen and (min-width: 1024px){._purpur-grid-item_zx9tz_1._purpur-grid-item-colspan-lg-10_zx9tz_87{width:83.3333333333%}}@media screen and (min-width: 1024px){._purpur-grid-item_zx9tz_1._purpur-grid-item-colspan-lg-9_zx9tz_92{width:75%}}@media screen and (min-width: 1024px){._purpur-grid-item_zx9tz_1._purpur-grid-item-colspan-lg-8_zx9tz_97{width:66.6666666667%}}@media screen and (min-width: 1024px){._purpur-grid-item_zx9tz_1._purpur-grid-item-colspan-lg-7_zx9tz_102{width:58.3333333333%}}@media screen and (min-width: 1024px){._purpur-grid-item_zx9tz_1._purpur-grid-item-colspan-lg-6_zx9tz_107{width:50%}}@media screen and (min-width: 1024px){._purpur-grid-item_zx9tz_1._purpur-grid-item-colspan-lg-5_zx9tz_112{width:41.6666666667%}}@media screen and (min-width: 1024px){._purpur-grid-item_zx9tz_1._purpur-grid-item-colspan-lg-4_zx9tz_117{width:33.3333333333%}}@media screen and (min-width: 1024px){._purpur-grid-item_zx9tz_1._purpur-grid-item-colspan-lg-3_zx9tz_122{width:25%}}@media screen and (min-width: 1024px){._purpur-grid-item_zx9tz_1._purpur-grid-item-colspan-lg-2_zx9tz_127{width:16.6666666667%}}@media screen and (min-width: 1024px){._purpur-grid-item_zx9tz_1._purpur-grid-item-colspan-lg-1_zx9tz_77{width:8.3333333333%}}._purpur-grid_8kjv6_1{box-sizing:border-box;width:100%;max-width:var(--purpur-breakpoint-xl);margin:0 auto;padding:0 var(--padding);--padding: var(--purpur-spacing-page-padding-sm)}@media screen and (min-width: 600px){._purpur-grid_8kjv6_1{--padding: var(--purpur-spacing-page-padding-md)}}@media screen and (min-width: 1024px){._purpur-grid_8kjv6_1{--padding: var(--purpur-spacing-page-padding-lg)}}@media screen and (min-width: 1440px){._purpur-grid_8kjv6_1{--padding: var(--purpur-spacing-page-padding-xl)}}._purpur-grid_8kjv6_1 ._purpur-grid_8kjv6_1{padding:0}._purpur-grid__inner_8kjv6_27{--gap: var(--purpur-spacing-gutter-sm);row-gap:var(--gap);padding:0}._purpur-grid__inner--no-gap_8kjv6_32,._purpur-grid__inner--no-row-gap_8kjv6_32{row-gap:0}@media screen and (min-width: 600px){._purpur-grid__inner_8kjv6_27{--gap: var(--purpur-spacing-gutter-md)}}@media screen and (min-width: 1024px){._purpur-grid__inner_8kjv6_27{--gap: var(--purpur-spacing-gutter-lg)}}@media screen and (min-width: 1440px){._purpur-grid__inner_8kjv6_27{--gap: var(--purpur-spacing-gutter-xl)}}._purpur-grid__inner--grid_8kjv6_50{display:grid;column-gap:var(--gap)}._purpur-grid__inner--grid_8kjv6_50._purpur-grid__inner--no-gap_8kjv6_32,._purpur-grid__inner--grid_8kjv6_50._purpur-grid__inner--no-col-gap_8kjv6_54{column-gap:0}._purpur-grid__inner--grid_8kjv6_50._purpur-grid__inner-col-sm-4_8kjv6_57{grid-template-columns:repeat(4,1fr)}._purpur-grid__inner--grid_8kjv6_50._purpur-grid__inner-col-sm-3_8kjv6_60{grid-template-columns:repeat(3,1fr)}._purpur-grid__inner--grid_8kjv6_50._purpur-grid__inner-col-sm-2_8kjv6_63{grid-template-columns:repeat(2,1fr)}@media screen and (min-width: 600px){._purpur-grid__inner--grid_8kjv6_50._purpur-grid__inner-col-md-8_8kjv6_67{grid-template-columns:repeat(8,1fr)}}@media screen and (min-width: 600px){._purpur-grid__inner--grid_8kjv6_50._purpur-grid__inner-col-md-7_8kjv6_72{grid-template-columns:repeat(7,1fr)}}@media screen and (min-width: 600px){._purpur-grid__inner--grid_8kjv6_50._purpur-grid__inner-col-md-6_8kjv6_77{grid-template-columns:repeat(6,1fr)}}@media screen and (min-width: 600px){._purpur-grid__inner--grid_8kjv6_50._purpur-grid__inner-col-md-5_8kjv6_82{grid-template-columns:repeat(5,1fr)}}@media screen and (min-width: 600px){._purpur-grid__inner--grid_8kjv6_50._purpur-grid__inner-col-md-4_8kjv6_87{grid-template-columns:repeat(4,1fr)}}@media screen and (min-width: 600px){._purpur-grid__inner--grid_8kjv6_50._purpur-grid__inner-col-md-3_8kjv6_92{grid-template-columns:repeat(3,1fr)}}@media screen and (min-width: 600px){._purpur-grid__inner--grid_8kjv6_50._purpur-grid__inner-col-md-2_8kjv6_97{grid-template-columns:repeat(2,1fr)}}@media screen and (min-width: 1024px){._purpur-grid__inner--grid_8kjv6_50._purpur-grid__inner-col-lg-12_8kjv6_102{grid-template-columns:repeat(12,1fr)}}@media screen and (min-width: 1024px){._purpur-grid__inner--grid_8kjv6_50._purpur-grid__inner-col-lg-11_8kjv6_107{grid-template-columns:repeat(11,1fr)}}@media screen and (min-width: 1024px){._purpur-grid__inner--grid_8kjv6_50._purpur-grid__inner-col-lg-10_8kjv6_112{grid-template-columns:repeat(10,1fr)}}@media screen and (min-width: 1024px){._purpur-grid__inner--grid_8kjv6_50._purpur-grid__inner-col-lg-9_8kjv6_117{grid-template-columns:repeat(9,1fr)}}@media screen and (min-width: 1024px){._purpur-grid__inner--grid_8kjv6_50._purpur-grid__inner-col-lg-8_8kjv6_122{grid-template-columns:repeat(8,1fr)}}@media screen and (min-width: 1024px){._purpur-grid__inner--grid_8kjv6_50._purpur-grid__inner-col-lg-7_8kjv6_127{grid-template-columns:repeat(7,1fr)}}@media screen and (min-width: 1024px){._purpur-grid__inner--grid_8kjv6_50._purpur-grid__inner-col-lg-6_8kjv6_132{grid-template-columns:repeat(6,1fr)}}@media screen and (min-width: 1024px){._purpur-grid__inner--grid_8kjv6_50._purpur-grid__inner-col-lg-5_8kjv6_137{grid-template-columns:repeat(5,1fr)}}@media screen and (min-width: 1024px){._purpur-grid__inner--grid_8kjv6_50._purpur-grid__inner-col-lg-4_8kjv6_142{grid-template-columns:repeat(4,1fr)}}@media screen and (min-width: 1024px){._purpur-grid__inner--grid_8kjv6_50._purpur-grid__inner-col-lg-3_8kjv6_147{grid-template-columns:repeat(3,1fr)}}@media screen and (min-width: 1024px){._purpur-grid__inner--grid_8kjv6_50._purpur-grid__inner-col-lg-2_8kjv6_152{grid-template-columns:repeat(2,1fr)}}._purpur-grid__inner--flex_8kjv6_156{--gutter: var(--purpur-spacing-gutter-sm);display:flex;flex-wrap:wrap;width:calc(100% + var(--gutter));margin:0 calc(-1 * var(--gutter) / 2);box-sizing:border-box}._purpur-grid__inner--flex_8kjv6_156._purpur-grid__inner--no-gap_8kjv6_32,._purpur-grid__inner--flex_8kjv6_156._purpur-grid__inner--no-col-gap_8kjv6_54{width:100%;margin:0}@media screen and (min-width: 600px){._purpur-grid__inner--flex_8kjv6_156{--gutter: var(--purpur-spacing-gutter-md)}}@media screen and (min-width: 1024px){._purpur-grid__inner--flex_8kjv6_156{--gutter: var(--purpur-spacing-gutter-lg)}}@media screen and (min-width: 1440px){._purpur-grid__inner--flex_8kjv6_156{--gutter: var(--purpur-spacing-gutter-xl)}}
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "@purpurds/grid",
3
- "version": "5.24.0",
3
+ "version": "5.24.2",
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": "5.24.0"
18
+ "@purpurds/tokens": "5.24.2"
19
19
  },
20
20
  "devDependencies": {
21
21
  "@rushstack/eslint-patch": "~1.10.0",
@@ -42,7 +42,7 @@
42
42
  "vite": "5.4.8",
43
43
  "vitest": "^2.1.2",
44
44
  "@purpurds/component-rig": "1.0.0",
45
- "@purpurds/link": "5.24.0"
45
+ "@purpurds/link": "5.24.2"
46
46
  },
47
47
  "scripts": {
48
48
  "build:dev": "vite",
package/src/grid.module.scss CHANGED
@@ -5,39 +5,48 @@
5
5
  width: 100%;
6
6
  max-width: var(--purpur-breakpoint-xl);
7
7
  margin: 0 auto;
8
+ padding: 0 var(--padding);
9
+ --padding: var(--purpur-spacing-page-padding-sm);
10
+
11
+ @media screen and (min-width: $purpur-breakpoint-md) {
12
+ --padding: var(--purpur-spacing-page-padding-md);
13
+ }
14
+
15
+ @media screen and (min-width: $purpur-breakpoint-lg) {
16
+ --padding: var(--purpur-spacing-page-padding-lg);
17
+ }
18
+
19
+ @media screen and (min-width: $purpur-breakpoint-xl) {
20
+ --padding: var(--purpur-spacing-page-padding-xl);
21
+ }
22
+
23
+ .purpur-grid {
24
+ padding: 0;
25
+ }
8
26
 
9
27
  &__inner {
10
28
  $inner: &;
11
29
 
12
30
  --gap: var(--purpur-spacing-gutter-sm);
13
- --padding: var(--purpur-spacing-page-padding-sm);
14
31
 
15
32
  row-gap: var(--gap);
16
- padding: 0 var(--padding);
33
+ padding: 0;
17
34
 
18
35
  &--no-gap,
19
36
  &--no-row-gap {
20
37
  row-gap: 0;
21
38
  }
22
39
 
23
- /* Remove padding for nested grids */
24
- #{$inner} {
25
- padding: 0;
26
- }
27
-
28
40
  @media screen and (min-width: $purpur-breakpoint-md) {
29
41
  --gap: var(--purpur-spacing-gutter-md);
30
- --padding: var(--purpur-spacing-page-padding-md);
31
42
  }
32
43
 
33
44
  @media screen and (min-width: $purpur-breakpoint-lg) {
34
45
  --gap: var(--purpur-spacing-gutter-lg);
35
- --padding: var(--purpur-spacing-page-padding-lg);
36
46
  }
37
47
 
38
48
  @media screen and (min-width: $purpur-breakpoint-xl) {
39
49
  --gap: var(--purpur-spacing-gutter-xl);
40
- --padding: var(--purpur-spacing-page-padding-xl);
41
50
  }
42
51
 
43
52
  &--grid {
@@ -100,4 +109,4 @@
100
109
  }
101
110
  }
102
111
  }
103
- }
112
+ }