@kickstartds/ds-agency-premium 1.6.61--canary.40.1509.0 → 1.6.61

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 (31) hide show
  1. package/dist/BlogOverviewProps-9f207f1c.d.ts +1 -1
  2. package/dist/BlogPostProps-6b3cff22.d.ts +1 -1
  3. package/dist/{CtaProps-fd5e75dc.d.ts → CtaProps-93230a76.d.ts} +8 -13
  4. package/dist/SectionProps-1cfcf6e8.d.ts +2 -2
  5. package/dist/{SliderProps-fd5e75dc.d.ts → SliderProps-93230a76.d.ts} +1 -1
  6. package/dist/components/blog-overview/blog-overview.schema.dereffed.json +24 -57
  7. package/dist/components/blog-post/blog-post.schema.dereffed.json +24 -57
  8. package/dist/components/cta/cta.css +59 -36
  9. package/dist/components/cta/cta.schema.dereffed.json +8 -19
  10. package/dist/components/cta/cta.schema.json +8 -15
  11. package/dist/components/cta/index.d.ts +1 -1
  12. package/dist/components/cta/index.js +6 -4
  13. package/dist/components/footer/footer.css +1 -1
  14. package/dist/components/header/header.css +1 -1
  15. package/dist/components/hero/hero.css +5 -3
  16. package/dist/components/image-story/image-story.css +2 -5
  17. package/dist/components/mosaic/mosaic.css +1 -1
  18. package/dist/components/page/page.schema.dereffed.json +16 -38
  19. package/dist/components/page-wrapper/tokens.css +1 -1
  20. package/dist/components/presets.json +50 -56
  21. package/dist/components/section/section.css +2 -2
  22. package/dist/components/section/section.schema.dereffed.json +16 -38
  23. package/dist/components/slider/index.d.ts +1 -1
  24. package/dist/components/slider/slider.schema.dereffed.json +8 -19
  25. package/dist/components/split/split.css +2 -2
  26. package/dist/components/testimonials/index.d.ts +1 -1
  27. package/dist/global.css +2 -3
  28. package/dist/tokens/themes.css +4 -4
  29. package/dist/tokens/tokens.css +1 -1
  30. package/dist/tokens/tokens.js +1 -1
  31. package/package.json +1 -1
@@ -36,6 +36,12 @@
36
36
  "default": false,
37
37
  "type": "boolean"
38
38
  },
39
+ "fullWidth": {
40
+ "title": "Width",
41
+ "description": "Set the width of the content to the full width of the element",
42
+ "type": "boolean",
43
+ "default": false
44
+ },
39
45
  "buttons": {
40
46
  "type": "array",
41
47
  "items": {
@@ -81,13 +87,6 @@
81
87
  "title": "Alt text",
82
88
  "description": "Image description",
83
89
  "type": "string"
84
- },
85
- "align": {
86
- "title": "Vertical alignment of the image",
87
- "description": "Select a vertical alignment for the image",
88
- "type": "string",
89
- "enum": ["center", "top", "bottom"],
90
- "default": "center"
91
90
  }
92
91
  },
93
92
  "additionalProperties": false
@@ -119,18 +118,12 @@
119
118
  "type": "string",
120
119
  "default": "left"
121
120
  },
122
- "align": {
121
+ "contentAlign": {
123
122
  "title": "Vertical alignment of the content",
124
- "description": "Select a vertical alignment for the content",
123
+ "description": "Select a vertical alignment for the image",
125
124
  "type": "string",
126
125
  "enum": ["center", "top", "bottom"],
127
126
  "default": "center"
128
- },
129
- "padding": {
130
- "title": "Padding",
131
- "description": "Toggle padding of the content",
132
- "type": "boolean",
133
- "default": false
134
127
  }
135
128
  },
136
129
  "additionalProperties": false
@@ -1,6 +1,6 @@
1
1
  /// <reference types="react" />
2
2
  import { HTMLAttributes } from "react";
3
- import { CtaProps } from "../../CtaProps-fd5e75dc.js";
3
+ import { CtaProps } from "../../CtaProps-93230a76.js";
4
4
  declare const CtaContextDefault: import("react").ForwardRefExoticComponent<CtaProps & HTMLAttributes<HTMLDivElement> & import("react").RefAttributes<HTMLDivElement>>;
5
5
  declare const CtaContext: import("react").Context<import("react").ForwardRefExoticComponent<CtaProps & HTMLAttributes<HTMLDivElement> & import("react").RefAttributes<HTMLDivElement>>>;
6
6
  declare const Cta: import("react").ForwardRefExoticComponent<CtaProps & HTMLAttributes<HTMLDivElement> & import("react").RefAttributes<HTMLDivElement>>;
@@ -7,20 +7,22 @@ import classnames from 'classnames';
7
7
  import { useButtonGroup } from '../button-group/index.js';
8
8
  import '@kickstartds/base/lib/button-group';
9
9
 
10
- const CtaContextDefault = forwardRef(({ headline, highlightText = false, sub, image, text, textAlign, backgroundImage, backgroundColor, colorNeutral, align, padding, order, buttons = [], ...rest }, ref) => {
10
+ const CtaContextDefault = forwardRef(({ headline, highlightText = false, sub, image, text, textAlign, backgroundImage, backgroundColor, colorNeutral, contentAlign, order, fullWidth = false, buttons = [], ...rest }, ref) => {
11
11
  const ButtonGroup = useButtonGroup();
12
12
  return (jsx(ButtonContext.Provider
13
13
  // @ts-expect-error
14
14
  , {
15
15
  // @ts-expect-error
16
- value: ButtonGroup, children: jsx(Storytelling, { ...rest, ref: ref, className: classnames("dsa-cta", highlightText ? `dsa-cta--highlight-text` : "", colorNeutral ? `dsa-cta--color-neutral` : "", image?.padding ? `dsa-cta--image-padding` : "", !padding ? `dsa-cta--no-padding` : "", align && align !== "center" ? `dsa-cta--align-${align}` : ""), backgroundImage: backgroundImage, backgroundColor: backgroundColor, full: true, image: {
16
+ value: ButtonGroup, children: jsx(Storytelling, { ...rest, ref: ref, className: classnames("dsa-cta", fullWidth ? `dsa-cta--full-width` : "", highlightText ? `dsa-cta--highlight-text` : "", colorNeutral ? `dsa-cta--color-neutral` : "", contentAlign && contentAlign !== "center"
17
+ ? `dsa-cta--align-${contentAlign}`
18
+ : ""), backgroundImage: backgroundImage, backgroundColor: backgroundColor, full: image?.padding === false, image: {
17
19
  source: image?.src,
18
20
  order: order,
19
- vAlign: image?.align,
21
+ vAlign: contentAlign,
20
22
  }, box: {
21
23
  text: text,
22
24
  textAlign: textAlign,
23
- vAlign: align,
25
+ vAlign: contentAlign,
24
26
  link: {
25
27
  buttons,
26
28
  colorNeutral: colorNeutral,
@@ -27,7 +27,7 @@
27
27
  background-color: var(--dsa-footer--background-color, var(--ks-background-color-default));
28
28
  }
29
29
  .dsa-footer__content {
30
- padding: var(--l-section--space-small) var(--dsa-content--horizontal-spacing);
30
+ padding: var(--l-section--space-small) var(--dsa-content--spacing);
31
31
  border-top: var(--dsa-footer--border-top, 1px solid var(--ks-border-color-default));
32
32
  max-width: var(--dsa-footer--max-width, var(--dsa-content--width_wide));
33
33
  width: 100%;
@@ -9,7 +9,7 @@
9
9
  [ks-theme],
10
10
  [ks-inverted] {
11
11
  --dsa-header--spacing-vertical: var(--ks-spacing-stack-s);
12
- --dsa-header--spacing-horizontal: var(--dsa-content--horizontal-spacing);
12
+ --dsa-header--spacing-horizontal: var(--dsa-content--spacing);
13
13
  }
14
14
  }
15
15
 
@@ -17,7 +17,6 @@
17
17
  --dsa-hero__textbox--background-color: var(--ks-color-bg-alpha-2);
18
18
  --dsa-hero__textbox--border-radius: var(--ks-border-radius-surface);
19
19
  --dsa-hero__textbox--max-width: var(--dsa-content--width_narrow);
20
- --dsa-hero_below__textbox--max-width: var(--dsa-content--width_default);
21
20
  --dsa-hero__textbox--padding: var(--ks-spacing-inset-squish-xl);
22
21
  --dsa-hero__overlay--background: linear-gradient(0deg, var(--ks-background-color-default) 15%, transparent 50%);
23
22
  }
@@ -115,12 +114,15 @@
115
114
  height: var(--c-visual--min-height);
116
115
  }
117
116
  .c-visual.dsa-hero.dsa-hero--content-below .c-visual__content {
118
- padding: 0 var(--dsa-content--horizontal-spacing);
117
+ padding: 0 var(--dsa-content--spacing);
119
118
  margin-top: -10%;
120
119
  position: relative;
121
120
  }
122
121
  .c-visual.dsa-hero.dsa-hero--content-below .c-visual__content .c-visual__box {
123
- --c-visual_box--max-width: var(--dsa-hero_below__textbox--max-width, var(--dsa-content--width_default));
122
+ --c-visual_box--max-width: var(--dsa-content--width_default);
123
+ }
124
+ .c-visual.dsa-hero.c-visual--no-crop {
125
+ --c-visual--min-height: 0;
124
126
  }
125
127
  @container visual (min-width: 640px) {
126
128
  .c-visual.dsa-hero.dsa-hero--content-below.c-visual--no-crop .c-visual__media .c-visual__image {
@@ -1,6 +1,6 @@
1
1
  .dsa-image-story.c-storytelling {
2
2
  --dsa-image-story--gap: var(--ks-spacing-m);
3
- --dsa-image-story--horizontal-padding: var(--dsa-content--horizontal-spacing);
3
+ --dsa-image-story--horizontal-padding: var(--dsa-content--spacing);
4
4
  --dsa-image-story--vertical-padding: var(--ks-spacing-xl);
5
5
  --dsa-image-story__copy--font: var(--dsa-rich-text--font);
6
6
  --dsa-image-story__copy--color: var(--dsa-rich-text--color);
@@ -8,10 +8,7 @@
8
8
 
9
9
  .c-storytelling.dsa-image-story {
10
10
  gap: var(--c-storytelling--horizontal-padding);
11
- --c-storytelling--horizontal-padding: var(
12
- --dsa-image-story--horizontal-padding,
13
- var(--dsa-content--horizontal-spacing)
14
- );
11
+ --c-storytelling--horizontal-padding: var(--dsa-image-story--horizontal-padding, var(--dsa-content--spacing));
15
12
  --c-storytelling--vertical-padding: var(--dsa-image-story--vertical-padding, var(--ks-spacing-xl));
16
13
  }
17
14
  .c-storytelling.dsa-image-story .c-storytelling__box__content {
@@ -1,6 +1,6 @@
1
1
  .dsa-mosaic {
2
2
  --dsa-mosaic--vertical-padding: var(--l-section--space-default);
3
- --dsa-mosaic--horizontal-padding: var(--dsa-content--horizontal-spacing);
3
+ --dsa-mosaic--horizontal-padding: var(--dsa-content--spacing);
4
4
  --dsa-mosaic__copy--font: var(--dsa-rich-text--font);
5
5
  --dsa-mosaic__copy--color: var(--ks-text-color-default);
6
6
  --dsa-mosaic__headline--color: var(--dsa-headline--color);
@@ -282,6 +282,12 @@
282
282
  "default": false,
283
283
  "type": "boolean"
284
284
  },
285
+ "fullWidth": {
286
+ "title": "Width",
287
+ "description": "Set the width of the content to the full width of the element",
288
+ "type": "boolean",
289
+ "default": false
290
+ },
285
291
  "buttons": {
286
292
  "type": "array",
287
293
  "items": {
@@ -345,17 +351,6 @@
345
351
  "title": "Alt text",
346
352
  "description": "Image description",
347
353
  "type": "string"
348
- },
349
- "align": {
350
- "title": "Vertical alignment of the image",
351
- "description": "Select a vertical alignment for the image",
352
- "type": "string",
353
- "enum": [
354
- "center",
355
- "top",
356
- "bottom"
357
- ],
358
- "default": "center"
359
354
  }
360
355
  },
361
356
  "additionalProperties": false
@@ -390,9 +385,9 @@
390
385
  "type": "string",
391
386
  "default": "left"
392
387
  },
393
- "align": {
388
+ "contentAlign": {
394
389
  "title": "Vertical alignment of the content",
395
- "description": "Select a vertical alignment for the content",
390
+ "description": "Select a vertical alignment for the image",
396
391
  "type": "string",
397
392
  "enum": [
398
393
  "center",
@@ -401,12 +396,6 @@
401
396
  ],
402
397
  "default": "center"
403
398
  },
404
- "padding": {
405
- "title": "Padding",
406
- "description": "Toggle padding of the content",
407
- "type": "boolean",
408
- "default": false
409
- },
410
399
  "type": {
411
400
  "const": "cta"
412
401
  }
@@ -1549,6 +1538,12 @@
1549
1538
  "default": false,
1550
1539
  "type": "boolean"
1551
1540
  },
1541
+ "fullWidth": {
1542
+ "title": "Width",
1543
+ "description": "Set the width of the content to the full width of the element",
1544
+ "type": "boolean",
1545
+ "default": false
1546
+ },
1552
1547
  "buttons": {
1553
1548
  "type": "array",
1554
1549
  "items": {
@@ -1612,17 +1607,6 @@
1612
1607
  "title": "Alt text",
1613
1608
  "description": "Image description",
1614
1609
  "type": "string"
1615
- },
1616
- "align": {
1617
- "title": "Vertical alignment of the image",
1618
- "description": "Select a vertical alignment for the image",
1619
- "type": "string",
1620
- "enum": [
1621
- "center",
1622
- "top",
1623
- "bottom"
1624
- ],
1625
- "default": "center"
1626
1610
  }
1627
1611
  },
1628
1612
  "additionalProperties": false
@@ -1657,9 +1641,9 @@
1657
1641
  "type": "string",
1658
1642
  "default": "left"
1659
1643
  },
1660
- "align": {
1644
+ "contentAlign": {
1661
1645
  "title": "Vertical alignment of the content",
1662
- "description": "Select a vertical alignment for the content",
1646
+ "description": "Select a vertical alignment for the image",
1663
1647
  "type": "string",
1664
1648
  "enum": [
1665
1649
  "center",
@@ -1668,12 +1652,6 @@
1668
1652
  ],
1669
1653
  "default": "center"
1670
1654
  },
1671
- "padding": {
1672
- "title": "Padding",
1673
- "description": "Toggle padding of the content",
1674
- "type": "boolean",
1675
- "default": false
1676
- },
1677
1655
  "type": {
1678
1656
  "const": "cta"
1679
1657
  }
@@ -1,6 +1,6 @@
1
1
  /**
2
2
  * Do not edit directly
3
- * Generated on Fri, 10 Jan 2025 14:46:36 GMT
3
+ * Generated on Mon, 27 Jan 2025 11:31:05 GMT
4
4
  */
5
5
  :root, [ks-theme] {
6
6
  --ks-background-color-accent-base: var(--ks-color-primary-to-bg-8-base);