@ndla/ui 56.0.165-alpha.0 → 56.0.166-alpha.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/es/Grid/Grid.mjs +1 -1
- package/es/Grid/Grid.mjs.map +1 -1
- package/lib/Grid/Grid.js +1 -1
- package/lib/Grid/Grid.js.map +1 -1
- package/package.json +2 -2
- package/src/Grid/Grid.tsx +1 -1
package/es/Grid/Grid.mjs
CHANGED
|
@@ -62,7 +62,7 @@ const Grid = ({ columns, border, children, ...rest }) => {
|
|
|
62
62
|
};
|
|
63
63
|
const GridItem = ({ border, children, ...rest }) => {
|
|
64
64
|
return /* @__PURE__ */ jsx(StyledGridItem, {
|
|
65
|
-
"data-embed-type": "grid-
|
|
65
|
+
"data-embed-type": "grid-cell",
|
|
66
66
|
border,
|
|
67
67
|
...rest,
|
|
68
68
|
children
|
package/es/Grid/Grid.mjs.map
CHANGED
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"Grid.mjs","names":[],"sources":["../../src/Grid/Grid.tsx"],"sourcesContent":["/**\n * Copyright (c) 2023-present, NDLA.\n *\n * This source code is licensed under the GPLv3 license found in the\n * LICENSE file in the root directory of this source tree.\n *\n */\n\nimport { type ComponentProps, type ReactNode } from \"react\";\nimport { styled } from \"@ndla/styled-system/jsx\";\nimport type { StyledVariantProps } from \"@ndla/styled-system/types\";\n\nconst GridContainer = styled(\"div\", {\n base: {\n display: \"grid\",\n justifyContent: \"center\",\n borderRadius: \"xsmall\",\n gridRowGap: \"large\",\n gridColumnGap: \"medium\",\n width: \"100%\",\n minWidth: \"surface.xxsmall\",\n gridTemplateColumns: \"repeat(2, minmax(0, 1fr))\",\n\n \"& div[data-embed-type='pitch']\": {\n height: \"100%\",\n \"& > :last-child\": {\n marginTop: \"auto\",\n },\n },\n tabletDown: {\n gridTemplateColumns: \"repeat(1, minmax(0, 1fr))\",\n },\n tabletToDesktop: {\n gridTemplateColumns: \"repeat(2, minmax(0, 1fr))\",\n \"& > div:nth-child(3):last-child\": {\n display: \"flex\",\n flexFlow: \"column\",\n justifyContent: \"center\",\n alignItems: \"center\",\n gridColumn: \"span 2\",\n },\n },\n },\n variants: {\n columns: {\n \"2\": {},\n \"2x2\": {},\n \"3\": { desktop: { gridTemplateColumns: \"repeat(3, minmax(0, 1fr))\" } },\n \"4\": { desktop: { gridTemplateColumns: \"repeat(4, minmax(0, 1fr))\" } },\n },\n border: {\n lightBlue: {\n padding: \"xsmall\",\n border: \"1px solid\",\n borderColor: \"surface.brand.2\",\n },\n },\n },\n});\n\nconst StyledGridItem = styled(\"div\", {\n base: {},\n variants: {\n border: {\n true: {\n outline: \"1px solid\",\n borderColor: \"stroke.default\",\n },\n },\n },\n});\n\ntype GridVariantProps = NonNullable<StyledVariantProps<typeof GridContainer>>;\n\nexport interface GridProps extends ComponentProps<\"div\">, GridVariantProps {\n children?: ReactNode[];\n columns: NonNullable<GridVariantProps[\"columns\"]>;\n}\n\ntype GridItemVariantProps = NonNullable<StyledVariantProps<typeof StyledGridItem>>;\n\nexport interface GridItemProps extends ComponentProps<\"div\">, GridItemVariantProps {}\n\nexport const Grid = ({ columns, border, children, ...rest }: GridProps) => {\n const amountOfColumns = children?.length === 3 ? \"3\" : columns;\n\n return (\n <GridContainer data-embed-type=\"grid\" border={border} columns={amountOfColumns} {...rest}>\n {children}\n </GridContainer>\n );\n};\n\nexport const GridItem = ({ border, children, ...rest }: GridItemProps) => {\n return (\n <StyledGridItem data-embed-type=\"grid-
|
|
1
|
+
{"version":3,"file":"Grid.mjs","names":[],"sources":["../../src/Grid/Grid.tsx"],"sourcesContent":["/**\n * Copyright (c) 2023-present, NDLA.\n *\n * This source code is licensed under the GPLv3 license found in the\n * LICENSE file in the root directory of this source tree.\n *\n */\n\nimport { type ComponentProps, type ReactNode } from \"react\";\nimport { styled } from \"@ndla/styled-system/jsx\";\nimport type { StyledVariantProps } from \"@ndla/styled-system/types\";\n\nconst GridContainer = styled(\"div\", {\n base: {\n display: \"grid\",\n justifyContent: \"center\",\n borderRadius: \"xsmall\",\n gridRowGap: \"large\",\n gridColumnGap: \"medium\",\n width: \"100%\",\n minWidth: \"surface.xxsmall\",\n gridTemplateColumns: \"repeat(2, minmax(0, 1fr))\",\n\n \"& div[data-embed-type='pitch']\": {\n height: \"100%\",\n \"& > :last-child\": {\n marginTop: \"auto\",\n },\n },\n tabletDown: {\n gridTemplateColumns: \"repeat(1, minmax(0, 1fr))\",\n },\n tabletToDesktop: {\n gridTemplateColumns: \"repeat(2, minmax(0, 1fr))\",\n \"& > div:nth-child(3):last-child\": {\n display: \"flex\",\n flexFlow: \"column\",\n justifyContent: \"center\",\n alignItems: \"center\",\n gridColumn: \"span 2\",\n },\n },\n },\n variants: {\n columns: {\n \"2\": {},\n \"2x2\": {},\n \"3\": { desktop: { gridTemplateColumns: \"repeat(3, minmax(0, 1fr))\" } },\n \"4\": { desktop: { gridTemplateColumns: \"repeat(4, minmax(0, 1fr))\" } },\n },\n border: {\n lightBlue: {\n padding: \"xsmall\",\n border: \"1px solid\",\n borderColor: \"surface.brand.2\",\n },\n },\n },\n});\n\nconst StyledGridItem = styled(\"div\", {\n base: {},\n variants: {\n border: {\n true: {\n outline: \"1px solid\",\n borderColor: \"stroke.default\",\n },\n },\n },\n});\n\ntype GridVariantProps = NonNullable<StyledVariantProps<typeof GridContainer>>;\n\nexport interface GridProps extends ComponentProps<\"div\">, GridVariantProps {\n children?: ReactNode[];\n columns: NonNullable<GridVariantProps[\"columns\"]>;\n}\n\ntype GridItemVariantProps = NonNullable<StyledVariantProps<typeof StyledGridItem>>;\n\nexport interface GridItemProps extends ComponentProps<\"div\">, GridItemVariantProps {}\n\nexport const Grid = ({ columns, border, children, ...rest }: GridProps) => {\n const amountOfColumns = children?.length === 3 ? \"3\" : columns;\n\n return (\n <GridContainer data-embed-type=\"grid\" border={border} columns={amountOfColumns} {...rest}>\n {children}\n </GridContainer>\n );\n};\n\nexport const GridItem = ({ border, children, ...rest }: GridItemProps) => {\n return (\n <StyledGridItem data-embed-type=\"grid-cell\" border={border} {...rest}>\n {children}\n </StyledGridItem>\n );\n};\n"],"mappings":";;;;;AAYA,MAAM,gBAAgB,OAAO,OAAO;CAClC,MAAM;EACJ,SAAS;EACT,gBAAgB;EAChB,cAAc;EACd,YAAY;EACZ,eAAe;EACf,OAAO;EACP,UAAU;EACV,qBAAqB;EAErB,kCAAkC;GAChC,QAAQ;GACR,mBAAmB,EACjB,WAAW,QACZ;GACF;EACD,YAAY,EACV,qBAAqB,6BACtB;EACD,iBAAiB;GACf,qBAAqB;GACrB,mCAAmC;IACjC,SAAS;IACT,UAAU;IACV,gBAAgB;IAChB,YAAY;IACZ,YAAY;IACb;GACF;EACF;CACD,UAAU;EACR,SAAS;GACP,KAAK,EAAE;GACP,OAAO,EAAE;GACT,KAAK,EAAE,SAAS,EAAE,qBAAqB,6BAA6B,EAAE;GACtE,KAAK,EAAE,SAAS,EAAE,qBAAqB,6BAA6B,EAAE;GACvE;EACD,QAAQ,EACN,WAAW;GACT,SAAS;GACT,QAAQ;GACR,aAAa;GACd,EACF;EACF;CACF,CAAC;AAEF,MAAM,iBAAiB,OAAO,OAAO;CACnC,MAAM,EAAE;CACR,UAAU,EACR,QAAQ,EACN,MAAM;EACJ,SAAS;EACT,aAAa;EACd,EACF,EACF;CACF,CAAC;AAaF,MAAa,QAAQ,EAAE,SAAS,QAAQ,UAAU,GAAG,WAAsB;CACzE,MAAM,kBAAkB,UAAU,WAAW,IAAI,MAAM;AAEvD,QACE,oBAAC;EAAc,mBAAgB;EAAe;EAAQ,SAAS;EAAiB,GAAI;EACjF;GACa;;AAIpB,MAAa,YAAY,EAAE,QAAQ,UAAU,GAAG,WAA0B;AACxE,QACE,oBAAC;EAAe,mBAAgB;EAAoB;EAAQ,GAAI;EAC7D;GACc"}
|
package/lib/Grid/Grid.js
CHANGED
|
@@ -70,7 +70,7 @@ const Grid = ({ columns, border, children, ...rest }) => {
|
|
|
70
70
|
};
|
|
71
71
|
const GridItem = ({ border, children, ...rest }) => {
|
|
72
72
|
return /* @__PURE__ */ (0, react_jsx_runtime.jsx)(StyledGridItem, {
|
|
73
|
-
"data-embed-type": "grid-
|
|
73
|
+
"data-embed-type": "grid-cell",
|
|
74
74
|
border,
|
|
75
75
|
...rest,
|
|
76
76
|
children
|
package/lib/Grid/Grid.js.map
CHANGED
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"Grid.js","names":[],"sources":["../../src/Grid/Grid.tsx"],"sourcesContent":["/**\n * Copyright (c) 2023-present, NDLA.\n *\n * This source code is licensed under the GPLv3 license found in the\n * LICENSE file in the root directory of this source tree.\n *\n */\n\nimport { type ComponentProps, type ReactNode } from \"react\";\nimport { styled } from \"@ndla/styled-system/jsx\";\nimport type { StyledVariantProps } from \"@ndla/styled-system/types\";\n\nconst GridContainer = styled(\"div\", {\n base: {\n display: \"grid\",\n justifyContent: \"center\",\n borderRadius: \"xsmall\",\n gridRowGap: \"large\",\n gridColumnGap: \"medium\",\n width: \"100%\",\n minWidth: \"surface.xxsmall\",\n gridTemplateColumns: \"repeat(2, minmax(0, 1fr))\",\n\n \"& div[data-embed-type='pitch']\": {\n height: \"100%\",\n \"& > :last-child\": {\n marginTop: \"auto\",\n },\n },\n tabletDown: {\n gridTemplateColumns: \"repeat(1, minmax(0, 1fr))\",\n },\n tabletToDesktop: {\n gridTemplateColumns: \"repeat(2, minmax(0, 1fr))\",\n \"& > div:nth-child(3):last-child\": {\n display: \"flex\",\n flexFlow: \"column\",\n justifyContent: \"center\",\n alignItems: \"center\",\n gridColumn: \"span 2\",\n },\n },\n },\n variants: {\n columns: {\n \"2\": {},\n \"2x2\": {},\n \"3\": { desktop: { gridTemplateColumns: \"repeat(3, minmax(0, 1fr))\" } },\n \"4\": { desktop: { gridTemplateColumns: \"repeat(4, minmax(0, 1fr))\" } },\n },\n border: {\n lightBlue: {\n padding: \"xsmall\",\n border: \"1px solid\",\n borderColor: \"surface.brand.2\",\n },\n },\n },\n});\n\nconst StyledGridItem = styled(\"div\", {\n base: {},\n variants: {\n border: {\n true: {\n outline: \"1px solid\",\n borderColor: \"stroke.default\",\n },\n },\n },\n});\n\ntype GridVariantProps = NonNullable<StyledVariantProps<typeof GridContainer>>;\n\nexport interface GridProps extends ComponentProps<\"div\">, GridVariantProps {\n children?: ReactNode[];\n columns: NonNullable<GridVariantProps[\"columns\"]>;\n}\n\ntype GridItemVariantProps = NonNullable<StyledVariantProps<typeof StyledGridItem>>;\n\nexport interface GridItemProps extends ComponentProps<\"div\">, GridItemVariantProps {}\n\nexport const Grid = ({ columns, border, children, ...rest }: GridProps) => {\n const amountOfColumns = children?.length === 3 ? \"3\" : columns;\n\n return (\n <GridContainer data-embed-type=\"grid\" border={border} columns={amountOfColumns} {...rest}>\n {children}\n </GridContainer>\n );\n};\n\nexport const GridItem = ({ border, children, ...rest }: GridItemProps) => {\n return (\n <StyledGridItem data-embed-type=\"grid-
|
|
1
|
+
{"version":3,"file":"Grid.js","names":[],"sources":["../../src/Grid/Grid.tsx"],"sourcesContent":["/**\n * Copyright (c) 2023-present, NDLA.\n *\n * This source code is licensed under the GPLv3 license found in the\n * LICENSE file in the root directory of this source tree.\n *\n */\n\nimport { type ComponentProps, type ReactNode } from \"react\";\nimport { styled } from \"@ndla/styled-system/jsx\";\nimport type { StyledVariantProps } from \"@ndla/styled-system/types\";\n\nconst GridContainer = styled(\"div\", {\n base: {\n display: \"grid\",\n justifyContent: \"center\",\n borderRadius: \"xsmall\",\n gridRowGap: \"large\",\n gridColumnGap: \"medium\",\n width: \"100%\",\n minWidth: \"surface.xxsmall\",\n gridTemplateColumns: \"repeat(2, minmax(0, 1fr))\",\n\n \"& div[data-embed-type='pitch']\": {\n height: \"100%\",\n \"& > :last-child\": {\n marginTop: \"auto\",\n },\n },\n tabletDown: {\n gridTemplateColumns: \"repeat(1, minmax(0, 1fr))\",\n },\n tabletToDesktop: {\n gridTemplateColumns: \"repeat(2, minmax(0, 1fr))\",\n \"& > div:nth-child(3):last-child\": {\n display: \"flex\",\n flexFlow: \"column\",\n justifyContent: \"center\",\n alignItems: \"center\",\n gridColumn: \"span 2\",\n },\n },\n },\n variants: {\n columns: {\n \"2\": {},\n \"2x2\": {},\n \"3\": { desktop: { gridTemplateColumns: \"repeat(3, minmax(0, 1fr))\" } },\n \"4\": { desktop: { gridTemplateColumns: \"repeat(4, minmax(0, 1fr))\" } },\n },\n border: {\n lightBlue: {\n padding: \"xsmall\",\n border: \"1px solid\",\n borderColor: \"surface.brand.2\",\n },\n },\n },\n});\n\nconst StyledGridItem = styled(\"div\", {\n base: {},\n variants: {\n border: {\n true: {\n outline: \"1px solid\",\n borderColor: \"stroke.default\",\n },\n },\n },\n});\n\ntype GridVariantProps = NonNullable<StyledVariantProps<typeof GridContainer>>;\n\nexport interface GridProps extends ComponentProps<\"div\">, GridVariantProps {\n children?: ReactNode[];\n columns: NonNullable<GridVariantProps[\"columns\"]>;\n}\n\ntype GridItemVariantProps = NonNullable<StyledVariantProps<typeof StyledGridItem>>;\n\nexport interface GridItemProps extends ComponentProps<\"div\">, GridItemVariantProps {}\n\nexport const Grid = ({ columns, border, children, ...rest }: GridProps) => {\n const amountOfColumns = children?.length === 3 ? \"3\" : columns;\n\n return (\n <GridContainer data-embed-type=\"grid\" border={border} columns={amountOfColumns} {...rest}>\n {children}\n </GridContainer>\n );\n};\n\nexport const GridItem = ({ border, children, ...rest }: GridItemProps) => {\n return (\n <StyledGridItem data-embed-type=\"grid-cell\" border={border} {...rest}>\n {children}\n </StyledGridItem>\n );\n};\n"],"mappings":";;;;;;;;;;;;;AAYA,MAAM,qDAAuB,OAAO;CAClC,MAAM;EACJ,SAAS;EACT,gBAAgB;EAChB,cAAc;EACd,YAAY;EACZ,eAAe;EACf,OAAO;EACP,UAAU;EACV,qBAAqB;EAErB,kCAAkC;GAChC,QAAQ;GACR,mBAAmB,EACjB,WAAW,QACZ;GACF;EACD,YAAY,EACV,qBAAqB,6BACtB;EACD,iBAAiB;GACf,qBAAqB;GACrB,mCAAmC;IACjC,SAAS;IACT,UAAU;IACV,gBAAgB;IAChB,YAAY;IACZ,YAAY;IACb;GACF;EACF;CACD,UAAU;EACR,SAAS;GACP,KAAK,EAAE;GACP,OAAO,EAAE;GACT,KAAK,EAAE,SAAS,EAAE,qBAAqB,6BAA6B,EAAE;GACtE,KAAK,EAAE,SAAS,EAAE,qBAAqB,6BAA6B,EAAE;GACvE;EACD,QAAQ,EACN,WAAW;GACT,SAAS;GACT,QAAQ;GACR,aAAa;GACd,EACF;EACF;CACF,CAAC;AAEF,MAAM,sDAAwB,OAAO;CACnC,MAAM,EAAE;CACR,UAAU,EACR,QAAQ,EACN,MAAM;EACJ,SAAS;EACT,aAAa;EACd,EACF,EACF;CACF,CAAC;AAaF,MAAa,QAAQ,EAAE,SAAS,QAAQ,UAAU,GAAG,WAAsB;CACzE,MAAM,kBAAkB,UAAU,WAAW,IAAI,MAAM;AAEvD,QACE,2CAAC;EAAc,mBAAgB;EAAe;EAAQ,SAAS;EAAiB,GAAI;EACjF;GACa;;AAIpB,MAAa,YAAY,EAAE,QAAQ,UAAU,GAAG,WAA0B;AACxE,QACE,2CAAC;EAAe,mBAAgB;EAAoB;EAAQ,GAAI;EAC7D;GACc"}
|
package/package.json
CHANGED
|
@@ -1,7 +1,7 @@
|
|
|
1
1
|
{
|
|
2
2
|
"name": "@ndla/ui",
|
|
3
3
|
"type": "module",
|
|
4
|
-
"version": "56.0.
|
|
4
|
+
"version": "56.0.166-alpha.0",
|
|
5
5
|
"description": "UI component library for NDLA",
|
|
6
6
|
"license": "GPL-3.0",
|
|
7
7
|
"exports": {
|
|
@@ -62,5 +62,5 @@
|
|
|
62
62
|
"publishConfig": {
|
|
63
63
|
"access": "public"
|
|
64
64
|
},
|
|
65
|
-
"gitHead": "
|
|
65
|
+
"gitHead": "9ed9437ecea8f7f194485c631650de20b50cb23b"
|
|
66
66
|
}
|
package/src/Grid/Grid.tsx
CHANGED
|
@@ -93,7 +93,7 @@ export const Grid = ({ columns, border, children, ...rest }: GridProps) => {
|
|
|
93
93
|
|
|
94
94
|
export const GridItem = ({ border, children, ...rest }: GridItemProps) => {
|
|
95
95
|
return (
|
|
96
|
-
<StyledGridItem data-embed-type="grid-
|
|
96
|
+
<StyledGridItem data-embed-type="grid-cell" border={border} {...rest}>
|
|
97
97
|
{children}
|
|
98
98
|
</StyledGridItem>
|
|
99
99
|
);
|