@ndla/primitives 0.0.20 → 0.0.22

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 (9) hide show
  1. package/dist/panda.buildinfo.json +3 -1
  2. package/dist/styles.css +11 -3
  3. package/es/FramedContent.js +1 -0
  4. package/es/Hero.js +1 -1
  5. package/es/Toast.js +7 -0
  6. package/lib/FramedContent.js +1 -0
  7. package/lib/Hero.js +1 -1
  8. package/lib/Toast.js +7 -0
  9. package/package.json +2 -2
package/dist/panda.buildinfo.json CHANGED
@@ -327,7 +327,7 @@
327
327
  "backgroundColor]___[value:surface.brand.2.subtle",
328
328
  "height]___[value:350px",
329
329
  "zIndex]___[value:hide",
330
- "clipPath]___[value:polygon(0 0, 100% 0, 100% 65%, 0 100%)",
330
+ "clipPath]___[value:polygon(0 0, 100% 0, 100% calc(100% - 5vw), 0 100%)",
331
331
  "position]___[value:absolute",
332
332
  "background]___[value:primary",
333
333
  "background]___[value:blue.800",
@@ -568,6 +568,7 @@
568
568
  "textStyle]___[value:heading.medium",
569
569
  "boxShadow]___[value:medium",
570
570
  "minWidth]___[value:20rem",
571
+ "maxWidth]___[value:30rem",
571
572
  "height]___[value:var(--height)",
572
573
  "opacity]___[value:var(--opacity)",
573
574
  "overflowWrap]___[value:anywhere",
@@ -578,6 +579,7 @@
578
579
  "zIndex]___[value:var(--z-index)",
579
580
  "transitionDuration]___[value:slow",
580
581
  "transitionProperty]___[value:translate, scale, opacity, height",
582
+ "paddingInlineEnd]___[value:xxlarge",
581
583
  "top]___[value:xxsmall",
582
584
  "right]___[value:xxsmall",
583
585
  "paddingInline]___[value:xxsmall",
package/dist/styles.css CHANGED
@@ -552,9 +552,9 @@
552
552
  z-index: var(--z-index-hide);
553
553
  }
554
554
 
555
- .cp-path_polygon\(0_0\,_100\%_0\,_100\%_65\%\,_0_100\%\) {
556
- clip-path: polygon(0 0, 100% 0, 100% 65%, 0 100%);
557
- -webkit-clip-path: polygon(0 0, 100% 0, 100% 65%, 0 100%);
555
+ .cp-path_polygon\(0_0\,_100\%_0\,_100\%_calc\(100\%_-_5vw\)\,_0_100\%\) {
556
+ clip-path: polygon(0 0, 100% 0, 100% calc(100% - 5vw), 0 100%);
557
+ -webkit-clip-path: polygon(0 0, 100% 0, 100% calc(100% - 5vw), 0 100%);
558
558
  }
559
559
 
560
560
  .pos_absolute {
@@ -833,6 +833,10 @@
833
833
  min-width: 20rem;
834
834
  }
835
835
 
836
+ .max-w_30rem {
837
+ max-width: 30rem;
838
+ }
839
+
836
840
  .h_var\(--height\) {
837
841
  height: var(--height);
838
842
  }
@@ -865,6 +869,10 @@
865
869
  z-index: var(--z-index);
866
870
  }
867
871
 
872
+ .pe_xxlarge {
873
+ padding-inline-end: var(--spacing-xxlarge);
874
+ }
875
+
868
876
  .px_xxsmall {
869
877
  padding-inline: var(--spacing-xxsmall);
870
878
  }
package/es/FramedContent.js CHANGED
@@ -47,6 +47,7 @@ export const FramedContent = /*#__PURE__*/forwardRef((_ref, ref) => {
47
47
  ...props
48
48
  } = _ref;
49
49
  return /*#__PURE__*/_jsx(StyledFramedContent, {
50
+ "data-embed-type": "framed-content",
50
51
  css: css.raw(framedContentRecipe.raw({
51
52
  colorTheme
52
53
  }), cssProp),
package/es/Hero.js CHANGED
@@ -22,7 +22,7 @@ const heroRecipe = sva({
22
22
  width: "100%",
23
23
  zIndex: "hide",
24
24
  overflow: "hidden",
25
- clipPath: "polygon(0 0, 100% 0, 100% 65%, 0 100%)"
25
+ clipPath: "polygon(0 0, 100% 0, 100% calc(100% - 5vw), 0 100%)"
26
26
  },
27
27
  content: {
28
28
  display: "flex",
package/es/Toast.js CHANGED
@@ -21,6 +21,7 @@ const toastRecipe = sva({
21
21
  borderRadius: "xsmall",
22
22
  boxShadow: "medium",
23
23
  minWidth: "20rem",
24
+ maxWidth: "30rem",
24
25
  height: "var(--height)",
25
26
  opacity: "var(--opacity)",
26
27
  overflowWrap: "anywhere",
@@ -33,10 +34,16 @@ const toastRecipe = sva({
33
34
  transitionProperty: "translate, scale, opacity, height",
34
35
  transitionTimingFunction: "default"
35
36
  },
37
+ title: {
38
+ paddingInlineEnd: "xxlarge"
39
+ },
36
40
  closeTrigger: {
37
41
  position: "absolute",
38
42
  top: "xxsmall",
39
43
  right: "xxsmall"
44
+ },
45
+ description: {
46
+ paddingInlineEnd: "xxlarge"
40
47
  }
41
48
  }
42
49
  });
package/lib/FramedContent.js CHANGED
@@ -53,6 +53,7 @@ const FramedContent = exports.FramedContent = /*#__PURE__*/(0, _react.forwardRef
53
53
  ...props
54
54
  } = _ref;
55
55
  return /*#__PURE__*/(0, _jsxRuntime.jsx)(StyledFramedContent, {
56
+ "data-embed-type": "framed-content",
56
57
  css: _css.css.raw(framedContentRecipe.raw({
57
58
  colorTheme
58
59
  }), cssProp),
package/lib/Hero.js CHANGED
@@ -28,7 +28,7 @@ const heroRecipe = (0, _css.sva)({
28
28
  width: "100%",
29
29
  zIndex: "hide",
30
30
  overflow: "hidden",
31
- clipPath: "polygon(0 0, 100% 0, 100% 65%, 0 100%)"
31
+ clipPath: "polygon(0 0, 100% 0, 100% calc(100% - 5vw), 0 100%)"
32
32
  },
33
33
  content: {
34
34
  display: "flex",
package/lib/Toast.js CHANGED
@@ -27,6 +27,7 @@ const toastRecipe = (0, _css.sva)({
27
27
  borderRadius: "xsmall",
28
28
  boxShadow: "medium",
29
29
  minWidth: "20rem",
30
+ maxWidth: "30rem",
30
31
  height: "var(--height)",
31
32
  opacity: "var(--opacity)",
32
33
  overflowWrap: "anywhere",
@@ -39,10 +40,16 @@ const toastRecipe = (0, _css.sva)({
39
40
  transitionProperty: "translate, scale, opacity, height",
40
41
  transitionTimingFunction: "default"
41
42
  },
43
+ title: {
44
+ paddingInlineEnd: "xxlarge"
45
+ },
42
46
  closeTrigger: {
43
47
  position: "absolute",
44
48
  top: "xxsmall",
45
49
  right: "xxsmall"
50
+ },
51
+ description: {
52
+ paddingInlineEnd: "xxlarge"
46
53
  }
47
54
  }
48
55
  });
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "@ndla/primitives",
3
- "version": "0.0.20",
3
+ "version": "0.0.22",
4
4
  "description": "Primitive components for NDLA.",
5
5
  "license": "GPL-3.0",
6
6
  "main": "lib/index.js",
@@ -43,5 +43,5 @@
43
43
  "publishConfig": {
44
44
  "access": "public"
45
45
  },
46
- "gitHead": "557f718324916e39e3b04d6a7196679d31056e00"
46
+ "gitHead": "cbe8d6b48a44da4dd99d66bd5cda517622da2859"
47
47
  }