@kickstartds/ds-agency-premium 1.5.25 → 1.5.26--canary.994.190c0e1.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-83d399b4.d.ts → BlogOverviewProps-9f207f1c.d.ts} +1 -1
- package/dist/{BlogPostProps-d9decb7c.d.ts → BlogPostProps-6b3cff22.d.ts} +1 -1
- package/dist/{PageProps-83d399b4.d.ts → PageProps-aa29c554.d.ts} +1 -1
- package/dist/{SectionProps-03ff6d21.d.ts → SectionProps-83d399b4.d.ts} +1 -1
- package/dist/components/blog-aside/blog-aside.css +2 -6
- package/dist/components/blog-overview/index.d.ts +1 -1
- package/dist/components/blog-post/index.d.ts +1 -1
- package/dist/components/contact/contact.css +0 -2
- package/dist/components/footer/footer.css +2 -2
- package/dist/components/footer/index.d.ts +3 -6
- package/dist/components/footer/index.js +3 -8
- package/dist/components/image-story/index.d.ts +1 -1
- package/dist/components/index/index.d.ts +3 -3
- package/dist/components/page/index.d.ts +1 -1
- package/dist/components/page-wrapper/tokens.css +5 -5
- package/dist/components/presets.json +0 -20
- package/dist/components/section/index.d.ts +1 -1
- package/dist/global.css +4 -8
- package/dist/tokens/themes.css +4 -4
- package/dist/tokens/tokens.css +5 -5
- package/dist/tokens/tokens.js +5 -5
- package/package.json +2 -1
- package/dist/components/divider/divider.css +0 -13
- package/dist/components/divider/divider.schema.dereffed.json +0 -33
- package/dist/components/divider/divider.schema.json +0 -27
- package/dist/components/divider/index.d.ts +0 -33
- package/dist/components/divider/index.js +0 -16
- /package/dist/{ImageStoryProps-03ff6d21.d.ts → ImageStoryProps-e853e1e7.d.ts} +0 -0
|
@@ -3,7 +3,7 @@
|
|
|
3
3
|
* DO NOT MODIFY IT BY HAND. Instead, modify the source JSONSchema file,
|
|
4
4
|
* and run json-schema-to-typescript to regenerate this file.
|
|
5
5
|
*/
|
|
6
|
-
import { SectionProps } from "./SectionProps-
|
|
6
|
+
import { SectionProps } from "./SectionProps-83d399b4.js";
|
|
7
7
|
import { BlogTeaserProps } from "./BlogTeaserProps-f5855e93.js";
|
|
8
8
|
import { CtaProps } from "./CtaProps-93230a76.js";
|
|
9
9
|
import { SeoProps } from "./SeoProps-f2d6dcaa.js";
|
|
@@ -5,7 +5,7 @@
|
|
|
5
5
|
*/
|
|
6
6
|
import { BlogHeadProps } from "./BlogHeadProps-3f6e4072.js";
|
|
7
7
|
import { BlogAsideProps } from "./BlogAsideProps-d9decb7c.js";
|
|
8
|
-
import { SectionProps } from "./SectionProps-
|
|
8
|
+
import { SectionProps } from "./SectionProps-83d399b4.js";
|
|
9
9
|
import { CtaProps } from "./CtaProps-93230a76.js";
|
|
10
10
|
import { SeoProps } from "./SeoProps-f2d6dcaa.js";
|
|
11
11
|
/**
|
|
@@ -3,7 +3,7 @@
|
|
|
3
3
|
* DO NOT MODIFY IT BY HAND. Instead, modify the source JSONSchema file,
|
|
4
4
|
* and run json-schema-to-typescript to regenerate this file.
|
|
5
5
|
*/
|
|
6
|
-
import { SectionProps } from "./SectionProps-
|
|
6
|
+
import { SectionProps } from "./SectionProps-83d399b4.js";
|
|
7
7
|
import { SeoProps } from "./SeoProps-f2d6dcaa.js";
|
|
8
8
|
/**
|
|
9
9
|
* Collection of sections (with their contents) to render on the page
|
|
@@ -8,7 +8,7 @@ import { FaqProps } from "./FaqProps-ad618cd5.js";
|
|
|
8
8
|
import { FeaturesProps } from "./FeaturesProps-b05859d6.js";
|
|
9
9
|
import { GalleryProps } from "./GalleryProps-76e7de44.js";
|
|
10
10
|
import { HeroProps } from "./HeroProps-cf82a16d.js";
|
|
11
|
-
import { ImageStoryProps } from "./ImageStoryProps-
|
|
11
|
+
import { ImageStoryProps } from "./ImageStoryProps-e853e1e7.js";
|
|
12
12
|
import { ImageTextProps } from "./ImageTextProps-9286cca4.js";
|
|
13
13
|
import { LogosProps } from "./LogosProps-f9474fe2.js";
|
|
14
14
|
import { MosaicProps } from "./MosaicProps-d52c7151.js";
|
|
@@ -10,8 +10,6 @@
|
|
|
10
10
|
--dsa-blog-aside__author__image--flex-basis: 120px;
|
|
11
11
|
--dsa-blog-aside__author__body--flex-basis: 240px;
|
|
12
12
|
--dsa-blog-aside__author__link--font: var(--ks-font-interface-s);
|
|
13
|
-
--dsa-blog-aside__author--gap-horizontal: var(--ks-spacing-inline-xs);
|
|
14
|
-
--dsa-blog-aside__author--gap-vertical: var(--ks-spacing-stack-xs);
|
|
15
13
|
--dsa-blog-aside__meta__item--font: var(--ks-font-interface-s);
|
|
16
14
|
--dsa-blog-aside__meta__item--color: var(--ks-text-color-interface);
|
|
17
15
|
--dsa-blog-aside__meta__item__icon--size: 1.2em;
|
|
@@ -25,8 +23,6 @@
|
|
|
25
23
|
--dsa-blog-aside__author__title--font: var(--ks-font-copy-l);
|
|
26
24
|
--dsa-blog-aside__author__subtitle--font: var(--ks-font-copy-m);
|
|
27
25
|
--dsa-blog-aside__author__link--font: var(--ks-font-interface-m);
|
|
28
|
-
--dsa-blog-aside__author--gap-horizontal: var(--ks-spacing-stack-s);
|
|
29
|
-
--dsa-blog-aside__author--gap-vertical: var(--ks-spacing-inline-l);
|
|
30
26
|
--dsa-blog-aside__meta__item--font: var(--ks-font-interface-m);
|
|
31
27
|
--dsa-blog-aside__share-bar__icon--size: 2em;
|
|
32
28
|
}
|
|
@@ -43,8 +39,8 @@
|
|
|
43
39
|
gap: var(--dsa-blog-aside--gap);
|
|
44
40
|
}
|
|
45
41
|
.dsa-blog-aside .dsa-contact {
|
|
46
|
-
--dsa-contact--gap-vertical: var(--dsa-blog-
|
|
47
|
-
--dsa-contact--gap-horizontal: var(--dsa-blog-
|
|
42
|
+
--dsa-contact--gap-vertical: var(--dsa-blog-asde__author--gap-vertical, var(--ks-spacing-stack-xs));
|
|
43
|
+
--dsa-contact--gap-horizontal: var(--dsa-blog-asde__author--gap-horizontal, var(--ks-spacing-inline-xs));
|
|
48
44
|
--dsa-contact__image--flex-basis: var(--dsa-blog-aside__author__image--flex-basis, 200px);
|
|
49
45
|
--dsa-contact__body--flex-basis: var(--dsa-blog-aside__author__body--flex-basis, 300px);
|
|
50
46
|
--dsa-contact__title--font: var(--dsa-blog-aside__author__title--font, var(--ks-font-copy-m));
|
|
@@ -1,4 +1,4 @@
|
|
|
1
|
-
import { BlogOverviewProps } from "../../BlogOverviewProps-
|
|
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 { BlogOverview };
|
|
@@ -10,7 +10,7 @@
|
|
|
10
10
|
--dsa-footer__link--font-weight: var(--dsa-link--font-weight);
|
|
11
11
|
--dsa-footer__link--color: var(--dsa-link--color);
|
|
12
12
|
--dsa-footer__link--text-tecoration: none;
|
|
13
|
-
--dsa-footer__link--text-
|
|
13
|
+
--dsa-footer__link--text-tecorationhover: underline;
|
|
14
14
|
--dsa-footer__logo--height: 1.5rem;
|
|
15
15
|
}
|
|
16
16
|
@media (min-width: 62em) {
|
|
@@ -57,6 +57,6 @@
|
|
|
57
57
|
text-decoration: var(--dsa-footer__link--text-tecoration, none);
|
|
58
58
|
}
|
|
59
59
|
.dsa-footer__link:not(.c-button):hover {
|
|
60
|
-
text-decoration: var(--dsa-footer__link--text-
|
|
60
|
+
text-decoration: var(--dsa-footer__link--text-tecoration-hover, underline);
|
|
61
61
|
color: var(--dsa-footer__link--color_hover, var(--dsa-link--color_hover));
|
|
62
62
|
}
|
|
@@ -1,7 +1,4 @@
|
|
|
1
|
-
|
|
1
|
+
import { FC } from "react";
|
|
2
2
|
import { FooterProps } from "../../FooterProps-171a3067.js";
|
|
3
|
-
|
|
4
|
-
|
|
5
|
-
declare const FooterContext: import("react").Context<import("react").ForwardRefExoticComponent<FooterProps & HTMLAttributes<HTMLDivElement> & import("react").RefAttributes<HTMLDivElement>>>;
|
|
6
|
-
declare const Footer: import("react").ForwardRefExoticComponent<FooterProps & HTMLAttributes<HTMLDivElement> & import("react").RefAttributes<HTMLDivElement>>;
|
|
7
|
-
export { FooterContextDefault, FooterContext, Footer };
|
|
3
|
+
declare const Footer: FC<FooterProps>;
|
|
4
|
+
export { Footer };
|
|
@@ -1,17 +1,12 @@
|
|
|
1
1
|
import "./footer.css";
|
|
2
|
-
import {
|
|
2
|
+
import { createElement } from 'react';
|
|
3
3
|
import { jsx, jsxs } from 'react/jsx-runtime';
|
|
4
4
|
import classnames from 'classnames';
|
|
5
5
|
import { Link } from '@kickstartds/base/lib/link';
|
|
6
6
|
import { Logo } from '../logo/index.js';
|
|
7
7
|
import '@kickstartds/base/lib/picture';
|
|
8
8
|
|
|
9
|
-
const
|
|
10
|
-
const FooterContext = createContext(FooterContextDefault);
|
|
11
|
-
const Footer = forwardRef((props, ref) => {
|
|
12
|
-
const Component = useContext(FooterContext);
|
|
13
|
-
return jsx(Component, { ...props, ref: ref });
|
|
14
|
-
});
|
|
9
|
+
const Footer = ({ logo, byline, inverted = false, navItems = [], }) => (jsx("div", { className: classnames("dsa-footer"), "ks-inverted": inverted.toString(), children: jsxs("div", { className: "dsa-footer__content", children: [jsx(Logo, { ...logo, inverted: inverted }), byline && jsx("span", { className: "dsa-footer__byline", children: byline }), navItems.length > 0 ? (jsx("div", { className: "dsa-footer__links", children: navItems.map(({ label, active, ...linkProps }) => (createElement(Link, { ...linkProps, className: "dsa-footer__link", key: linkProps.href + label }, label))) })) : null] }) }));
|
|
15
10
|
Footer.displayName = "Footer";
|
|
16
11
|
|
|
17
|
-
export { Footer
|
|
12
|
+
export { Footer };
|
|
@@ -1,6 +1,6 @@
|
|
|
1
1
|
/// <reference types="react" />
|
|
2
2
|
import { HTMLAttributes } from "react";
|
|
3
|
-
import { ImageStoryProps } from "../../ImageStoryProps-
|
|
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>>;
|
|
@@ -24,7 +24,7 @@ interface SettingsProps {
|
|
|
24
24
|
*/
|
|
25
25
|
seo: SeoProps;
|
|
26
26
|
}
|
|
27
|
-
export * from "../../BlogPostProps-
|
|
28
|
-
export * from "../../BlogOverviewProps-
|
|
29
|
-
export * from "../../PageProps-
|
|
27
|
+
export * from "../../BlogPostProps-6b3cff22.js";
|
|
28
|
+
export * from "../../BlogOverviewProps-9f207f1c.js";
|
|
29
|
+
export * from "../../PageProps-aa29c554.js";
|
|
30
30
|
export { SettingsProps };
|
|
@@ -1,6 +1,6 @@
|
|
|
1
1
|
/**
|
|
2
2
|
* Do not edit directly
|
|
3
|
-
* Generated on Tue, 10 Sep 2024
|
|
3
|
+
* Generated on Tue, 10 Sep 2024 15:41:45 GMT
|
|
4
4
|
*/
|
|
5
5
|
:root, [ks-theme] {
|
|
6
6
|
--ks-background-color-accent-base: var(--ks-color-primary-to-bg-8-base);
|
|
@@ -115,8 +115,8 @@
|
|
|
115
115
|
--ks-background-color-secondary-inverted-interactive-active-base: var(--ks-color-secondary-inverted-to-bg-2-base);
|
|
116
116
|
--ks-background-color-secondary-inverted-interactive-selected-base: var(--ks-color-secondary-inverted-to-bg-4-base);
|
|
117
117
|
--ks-background-color-secondary-inverted-translucent-base: var(--ks-color-secondary-inverted-alpha-5-base);
|
|
118
|
-
--ks-border-color-accent-base: var(--ks-color-
|
|
119
|
-
--ks-border-color-accent-inverted-base: var(--ks-color-
|
|
118
|
+
--ks-border-color-accent-base: var(--ks-color-fg-to-bg-7-base);
|
|
119
|
+
--ks-border-color-accent-inverted-base: var(--ks-color-fg-inverted-to-bg-7-base);
|
|
120
120
|
--ks-border-color-clear-base: var(--ks-color-transparent-base);
|
|
121
121
|
--ks-border-color-clear-interactive-base: var(--ks-color-transparent-base);
|
|
122
122
|
--ks-border-color-clear-interactive-hover-base: var(--ks-color-primary-alpha-8-base);
|
|
@@ -127,8 +127,8 @@
|
|
|
127
127
|
--ks-border-color-clear-inverted-interactive-hover-base: var(--ks-color-primary-inverted-alpha-7-base);
|
|
128
128
|
--ks-border-color-clear-inverted-interactive-active-base: var(--ks-color-primary-inverted-alpha-6-base);
|
|
129
129
|
--ks-border-color-clear-inverted-interactive-selected-base: var(--ks-color-primary-inverted-alpha-5-base);
|
|
130
|
-
--ks-border-color-default-base: var(--ks-color-fg-
|
|
131
|
-
--ks-border-color-default-inverted-base: var(--ks-color-fg-
|
|
130
|
+
--ks-border-color-default-base: var(--ks-color-fg-inverted-base);
|
|
131
|
+
--ks-border-color-default-inverted-base: var(--ks-color-fg-alpha-3-base);
|
|
132
132
|
--ks-border-color-interface-base: var(--ks-color-fg-alpha-8-base);
|
|
133
133
|
--ks-border-color-interface-interactive-base: var(--ks-color-fg-alpha-7-base);
|
|
134
134
|
--ks-border-color-interface-interactive-disabled-base: var(--ks-color-fg-alpha-8-base);
|
|
@@ -1185,26 +1185,6 @@
|
|
|
1185
1185
|
},
|
|
1186
1186
|
"screenshot": "img/screenshots/components-cta--align-bottom.png"
|
|
1187
1187
|
},
|
|
1188
|
-
{
|
|
1189
|
-
"id": "components-divider--accent",
|
|
1190
|
-
"group": "Components/Divider",
|
|
1191
|
-
"name": "Accent",
|
|
1192
|
-
"code": "<No Display Name variant=\"accent\" />",
|
|
1193
|
-
"args": {
|
|
1194
|
-
"variant": "accent"
|
|
1195
|
-
},
|
|
1196
|
-
"screenshot": "img/screenshots/components-divider--accent.png"
|
|
1197
|
-
},
|
|
1198
|
-
{
|
|
1199
|
-
"id": "components-divider--default",
|
|
1200
|
-
"group": "Components/Divider",
|
|
1201
|
-
"name": "Default",
|
|
1202
|
-
"code": "<No Display Name variant=\"default\" />",
|
|
1203
|
-
"args": {
|
|
1204
|
-
"variant": "default"
|
|
1205
|
-
},
|
|
1206
|
-
"screenshot": "img/screenshots/components-divider--default.png"
|
|
1207
|
-
},
|
|
1208
1188
|
{
|
|
1209
1189
|
"id": "components-faq--dropdown-list",
|
|
1210
1190
|
"group": "Components/Faq",
|
|
@@ -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-83d399b4.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>>;
|
package/dist/global.css
CHANGED
|
@@ -507,19 +507,15 @@ h3 {
|
|
|
507
507
|
color: var(--dsa-form-field__placeholder--color, var(--ks-color-fg-alpha-5));
|
|
508
508
|
}
|
|
509
509
|
|
|
510
|
-
.
|
|
511
|
-
--dsa-divider--background: var(--ks-border-color-
|
|
512
|
-
--dsa-divider--
|
|
513
|
-
--dsa-divider--height: var(--ks-border-width-default);
|
|
510
|
+
.c-divider {
|
|
511
|
+
--dsa-divider--background: var(--ks-border-color-accent);
|
|
512
|
+
--dsa-divider--height: var(--ks-border-widht-default);
|
|
514
513
|
}
|
|
515
514
|
|
|
516
515
|
hr.c-divider {
|
|
517
|
-
--c-divider--background: var(--dsa-divider--background, var(--ks-border-color-
|
|
516
|
+
--c-divider--background: var(--dsa-divider--background, var(--ks-border-color-accent));
|
|
518
517
|
--c-divider--height: var(--dsa-divider--height, var(--ks-border-width-default));
|
|
519
518
|
}
|
|
520
|
-
hr.c-divider--accent {
|
|
521
|
-
--c-divider--background: var(--dsa-divider--background_accent, var(--ks-border-color-accent));
|
|
522
|
-
}
|
|
523
519
|
|
|
524
520
|
@font-face {
|
|
525
521
|
font-family: "Fredoka";
|
package/dist/tokens/themes.css
CHANGED
|
@@ -1,6 +1,6 @@
|
|
|
1
1
|
/**
|
|
2
2
|
* Do not edit directly
|
|
3
|
-
* Generated on Tue, 10 Sep 2024
|
|
3
|
+
* Generated on Tue, 10 Sep 2024 15:41:47 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 Tue, 10 Sep 2024
|
|
2730
|
+
* Generated on Tue, 10 Sep 2024 15:41:52 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 Tue, 10 Sep 2024
|
|
5461
|
+
* Generated on Tue, 10 Sep 2024 15:41:50 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 Tue, 10 Sep 2024
|
|
8462
|
+
* Generated on Tue, 10 Sep 2024 15:41:54 GMT
|
|
8463
8463
|
*/
|
|
8464
8464
|
:root [ks-theme=telekom] {
|
|
8465
8465
|
--ks-background-color-accent-base: var(--ks-color-primary-to-bg-8-base);
|
package/dist/tokens/tokens.css
CHANGED
|
@@ -1,6 +1,6 @@
|
|
|
1
1
|
/**
|
|
2
2
|
* Do not edit directly
|
|
3
|
-
* Generated on Tue, 10 Sep 2024
|
|
3
|
+
* Generated on Tue, 10 Sep 2024 15:41:45 GMT
|
|
4
4
|
*/
|
|
5
5
|
|
|
6
6
|
:root, [ks-theme] {
|
|
@@ -116,8 +116,8 @@
|
|
|
116
116
|
--ks-background-color-secondary-inverted-interactive-active-base: var(--ks-color-secondary-inverted-to-bg-2-base);
|
|
117
117
|
--ks-background-color-secondary-inverted-interactive-selected-base: var(--ks-color-secondary-inverted-to-bg-4-base);
|
|
118
118
|
--ks-background-color-secondary-inverted-translucent-base: var(--ks-color-secondary-inverted-alpha-5-base);
|
|
119
|
-
--ks-border-color-accent-base: var(--ks-color-
|
|
120
|
-
--ks-border-color-accent-inverted-base: var(--ks-color-
|
|
119
|
+
--ks-border-color-accent-base: var(--ks-color-fg-to-bg-7-base);
|
|
120
|
+
--ks-border-color-accent-inverted-base: var(--ks-color-fg-inverted-to-bg-7-base);
|
|
121
121
|
--ks-border-color-clear-base: var(--ks-color-transparent-base);
|
|
122
122
|
--ks-border-color-clear-interactive-base: var(--ks-color-transparent-base);
|
|
123
123
|
--ks-border-color-clear-interactive-hover-base: var(--ks-color-primary-alpha-8-base);
|
|
@@ -128,8 +128,8 @@
|
|
|
128
128
|
--ks-border-color-clear-inverted-interactive-hover-base: var(--ks-color-primary-inverted-alpha-7-base);
|
|
129
129
|
--ks-border-color-clear-inverted-interactive-active-base: var(--ks-color-primary-inverted-alpha-6-base);
|
|
130
130
|
--ks-border-color-clear-inverted-interactive-selected-base: var(--ks-color-primary-inverted-alpha-5-base);
|
|
131
|
-
--ks-border-color-default-base: var(--ks-color-fg-
|
|
132
|
-
--ks-border-color-default-inverted-base: var(--ks-color-fg-
|
|
131
|
+
--ks-border-color-default-base: var(--ks-color-fg-inverted-base);
|
|
132
|
+
--ks-border-color-default-inverted-base: var(--ks-color-fg-alpha-3-base);
|
|
133
133
|
--ks-border-color-interface-base: var(--ks-color-fg-alpha-8-base);
|
|
134
134
|
--ks-border-color-interface-interactive-base: var(--ks-color-fg-alpha-7-base);
|
|
135
135
|
--ks-border-color-interface-interactive-disabled-base: var(--ks-color-fg-alpha-8-base);
|
package/dist/tokens/tokens.js
CHANGED
|
@@ -1,6 +1,6 @@
|
|
|
1
1
|
/**
|
|
2
2
|
* Do not edit directly
|
|
3
|
-
* Generated on Tue, 10 Sep 2024
|
|
3
|
+
* Generated on Tue, 10 Sep 2024 15:41:45 GMT
|
|
4
4
|
*/
|
|
5
5
|
|
|
6
6
|
export const KsBackgroundColorAccentBase = "#230a2b";
|
|
@@ -115,8 +115,8 @@ export const KsBackgroundColorSecondaryInvertedInteractiveHoverBase = "#e43489";
|
|
|
115
115
|
export const KsBackgroundColorSecondaryInvertedInteractiveActiveBase = "#e43489";
|
|
116
116
|
export const KsBackgroundColorSecondaryInvertedInteractiveSelectedBase = "#e868a6";
|
|
117
117
|
export const KsBackgroundColorSecondaryInvertedTranslucentBase = "rgba(226, 24, 121, 0.5)";
|
|
118
|
-
export const KsBorderColorAccentBase = "
|
|
119
|
-
export const KsBorderColorAccentInvertedBase = "
|
|
118
|
+
export const KsBorderColorAccentBase = "#424355";
|
|
119
|
+
export const KsBorderColorAccentInvertedBase = "#b9b9c0";
|
|
120
120
|
export const KsBorderColorClearBase = "rgba(0, 0, 0, 0)";
|
|
121
121
|
export const KsBorderColorClearInteractiveBase = "rgba(0, 0, 0, 0)";
|
|
122
122
|
export const KsBorderColorClearInteractiveHoverBase = "rgba(226, 24, 121, 0.13)";
|
|
@@ -127,8 +127,8 @@ export const KsBorderColorClearInvertedInteractiveBase = "rgba(0, 0, 0, 0)";
|
|
|
127
127
|
export const KsBorderColorClearInvertedInteractiveHoverBase = "rgba(77, 37, 239, 0.24)";
|
|
128
128
|
export const KsBorderColorClearInvertedInteractiveActiveBase = "rgba(77, 37, 239, 0.37)";
|
|
129
129
|
export const KsBorderColorClearInvertedInteractiveSelectedBase = "rgba(77, 37, 239, 0.5)";
|
|
130
|
-
export const KsBorderColorDefaultBase = "
|
|
131
|
-
export const KsBorderColorDefaultInvertedBase = "rgba(
|
|
130
|
+
export const KsBorderColorDefaultBase = "#06081f";
|
|
131
|
+
export const KsBorderColorDefaultInvertedBase = "rgba(255, 255, 255, 0.76)";
|
|
132
132
|
export const KsBorderColorInterfaceBase = "rgba(255, 255, 255, 0.13)";
|
|
133
133
|
export const KsBorderColorInterfaceInteractiveBase = "rgba(255, 255, 255, 0.24)";
|
|
134
134
|
export const KsBorderColorInterfaceInteractiveDisabledBase = "rgba(255, 255, 255, 0.13)";
|
package/package.json
CHANGED
|
@@ -1,6 +1,6 @@
|
|
|
1
1
|
{
|
|
2
2
|
"name": "@kickstartds/ds-agency-premium",
|
|
3
|
-
"version": "1.5.
|
|
3
|
+
"version": "1.5.26--canary.994.190c0e1.0",
|
|
4
4
|
"description": "",
|
|
5
5
|
"homepage": "https://github.com/kickstartDS/ds-agency-premium#readme",
|
|
6
6
|
"bugs": {
|
|
@@ -114,6 +114,7 @@
|
|
|
114
114
|
"happy-dom": "^13.3.1",
|
|
115
115
|
"husky": "^8.0.3",
|
|
116
116
|
"jest-image-snapshot": "^6.4.0",
|
|
117
|
+
"json-schema-traverse": "^1.0.0",
|
|
117
118
|
"kickstartds": "^3.0.0",
|
|
118
119
|
"lazysizes": "^5.3.2",
|
|
119
120
|
"npm-run-all": "^4.1.5",
|
|
@@ -1,13 +0,0 @@
|
|
|
1
|
-
.dsa-divider {
|
|
2
|
-
--dsa-divider--background: var(--ks-border-color-default);
|
|
3
|
-
--dsa-divider--background_accent: var(--ks-border-color-accent);
|
|
4
|
-
--dsa-divider--height: var(--ks-border-width-default);
|
|
5
|
-
}
|
|
6
|
-
|
|
7
|
-
hr.c-divider {
|
|
8
|
-
--c-divider--background: var(--dsa-divider--background, var(--ks-border-color-default));
|
|
9
|
-
--c-divider--height: var(--dsa-divider--height, var(--ks-border-width-default));
|
|
10
|
-
}
|
|
11
|
-
hr.c-divider--accent {
|
|
12
|
-
--c-divider--background: var(--dsa-divider--background_accent, var(--ks-border-color-accent));
|
|
13
|
-
}
|
|
@@ -1,33 +0,0 @@
|
|
|
1
|
-
{
|
|
2
|
-
"$schema": "http://json-schema.org/draft-07/schema#",
|
|
3
|
-
"$id": "http://schema.mydesignsystem.com/divider.schema.json",
|
|
4
|
-
"title": "Divider",
|
|
5
|
-
"description": "Dividers bring clarity to a layout by grouping and dividing content in close proximity.",
|
|
6
|
-
"type": "object",
|
|
7
|
-
"properties": {
|
|
8
|
-
"variant": {
|
|
9
|
-
"title": "Style of the divider",
|
|
10
|
-
"type": "string",
|
|
11
|
-
"description": "Choose a variant for the divider",
|
|
12
|
-
"enum": [
|
|
13
|
-
"default",
|
|
14
|
-
"accent"
|
|
15
|
-
],
|
|
16
|
-
"default": "default"
|
|
17
|
-
},
|
|
18
|
-
"className": {
|
|
19
|
-
"type": "string",
|
|
20
|
-
"title": "Additional Classes",
|
|
21
|
-
"description": "Add additional css classes that should be applied to the divider"
|
|
22
|
-
},
|
|
23
|
-
"component": {
|
|
24
|
-
"title": "`ks-component` attribute",
|
|
25
|
-
"description": "Optional custom component identifier",
|
|
26
|
-
"type": "string"
|
|
27
|
-
},
|
|
28
|
-
"type": {
|
|
29
|
-
"const": "divider"
|
|
30
|
-
}
|
|
31
|
-
},
|
|
32
|
-
"additionalProperties": false
|
|
33
|
-
}
|
|
@@ -1,27 +0,0 @@
|
|
|
1
|
-
{
|
|
2
|
-
"$schema": "http://json-schema.org/draft-07/schema#",
|
|
3
|
-
"$id": "http://schema.mydesignsystem.com/divider.schema.json",
|
|
4
|
-
"title": "Divider",
|
|
5
|
-
"description": "Dividers bring clarity to a layout by grouping and dividing content in close proximity.",
|
|
6
|
-
"type": "object",
|
|
7
|
-
"properties": {
|
|
8
|
-
"variant": {
|
|
9
|
-
"title": "Style of the divider",
|
|
10
|
-
"type": "string",
|
|
11
|
-
"description": "Choose a variant for the divider",
|
|
12
|
-
"enum": ["default", "accent"],
|
|
13
|
-
"default": "default"
|
|
14
|
-
},
|
|
15
|
-
"className": {
|
|
16
|
-
"type": "string",
|
|
17
|
-
"title": "Additional Classes",
|
|
18
|
-
"description": "Add additional css classes that should be applied to the divider"
|
|
19
|
-
},
|
|
20
|
-
"component": {
|
|
21
|
-
"title": "`ks-component` attribute",
|
|
22
|
-
"description": "Optional custom component identifier",
|
|
23
|
-
"type": "string"
|
|
24
|
-
}
|
|
25
|
-
},
|
|
26
|
-
"additionalProperties": false
|
|
27
|
-
}
|
|
@@ -1,33 +0,0 @@
|
|
|
1
|
-
/// <reference types="react" />
|
|
2
|
-
import { HTMLAttributes, FC, PropsWithChildren } from "react";
|
|
3
|
-
/* eslint-disable */
|
|
4
|
-
/**
|
|
5
|
-
* This file was automatically generated by json-schema-to-typescript.
|
|
6
|
-
* DO NOT MODIFY IT BY HAND. Instead, modify the source JSONSchema file,
|
|
7
|
-
* and run json-schema-to-typescript to regenerate this file.
|
|
8
|
-
*/
|
|
9
|
-
/**
|
|
10
|
-
* Choose a variant for the divider
|
|
11
|
-
*/
|
|
12
|
-
type StyleOfTheDivider = "default" | "accent";
|
|
13
|
-
/**
|
|
14
|
-
* Add additional css classes that should be applied to the divider
|
|
15
|
-
*/
|
|
16
|
-
type AdditionalClasses = string;
|
|
17
|
-
/**
|
|
18
|
-
* Optional custom component identifier
|
|
19
|
-
*/
|
|
20
|
-
type KsComponentAttribute = string;
|
|
21
|
-
/**
|
|
22
|
-
* Dividers bring clarity to a layout by grouping and dividing content in close proximity.
|
|
23
|
-
*/
|
|
24
|
-
interface DividerProps {
|
|
25
|
-
variant?: StyleOfTheDivider;
|
|
26
|
-
className?: AdditionalClasses;
|
|
27
|
-
component?: KsComponentAttribute;
|
|
28
|
-
}
|
|
29
|
-
declare const DividerContextDefault: import("react").ForwardRefExoticComponent<DividerProps & HTMLAttributes<HTMLHRElement> & import("react").RefAttributes<HTMLHRElement>>;
|
|
30
|
-
declare const DividerContext: import("react").Context<import("react").ForwardRefExoticComponent<DividerProps & HTMLAttributes<HTMLHRElement> & import("react").RefAttributes<HTMLHRElement>>>;
|
|
31
|
-
declare const Divider: import("react").ForwardRefExoticComponent<DividerProps & HTMLAttributes<HTMLHRElement> & import("react").RefAttributes<HTMLHRElement>>;
|
|
32
|
-
declare const DividerProvider: FC<PropsWithChildren>;
|
|
33
|
-
export { DividerContextDefault, DividerContext, Divider, DividerProvider };
|
|
@@ -1,16 +0,0 @@
|
|
|
1
|
-
import "./divider.css";
|
|
2
|
-
import { jsx } from 'react/jsx-runtime';
|
|
3
|
-
import { forwardRef, createContext, useContext } from 'react';
|
|
4
|
-
import classnames from 'classnames';
|
|
5
|
-
import { DividerContextDefault as DividerContextDefault$1, DividerContext as DividerContext$1 } from '@kickstartds/base/lib/divider';
|
|
6
|
-
|
|
7
|
-
const DividerContextDefault = forwardRef(({ variant, className, ...props }, ref) => (jsx(DividerContextDefault$1, { ...props, className: classnames("dsa-divider", className), variant: variant, ref: ref })));
|
|
8
|
-
const DividerContext = createContext(DividerContextDefault);
|
|
9
|
-
const Divider = forwardRef((props, ref) => {
|
|
10
|
-
const Component = useContext(DividerContext);
|
|
11
|
-
return jsx(Component, { ...props, ref: ref });
|
|
12
|
-
});
|
|
13
|
-
Divider.displayName = "Divider";
|
|
14
|
-
const DividerProvider = (props) => (jsx(DividerContext$1.Provider, { ...props, value: DividerContextDefault }));
|
|
15
|
-
|
|
16
|
-
export { Divider, DividerContext, DividerContextDefault, DividerProvider };
|
|
File without changes
|