@kickstartds/ds-agency-premium 1.6.71--canary.50.2257.0 → 1.6.71--canary.50.2259.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.
Files changed (33) hide show
  1. package/dist/{BlogPostProps-d60aba86.d.ts → BlogPostProps-c760fd2a.d.ts} +1 -1
  2. package/dist/{SearchResultProps-a4d09722.d.ts → SearchResultProps-f6f07017.d.ts} +10 -14
  3. package/dist/SectionProps-d60aba86.d.ts +1 -1
  4. package/dist/SplitEvenProps-789f8508.d.ts +1 -1
  5. package/dist/SplitWeightedProps-789f8508.d.ts +1 -1
  6. package/dist/components/blog-aside/index.d.ts +1 -1
  7. package/dist/components/blog-overview/index.d.ts +1 -1
  8. package/dist/components/blog-post/index.d.ts +1 -1
  9. package/dist/components/image-story/index.d.ts +1 -1
  10. package/dist/components/index/index.d.ts +3 -3
  11. package/dist/components/page/index.d.ts +1 -1
  12. package/dist/components/page-wrapper/tokens.css +1 -1
  13. package/dist/components/presets.json +8 -18
  14. package/dist/components/search/index.d.ts +1 -1
  15. package/dist/components/search/search.schema.dereffed.json +13 -14
  16. package/dist/components/search-form/index.js +1 -1
  17. package/dist/components/search-modal/index.js +1 -1
  18. package/dist/components/search-modal/search-modal.css +3 -0
  19. package/dist/components/search-result/index.d.ts +1 -1
  20. package/dist/components/search-result/index.js +5 -7
  21. package/dist/components/search-result/search-result.css +14 -8
  22. package/dist/components/search-result/search-result.schema.dereffed.json +13 -14
  23. package/dist/components/search-result/search-result.schema.json +9 -13
  24. package/dist/components/search-result-match/index.js +1 -2
  25. package/dist/components/search-result-match/search-result-match.css +1 -3
  26. package/dist/tokens/themes.css +4 -4
  27. package/dist/tokens/tokens.css +1 -1
  28. package/dist/tokens/tokens.js +1 -1
  29. package/package.json +1 -1
  30. /package/dist/{BlogAsideProps-fb0241df.d.ts → BlogAsideProps-c760fd2a.d.ts} +0 -0
  31. /package/dist/{BlogOverviewProps-d60aba86.d.ts → BlogOverviewProps-9f207f1c.d.ts} +0 -0
  32. /package/dist/{ImageStoryProps-4e2b2ecf.d.ts → ImageStoryProps-e853e1e7.d.ts} +0 -0
  33. /package/dist/{PageProps-d60aba86.d.ts → PageProps-aa29c554.d.ts} +0 -0
@@ -4,7 +4,7 @@
4
4
  * and run json-schema-to-typescript to regenerate this file.
5
5
  */
6
6
  import { BlogHeadProps } from "./BlogHeadProps-c04a5ed8.js";
7
- import { BlogAsideProps } from "./BlogAsideProps-fb0241df.js";
7
+ import { BlogAsideProps } from "./BlogAsideProps-c760fd2a.js";
8
8
  import { SectionProps } from "./SectionProps-d60aba86.js";
9
9
  import { CtaProps } from "./CtaProps-789f8508.js";
10
10
  import { SeoProps } from "./SeoProps-f2d6dcaa.js";
@@ -12,6 +12,14 @@ type URL = string;
12
12
  * The title of the search result.
13
13
  */
14
14
  type Title = string;
15
+ /**
16
+ * The reserved space of the image row.
17
+ */
18
+ type ImageRowSize = "none" | "small" | "large";
19
+ /**
20
+ * A URL to an image preview for the search result.
21
+ */
22
+ type PreviewImage = string;
15
23
  /**
16
24
  * The initial search match or summary of the search result.
17
25
  */
@@ -27,22 +35,10 @@ type ShowLink = boolean;
27
35
  interface SearchResultProps {
28
36
  url?: URL;
29
37
  title?: Title;
38
+ imageColSize?: ImageRowSize;
30
39
  previewImage?: PreviewImage;
31
40
  initialMatch?: InitialMatch;
32
41
  matches?: Matches;
33
42
  showLink?: ShowLink;
34
43
  }
35
- /**
36
- * An optional preview image for the search result.
37
- */
38
- interface PreviewImage {
39
- /**
40
- * A URL to an image preview for the search result.
41
- */
42
- src?: string;
43
- /**
44
- * Large display of the preview image.
45
- */
46
- large?: boolean;
47
- }
48
- export { URL, Title, InitialMatch, Matches, ShowLink, SearchResultProps, PreviewImage };
44
+ export { URL, Title, ImageRowSize, PreviewImage, InitialMatch, Matches, ShowLink, SearchResultProps };
@@ -13,7 +13,7 @@ import { FeaturesProps } from "./FeaturesProps-a9041d97.js";
13
13
  import { GalleryProps } from "./GalleryProps-76e7de44.js";
14
14
  import { HeroProps } from "./HeroProps-fec6b267.js";
15
15
  import { HtmlProps } from "./HtmlProps-9d091769.js";
16
- import { ImageStoryProps } from "./ImageStoryProps-4e2b2ecf.js";
16
+ import { ImageStoryProps } from "./ImageStoryProps-e853e1e7.js";
17
17
  import { ImageTextProps } from "./ImageTextProps-9286cca4.js";
18
18
  import { LogosProps } from "./LogosProps-f9474fe2.js";
19
19
  import { MosaicProps } from "./MosaicProps-d52c7151.js";
@@ -10,7 +10,7 @@ import { FeaturesProps } from "./FeaturesProps-a9041d97.js";
10
10
  import { GalleryProps } from "./GalleryProps-76e7de44.js";
11
11
  import { HeroProps } from "./HeroProps-fec6b267.js";
12
12
  import { HtmlProps } from "./HtmlProps-9d091769.js";
13
- import { ImageStoryProps } from "./ImageStoryProps-4e2b2ecf.js";
13
+ import { ImageStoryProps } from "./ImageStoryProps-e853e1e7.js";
14
14
  import { ImageTextProps } from "./ImageTextProps-9286cca4.js";
15
15
  import { LogosProps } from "./LogosProps-f9474fe2.js";
16
16
  import { MosaicProps } from "./MosaicProps-d52c7151.js";
@@ -10,7 +10,7 @@ import { FeaturesProps } from "./FeaturesProps-a9041d97.js";
10
10
  import { GalleryProps } from "./GalleryProps-76e7de44.js";
11
11
  import { HeroProps } from "./HeroProps-fec6b267.js";
12
12
  import { HtmlProps } from "./HtmlProps-9d091769.js";
13
- import { ImageStoryProps } from "./ImageStoryProps-4e2b2ecf.js";
13
+ import { ImageStoryProps } from "./ImageStoryProps-e853e1e7.js";
14
14
  import { ImageTextProps } from "./ImageTextProps-9286cca4.js";
15
15
  import { LogosProps } from "./LogosProps-f9474fe2.js";
16
16
  import { MosaicProps } from "./MosaicProps-d52c7151.js";
@@ -1,6 +1,6 @@
1
1
  /// <reference types="react" />
2
2
  import { HTMLAttributes } from "react";
3
- import { BlogAsideProps } from "../../BlogAsideProps-fb0241df.js";
3
+ import { BlogAsideProps } from "../../BlogAsideProps-c760fd2a.js";
4
4
  declare const BlogAsideContextDefault: import("react").ForwardRefExoticComponent<BlogAsideProps & HTMLAttributes<HTMLDivElement> & import("react").RefAttributes<HTMLDivElement>>;
5
5
  declare const BlogAsideContext: import("react").Context<import("react").ForwardRefExoticComponent<BlogAsideProps & HTMLAttributes<HTMLDivElement> & import("react").RefAttributes<HTMLDivElement>>>;
6
6
  declare const BlogAside: import("react").ForwardRefExoticComponent<BlogAsideProps & import("react").RefAttributes<HTMLDivElement>>;
@@ -1,4 +1,4 @@
1
- import { BlogOverviewProps } from "../../BlogOverviewProps-d60aba86.js";
1
+ import { BlogOverviewProps } from "../../BlogOverviewProps-9f207f1c.js";
2
2
  import { FC, PropsWithChildren } from "react";
3
3
  declare const BlogOverview: FC<PropsWithChildren<BlogOverviewProps>>;
4
4
  export type { BlogOverviewProps };
@@ -1,4 +1,4 @@
1
- import { BlogPostProps } from "../../BlogPostProps-d60aba86.js";
1
+ import { BlogPostProps } from "../../BlogPostProps-c760fd2a.js";
2
2
  import { FC, PropsWithChildren } from "react";
3
3
  declare const BlogPost: FC<PropsWithChildren<BlogPostProps>>;
4
4
  export type { BlogPostProps };
@@ -1,6 +1,6 @@
1
1
  /// <reference types="react" />
2
2
  import { HTMLAttributes } from "react";
3
- import { ImageStoryProps } from "../../ImageStoryProps-4e2b2ecf.js";
3
+ import { ImageStoryProps } from "../../ImageStoryProps-e853e1e7.js";
4
4
  declare const ImageStoryContextDefault: import("react").ForwardRefExoticComponent<ImageStoryProps & HTMLAttributes<HTMLDivElement> & import("react").RefAttributes<HTMLDivElement>>;
5
5
  declare const ImageStoryContext: import("react").Context<import("react").ForwardRefExoticComponent<ImageStoryProps & HTMLAttributes<HTMLDivElement> & import("react").RefAttributes<HTMLDivElement>>>;
6
6
  declare const ImageStory: import("react").ForwardRefExoticComponent<ImageStoryProps & HTMLAttributes<HTMLDivElement> & import("react").RefAttributes<HTMLDivElement>>;
@@ -29,8 +29,8 @@ interface SettingsProps {
29
29
  seo: SeoProps;
30
30
  iconSprite?: IconSprite;
31
31
  }
32
- export * from "../../BlogPostProps-d60aba86.js";
33
- export * from "../../BlogOverviewProps-d60aba86.js";
34
- export * from "../../PageProps-d60aba86.js";
32
+ export * from "../../BlogPostProps-c760fd2a.js";
33
+ export * from "../../BlogOverviewProps-9f207f1c.js";
34
+ export * from "../../PageProps-aa29c554.js";
35
35
  export { IconSprite, SettingsProps };
36
36
  export * from "../../EventDetailProps-42a7eebe.js";
@@ -1,4 +1,4 @@
1
- import { PageProps } from "../../PageProps-d60aba86.js";
1
+ import { PageProps } from "../../PageProps-aa29c554.js";
2
2
  import { FC, PropsWithChildren } from "react";
3
3
  declare const Page: FC<PropsWithChildren<PageProps>>;
4
4
  export type { PageProps };
@@ -1,6 +1,6 @@
1
1
  /**
2
2
  * Do not edit directly
3
- * Generated on Fri, 05 Sep 2025 13:51:26 GMT
3
+ * Generated on Fri, 05 Sep 2025 14:03:21 GMT
4
4
  */
5
5
  :root, [ks-theme] {
6
6
  --ks-background-color-accent-base: var(--ks-color-fg-to-bg-9-base);
@@ -1192,7 +1192,7 @@
1192
1192
  "id": "page-archetypes-search--search",
1193
1193
  "group": "Page Archetypes/Search",
1194
1194
  "name": "Search",
1195
- "code": "<Search\n events={[\n {\n category: 'Buyers',\n ctaText: 'Show event',\n date: 'FRI, JAN 16',\n image: {\n alt: 'This is an image of a flower',\n src: 'https://picsum.photos/seed/flower/800/600'\n },\n location: {\n address: 'Köln',\n name: 'Stadthalle'\n },\n tags: [\n 'AI'\n ],\n text: 'The Future of AI is here and now - Join us to explore the latest advancements in artificial intelligence. The Future of AI is here and now - Join us to explore the latest advancements in artificial intelligence.',\n time: '10:00',\n title: 'This is a event teaser title',\n url: 'https://example.com'\n },\n {\n category: 'Buyers',\n ctaText: 'Show event',\n date: 'FRI, JAN 16',\n image: {\n alt: 'This is an image of a flower',\n src: 'https://picsum.photos/seed/flower/800/600'\n },\n location: {\n address: 'Köln',\n name: 'Stadthalle'\n },\n tags: [\n 'AI'\n ],\n text: 'The Future of AI is here and now - Join us to explore the latest advancements in artificial intelligence. The Future of AI is here and now - Join us to explore the latest advancements in artificial intelligence.',\n time: '10:00',\n title: 'This is a event teaser title',\n url: 'https://example.com'\n },\n {\n category: 'Buyers',\n ctaText: 'Show event',\n date: 'FRI, JAN 16',\n image: {\n alt: 'This is an image of a flower',\n src: 'https://picsum.photos/seed/flower/800/600'\n },\n location: {\n address: 'Köln',\n name: 'Stadthalle'\n },\n tags: [\n 'AI'\n ],\n text: 'The Future of AI is here and now - Join us to explore the latest advancements in artificial intelligence. The Future of AI is here and now - Join us to explore the latest advancements in artificial intelligence.',\n time: '10:00',\n title: 'This is a event teaser title',\n url: 'https://example.com'\n }\n ]}\n filter={{\n applyButton: {\n label: 'Filter Appointments'\n },\n categories: {\n categoryCheckboxes: [\n 'Category Filter',\n 'Category Filter',\n 'Category Filter'\n ],\n title: 'Categories',\n toggle: true\n },\n datePicker: {\n dateFromInput: {\n label: 'From',\n placeholder: 'Select a date'\n },\n dateToInput: {\n label: 'To',\n placeholder: 'Select a date'\n },\n title: 'Find Appointment',\n toggle: true\n },\n resetButton: {\n label: 'Reset Filters'\n }\n }}\n headline={{\n level: 'h1',\n style: 'h1',\n text: 'Search'\n }}\n searchFilter={{\n categories: [\n {\n amount: 10,\n title: 'Pages',\n url: '#'\n },\n {\n amount: 5,\n title: 'News',\n url: '#'\n },\n {\n amount: 2,\n title: 'Blog Posts',\n url: '#'\n }\n ],\n title: 'Search Filters'\n }}\n searchResults={[\n {\n initialMatch: 'Embracing a **sustainable** lifestyle can significantly reduce your environmental impact. From using energy-efficient appliances to adopting renewable energy sources, every small step counts towards a greener future.',\n matches: [\n {\n snippet: 'Simple changes can make your home more **sustainable** and energy-efficient.',\n title: 'Home',\n url: '#'\n },\n {\n snippet: 'Adopting a **sustainable** lifestyle benefits both you and the planet.',\n title: 'Lifestyle',\n url: '#'\n }\n ],\n previewImage: {\n src: 'img/people-brainstorming-work-meeting.png'\n },\n title: 'Sustainable Living: Everyday Tips',\n url: 'www.example.com/lifestyle/sustainable-living'\n },\n {\n initialMatch: 'Discover how **sustainable** design is shaping the future of urban development, from green buildings to eco-friendly materials. Research shows that **sustainable** architecture not only benefits the environment but also enhances the well-being of its occupants.',\n previewImage: {\n large: true,\n src: 'img/full-shot-different-people-working-together.png'\n },\n title: 'Sustainable Architecture Trends',\n url: 'www.example.com/architecture/sustainable-trends'\n },\n {\n matches: [\n {\n snippet: 'A **sustainable** business model focuses on long-term growth and environmental responsibility.',\n title: 'Getting Started',\n url: '#'\n },\n {\n snippet: 'Explore examples of companies that have adopted **sustainable** practices successfully.',\n title: 'Case Studies',\n url: '#'\n },\n {\n snippet: 'Using **sustainable** materials can significantly reduce a building’s carbon footprint.',\n title: 'Materials',\n url: '#'\n }\n ],\n title: 'How to Build a Sustainable Business',\n url: 'www.example.com/business/sustainable-model'\n },\n {\n initialMatch: 'Embracing a **sustainable** lifestyle can significantly reduce your environmental impact. From using energy-efficient appliances to adopting renewable energy sources, every small step counts towards a greener future.',\n matches: [\n {\n snippet: 'A **sustainable** business model focuses on long-term growth and environmental responsibility.',\n title: 'Getting Started',\n url: '#'\n },\n {\n snippet: 'Explore examples of companies that have adopted **sustainable** practices successfully.',\n title: 'Case Studies',\n url: '#'\n },\n {\n snippet: 'Using **sustainable** materials can significantly reduce a building’s carbon footprint.',\n title: 'Materials',\n url: '#'\n }\n ],\n previewImage: {\n large: true,\n src: 'img/full-shot-different-people-working-together.png'\n },\n title: 'Sustainable Living: Everyday Tips',\n url: 'www.example.com/business/sustainable-model'\n }\n ]}\n/>",
1195
+ "code": "<Search\n events={[\n {\n category: 'Buyers',\n ctaText: 'Show event',\n date: 'FRI, JAN 16',\n image: {\n alt: 'This is an image of a flower',\n src: 'https://picsum.photos/seed/flower/800/600'\n },\n location: {\n address: 'Köln',\n name: 'Stadthalle'\n },\n tags: [\n 'AI'\n ],\n text: 'The Future of AI is here and now - Join us to explore the latest advancements in artificial intelligence. The Future of AI is here and now - Join us to explore the latest advancements in artificial intelligence.',\n time: '10:00',\n title: 'This is a event teaser title',\n url: 'https://example.com'\n },\n {\n category: 'Buyers',\n ctaText: 'Show event',\n date: 'FRI, JAN 16',\n image: {\n alt: 'This is an image of a flower',\n src: 'https://picsum.photos/seed/flower/800/600'\n },\n location: {\n address: 'Köln',\n name: 'Stadthalle'\n },\n tags: [\n 'AI'\n ],\n text: 'The Future of AI is here and now - Join us to explore the latest advancements in artificial intelligence. The Future of AI is here and now - Join us to explore the latest advancements in artificial intelligence.',\n time: '10:00',\n title: 'This is a event teaser title',\n url: 'https://example.com'\n },\n {\n category: 'Buyers',\n ctaText: 'Show event',\n date: 'FRI, JAN 16',\n image: {\n alt: 'This is an image of a flower',\n src: 'https://picsum.photos/seed/flower/800/600'\n },\n location: {\n address: 'Köln',\n name: 'Stadthalle'\n },\n tags: [\n 'AI'\n ],\n text: 'The Future of AI is here and now - Join us to explore the latest advancements in artificial intelligence. The Future of AI is here and now - Join us to explore the latest advancements in artificial intelligence.',\n time: '10:00',\n title: 'This is a event teaser title',\n url: 'https://example.com'\n }\n ]}\n filter={{\n applyButton: {\n label: 'Filter Appointments'\n },\n categories: {\n categoryCheckboxes: [\n 'Category Filter',\n 'Category Filter',\n 'Category Filter'\n ],\n title: 'Categories',\n toggle: true\n },\n datePicker: {\n dateFromInput: {\n label: 'From',\n placeholder: 'Select a date'\n },\n dateToInput: {\n label: 'To',\n placeholder: 'Select a date'\n },\n title: 'Find Appointment',\n toggle: true\n },\n resetButton: {\n label: 'Reset Filters'\n }\n }}\n headline={{\n level: 'h1',\n style: 'h1',\n text: 'Search'\n }}\n searchFilter={{\n categories: [\n {\n amount: 10,\n title: 'Pages',\n url: '#'\n },\n {\n amount: 5,\n title: 'News',\n url: '#'\n },\n {\n amount: 2,\n title: 'Blog Posts',\n url: '#'\n }\n ],\n title: 'Search Filters'\n }}\n searchResults={[\n {\n initialMatch: 'Embracing a **sustainable** lifestyle can significantly reduce your environmental impact. From using energy-efficient appliances to adopting renewable energy sources, every small step counts towards a greener future.',\n matches: [\n {\n snippet: 'Simple changes can make your home more **sustainable** and energy-efficient.',\n title: 'Home',\n url: '#'\n },\n {\n snippet: 'Adopting a **sustainable** lifestyle benefits both you and the planet.',\n title: 'Lifestyle',\n url: '#'\n }\n ],\n previewImage: 'img/people-brainstorming-work-meeting.png',\n title: 'Sustainable Living: Everyday Tips',\n url: 'www.example.com/lifestyle/sustainable-living'\n },\n {\n initialMatch: 'Discover how **sustainable** design is shaping the future of urban development, from green buildings to eco-friendly materials. Research shows that **sustainable** architecture not only benefits the environment but also enhances the well-being of its occupants.',\n previewImage: 'img/full-shot-different-people-working-together.png',\n title: 'Sustainable Architecture Trends',\n url: 'www.example.com/architecture/sustainable-trends'\n },\n {\n matches: [\n {\n snippet: 'A **sustainable** business model focuses on long-term growth and environmental responsibility.',\n title: 'Getting Started',\n url: '#'\n },\n {\n snippet: 'Explore examples of companies that have adopted **sustainable** practices successfully.',\n title: 'Case Studies',\n url: '#'\n },\n {\n snippet: 'Using **sustainable** materials can significantly reduce a building’s carbon footprint.',\n title: 'Materials',\n url: '#'\n }\n ],\n title: 'How to Build a Sustainable Business',\n url: 'www.example.com/business/sustainable-model'\n },\n {\n initialMatch: 'Embracing a **sustainable** lifestyle can significantly reduce your environmental impact. From using energy-efficient appliances to adopting renewable energy sources, every small step counts towards a greener future.',\n matches: [\n {\n snippet: 'A **sustainable** business model focuses on long-term growth and environmental responsibility.',\n title: 'Getting Started',\n url: '#'\n },\n {\n snippet: 'Explore examples of companies that have adopted **sustainable** practices successfully.',\n title: 'Case Studies',\n url: '#'\n },\n {\n snippet: 'Using **sustainable** materials can significantly reduce a building’s carbon footprint.',\n title: 'Materials',\n url: '#'\n }\n ],\n previewImage: 'img/full-shot-different-people-working-together.png',\n title: 'Sustainable Living: Everyday Tips',\n url: 'www.example.com/business/sustainable-model'\n }\n ]}\n/>",
1196
1196
  "args": {
1197
1197
  "filter": {
1198
1198
  "datePicker": {
@@ -1313,9 +1313,7 @@
1313
1313
  "searchResults": [
1314
1314
  {
1315
1315
  "title": "Sustainable Living: Everyday Tips",
1316
- "previewImage": {
1317
- "src": "img/people-brainstorming-work-meeting.png"
1318
- },
1316
+ "previewImage": "img/people-brainstorming-work-meeting.png",
1319
1317
  "initialMatch": "Embracing a **sustainable** lifestyle can significantly reduce your environmental impact. From using energy-efficient appliances to adopting renewable energy sources, every small step counts towards a greener future.",
1320
1318
  "matches": [
1321
1319
  {
@@ -1333,10 +1331,7 @@
1333
1331
  },
1334
1332
  {
1335
1333
  "title": "Sustainable Architecture Trends",
1336
- "previewImage": {
1337
- "large": true,
1338
- "src": "img/full-shot-different-people-working-together.png"
1339
- },
1334
+ "previewImage": "img/full-shot-different-people-working-together.png",
1340
1335
  "initialMatch": "Discover how **sustainable** design is shaping the future of urban development, from green buildings to eco-friendly materials. Research shows that **sustainable** architecture not only benefits the environment but also enhances the well-being of its occupants.",
1341
1336
  "url": "www.example.com/architecture/sustainable-trends"
1342
1337
  },
@@ -1363,10 +1358,7 @@
1363
1358
  },
1364
1359
  {
1365
1360
  "title": "Sustainable Living: Everyday Tips",
1366
- "previewImage": {
1367
- "large": true,
1368
- "src": "img/full-shot-different-people-working-together.png"
1369
- },
1361
+ "previewImage": "img/full-shot-different-people-working-together.png",
1370
1362
  "initialMatch": "Embracing a **sustainable** lifestyle can significantly reduce your environmental impact. From using energy-efficient appliances to adopting renewable energy sources, every small step counts towards a greener future.",
1371
1363
  "matches": [
1372
1364
  {
@@ -3980,7 +3972,7 @@
3980
3972
  "id": "corporate-search-modal--pagefind",
3981
3973
  "group": "Corporate / Search Modal",
3982
3974
  "name": "Pagefind",
3983
- "code": "<>\n <Button\n data-topic=\"dsa.search-modal.open\"\n ks-component=\"dsa.radio-emit\"\n label=\"open\"\n size=\"small\"\n />\n <hr />\n <SearchModal\n closeAriaLabel=\"close\"\n formComponent=\"dsa.search-form.pagefind\"\n headline=\"Search\"\n />\n</>",
3975
+ "code": "<>\n <Button\n data-topic=\"dsa.search-modal.open\"\n ks-component=\"dsa.radio-emit\"\n label=\"Open\"\n size=\"small\"\n />\n <hr />\n <SearchModal\n closeAriaLabel=\"close\"\n formComponent=\"dsa.search-form.pagefind\"\n headline=\"Search\"\n />\n</>",
3984
3976
  "args": {
3985
3977
  "headline": "Search",
3986
3978
  "closeAriaLabel": "close",
@@ -3992,14 +3984,11 @@
3992
3984
  "id": "corporate-search-result--default",
3993
3985
  "group": "Corporate / Search Result",
3994
3986
  "name": "Default",
3995
- "code": "<SearchResult\n initialMatch=\"Embracing a **sustainable** lifestyle can significantly reduce your environmental impact. From using energy-efficient appliances to adopting renewable energy sources, every small step counts towards a greener future.\"\n matches={[\n {\n snippet: 'Learn how leading companies are integrating **sustainability** into their core strategies.',\n title: 'Keynote: Embracing Sustainability',\n url: '#'\n },\n {\n snippet: 'Business models that prioritize **sustainability** are shared by industry experts in this session.',\n title: 'Panel: Sustainability in Practice',\n url: '#'\n },\n {\n snippet: 'In your organization, **sustainability** can be assessed using new tools and techniques.',\n title: 'Workshop: Measuring Sustainability',\n url: '#'\n }\n ]}\n previewImage={{\n large: false,\n src: 'img/full-shot-different-people-working-together.png'\n }}\n showLink\n title=\"GreenTech Summit 2023\"\n url=\"https://www.example.com/greentech-summit-2023\"\n/>",
3987
+ "code": "<SearchResult\n imageColSize=\"small\"\n initialMatch=\"Embracing a **sustainable** lifestyle can significantly reduce your environmental impact. From using energy-efficient appliances to adopting renewable energy sources, every small step counts towards a greener future.\"\n matches={[\n {\n snippet: 'Learn how leading companies are integrating **sustainability** into their core strategies.',\n title: 'Keynote: Embracing Sustainability',\n url: '#'\n },\n {\n snippet: 'Business models that prioritize **sustainability** are shared by industry experts in this session.',\n title: 'Panel: Sustainability in Practice',\n url: '#'\n },\n {\n snippet: 'In your organization, **sustainability** can be assessed using new tools and techniques.',\n title: 'Workshop: Measuring Sustainability',\n url: '#'\n }\n ]}\n previewImage=\"img/full-shot-different-people-working-together.png\"\n showLink\n title=\"GreenTech Summit 2023\"\n url=\"https://www.example.com/greentech-summit-2023\"\n/>",
3996
3988
  "args": {
3997
3989
  "url": "https://www.example.com/greentech-summit-2023",
3998
3990
  "title": "GreenTech Summit 2023",
3999
- "previewImage": {
4000
- "large": false,
4001
- "src": "img/full-shot-different-people-working-together.png"
4002
- },
3991
+ "imageColSize": "small",
4003
3992
  "matches": [
4004
3993
  {
4005
3994
  "title": "Keynote: Embracing Sustainability",
@@ -4018,6 +4007,7 @@
4018
4007
  }
4019
4008
  ],
4020
4009
  "showLink": true,
4010
+ "previewImage": "img/full-shot-different-people-working-together.png",
4021
4011
  "initialMatch": "Embracing a **sustainable** lifestyle can significantly reduce your environmental impact. From using energy-efficient appliances to adopting renewable energy sources, every small step counts towards a greener future."
4022
4012
  },
4023
4013
  "screenshot": "img/screenshots/corporate-search-result--default.png"
@@ -8,7 +8,7 @@ import { FC, PropsWithChildren } from "react";
8
8
  import { HeadlineProps } from "../../HeadlineProps-e1305784.js";
9
9
  import { SearchBarProps } from "../../SearchBarProps-26263244.js";
10
10
  import { SearchFilterProps } from "../../SearchFilterProps-2fa6419b.js";
11
- import { SearchResultProps } from "../../SearchResultProps-a4d09722.js";
11
+ import { SearchResultProps } from "../../SearchResultProps-f6f07017.js";
12
12
  interface SearchProps {
13
13
  /**
14
14
  * Referenced component HeadlineProps
@@ -227,22 +227,21 @@
227
227
  "AI Conference 2023"
228
228
  ]
229
229
  },
230
+ "imageColSize": {
231
+ "title": "Image Row Size",
232
+ "type": "string",
233
+ "description": "The reserved space of the image row.",
234
+ "default": "small",
235
+ "enum": [
236
+ "none",
237
+ "small",
238
+ "large"
239
+ ]
240
+ },
230
241
  "previewImage": {
231
242
  "title": "Preview Image",
232
- "type": "object",
233
- "description": "An optional preview image for the search result.",
234
- "properties": {
235
- "src": {
236
- "type": "string",
237
- "description": "A URL to an image preview for the search result."
238
- },
239
- "large": {
240
- "type": "boolean",
241
- "description": "Large display of the preview image.",
242
- "default": false
243
- }
244
- },
245
- "additionalProperties": false
243
+ "type": "string",
244
+ "description": "A URL to an image preview for the search result."
246
245
  },
247
246
  "initialMatch": {
248
247
  "title": "Initial Match",
@@ -17,6 +17,6 @@ import '@kickstartds/core/lib/container';
17
17
  import '@kickstartds/core/lib/component';
18
18
  import '@kickstartds/core/lib/core';
19
19
 
20
- const SearchForm = ({ className, component = "dsa.search-form", ...props }) => (jsxs("form", { className: classnames("dsa-search-form", className), "ks-component": component, ...props, children: [jsx(SearchBar, { alternativeText: "", alternativeResult: "", hint: "" }), jsxs("div", { hidden: true, children: [jsx("li", { "data-template": "result", className: "lazyload", children: jsx(SearchResult, { previewImage: {} }) }), jsx(SearchResultMatch, { "data-template": "subresult" })] }), jsx("ol", { className: "dsa-search-form__results" })] }));
20
+ const SearchForm = ({ className, component = "dsa.search-form", ...props }) => (jsxs("form", { className: classnames("dsa-search-form", className), "ks-component": component, ...props, children: [jsx(SearchBar, { alternativeText: "", alternativeResult: "", hint: "" }), jsxs("div", { hidden: true, children: [jsx("li", { "data-template": "result", className: "lazyload", children: jsx(SearchResult, { previewImage: "" }) }), jsx(SearchResultMatch, { "data-template": "subresult" })] }), jsx("ol", { className: "dsa-search-form__results" })] }));
21
21
 
22
22
  export { SearchForm };
@@ -30,7 +30,7 @@ const SearchModal = ({ headline = "Search", closeAriaLabel = "close", formCompon
30
30
  sub: closeAriaLabel,
31
31
  // @ts-expect-error
32
32
  renderSubheadline(sub) {
33
- return (jsx(Button, { "aria-label": sub, label: "", icon: "close", size: "small", "ks-component": "dsa.radio-emit", "data-topic": "dsa.search-modal.close" }));
33
+ return (jsx(Button, { className: "dsa-search-modal__close", "aria-label": sub, label: "", icon: "close", size: "small", "ks-component": "dsa.radio-emit", "data-topic": "dsa.search-modal.close" }));
34
34
  },
35
35
  }, spaceBefore: "small", spaceAfter: "small", children: jsx(SearchForm, { component: formComponent }) }) }));
36
36
 
@@ -11,6 +11,9 @@
11
11
  .dsa-search-modal::backdrop {
12
12
  background-color: var(--dsa-overlay--background-color);
13
13
  }
14
+ .dsa-search-modal__close {
15
+ --dsa-button--padding: 1em;
16
+ }
14
17
  .dsa-search-modal .l-section__container--headline .dsa-headline {
15
18
  flex-direction: row;
16
19
  align-items: center;
@@ -1,5 +1,5 @@
1
1
  /// <reference types="react" />
2
- import { SearchResultProps } from "../../SearchResultProps-a4d09722.js";
2
+ import { SearchResultProps } from "../../SearchResultProps-f6f07017.js";
3
3
  declare const SearchResultContextDefault: import("react").ForwardRefExoticComponent<SearchResultProps & import("react").RefAttributes<HTMLDivElement>>;
4
4
  declare const SearchResultContext: import("react").Context<import("react").ForwardRefExoticComponent<SearchResultProps & import("react").RefAttributes<HTMLDivElement>>>;
5
5
  declare const SearchResult: import("react").ForwardRefExoticComponent<SearchResultProps & import("react").RefAttributes<HTMLDivElement>>;
@@ -8,19 +8,17 @@ import classnames from 'classnames';
8
8
  import { Picture } from '@kickstartds/base/lib/picture';
9
9
  import { Container } from '@kickstartds/core/lib/container';
10
10
  import { SearchResultMatch } from '../search-result-match/index.js';
11
- import '@kickstartds/base/lib/icon';
12
11
 
13
12
  const defaults = {
14
- "previewImage": {
15
- "large": false
16
- },
13
+ "imageColSize": "small",
17
14
  "matches": [],
18
15
  "showLink": true
19
16
  };
20
17
 
21
- const SearchResultContextDefault = forwardRef(({ title, previewImage, initialMatch, matches, url, showLink }, ref) => (jsx(Container, { name: "search-result", children: jsxs("div", { ref: ref, className: classnames("dsa-search-result", {
22
- "dsa-search-result--image-large": previewImage?.large,
23
- }), children: [jsxs("div", { className: "dsa-search-result__content", children: [jsx("div", { className: "dsa-search-result__header", children: jsx(Link, { href: url, className: "dsa-search-result__title", "data-result-link": true, "data-result-title": true, children: title }) }), jsx(RichText, { text: initialMatch, className: "dsa-search-result__initial-match", "data-result-excerpt": true }), jsx("div", { className: "dsa-search-result__matches", "data-result-subresults": true, children: matches?.map((match, index) => (jsx(SearchResultMatch, { ...match }, index))) }), showLink && (jsx(Link, { href: url, className: "dsa-search-result__link", "data-result-link": true, "data-result-url": true, children: url }))] }), previewImage && (jsx(Link, { tabIndex: -1, "aria-hidden": true, href: url, className: "dsa-search-result__preview-image-wrapper", "data-result-link": true, children: jsx(Picture, { src: previewImage.src, alt: "", className: "dsa-search-result__preview-image", "data-result-image": true }) }))] }) })));
18
+ const SearchResultContextDefault = forwardRef(({ title, previewImage, imageColSize = "small", initialMatch, matches, url, showLink, }, ref) => (jsx(Container, { name: "search-result", children: jsxs("div", { ref: ref, className: classnames("dsa-search-result", {
19
+ "dsa-search-result--image-row-large": imageColSize === "large",
20
+ "dsa-search-result--image-row-none": imageColSize === "none",
21
+ }), children: [jsxs("div", { className: "dsa-search-result__content", children: [jsx("div", { className: "dsa-search-result__header", children: jsx(Link, { "data-result-link": true, "data-result-title": true, href: url, className: "dsa-search-result__title", children: title }) }), initialMatch && (jsx(RichText, { className: "dsa-search-result__initial-match", text: initialMatch, "data-result-excerpt": true })), matches && matches.length > 0 && (jsx("div", { className: "dsa-search-result__matches", "data-result-subresults": true, children: matches.map((match, index) => (jsx(SearchResultMatch, { ...match }, index))) })), showLink && (jsx(Link, { href: url, className: "dsa-search-result__link", "data-result-link": true, "data-result-url": true, children: url }))] }), imageColSize !== "none" && (jsx("div", { className: "dsa-search-result__preview-image-row", children: previewImage && (jsx(Link, { tabIndex: -1, "aria-hidden": true, href: url, className: "dsa-search-result__preview-image-wrapper", "data-result-link": true, children: jsx(Picture, { src: previewImage, alt: "", className: "dsa-search-result__preview-image", "data-result-image": true }) })) }))] }) })));
24
22
  const SearchResultContext = createContext(SearchResultContextDefault);
25
23
  const SearchResult = forwardRef((props, ref) => {
26
24
  const Component = useContext(SearchResultContext);
@@ -24,9 +24,15 @@
24
24
  flex-grow: 1;
25
25
  }
26
26
  .dsa-search-result__link {
27
+ --g-link--color: var(--ks-color-fg-alpha-4);
28
+ --g-link--color-hover: var(--ks-color-fg-alpha-2);
27
29
  width: fit-content;
28
30
  font: var(--ks-font-interface-s);
29
- color: var(--ks-color-fg-alpha-4);
31
+ }
32
+ .dsa-search-result strong {
33
+ border-bottom: 1px dashed var(--ks-color-fg);
34
+ font-weight: unset;
35
+ color: var(--ks-color-fg);
30
36
  }
31
37
  .dsa-search-result__matches {
32
38
  padding: var(--ks-spacing-xxs) 0;
@@ -39,15 +45,19 @@
39
45
  font-family: var(--ks-font-family-display);
40
46
  line-height: var(--ks-line-height-display-m);
41
47
  }
42
- .dsa-search-result__preview-image-wrapper {
48
+ .dsa-search-result__preview-image-row {
43
49
  height: fit-content;
50
+ flex-basis: var(--dsa-tile--width_smallest);
51
+ }
52
+ .dsa-search-result--image-row-large .dsa-search-result__preview-image-row {
53
+ flex-basis: var(--dsa-tile--width_small);
44
54
  }
45
55
  @media (max-width: 980px) {
46
- .dsa-search-result__preview-image-wrapper {
56
+ .dsa-search-result__preview-image-row {
47
57
  display: none;
48
58
  }
49
59
  @container search-result (min-width: 640px) {
50
- .dsa-search-result__preview-image-wrapper {
60
+ .dsa-search-result__preview-image-row {
51
61
  display: block;
52
62
  }
53
63
  }
@@ -58,8 +68,4 @@
58
68
  object-fit: cover;
59
69
  aspect-ratio: 4/3;
60
70
  border-radius: calc(var(--ks-border-radius-card) / 2);
61
- max-width: var(--dsa-tile--width_smallest);
62
- }
63
- .dsa-search-result--image-large .dsa-search-result__preview-image {
64
- max-width: var(--dsa-tile--width_small);
65
71
  }
@@ -20,22 +20,21 @@
20
20
  "AI Conference 2023"
21
21
  ]
22
22
  },
23
+ "imageColSize": {
24
+ "title": "Image Row Size",
25
+ "type": "string",
26
+ "description": "The reserved space of the image row.",
27
+ "default": "small",
28
+ "enum": [
29
+ "none",
30
+ "small",
31
+ "large"
32
+ ]
33
+ },
23
34
  "previewImage": {
24
35
  "title": "Preview Image",
25
- "type": "object",
26
- "description": "An optional preview image for the search result.",
27
- "properties": {
28
- "src": {
29
- "type": "string",
30
- "description": "A URL to an image preview for the search result."
31
- },
32
- "large": {
33
- "type": "boolean",
34
- "description": "Large display of the preview image.",
35
- "default": false
36
- }
37
- },
38
- "additionalProperties": false
36
+ "type": "string",
37
+ "description": "A URL to an image preview for the search result."
39
38
  },
40
39
  "initialMatch": {
41
40
  "title": "Initial Match",
@@ -16,21 +16,17 @@
16
16
  "description": "The title of the search result.",
17
17
  "examples": ["AI Conference 2023"]
18
18
  },
19
+ "imageColSize": {
20
+ "title": "Image Row Size",
21
+ "type": "string",
22
+ "description": "The reserved space of the image row.",
23
+ "default": "small",
24
+ "enum": ["none", "small", "large"]
25
+ },
19
26
  "previewImage": {
20
27
  "title": "Preview Image",
21
- "type": "object",
22
- "description": "An optional preview image for the search result.",
23
- "properties": {
24
- "src": {
25
- "type": "string",
26
- "description": "A URL to an image preview for the search result."
27
- },
28
- "large": {
29
- "type": "boolean",
30
- "description": "Large display of the preview image.",
31
- "default": false
32
- }
33
- }
28
+ "type": "string",
29
+ "description": "A URL to an image preview for the search result."
34
30
  },
35
31
  "initialMatch": {
36
32
  "title": "Initial Match",
@@ -4,11 +4,10 @@ import { forwardRef, createContext, useContext } from 'react';
4
4
  import { Link } from '@kickstartds/base/lib/link';
5
5
  import { RichText } from '@kickstartds/base/lib/rich-text';
6
6
  import { d as deepMergeDefaults } from '../../helpers-12f48df8.js';
7
- import { Icon } from '@kickstartds/base/lib/icon';
8
7
 
9
8
  const defaults = {};
10
9
 
11
- const SearchResultMatchContextDefault = forwardRef(({ title, snippet, url, ...props }, ref) => (jsxs(Link, { ref: ref, href: url, className: "dsa-search-result-match", "data-result-link": true, ...props, children: [jsxs("div", { className: "dsa-search-result-match__title", children: [jsx(Icon, { className: "dsa-search-result-match__chevron", icon: "chevron-right" }), jsx("span", { "data-result-title": true, children: title })] }), jsx(RichText, { text: snippet, className: "dsa-search-result-match__snippet", "data-result-excerpt": true })] })));
10
+ const SearchResultMatchContextDefault = forwardRef(({ title, snippet, url, ...props }, ref) => (jsxs(Link, { ref: ref, href: url, className: "dsa-search-result-match", "data-result-link": true, ...props, children: [jsx("div", { "data-result-title": true, className: "dsa-search-result-match__title", children: title }), jsx(RichText, { text: snippet, className: "dsa-search-result-match__snippet", "data-result-excerpt": true })] })));
12
11
  const SearchResultMatchContext = createContext(SearchResultMatchContextDefault);
13
12
  const SearchResultMatch = forwardRef((props, ref) => {
14
13
  const Component = useContext(SearchResultMatchContext);
@@ -4,6 +4,7 @@
4
4
  padding: var(--ks-spacing-stack-s) 0;
5
5
  border-top: 1px solid var(--ks-border-color-default);
6
6
  display: block;
7
+ margin-left: 1.25em;
7
8
  }
8
9
  .dsa-search-result-match__snippet {
9
10
  font: var(--ks-font-copy-m);
@@ -14,7 +15,4 @@
14
15
  }
15
16
  .dsa-search-result-match:last-child {
16
17
  border-bottom: 1px solid var(--ks-border-color-default);
17
- }
18
- .dsa-search-result-match .l-container--rich-text {
19
- margin-left: 1em;
20
18
  }
@@ -1,6 +1,6 @@
1
1
  /**
2
2
  * Do not edit directly
3
- * Generated on Fri, 05 Sep 2025 13:51:29 GMT
3
+ * Generated on Fri, 05 Sep 2025 14:03:24 GMT
4
4
  */
5
5
  :root [ks-theme=business] {
6
6
  --ks-background-color-accent-base: var(--ks-color-primary-to-bg-8-base);
@@ -2727,7 +2727,7 @@
2727
2727
  }
2728
2728
  /**
2729
2729
  * Do not edit directly
2730
- * Generated on Fri, 05 Sep 2025 13:51:33 GMT
2730
+ * Generated on Fri, 05 Sep 2025 14:03:28 GMT
2731
2731
  */
2732
2732
  :root [ks-theme=google] {
2733
2733
  --ks-background-color-accent-base: var(--ks-color-primary-to-bg-8-base);
@@ -5458,7 +5458,7 @@
5458
5458
  }
5459
5459
  /**
5460
5460
  * Do not edit directly
5461
- * Generated on Fri, 05 Sep 2025 13:51:31 GMT
5461
+ * Generated on Fri, 05 Sep 2025 14:03:26 GMT
5462
5462
  */
5463
5463
  :root [ks-theme=ngo] {
5464
5464
  --ks-background-color-accent-base: var(--ks-color-primary-to-bg-8-base);
@@ -8459,7 +8459,7 @@
8459
8459
  }
8460
8460
  /**
8461
8461
  * Do not edit directly
8462
- * Generated on Fri, 05 Sep 2025 13:51:36 GMT
8462
+ * Generated on Fri, 05 Sep 2025 14:03:30 GMT
8463
8463
  */
8464
8464
  :root [ks-theme=telekom] {
8465
8465
  --ks-background-color-accent-base: var(--ks-color-primary-to-bg-8-base);
@@ -1,6 +1,6 @@
1
1
  /**
2
2
  * Do not edit directly
3
- * Generated on Fri, 05 Sep 2025 13:51:26 GMT
3
+ * Generated on Fri, 05 Sep 2025 14:03:21 GMT
4
4
  */
5
5
 
6
6
  :root, [ks-theme] {
@@ -1,6 +1,6 @@
1
1
  /**
2
2
  * Do not edit directly
3
- * Generated on Fri, 05 Sep 2025 13:51:27 GMT
3
+ * Generated on Fri, 05 Sep 2025 14:03:22 GMT
4
4
  */
5
5
 
6
6
  export const KsBackgroundColorAccentBase = "#f3f3f4";
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "@kickstartds/ds-agency-premium",
3
- "version": "1.6.71--canary.50.2257.0",
3
+ "version": "1.6.71--canary.50.2259.0",
4
4
  "description": "",
5
5
  "homepage": "https://github.com/kickstartDS/ds-agency-premium#readme",
6
6
  "bugs": {