@kickstartds/ds-agency-premium 1.6.71--canary.45.2208.0 → 1.6.71--canary.49.2214.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/dist/{BlogOverviewProps-d62a0a9a.d.ts → BlogOverviewProps-9f207f1c.d.ts} +2 -2
- package/dist/BlogPostProps-c760fd2a.d.ts +1 -1
- package/dist/PageProps-aa29c554.d.ts +1 -1
- package/dist/{SectionProps-d60aba86.d.ts → SectionProps-2a23ef89.d.ts} +1 -1
- package/dist/components/blog-overview/blog-overview.schema.dereffed.json +1 -1
- package/dist/components/blog-overview/index.d.ts +1 -1
- package/dist/components/blog-post/blog-post.schema.dereffed.json +1 -1
- package/dist/components/blog-teaser/index.d.ts +1 -1
- package/dist/components/button/button.css +1 -1
- package/dist/components/cookie-consent/C15t.client.js +3 -32
- package/dist/components/cookie-consent/CookieConsent.client.d.ts +1 -0
- package/dist/components/cookie-consent/CookieConsent.client.js +13 -8
- package/dist/components/cookie-consent/cookie-consent.css +15 -3
- package/dist/components/cookie-consent/index.js +1 -1
- package/dist/components/features/features.css +2 -1
- package/dist/components/footer/footer.css +2 -2
- package/dist/components/footer/footer.schema.dereffed.json +18 -25
- package/dist/components/header/header.css +1 -0
- package/dist/components/header/header.schema.dereffed.json +18 -25
- package/dist/components/headline/headline.css +7 -7
- package/dist/components/headline/index.d.ts +53 -1
- package/dist/components/hero/hero.css +4 -4
- package/dist/components/index/index.d.ts +1 -1
- package/dist/components/mosaic/index.js +1 -0
- package/dist/components/nav-dropdown/nav-dropdown.css +5 -5
- package/dist/components/nav-flyout/nav-flyout.schema.dereffed.json +18 -25
- package/dist/components/nav-main/nav-main.schema.dereffed.json +18 -25
- package/dist/components/nav-main/nav-main.schema.json +18 -25
- package/dist/components/nav-topbar/index.js +3 -3
- package/dist/components/nav-topbar/nav-topbar.css +19 -3
- package/dist/components/nav-topbar/nav-topbar.schema.dereffed.json +18 -25
- package/dist/components/page/page.schema.dereffed.json +1 -1
- package/dist/components/page-wrapper/index.js +51 -0
- package/dist/components/page-wrapper/tokens.css +350 -350
- package/dist/components/presets.json +37 -56
- package/dist/components/search/index.d.ts +0 -10
- package/dist/components/search/index.js +20 -29
- package/dist/components/search/search.schema.dereffed.json +0 -133
- package/dist/components/search/search.schema.json +0 -6
- package/dist/components/search-bar/index.d.ts +29 -1
- package/dist/components/section/index.d.ts +1 -1
- package/dist/components/section/section.css +8 -12
- package/dist/components/section/section.schema.dereffed.json +1 -1
- package/dist/components/section/section.schema.json +1 -1
- package/dist/components/settings/settings.schema.dereffed.json +36 -50
- package/dist/components/slider/slider.css +2 -2
- package/dist/components/teaser-card/index.js +1 -1
- package/dist/components/teaser-card/teaser-card.css +10 -9
- package/dist/global.css +5 -68
- package/dist/static/fonts/dsa/HelveticaNeueMedium.woff2 +0 -0
- package/dist/static/logo-dark.svg +8 -12
- package/dist/static/logo.png +0 -0
- package/dist/static/logo.svg +8 -12
- package/dist/static/optoma/2989.jpg +0 -0
- package/dist/static/optoma/3081.jpg +0 -0
- package/dist/static/optoma/3124.jpg +0 -0
- package/dist/static/optoma/3276.jpg +0 -0
- package/dist/static/optoma/3333.jpg +0 -0
- package/dist/static/optoma/3342.jpg +0 -0
- package/dist/static/optoma/bannerimgpro.jpg +0 -0
- package/dist/static/optoma/beamer.jpg +0 -0
- package/dist/static/optoma/beamer.png +0 -0
- package/dist/static/optoma/beamer.svg +10 -0
- package/dist/static/optoma/creative-board-girl.jpg +0 -0
- package/dist/static/optoma/downloads/cad.png +0 -0
- package/dist/static/optoma/downloads/datenblatt.png +0 -0
- package/dist/static/optoma/downloads/gebrauchsanleitung.png +0 -0
- package/dist/static/optoma/hero.jpg +0 -0
- package/dist/static/optoma/interaktive-displays.svg +9 -0
- package/dist/static/optoma/landing-banner.jpg +0 -0
- package/dist/static/optoma/led.svg +21 -0
- package/dist/static/optoma/location-1.jpg +0 -0
- package/dist/static/optoma/location-2.jpg +0 -0
- package/dist/static/optoma/logo.svg +9 -0
- package/dist/static/optoma/l/303/266sungen.svg +13 -0
- package/dist/static/optoma/product-1.jpg +0 -0
- package/dist/static/optoma/product-1.png +0 -0
- package/dist/static/optoma/product-2.jpg +0 -0
- package/dist/static/optoma/product-2.png +0 -0
- package/dist/static/optoma/product-3.jpg +0 -0
- package/dist/static/optoma/product-3.png +0 -0
- package/dist/static/optoma/product-4.jpg +0 -0
- package/dist/static/optoma/product-4.png +0 -0
- package/dist/static/optoma/product-5.jpg +0 -0
- package/dist/static/optoma/product-6.jpg +0 -0
- package/dist/static/optoma/professionelle-displays.svg +4 -0
- package/dist/static/optoma/square-1.jpg +0 -0
- package/dist/static/optoma/square-2.jpg +0 -0
- package/dist/static/optoma/zubeh/303/266r.svg +5 -0
- package/dist/tokens/IconSprite.js +51 -0
- package/dist/tokens/icon-sprite.html +20 -0
- package/dist/tokens/themes.css +4 -4
- package/dist/tokens/tokens.css +350 -350
- package/dist/tokens/tokens.js +562 -557
- package/package.json +1 -1
- package/dist/HeadlineProps-e1305784.d.ts +0 -53
- package/dist/SearchBarProps-26263244.d.ts +0 -29
- /package/dist/{BlogTeaserProps-d62a0a9a.d.ts → BlogTeaserProps-f5855e93.d.ts} +0 -0
|
@@ -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
|
|
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 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 ariaLabel: 'Search Result: AI Conference 2023',\n showLink: true,\n text: 'Join us for the annual **AI Conference** bringing together experts from around the world.\\n Register now to secure your spot and learn about the latest advancements in AI.',\n title: 'AI Conference 2023',\n url: 'https://www.example.com/ai-conference-2023'\n },\n {\n ariaLabel: 'Search Result: Web Development Summit 2023',\n showLink: true,\n text: 'Explore the future of web development at the **Web Development Summit**.\\n Discover new technologies and network with industry leaders.',\n title: 'Web Development Summit 2023',\n url: 'https://www.example.com/web-development-summit-2023'\n },\n {\n ariaLabel: 'Search Result: Data Science Bootcamp',\n showLink: true,\n text: 'Enhance your skills with our **Data Science Bootcamp**.\\n Learn from experts and work on real-world projects.',\n title: 'Data Science Bootcamp',\n url: 'https://www.example.com/data-science-bootcamp'\n },\n {\n ariaLabel: 'Search Result: AI Conference 2023',\n showLink: true,\n text: 'Join us for the annual **AI Conference** bringing together experts from around the world.\\n Register now to secure your spot and learn about the latest advancements in AI.',\n title: 'AI Conference 2023',\n url: 'https://www.example.com/ai-conference-2023'\n },\n {\n ariaLabel: 'Search Result: Web Development Summit 2023',\n showLink: true,\n text: 'Explore the future of web development at the **Web Development Summit**.\\n Discover new technologies and network with industry leaders.',\n title: 'Web Development Summit 2023',\n url: 'https://www.example.com/web-development-summit-2023'\n },\n {\n ariaLabel: 'Search Result: Data Science Bootcamp',\n showLink: true,\n text: 'Enhance your skills with our **Data Science Bootcamp**.\\n Learn from experts and work on real-world projects.',\n title: 'Data Science Bootcamp',\n url: 'https://www.example.com/data-science-bootcamp'\n }\n ]}\n/>",
|
|
1196
1196
|
"args": {
|
|
1197
1197
|
"filter": {
|
|
1198
1198
|
"datePicker": {
|
|
@@ -1285,11 +1285,6 @@
|
|
|
1285
1285
|
"ctaText": "Show event"
|
|
1286
1286
|
}
|
|
1287
1287
|
],
|
|
1288
|
-
"headline": {
|
|
1289
|
-
"text": "Search",
|
|
1290
|
-
"level": "h1",
|
|
1291
|
-
"style": "h1"
|
|
1292
|
-
},
|
|
1293
1288
|
"searchFilter": {
|
|
1294
1289
|
"title": "Search Filters",
|
|
1295
1290
|
"categories": [
|
|
@@ -2909,7 +2904,7 @@
|
|
|
2909
2904
|
"id": "layout-footer--footer",
|
|
2910
2905
|
"group": "Layout/Footer",
|
|
2911
2906
|
"name": "Footer",
|
|
2912
|
-
"code": "<Footer\n byline=\"© 2024 systemics Inc. All rights reserved.\"\n logo={{\n alt: 'Systemics Logo',\n height: 40,\n homepageHref: '#',\n inverted: false,\n src: '/logo.svg',\n srcInverted: '/logo-inverted.svg',\n width: 176\n }}\n navItems={[\n {\n active: true,\n label: '
|
|
2907
|
+
"code": "<Footer\n byline=\"© 2024 systemics Inc. All rights reserved.\"\n logo={{\n alt: 'Systemics Logo',\n height: 40,\n homepageHref: '#',\n inverted: false,\n src: '/logo.svg',\n srcInverted: '/logo-inverted.svg',\n width: 176\n }}\n navItems={[\n {\n active: true,\n label: 'Beamer',\n url: '#'\n },\n {\n label: 'Interaktive Displays',\n url: '#'\n },\n {\n label: 'Professional Displays',\n url: '#'\n },\n {\n label: 'LED Displays',\n url: '#'\n },\n {\n label: 'Lösungen',\n url: '#'\n },\n {\n label: 'Zubehör',\n url: '#'\n },\n {\n label: 'Über Optoma',\n url: '#'\n },\n {\n label: 'Support',\n url: '#'\n }\n ]}\n/>",
|
|
2913
2908
|
"args": {
|
|
2914
2909
|
"logo": {
|
|
2915
2910
|
"src": "/logo.svg",
|
|
@@ -2925,43 +2920,36 @@
|
|
|
2925
2920
|
"navItems": [
|
|
2926
2921
|
{
|
|
2927
2922
|
"url": "#",
|
|
2928
|
-
"label": "
|
|
2923
|
+
"label": "Beamer",
|
|
2929
2924
|
"active": true
|
|
2930
2925
|
},
|
|
2931
2926
|
{
|
|
2932
2927
|
"url": "#",
|
|
2933
|
-
"label": "
|
|
2928
|
+
"label": "Interaktive Displays"
|
|
2934
2929
|
},
|
|
2935
2930
|
{
|
|
2936
2931
|
"url": "#",
|
|
2937
|
-
"label": "
|
|
2938
|
-
|
|
2939
|
-
|
|
2940
|
-
|
|
2941
|
-
|
|
2942
|
-
|
|
2943
|
-
|
|
2944
|
-
|
|
2945
|
-
|
|
2946
|
-
|
|
2947
|
-
|
|
2948
|
-
|
|
2949
|
-
|
|
2950
|
-
"label": "An Item with a longer Label"
|
|
2951
|
-
},
|
|
2952
|
-
{
|
|
2953
|
-
"url": "#",
|
|
2954
|
-
"label": "And One last one"
|
|
2955
|
-
}
|
|
2956
|
-
]
|
|
2932
|
+
"label": "Professional Displays"
|
|
2933
|
+
},
|
|
2934
|
+
{
|
|
2935
|
+
"url": "#",
|
|
2936
|
+
"label": "LED Displays"
|
|
2937
|
+
},
|
|
2938
|
+
{
|
|
2939
|
+
"url": "#",
|
|
2940
|
+
"label": "Lösungen"
|
|
2941
|
+
},
|
|
2942
|
+
{
|
|
2943
|
+
"url": "#",
|
|
2944
|
+
"label": "Zubehör"
|
|
2957
2945
|
},
|
|
2958
2946
|
{
|
|
2959
2947
|
"url": "#",
|
|
2960
|
-
"label": "
|
|
2948
|
+
"label": "Über Optoma"
|
|
2961
2949
|
},
|
|
2962
2950
|
{
|
|
2963
2951
|
"url": "#",
|
|
2964
|
-
"label": "
|
|
2952
|
+
"label": "Support"
|
|
2965
2953
|
}
|
|
2966
2954
|
]
|
|
2967
2955
|
},
|
|
@@ -3142,7 +3130,7 @@
|
|
|
3142
3130
|
"id": "layout-header--header",
|
|
3143
3131
|
"group": "Layout/Header",
|
|
3144
3132
|
"name": "Header",
|
|
3145
|
-
"code": "<Header\n logo={{\n alt: 'Systemics Logo',\n height: 40,\n homepageHref: '#',\n src: '/logo.svg',\n srcInverted: '/logo-inverted.svg',\n width: 176\n }}\n navItems={[\n {\n active: true,\n label: '
|
|
3133
|
+
"code": "<Header\n logo={{\n alt: 'Systemics Logo',\n height: 40,\n homepageHref: '#',\n src: '/logo.svg',\n srcInverted: '/logo-inverted.svg',\n width: 176\n }}\n navItems={[\n {\n active: true,\n label: 'Beamer',\n url: '#'\n },\n {\n label: 'Interaktive Displays',\n url: '#'\n },\n {\n label: 'Professional Displays',\n url: '#'\n },\n {\n label: 'LED Displays',\n url: '#'\n },\n {\n label: 'Lösungen',\n url: '#'\n },\n {\n label: 'Zubehör',\n url: '#'\n },\n {\n label: 'Über Optoma',\n url: '#'\n },\n {\n label: 'Support',\n url: '#'\n }\n ]}\n/>",
|
|
3146
3134
|
"args": {
|
|
3147
3135
|
"logo": {
|
|
3148
3136
|
"src": "/logo.svg",
|
|
@@ -3159,43 +3147,36 @@
|
|
|
3159
3147
|
"navItems": [
|
|
3160
3148
|
{
|
|
3161
3149
|
"url": "#",
|
|
3162
|
-
"label": "
|
|
3150
|
+
"label": "Beamer",
|
|
3163
3151
|
"active": true
|
|
3164
3152
|
},
|
|
3165
3153
|
{
|
|
3166
3154
|
"url": "#",
|
|
3167
|
-
"label": "
|
|
3155
|
+
"label": "Interaktive Displays"
|
|
3168
3156
|
},
|
|
3169
3157
|
{
|
|
3170
3158
|
"url": "#",
|
|
3171
|
-
"label": "
|
|
3172
|
-
|
|
3173
|
-
|
|
3174
|
-
|
|
3175
|
-
|
|
3176
|
-
|
|
3177
|
-
|
|
3178
|
-
|
|
3179
|
-
|
|
3180
|
-
|
|
3181
|
-
|
|
3182
|
-
|
|
3183
|
-
|
|
3184
|
-
"label": "An Item with a longer Label"
|
|
3185
|
-
},
|
|
3186
|
-
{
|
|
3187
|
-
"url": "#",
|
|
3188
|
-
"label": "And One last one"
|
|
3189
|
-
}
|
|
3190
|
-
]
|
|
3159
|
+
"label": "Professional Displays"
|
|
3160
|
+
},
|
|
3161
|
+
{
|
|
3162
|
+
"url": "#",
|
|
3163
|
+
"label": "LED Displays"
|
|
3164
|
+
},
|
|
3165
|
+
{
|
|
3166
|
+
"url": "#",
|
|
3167
|
+
"label": "Lösungen"
|
|
3168
|
+
},
|
|
3169
|
+
{
|
|
3170
|
+
"url": "#",
|
|
3171
|
+
"label": "Zubehör"
|
|
3191
3172
|
},
|
|
3192
3173
|
{
|
|
3193
3174
|
"url": "#",
|
|
3194
|
-
"label": "
|
|
3175
|
+
"label": "Über Optoma"
|
|
3195
3176
|
},
|
|
3196
3177
|
{
|
|
3197
3178
|
"url": "#",
|
|
3198
|
-
"label": "
|
|
3179
|
+
"label": "Support"
|
|
3199
3180
|
}
|
|
3200
3181
|
]
|
|
3201
3182
|
},
|
|
@@ -5,19 +5,9 @@ import { FC, PropsWithChildren } from "react";
|
|
|
5
5
|
* DO NOT MODIFY IT BY HAND. Instead, modify the source JSONSchema file,
|
|
6
6
|
* and run json-schema-to-typescript to regenerate this file.
|
|
7
7
|
*/
|
|
8
|
-
import { HeadlineProps } from "../../HeadlineProps-e1305784.js";
|
|
9
|
-
import { SearchBarProps } from "../../SearchBarProps-26263244.js";
|
|
10
8
|
import { SearchFilterProps } from "../../SearchFilterProps-2fa6419b.js";
|
|
11
9
|
import { SearchResultProps } from "../../SearchResultProps-224c2338.js";
|
|
12
10
|
interface SearchProps {
|
|
13
|
-
/**
|
|
14
|
-
* Referenced component HeadlineProps
|
|
15
|
-
*/
|
|
16
|
-
headline?: HeadlineProps;
|
|
17
|
-
/**
|
|
18
|
-
* Referenced component SearchBarProps
|
|
19
|
-
*/
|
|
20
|
-
searchBar?: SearchBarProps;
|
|
21
11
|
/**
|
|
22
12
|
* Referenced component SearchFilterProps
|
|
23
13
|
*/
|
|
@@ -1,12 +1,10 @@
|
|
|
1
|
-
import {
|
|
1
|
+
import { jsx, Fragment, jsxs } from 'react/jsx-runtime';
|
|
2
2
|
import { Section } from '../section/index.js';
|
|
3
3
|
import { SplitWeighted } from '../split-weighted/index.js';
|
|
4
4
|
import { SearchFilter } from '../search-filter/index.js';
|
|
5
5
|
import { SearchResult } from '../search-result/index.js';
|
|
6
6
|
import { RichText } from '@kickstartds/base/lib/rich-text';
|
|
7
7
|
import { Pagination } from '../pagination/index.js';
|
|
8
|
-
import { SearchBar } from '../search-bar/index.js';
|
|
9
|
-
import { Headline } from '../headline/index.js';
|
|
10
8
|
import 'react';
|
|
11
9
|
import 'classnames';
|
|
12
10
|
import '@kickstartds/core/lib/react';
|
|
@@ -17,33 +15,26 @@ import '../../helpers-12f48df8.js';
|
|
|
17
15
|
import 'markdown-to-jsx';
|
|
18
16
|
import '@kickstartds/base/lib/link';
|
|
19
17
|
import '@kickstartds/base/lib/icon';
|
|
20
|
-
import '@kickstartds/form/lib/text-field';
|
|
21
|
-
import '@kickstartds/base/lib/headline';
|
|
22
18
|
|
|
23
|
-
const Search = ({
|
|
24
|
-
|
|
25
|
-
|
|
26
|
-
|
|
27
|
-
|
|
28
|
-
|
|
29
|
-
|
|
30
|
-
|
|
31
|
-
|
|
32
|
-
|
|
33
|
-
|
|
34
|
-
|
|
35
|
-
|
|
36
|
-
|
|
37
|
-
|
|
38
|
-
|
|
39
|
-
|
|
40
|
-
|
|
41
|
-
|
|
42
|
-
},
|
|
43
|
-
{
|
|
44
|
-
url: "https://example.com/page3",
|
|
45
|
-
},
|
|
46
|
-
] })] }) }) })] }));
|
|
19
|
+
const Search = ({ searchFilter, searchResults, }) => (jsx(Fragment, { children: jsx(Section, { width: "wide", children: jsx(SplitWeighted, { verticalAlign: "sticky", mainLayout: {
|
|
20
|
+
minWidth: "narrow",
|
|
21
|
+
}, asideLayout: {
|
|
22
|
+
gutter: "small",
|
|
23
|
+
}, order: {
|
|
24
|
+
desktop: "asideFirst",
|
|
25
|
+
mobile: "asideFirst",
|
|
26
|
+
}, aside: jsxs(Fragment, { children: [jsx(SearchFilter, { ...searchFilter }), jsx(RichText, { text: `Showing 6 out of 18 results` })] }), main: jsxs(Fragment, { children: [searchResults.map((searchResult, index) => (jsx(SearchResult, { ...searchResult }, index))), jsx(Pagination, { pages: [
|
|
27
|
+
{
|
|
28
|
+
url: "https://example.com/page1",
|
|
29
|
+
active: true,
|
|
30
|
+
},
|
|
31
|
+
{
|
|
32
|
+
url: "https://example.com/page2",
|
|
33
|
+
},
|
|
34
|
+
{
|
|
35
|
+
url: "https://example.com/page3",
|
|
36
|
+
},
|
|
37
|
+
] })] }) }) }) }));
|
|
47
38
|
Search.displayName = "Search";
|
|
48
39
|
|
|
49
40
|
export { Search };
|
|
@@ -4,139 +4,6 @@
|
|
|
4
4
|
"title": "Search",
|
|
5
5
|
"type": "object",
|
|
6
6
|
"properties": {
|
|
7
|
-
"headline": {
|
|
8
|
-
"$schema": "http://json-schema.org/draft-07/schema#",
|
|
9
|
-
"$id": "http://schema.mydesignsystem.com/headline.schema.json",
|
|
10
|
-
"title": "Headline",
|
|
11
|
-
"description": "Component used for headlines",
|
|
12
|
-
"type": "object",
|
|
13
|
-
"properties": {
|
|
14
|
-
"text": {
|
|
15
|
-
"type": "string",
|
|
16
|
-
"title": "Text",
|
|
17
|
-
"description": "Text content of headline",
|
|
18
|
-
"format": "markdown"
|
|
19
|
-
},
|
|
20
|
-
"sub": {
|
|
21
|
-
"type": "string",
|
|
22
|
-
"title": "Sub",
|
|
23
|
-
"description": "Subheadline content",
|
|
24
|
-
"format": "markdown"
|
|
25
|
-
},
|
|
26
|
-
"switchOrder": {
|
|
27
|
-
"type": "boolean",
|
|
28
|
-
"title": "Switch order?",
|
|
29
|
-
"description": "Switch order of headline and subheadline",
|
|
30
|
-
"default": false
|
|
31
|
-
},
|
|
32
|
-
"align": {
|
|
33
|
-
"type": "string",
|
|
34
|
-
"title": "Section alignment",
|
|
35
|
-
"enum": [
|
|
36
|
-
"left",
|
|
37
|
-
"center",
|
|
38
|
-
"right"
|
|
39
|
-
]
|
|
40
|
-
},
|
|
41
|
-
"level": {
|
|
42
|
-
"type": "string",
|
|
43
|
-
"title": "Level",
|
|
44
|
-
"description": "Level of headline to use",
|
|
45
|
-
"enum": [
|
|
46
|
-
"h1",
|
|
47
|
-
"h2",
|
|
48
|
-
"h3",
|
|
49
|
-
"h4",
|
|
50
|
-
"p"
|
|
51
|
-
],
|
|
52
|
-
"default": "h2"
|
|
53
|
-
},
|
|
54
|
-
"style": {
|
|
55
|
-
"type": "string",
|
|
56
|
-
"title": "Style",
|
|
57
|
-
"description": "Style of headline to show",
|
|
58
|
-
"enum": [
|
|
59
|
-
"h1",
|
|
60
|
-
"h2",
|
|
61
|
-
"h3",
|
|
62
|
-
"h4",
|
|
63
|
-
"p"
|
|
64
|
-
],
|
|
65
|
-
"default": "h2"
|
|
66
|
-
},
|
|
67
|
-
"spaceAfter": {
|
|
68
|
-
"type": "string",
|
|
69
|
-
"title": "Space after?",
|
|
70
|
-
"description": "Whether to display space after headline",
|
|
71
|
-
"enum": [
|
|
72
|
-
"minimum",
|
|
73
|
-
"small",
|
|
74
|
-
"large"
|
|
75
|
-
],
|
|
76
|
-
"default": "small"
|
|
77
|
-
},
|
|
78
|
-
"className": {
|
|
79
|
-
"type": "string",
|
|
80
|
-
"title": "Class Name",
|
|
81
|
-
"description": "Set a custom class name"
|
|
82
|
-
},
|
|
83
|
-
"id": {
|
|
84
|
-
"type": "string",
|
|
85
|
-
"title": "ID",
|
|
86
|
-
"description": "Set a custom id attribute"
|
|
87
|
-
}
|
|
88
|
-
},
|
|
89
|
-
"additionalProperties": false,
|
|
90
|
-
"required": [
|
|
91
|
-
"level",
|
|
92
|
-
"text"
|
|
93
|
-
]
|
|
94
|
-
},
|
|
95
|
-
"searchBar": {
|
|
96
|
-
"$schema": "http://json-schema.org/draft-07/schema#",
|
|
97
|
-
"$id": "http://schema.mydesignsystem.com/search-bar.schema.json",
|
|
98
|
-
"title": "Search Bar",
|
|
99
|
-
"type": "object",
|
|
100
|
-
"properties": {
|
|
101
|
-
"placeholder": {
|
|
102
|
-
"title": "Placeholder",
|
|
103
|
-
"type": "string",
|
|
104
|
-
"description": "Placeholder text for the search input field.",
|
|
105
|
-
"examples": [
|
|
106
|
-
"Search..."
|
|
107
|
-
]
|
|
108
|
-
},
|
|
109
|
-
"buttonText": {
|
|
110
|
-
"type": "string",
|
|
111
|
-
"description": "Text displayed on the search button.",
|
|
112
|
-
"examples": [
|
|
113
|
-
"Search"
|
|
114
|
-
]
|
|
115
|
-
},
|
|
116
|
-
"hint": {
|
|
117
|
-
"type": "string",
|
|
118
|
-
"description": "Additional information or instructions related to the search functionality.",
|
|
119
|
-
"examples": [
|
|
120
|
-
"Press <kbd>Enter</kbd> to search"
|
|
121
|
-
]
|
|
122
|
-
},
|
|
123
|
-
"alternativeText": {
|
|
124
|
-
"type": "string",
|
|
125
|
-
"description": "Text to display when offering alternative results.",
|
|
126
|
-
"examples": [
|
|
127
|
-
"Did you mean"
|
|
128
|
-
]
|
|
129
|
-
},
|
|
130
|
-
"alternativeResult": {
|
|
131
|
-
"type": "string",
|
|
132
|
-
"description": "The alternative result to display when offering suggestions.",
|
|
133
|
-
"examples": [
|
|
134
|
-
"AI Conference"
|
|
135
|
-
]
|
|
136
|
-
}
|
|
137
|
-
},
|
|
138
|
-
"additionalProperties": false
|
|
139
|
-
},
|
|
140
7
|
"searchFilter": {
|
|
141
8
|
"$schema": "http://json-schema.org/draft-07/schema#",
|
|
142
9
|
"$id": "http://schema.mydesignsystem.com/search-filter.schema.json",
|
|
@@ -4,12 +4,6 @@
|
|
|
4
4
|
"title": "Search",
|
|
5
5
|
"type": "object",
|
|
6
6
|
"properties": {
|
|
7
|
-
"headline": {
|
|
8
|
-
"$ref": "http://schema.mydesignsystem.com/headline.schema.json"
|
|
9
|
-
},
|
|
10
|
-
"searchBar": {
|
|
11
|
-
"$ref": "http://schema.mydesignsystem.com/search-bar.schema.json"
|
|
12
|
-
},
|
|
13
7
|
"searchFilter": {
|
|
14
8
|
"$ref": "http://schema.mydesignsystem.com/search-filter.schema.json"
|
|
15
9
|
},
|
|
@@ -1,5 +1,33 @@
|
|
|
1
1
|
/// <reference types="react" />
|
|
2
|
-
|
|
2
|
+
/* eslint-disable */
|
|
3
|
+
/**
|
|
4
|
+
* This file was automatically generated by json-schema-to-typescript.
|
|
5
|
+
* DO NOT MODIFY IT BY HAND. Instead, modify the source JSONSchema file,
|
|
6
|
+
* and run json-schema-to-typescript to regenerate this file.
|
|
7
|
+
*/
|
|
8
|
+
/**
|
|
9
|
+
* Placeholder text for the search input field.
|
|
10
|
+
*/
|
|
11
|
+
type Placeholder = string;
|
|
12
|
+
interface SearchBarProps {
|
|
13
|
+
placeholder?: Placeholder;
|
|
14
|
+
/**
|
|
15
|
+
* Text displayed on the search button.
|
|
16
|
+
*/
|
|
17
|
+
buttonText?: string;
|
|
18
|
+
/**
|
|
19
|
+
* Additional information or instructions related to the search functionality.
|
|
20
|
+
*/
|
|
21
|
+
hint?: string;
|
|
22
|
+
/**
|
|
23
|
+
* Text to display when offering alternative results.
|
|
24
|
+
*/
|
|
25
|
+
alternativeText?: string;
|
|
26
|
+
/**
|
|
27
|
+
* The alternative result to display when offering suggestions.
|
|
28
|
+
*/
|
|
29
|
+
alternativeResult?: string;
|
|
30
|
+
}
|
|
3
31
|
declare const SearchBarContextDefault: import("react").ForwardRefExoticComponent<SearchBarProps & import("react").RefAttributes<HTMLDivElement>>;
|
|
4
32
|
declare const SearchBarContext: import("react").Context<import("react").ForwardRefExoticComponent<SearchBarProps & import("react").RefAttributes<HTMLDivElement>>>;
|
|
5
33
|
declare const SearchBar: import("react").ForwardRefExoticComponent<SearchBarProps & import("react").RefAttributes<HTMLDivElement>>;
|
|
@@ -1,6 +1,6 @@
|
|
|
1
1
|
/// <reference types="react" />
|
|
2
2
|
import { HTMLAttributes, FC, PropsWithChildren } from "react";
|
|
3
|
-
import { SectionProps } from "../../SectionProps-
|
|
3
|
+
import { SectionProps } from "../../SectionProps-2a23ef89.js";
|
|
4
4
|
declare const SectionContextDefault: import("react").ForwardRefExoticComponent<SectionProps & Omit<HTMLAttributes<HTMLElement>, "style" | "content"> & import("react").RefAttributes<HTMLDivElement>>;
|
|
5
5
|
declare const SectionContext: import("react").Context<import("react").ForwardRefExoticComponent<SectionProps & Omit<HTMLAttributes<HTMLElement>, "style" | "content"> & import("react").RefAttributes<HTMLDivElement>>>;
|
|
6
6
|
declare const Section: import("react").ForwardRefExoticComponent<SectionProps & Omit<HTMLAttributes<HTMLElement>, "style" | "content"> & import("react").RefAttributes<HTMLDivElement>>;
|
|
@@ -26,17 +26,13 @@
|
|
|
26
26
|
--dsa-section--background-color_default: var(--ks-background-color-default);
|
|
27
27
|
--dsa-section--background-color_accent: var(--ks-background-color-accent);
|
|
28
28
|
--dsa-section--background-color_bold: var(--ks-background-color-bold);
|
|
29
|
-
--dsa-section--transition_to-default: linear-gradient(
|
|
30
|
-
|
|
31
|
-
|
|
32
|
-
var(--ks-background-color-default) 75%
|
|
33
|
-
);
|
|
34
|
-
--dsa-section--transition_to-accent: linear-gradient(178deg, transparent 75%, var(--ks-background-color-accent) 75%);
|
|
35
|
-
--dsa-section--transition_to-bold: linear-gradient(178deg, transparent 75%, var(--ks-background-color-bold) 75%);
|
|
29
|
+
--dsa-section--transition_to-default: linear-gradient(180deg, transparent, var(--ks-background-color-default));
|
|
30
|
+
--dsa-section--transition_to-accent: linear-gradient(180deg, transparent, var(--ks-background-color-accent));
|
|
31
|
+
--dsa-section--transition_to-bold: linear-gradient(180deg, transparent, var(--ks-background-color-bold));
|
|
36
32
|
--dsa-section--transition_to-inverted: linear-gradient(
|
|
37
|
-
|
|
38
|
-
transparent
|
|
39
|
-
var(--ks-background-color-default-inverted)
|
|
33
|
+
180deg,
|
|
34
|
+
transparent,
|
|
35
|
+
var(--ks-background-color-default-inverted)
|
|
40
36
|
);
|
|
41
37
|
--dsa-section__slider-arrow--color: var(--ks-text-color-interface-interactive);
|
|
42
38
|
--dsa-section__slider-arrow--size: 2rem;
|
|
@@ -139,8 +135,8 @@
|
|
|
139
135
|
.l-section.dsa-section-style--deko {
|
|
140
136
|
background-image: var(--dsa-section_deko--background-image, radial-gradient(180deg, transparent 0%, var(--ks-background-color-default) 100%));
|
|
141
137
|
}
|
|
142
|
-
.l-section.dsa-section-style--
|
|
143
|
-
background-image: var(--
|
|
138
|
+
.l-section.dsa-section-style--inset {
|
|
139
|
+
background-image: linear-gradient(180deg, var(--ks-color-fg-alpha-9) 0%, transparent 5px), linear-gradient(180deg, var(--ks-color-fg-alpha-9) 0%, transparent 30px), linear-gradient(180deg, transparent calc(100% - 30px), var(--ks-color-fg-alpha-9) 100%), linear-gradient(180deg, transparent calc(100% - 5px), var(--ks-color-fg-alpha-9) 100%), radial-gradient(100% 100% at 50% 50%, var(--ks-color-bg), var(--ks-color-bg-to-fg-1));
|
|
144
140
|
}
|
|
145
141
|
.l-section.dsa-section--spotlight {
|
|
146
142
|
position: relative;
|