@eevenkoto/core 0.1.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/index.d.ts +62 -0
- package/dist/index.js +54 -0
- package/package.json +30 -0
package/dist/index.d.ts
ADDED
|
@@ -0,0 +1,62 @@
|
|
|
1
|
+
type ButtonVariant = 'primary' | 'secondary' | 'ghost';
|
|
2
|
+
type ButtonSize = 'small' | 'large';
|
|
3
|
+
type ButtonIconName = 'star' | 'check' | 'arrow' | 'plus';
|
|
4
|
+
type ButtonIconPosition = 'left' | 'right' | 'only';
|
|
5
|
+
interface ButtonProps {
|
|
6
|
+
variant: ButtonVariant;
|
|
7
|
+
label: string;
|
|
8
|
+
size?: ButtonSize;
|
|
9
|
+
disabled?: boolean;
|
|
10
|
+
/** Which placeholder icon to render. */
|
|
11
|
+
icon?: ButtonIconName;
|
|
12
|
+
/** Where the icon sits relative to the label. Defaults to left when icon is set. */
|
|
13
|
+
iconPosition?: ButtonIconPosition;
|
|
14
|
+
}
|
|
15
|
+
/** Props that affect Button BEM class names (excludes label/disabled content). */
|
|
16
|
+
type ButtonClassNameProps = Pick<ButtonProps, 'variant' | 'size' | 'icon' | 'iconPosition'>;
|
|
17
|
+
declare const resolveButtonIconPosition: (props: Pick<ButtonProps, "icon" | "iconPosition">) => ButtonIconPosition | undefined;
|
|
18
|
+
declare const buttonClassNames: (props: ButtonClassNameProps) => string;
|
|
19
|
+
|
|
20
|
+
type HeadingLevel = 1 | 2 | 3 | 4 | 5 | 6;
|
|
21
|
+
type HeadingTone = 'primary' | 'secondary';
|
|
22
|
+
interface HeadingProps {
|
|
23
|
+
level: HeadingLevel;
|
|
24
|
+
text: string;
|
|
25
|
+
tone?: HeadingTone;
|
|
26
|
+
/**
|
|
27
|
+
* Level 6 only: flow the heading into the following Paragraph
|
|
28
|
+
* (`.eevenkoto-heading--run-in` + sibling `.eevenkoto-paragraph`).
|
|
29
|
+
*/
|
|
30
|
+
runIn?: boolean;
|
|
31
|
+
}
|
|
32
|
+
type HeadingClassNameProps = Pick<HeadingProps, 'level' | 'tone' | 'runIn'>;
|
|
33
|
+
declare const headingClassNames: (props: HeadingClassNameProps) => string;
|
|
34
|
+
|
|
35
|
+
type ParagraphSize = 'sm' | 'md' | 'lg';
|
|
36
|
+
type ParagraphTone = 'primary' | 'secondary';
|
|
37
|
+
interface ParagraphProps {
|
|
38
|
+
text: string;
|
|
39
|
+
size?: ParagraphSize;
|
|
40
|
+
tone?: ParagraphTone;
|
|
41
|
+
}
|
|
42
|
+
type ParagraphClassNameProps = Pick<ParagraphProps, 'size' | 'tone'>;
|
|
43
|
+
declare const paragraphClassNames: (props?: ParagraphClassNameProps) => string;
|
|
44
|
+
|
|
45
|
+
type CaptionTone = 'primary' | 'secondary';
|
|
46
|
+
interface CaptionProps {
|
|
47
|
+
text: string;
|
|
48
|
+
tone?: CaptionTone;
|
|
49
|
+
}
|
|
50
|
+
type CaptionClassNameProps = Pick<CaptionProps, 'tone'>;
|
|
51
|
+
declare const captionClassNames: (props?: CaptionClassNameProps) => string;
|
|
52
|
+
|
|
53
|
+
type FlowDensity = 'tight' | 'loose';
|
|
54
|
+
interface FlowProps {
|
|
55
|
+
density?: FlowDensity;
|
|
56
|
+
}
|
|
57
|
+
declare const flowClassNames: (props?: FlowProps) => string;
|
|
58
|
+
|
|
59
|
+
/** Placeholder SVG path data until a shared icon library exists. */
|
|
60
|
+
declare const buttonIconPaths: Record<ButtonIconName, string>;
|
|
61
|
+
|
|
62
|
+
export { type ButtonClassNameProps, type ButtonIconName, type ButtonIconPosition, type ButtonProps, type ButtonSize, type ButtonVariant, type CaptionClassNameProps, type CaptionProps, type CaptionTone, type FlowDensity, type FlowProps, type HeadingClassNameProps, type HeadingLevel, type HeadingProps, type HeadingTone, type ParagraphClassNameProps, type ParagraphProps, type ParagraphSize, type ParagraphTone, buttonClassNames, buttonIconPaths, captionClassNames, flowClassNames, headingClassNames, paragraphClassNames, resolveButtonIconPosition };
|
package/dist/index.js
ADDED
|
@@ -0,0 +1,54 @@
|
|
|
1
|
+
// src/button.ts
|
|
2
|
+
var resolveButtonIconPosition = (props) => {
|
|
3
|
+
if (!props.icon) return props.iconPosition;
|
|
4
|
+
return props.iconPosition ?? "left";
|
|
5
|
+
};
|
|
6
|
+
var buttonClassNames = (props) => {
|
|
7
|
+
const iconPosition = resolveButtonIconPosition(props);
|
|
8
|
+
const sizeClass = props.size ? ` eevenkoto-button--${props.size}` : "";
|
|
9
|
+
const iconClass = iconPosition ? ` eevenkoto-button--icon-${iconPosition}` : "";
|
|
10
|
+
return `eevenkoto-button eevenkoto-button--${props.variant}${sizeClass}${iconClass}`;
|
|
11
|
+
};
|
|
12
|
+
|
|
13
|
+
// src/heading.ts
|
|
14
|
+
var headingClassNames = (props) => {
|
|
15
|
+
const tone = props.tone ?? "primary";
|
|
16
|
+
const runInClass = props.runIn && props.level === 6 ? " eevenkoto-heading--run-in" : "";
|
|
17
|
+
return `eevenkoto-heading eevenkoto-heading--${props.level} eevenkoto-heading--${tone}${runInClass}`;
|
|
18
|
+
};
|
|
19
|
+
|
|
20
|
+
// src/paragraph.ts
|
|
21
|
+
var paragraphClassNames = (props = {}) => {
|
|
22
|
+
const size = props.size ?? "md";
|
|
23
|
+
const tone = props.tone ?? "primary";
|
|
24
|
+
return `eevenkoto-paragraph eevenkoto-paragraph--${size} eevenkoto-paragraph--${tone}`;
|
|
25
|
+
};
|
|
26
|
+
|
|
27
|
+
// src/caption.ts
|
|
28
|
+
var captionClassNames = (props = {}) => {
|
|
29
|
+
const tone = props.tone ?? "secondary";
|
|
30
|
+
return `eevenkoto-caption eevenkoto-caption--${tone}`;
|
|
31
|
+
};
|
|
32
|
+
|
|
33
|
+
// src/flow.ts
|
|
34
|
+
var flowClassNames = (props = {}) => {
|
|
35
|
+
const densityClass = props.density ? ` eevenkoto-flow--${props.density}` : "";
|
|
36
|
+
return `eevenkoto-flow${densityClass}`;
|
|
37
|
+
};
|
|
38
|
+
|
|
39
|
+
// src/icons.ts
|
|
40
|
+
var buttonIconPaths = {
|
|
41
|
+
star: "M8 1.5a.75.75 0 0 1 .67.41l1.52 3.08 3.4.5a.75.75 0 0 1 .42 1.28l-2.46 2.4.58 3.39a.75.75 0 0 1-1.09.79L8 12.27l-3.04 1.6a.75.75 0 0 1-1.09-.79l.58-3.39-2.46-2.4a.75.75 0 0 1 .42-1.28l3.4-.5L7.33 1.91A.75.75 0 0 1 8 1.5Z",
|
|
42
|
+
check: "M12.207 4.793a1 1 0 0 1 0 1.414l-4.5 4.5a1 1 0 0 1-1.414 0l-2-2a1 1 0 0 1 1.414-1.414L7 8.586l3.793-3.793a1 1 0 0 1 1.414 0Z",
|
|
43
|
+
arrow: "M8.22 2.97a.75.75 0 0 1 1.06 0l4.25 4.25a.75.75 0 0 1 0 1.06l-4.25 4.25a.75.75 0 1 1-1.06-1.06L11.44 8.75H2.75a.75.75 0 0 1 0-1.5h8.69L8.22 4.03a.75.75 0 0 1 0-1.06Z",
|
|
44
|
+
plus: "M8 3a.75.75 0 0 1 .75.75v3.5h3.5a.75.75 0 0 1 0 1.5h-3.5v3.5a.75.75 0 0 1-1.5 0v-3.5h-3.5a.75.75 0 0 1 0-1.5h3.5v-3.5A.75.75 0 0 1 8 3Z"
|
|
45
|
+
};
|
|
46
|
+
export {
|
|
47
|
+
buttonClassNames,
|
|
48
|
+
buttonIconPaths,
|
|
49
|
+
captionClassNames,
|
|
50
|
+
flowClassNames,
|
|
51
|
+
headingClassNames,
|
|
52
|
+
paragraphClassNames,
|
|
53
|
+
resolveButtonIconPosition
|
|
54
|
+
};
|
package/package.json
ADDED
|
@@ -0,0 +1,30 @@
|
|
|
1
|
+
{
|
|
2
|
+
"name": "@eevenkoto/core",
|
|
3
|
+
"version": "0.1.0",
|
|
4
|
+
"description": "Eevenkoto shared prop types and className helpers",
|
|
5
|
+
"type": "module",
|
|
6
|
+
"files": [
|
|
7
|
+
"dist"
|
|
8
|
+
],
|
|
9
|
+
"main": "./dist/index.js",
|
|
10
|
+
"module": "./dist/index.js",
|
|
11
|
+
"types": "./dist/index.d.ts",
|
|
12
|
+
"exports": {
|
|
13
|
+
".": {
|
|
14
|
+
"types": "./dist/index.d.ts",
|
|
15
|
+
"import": "./dist/index.js"
|
|
16
|
+
}
|
|
17
|
+
},
|
|
18
|
+
"scripts": {
|
|
19
|
+
"build": "tsup src/index.ts --format esm --dts --clean",
|
|
20
|
+
"dev": "tsup src/index.ts --format esm --dts --watch"
|
|
21
|
+
},
|
|
22
|
+
"devDependencies": {
|
|
23
|
+
"tsup": "^8.5.0",
|
|
24
|
+
"typescript": "^5.9.2"
|
|
25
|
+
},
|
|
26
|
+
"license": "ISC",
|
|
27
|
+
"publishConfig": {
|
|
28
|
+
"access": "public"
|
|
29
|
+
}
|
|
30
|
+
}
|