@codeandfunction/callaloo 3.12.1 → 3.12.2
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/assets/styles.css +1 -1
- package/dist/components/Assets/{CLIcon.vue.d.ts → CLIcon/CLIcon.vue.d.ts} +4 -3
- package/dist/components/Assets/CLIcon/index.d.ts +4 -0
- package/dist/components/Assets/index.d.ts +1 -2
- package/dist/components/Buttons/{CLA11yButton.vue.d.ts → CLA11yButton/CLA11yButton.vue.d.ts} +8 -17
- package/dist/components/Buttons/CLA11yButton/index.d.ts +4 -0
- package/dist/components/Buttons/CLButton/CLButton.vue.d.ts +99 -0
- package/dist/components/Buttons/CLButton/index.d.ts +4 -0
- package/dist/components/Buttons/index.d.ts +2 -4
- package/dist/components/Containers/CLCard/CLCard.vue.d.ts +105 -0
- package/dist/components/Containers/CLCard/index.d.ts +4 -0
- package/dist/components/Containers/{Carousel → CLCarousel}/CLCarousel.vue.d.ts +9 -20
- package/dist/components/Containers/CLCarousel/CLCarouselNavigation.vue.d.ts +37 -0
- package/dist/components/Containers/CLCarousel/index.d.ts +11 -0
- package/dist/components/Containers/CLDisclosure/CLDisclosure.vue.d.ts +70 -0
- package/dist/components/Containers/CLDisclosure/index.d.ts +4 -0
- package/dist/components/Containers/index.d.ts +3 -9
- package/dist/components/Form/{CLCheckbox.vue.d.ts → CLCheckbox/CLCheckbox.vue.d.ts} +26 -13
- package/dist/components/Form/CLCheckbox/index.d.ts +4 -0
- package/dist/components/Form/{CLInput.vue.d.ts → CLInput/CLInput.vue.d.ts} +42 -17
- package/dist/components/Form/CLInput/index.d.ts +4 -0
- package/dist/components/Form/{CLRadioButton.vue.d.ts → CLRadioButton/CLRadioButton.vue.d.ts} +9 -9
- package/dist/components/Form/CLRadioButton/index.d.ts +4 -0
- package/dist/components/Form/{CLSelect.vue.d.ts → CLSelect/CLSelect.vue.d.ts} +9 -9
- package/dist/components/Form/CLSelect/index.d.ts +4 -0
- package/dist/components/Form/{CLTextArea.vue.d.ts → CLTextArea/CLTextArea.vue.d.ts} +18 -18
- package/dist/components/Form/CLTextArea/index.d.ts +4 -0
- package/dist/components/Form/index.d.ts +5 -10
- package/dist/components/Indicators/{CLBadge.vue.d.ts → CLBadge/CLBadge.vue.d.ts} +6 -6
- package/dist/components/Indicators/CLBadge/index.d.ts +4 -0
- package/dist/components/Indicators/CLBanner/CLBanner.vue.d.ts +49 -0
- package/dist/components/Indicators/CLBanner/index.d.ts +4 -0
- package/dist/components/Indicators/{CLPill.vue.d.ts → CLPill/CLPill.vue.d.ts} +4 -4
- package/dist/components/Indicators/CLPill/index.d.ts +4 -0
- package/dist/components/Indicators/CLProgress/CLProgress.vue.d.ts +32 -0
- package/dist/components/Indicators/CLProgress/index.d.ts +4 -0
- package/dist/components/Indicators/index.d.ts +4 -9
- package/dist/components/Loading/{CLSkeleton.vue.d.ts → CLSkeleton/CLSkeleton.vue.d.ts} +3 -3
- package/dist/components/Loading/CLSkeleton/index.d.ts +4 -0
- package/dist/components/Loading/{CLSpinner.vue.d.ts → CLSpinner/CLSpinner.vue.d.ts} +4 -4
- package/dist/components/Loading/CLSpinner/index.d.ts +4 -0
- package/dist/components/Loading/index.d.ts +2 -4
- package/dist/components/Modals/{CLModal.vue.d.ts → CLModal/CLModal.vue.d.ts} +16 -24
- package/dist/components/Modals/CLModal/index.d.ts +4 -0
- package/dist/components/Modals/index.d.ts +1 -2
- package/dist/components/Navigation/{CLLink.vue.d.ts → CLLink/CLLink.vue.d.ts} +6 -14
- package/dist/components/Navigation/CLLink/index.d.ts +4 -0
- package/dist/components/Navigation/{CLNavLink.vue.d.ts → CLNavLink/CLNavLink.vue.d.ts} +10 -14
- package/dist/components/Navigation/CLNavLink/index.d.ts +4 -0
- package/dist/components/Navigation/{CLNavSection.vue.d.ts → CLNavSection/CLNavSection.vue.d.ts} +3 -3
- package/dist/components/Navigation/CLNavSection/index.d.ts +4 -0
- package/dist/components/Navigation/index.d.ts +3 -6
- package/dist/components/Popups/CLDropdownMenu/CLDropdownMenu.vue.d.ts +204 -0
- package/dist/components/Popups/CLDropdownMenu/index.d.ts +4 -0
- package/dist/components/Popups/{CLToast.vue.d.ts → CLToast/CLToast.vue.d.ts} +1 -1
- package/dist/components/Popups/CLToast/index.d.ts +4 -0
- package/dist/components/Popups/index.d.ts +2 -5
- package/dist/components/Table/CLTable.vue.d.ts +5 -13
- package/dist/components/Table/CLTableCell.vue.d.ts +8 -16
- package/dist/components/Table/CLTableNestedCell.vue.d.ts +5 -12
- package/dist/components/Table/CLTableRow.vue.d.ts +4 -12
- package/dist/components/Table/index.d.ts +32 -15
- package/dist/components/Typography/CLHeading/CLHeading.vue.d.ts +33 -0
- package/dist/components/Typography/CLHeading/index.d.ts +4 -0
- package/dist/components/Typography/CLText/CLText.vue.d.ts +43 -0
- package/dist/components/Typography/CLText/index.d.ts +4 -0
- package/dist/components/Typography/index.d.ts +2 -5
- package/dist/index.d.ts +2 -2
- package/dist/index.js +3109 -3232
- package/dist/types.d.ts +14 -114
- package/package.json +6 -4
- package/dist/components/Buttons/CLButton.vue.d.ts +0 -288
- package/dist/components/Containers/CLCard.vue.d.ts +0 -51
- package/dist/components/Containers/CLDisclosure.vue.d.ts +0 -77
- package/dist/components/Containers/Carousel/CLCarouselNavigation.vue.d.ts +0 -22
- package/dist/components/Indicators/CLBanner.vue.d.ts +0 -13
- package/dist/components/Indicators/Progress/CLProgress.vue.d.ts +0 -45
- package/dist/components/Popups/CLDropdownMenu.vue.d.ts +0 -595
- package/dist/components/Typography/CLHeading.vue.d.ts +0 -85
- package/dist/components/Typography/CLText.vue.d.ts +0 -119
- /package/dist/components/Containers/{Carousel → CLCarousel}/CLCarouselSlide.vue.d.ts +0 -0
package/dist/types.d.ts
CHANGED
|
@@ -3,42 +3,6 @@ export declare enum CLAlign {
|
|
|
3
3
|
Center = "center",
|
|
4
4
|
Right = "right"
|
|
5
5
|
}
|
|
6
|
-
export interface CLBannerProps {
|
|
7
|
-
/** The action label text to be displayed. */
|
|
8
|
-
actionLabel?: string;
|
|
9
|
-
/** Set the horizontal alignment of content. The property can be one of `CLAlign`, e.g. `CLAlign.Left` */
|
|
10
|
-
align?: CLAlign;
|
|
11
|
-
/** Sets the aria-label on the banner if the `onClick` property has been set. It should be used when the `onClick` property has been set. */
|
|
12
|
-
ariaLabel?: string;
|
|
13
|
-
/** A boolean value when set to `true`, adds a border to the banner. */
|
|
14
|
-
bordered?: boolean;
|
|
15
|
-
/** The border radius size. The property can be one of `CLBorderRadius`, e.g. `CLBorderRadius.Medium`. */
|
|
16
|
-
borderRadius?: CLBorderRadius;
|
|
17
|
-
/** A `boolean` value which dictates the busy state of the Banner. When set to `true`, it utilizes the `<CLSkeleton />` component. */
|
|
18
|
-
busy?: boolean;
|
|
19
|
-
/** Sets the color of the Badge. The property can be one of `CLColors`, e.g. `CLColors.Primary`. */
|
|
20
|
-
color?: CLColors;
|
|
21
|
-
/** Sets the height of the Banner, it's default value is `auto`. */
|
|
22
|
-
height?: string;
|
|
23
|
-
/** The text to be displayed as the message. */
|
|
24
|
-
message?: string;
|
|
25
|
-
/** A callback function to handle click events */
|
|
26
|
-
onAction?: CLGenericFunction;
|
|
27
|
-
/** A callback function to handle click events. It should be used when in conjunction with the `ariaLabel` property. */
|
|
28
|
-
onClick?: CLGenericFunction;
|
|
29
|
-
/** A callback function to handle when the banner is dismissed. */
|
|
30
|
-
onDismiss?: CLGenericFunction;
|
|
31
|
-
/** When set to `false` it will not render a Banner with rounded corners. */
|
|
32
|
-
rounded?: boolean;
|
|
33
|
-
/** Sets a custom ID used for unit tests. */
|
|
34
|
-
testId?: string;
|
|
35
|
-
/** Set the text of the title which should be displayed. */
|
|
36
|
-
title?: string;
|
|
37
|
-
/** Sets the width of the Banner, it's default value is `100%`. */
|
|
38
|
-
width?: string;
|
|
39
|
-
/** Sets the color variant. The property can be one of `ColorVariants.Ghost | ColorVariants.Outline | ColorVariants.Soft | ColorVariants.Solid`, e.g `CLColorVariants.Soft`. */
|
|
40
|
-
variant?: CLColorVariants.Ghost | CLColorVariants.Outline | CLColorVariants.Soft | CLColorVariants.Solid;
|
|
41
|
-
}
|
|
42
6
|
export type CLBlockTextHtmlTags = 'blockquote' | 'dd' | 'div' | 'dl' | 'dt' | 'figcaption' | 'figure' | 'hr' | 'li' | 'menu' | 'ol' | 'p' | 'pre' | 'ul';
|
|
43
7
|
export declare enum CLBorderRadius {
|
|
44
8
|
Full = "rounded-full",
|
|
@@ -63,70 +27,6 @@ export declare enum CLCardTypes {
|
|
|
63
27
|
Large = "large",
|
|
64
28
|
XL = "xlarge"
|
|
65
29
|
}
|
|
66
|
-
export interface CLCardProps {
|
|
67
|
-
/** When set to `true`, it elelvates the card to indicate it's active state. */
|
|
68
|
-
active?: boolean;
|
|
69
|
-
/** Set the horizontal alignment of content. The property can be one of `CLAlign`, e.g. `CLAlign.Left` */
|
|
70
|
-
align?: CLAlign;
|
|
71
|
-
/** Sets the aria-label if the `onClick` or `href` property has been set. It should be used when the `onClick` or `href` property has been set. */
|
|
72
|
-
ariaLabel?: string;
|
|
73
|
-
/** The border radius size. The property can be one of `CLBorderRadius`, e.g. `CLBorderRadius.Medium`. */
|
|
74
|
-
borderRadius?: CLBorderRadius;
|
|
75
|
-
/** A boolean value when set to `true`, adds a border to the card. */
|
|
76
|
-
bordered?: boolean;
|
|
77
|
-
/** A `boolean` value which dictates the busy state of the card. When set to `true`, it utilizes the `<CLSkeleton />` component. */
|
|
78
|
-
busy?: boolean;
|
|
79
|
-
/** Appears below the title. Can be used to provide meta data, e.g. the time and date. */
|
|
80
|
-
byline?: string;
|
|
81
|
-
/** Sets the color of the Card. The property can be one of `CLColors`, e.g. `CLColors.Primary`. */
|
|
82
|
-
color?: CLColors;
|
|
83
|
-
/** A boolean value which dictates the compact state of the card. When set to `true`, it utilizes a more compact layout. */
|
|
84
|
-
compact?: boolean;
|
|
85
|
-
/** The `elevated` property displays a shadow to indicate elevation. */
|
|
86
|
-
elevated?: boolean;
|
|
87
|
-
/** A callback function which provides a reference to the button. */
|
|
88
|
-
forwardRef?: (elem: HTMLDivElement) => void;
|
|
89
|
-
/** Sets the height of the Card, it's default value is `auto`. */
|
|
90
|
-
height?: string;
|
|
91
|
-
/** Provide a URL for the entire Card to behave as a link. */
|
|
92
|
-
href?: string;
|
|
93
|
-
/** Provide a URL/relative path to an image to be displayed. */
|
|
94
|
-
image?: string;
|
|
95
|
-
/** Set the alt text for an image, when the image prop has been set. */
|
|
96
|
-
imageAltText?: string;
|
|
97
|
-
/** Set the position of the image. If the row prop is not set, the image can be set to appear to the left or right of the slot content. */
|
|
98
|
-
imageOrder?: CLOrder;
|
|
99
|
-
/** Sets the height of the image, it's default value is `auto`. */
|
|
100
|
-
imageHeight?: string;
|
|
101
|
-
/** Sets the width of the image, it's default value is `auto`. */
|
|
102
|
-
imageWidth?: string;
|
|
103
|
-
/** Indicates how the browser should load the image. Default is `CLLoading.Eager`*/
|
|
104
|
-
imageLoading?: CLLoading;
|
|
105
|
-
/** A callback function to handle click events. */
|
|
106
|
-
onClick?: CLGenericFunction;
|
|
107
|
-
/** When set to `false`, it will remove any horizontal and vertical padding of the slot content. */
|
|
108
|
-
padded?: boolean;
|
|
109
|
-
/** When set to `false` it will not render a Card with rounded corners. */
|
|
110
|
-
rounded?: boolean;
|
|
111
|
-
/** Sets where to display the linked URL. */
|
|
112
|
-
target?: CLLinkTarget;
|
|
113
|
-
/** Sets a custom ID used for unit tests. */
|
|
114
|
-
testId?: string;
|
|
115
|
-
/** Set the text of the title which should be displayed. */
|
|
116
|
-
title?: string;
|
|
117
|
-
/** Set the title type. The property can be one of `CLHeadingTypes`, e.g. `CLHeadingTypes.Title` */
|
|
118
|
-
titleType?: CLHeadingTypes;
|
|
119
|
-
/** Set the title heading level. The property can be one of `CLHeadingLevels`, e.g. `CLHeadingLevels.H1` */
|
|
120
|
-
titleHLevel?: CLHeadingLevels;
|
|
121
|
-
/** When set to `true`, truncate the title if it overflows its container. */
|
|
122
|
-
truncateTitle?: boolean;
|
|
123
|
-
/** Sets the Card type. The property can be one of `CLCardTypes`, e.g. `CLCardTypes.Medium`. */
|
|
124
|
-
type?: CLCardTypes;
|
|
125
|
-
/** Sets the width of the Card, it's default value is `auto`. */
|
|
126
|
-
width?: string;
|
|
127
|
-
/** Sets the color variant. The property can be on of `CLColorVariants`, e.g `CLColorVariants.Soft`. */
|
|
128
|
-
variant?: CLColorVariants;
|
|
129
|
-
}
|
|
130
30
|
export declare enum CLColors {
|
|
131
31
|
Primary = "primary",
|
|
132
32
|
Secondary = "secondary",
|
|
@@ -704,33 +604,33 @@ export declare enum CLToastPosition {
|
|
|
704
604
|
BottomRight = "bottom-right"
|
|
705
605
|
}
|
|
706
606
|
export interface CLToastProps {
|
|
707
|
-
/** The action label text to be displayed
|
|
607
|
+
/** The action label text to be displayed */
|
|
708
608
|
actionLabel?: string;
|
|
709
|
-
/** The border radius size
|
|
609
|
+
/** The border radius size */
|
|
710
610
|
borderRadius?: CLBorderRadius;
|
|
711
|
-
/** Sets the color of the buttons and icons
|
|
611
|
+
/** Sets the color of the buttons and icons */
|
|
712
612
|
color?: CLColors;
|
|
713
613
|
/** Time in seconds e.g 5 = 5 seconds */
|
|
714
614
|
dismissTimer?: number;
|
|
715
|
-
/** The icon to be displayed
|
|
615
|
+
/** The icon to be displayed */
|
|
716
616
|
icon?: CLIconNames;
|
|
717
|
-
/** The size of the icon
|
|
617
|
+
/** The size of the icon */
|
|
718
618
|
iconSize?: CLIconSizes;
|
|
719
|
-
/** The text to be displayed as the message
|
|
619
|
+
/** The text to be displayed as the message */
|
|
720
620
|
message?: string;
|
|
721
|
-
/**
|
|
722
|
-
position?: CLToastPosition;
|
|
723
|
-
/** A callback function to handle click events. */
|
|
621
|
+
/** A callback function to handle click events */
|
|
724
622
|
onAction?: CLGenericFunction;
|
|
725
|
-
/** A callback function to handle when the toast is dismissed
|
|
623
|
+
/** A callback function to handle when the toast is dismissed */
|
|
726
624
|
onDismiss: CLGenericFunction;
|
|
727
|
-
/**
|
|
625
|
+
/** Sets the position of the toast */
|
|
626
|
+
position?: CLToastPosition;
|
|
627
|
+
/** When set to `false` it will not render a Toast with rounded corners */
|
|
728
628
|
rounded?: boolean;
|
|
729
|
-
/** Sets a custom ID used for unit tests
|
|
629
|
+
/** Sets a custom ID used for unit tests */
|
|
730
630
|
testId?: string;
|
|
731
|
-
/** Set the text of the title which should be displayed
|
|
631
|
+
/** Set the text of the title which should be displayed */
|
|
732
632
|
title?: string;
|
|
733
|
-
/** Sets the color variant
|
|
633
|
+
/** Sets the color variant of the buttons and icons */
|
|
734
634
|
variant?: CLColorVariants;
|
|
735
635
|
/** Sets the width of the Toast, it's default value is `24rem`. */
|
|
736
636
|
width?: string;
|
package/package.json
CHANGED
|
@@ -17,15 +17,15 @@
|
|
|
17
17
|
"ui components",
|
|
18
18
|
"vuejs"
|
|
19
19
|
],
|
|
20
|
-
"version": "3.12.
|
|
20
|
+
"version": "3.12.2",
|
|
21
21
|
"license": "MIT",
|
|
22
22
|
"type": "module",
|
|
23
23
|
"scripts": {
|
|
24
24
|
"build": "pnpm export:icons && vite build",
|
|
25
25
|
"build:storybook": "pnpm export:icons && pnpm storybook build",
|
|
26
26
|
"coverage": "vitest run --coverage",
|
|
27
|
-
"export:icons": "npx tsx export-icons.ts",
|
|
28
|
-
"export:meta": "npx tsx export-meta.ts",
|
|
27
|
+
"export:icons": "npx tsx scripts/export-icons.ts",
|
|
28
|
+
"export:meta": "npx tsx scripts/export-meta.ts",
|
|
29
29
|
"lint": "pnpm lint:js && pnpm lint:prettier",
|
|
30
30
|
"lint:js": "eslint 'src/**/*.{ts,vue}'",
|
|
31
31
|
"lint:js:fix": "eslint 'src/**/*.{ts,vue}' --fix",
|
|
@@ -68,7 +68,7 @@
|
|
|
68
68
|
"@storybook/test-runner": "^0.23.0",
|
|
69
69
|
"@storybook/vue3-vite": "^9.1.9",
|
|
70
70
|
"@types/lodash-es": "^4.17.12",
|
|
71
|
-
"@types/node": "22.
|
|
71
|
+
"@types/node": "^22.18.8",
|
|
72
72
|
"@types/stylis": "^4.2.7",
|
|
73
73
|
"@vitejs/plugin-vue": "^5.2.4",
|
|
74
74
|
"@vitejs/plugin-vue-jsx": "^4.2.0",
|
|
@@ -93,6 +93,7 @@
|
|
|
93
93
|
"storybook": "^9.1.9",
|
|
94
94
|
"storybook-addon-deep-controls": "^0.9.5",
|
|
95
95
|
"stylis": "^4.3.6",
|
|
96
|
+
"tsx": "^4.20.6",
|
|
96
97
|
"unplugin-auto-import": "^19.3.0",
|
|
97
98
|
"vite": "^6.3.6",
|
|
98
99
|
"vite-plugin-dts": "^4.5.4",
|
|
@@ -100,6 +101,7 @@
|
|
|
100
101
|
"vitest": "3.2.4",
|
|
101
102
|
"vue": "^3.5.18",
|
|
102
103
|
"vue-component-meta": "^3.1.0",
|
|
104
|
+
"vue-docgen-api": "^4.79.2",
|
|
103
105
|
"vue-router": "^4.5.1",
|
|
104
106
|
"vue-tsc": "^2.2.12"
|
|
105
107
|
},
|
|
@@ -1,288 +0,0 @@
|
|
|
1
|
-
import { CLAlign, CLBorderRadius, CLButtonTypes, CLButtonTags, CLButtonForwardRefFunction, CLColors, CLColorVariants, CLIconNames, CLIconSizes, CLLinkTarget, CLSizes } from '../../index.ts';
|
|
2
|
-
/**
|
|
3
|
-
* The `<CLButton />` component extends the functionality of the native `<button />` element, by including support for icons and colors.
|
|
4
|
-
*/
|
|
5
|
-
declare const _default: import('vue').DefineComponent<globalThis.ExtractPropTypes<{
|
|
6
|
-
/** Sets the active state of the button. When set to true, the button will no longer receive pointer events */
|
|
7
|
-
active: {
|
|
8
|
-
type: BooleanConstructor;
|
|
9
|
-
default: boolean;
|
|
10
|
-
};
|
|
11
|
-
/** Set the horizontal alignment of content. The property can be one of `CLAlign`, e.g. `CLAlign.Left` */
|
|
12
|
-
alignContent: {
|
|
13
|
-
type: PropType<CLAlign>;
|
|
14
|
-
default: CLAlign;
|
|
15
|
-
};
|
|
16
|
-
/** Sets the aria-label on the button It should be used when there is no discernable text present, or if this is an icon only */
|
|
17
|
-
ariaLabel: {
|
|
18
|
-
type: StringConstructor;
|
|
19
|
-
};
|
|
20
|
-
/** Set the HTML tag of the text element. The property can be one of `CLTextHtmlTags`, e.g. `p`. */
|
|
21
|
-
as: {
|
|
22
|
-
type: PropType<CLButtonTags>;
|
|
23
|
-
default: string;
|
|
24
|
-
};
|
|
25
|
-
/** The border radius size. The property can be one of `CLBorderRadius`, e.g. `CLBorderRadius.Medium`. */
|
|
26
|
-
borderRadius: {
|
|
27
|
-
type: PropType<CLBorderRadius>;
|
|
28
|
-
};
|
|
29
|
-
/** A `boolean` value which dictates the busy state of the button */
|
|
30
|
-
busy: {
|
|
31
|
-
type: BooleanConstructor;
|
|
32
|
-
};
|
|
33
|
-
/** Sets the color of the button. The property can be one of `CLColors`, e.g. `CLColors.Primary`. */
|
|
34
|
-
color: {
|
|
35
|
-
type: PropType<CLColors>;
|
|
36
|
-
default: CLColors;
|
|
37
|
-
};
|
|
38
|
-
/** A `boolean` value which dictates the disabled state of the button */
|
|
39
|
-
disabled: {
|
|
40
|
-
type: BooleanConstructor;
|
|
41
|
-
};
|
|
42
|
-
/** The `elevated` property displays a shadow to indicate elevation. */
|
|
43
|
-
elevated: {
|
|
44
|
-
type: BooleanConstructor;
|
|
45
|
-
default: boolean;
|
|
46
|
-
};
|
|
47
|
-
/** The form whom the button belongs to. Useful for when buttons are not within a `form` element. */
|
|
48
|
-
form: {
|
|
49
|
-
type: StringConstructor;
|
|
50
|
-
};
|
|
51
|
-
/** A callback function which provides a reference to the button */
|
|
52
|
-
forwardRef: {
|
|
53
|
-
type: PropType<CLButtonForwardRefFunction>;
|
|
54
|
-
};
|
|
55
|
-
/** Sets the height of the button, it's default value is `auto`. */
|
|
56
|
-
height: {
|
|
57
|
-
type: StringConstructor;
|
|
58
|
-
default: string;
|
|
59
|
-
};
|
|
60
|
-
/** Sets the href attribute on the button element. This is useful when the button acts as a link. */
|
|
61
|
-
href: {
|
|
62
|
-
type: StringConstructor;
|
|
63
|
-
};
|
|
64
|
-
/** Sets the icon which is positioned after the button's slot content. */
|
|
65
|
-
iconAfter: {
|
|
66
|
-
type: PropType<CLIconNames>;
|
|
67
|
-
};
|
|
68
|
-
/** Sets the icon which is positioned before the button's slot content. */
|
|
69
|
-
iconBefore: {
|
|
70
|
-
type: PropType<CLIconNames>;
|
|
71
|
-
};
|
|
72
|
-
/** Sets the `iconBefore` size. The property can be one of `CLIconSizes`, e.g. `CLIconSizes.Medium`. */
|
|
73
|
-
iconSize: {
|
|
74
|
-
type: PropType<CLIconSizes>;
|
|
75
|
-
default: CLIconSizes;
|
|
76
|
-
};
|
|
77
|
-
/** Sets the `iconAfter` size. The property can be one of `CLIconSizes`, e.g. `CLIconSizes.Medium`. */
|
|
78
|
-
iconAfterSize: {
|
|
79
|
-
type: PropType<CLIconSizes>;
|
|
80
|
-
default: CLIconSizes;
|
|
81
|
-
};
|
|
82
|
-
/** A callback function to handle click events. */
|
|
83
|
-
onClick: {
|
|
84
|
-
type: FunctionConstructor;
|
|
85
|
-
};
|
|
86
|
-
/** When set to `true` it will display the button as a `CLPill`. */
|
|
87
|
-
pill: {
|
|
88
|
-
type: BooleanConstructor;
|
|
89
|
-
};
|
|
90
|
-
/** When set to `false` it will not render with rounded corners. */
|
|
91
|
-
rounded: {
|
|
92
|
-
type: BooleanConstructor;
|
|
93
|
-
default: boolean;
|
|
94
|
-
};
|
|
95
|
-
/** Sets the button size. The property can be one of `CLSizes`, e.g. `CLSizes.Medium`. */
|
|
96
|
-
size: {
|
|
97
|
-
type: PropType<CLSizes>;
|
|
98
|
-
default: CLSizes;
|
|
99
|
-
};
|
|
100
|
-
/** Sets the target attribute on the Link element. The property can be one of `CLLinkTarget`, e.g. `CLLinkTarget.Self` */
|
|
101
|
-
target: {
|
|
102
|
-
type: PropType<CLLinkTarget>;
|
|
103
|
-
default: CLLinkTarget;
|
|
104
|
-
};
|
|
105
|
-
/** Sets the title attribute. */
|
|
106
|
-
title: {
|
|
107
|
-
type: StringConstructor;
|
|
108
|
-
};
|
|
109
|
-
/** Sets a custom ID used for unit tests. */
|
|
110
|
-
testId: {
|
|
111
|
-
type: StringConstructor;
|
|
112
|
-
default: string;
|
|
113
|
-
};
|
|
114
|
-
/** Sets the button type. The property can be one of `CLButtonTypes`, e.g. `CLButtonTypes.Submit`. */
|
|
115
|
-
type: {
|
|
116
|
-
type: PropType<CLButtonTypes>;
|
|
117
|
-
default: CLButtonTypes;
|
|
118
|
-
};
|
|
119
|
-
/** Sets the color variant. The property can be on of `CLColorVariants`, e.g `CLColorVariants.Soft`. */
|
|
120
|
-
variant: {
|
|
121
|
-
type: PropType<CLColorVariants>;
|
|
122
|
-
default: CLColorVariants;
|
|
123
|
-
};
|
|
124
|
-
/** Sets the width of the button, it's default value is `auto`. */
|
|
125
|
-
width: {
|
|
126
|
-
type: StringConstructor;
|
|
127
|
-
default: string;
|
|
128
|
-
};
|
|
129
|
-
/** When set to `true`, it will remove any horizontal and vertical padding of the slot content. */
|
|
130
|
-
wrap: {
|
|
131
|
-
type: BooleanConstructor;
|
|
132
|
-
default: boolean;
|
|
133
|
-
};
|
|
134
|
-
}>, {
|
|
135
|
-
hasSlot: globalThis.ComputedRef<boolean>;
|
|
136
|
-
}, {}, {}, {
|
|
137
|
-
getSpinnerSize(): CLSizes.Tiny | CLSizes.Small | CLSizes.Medium;
|
|
138
|
-
}, import('vue').ComponentOptionsMixin, import('vue').ComponentOptionsMixin, {}, string, import('vue').PublicProps, Readonly<globalThis.ExtractPropTypes<{
|
|
139
|
-
/** Sets the active state of the button. When set to true, the button will no longer receive pointer events */
|
|
140
|
-
active: {
|
|
141
|
-
type: BooleanConstructor;
|
|
142
|
-
default: boolean;
|
|
143
|
-
};
|
|
144
|
-
/** Set the horizontal alignment of content. The property can be one of `CLAlign`, e.g. `CLAlign.Left` */
|
|
145
|
-
alignContent: {
|
|
146
|
-
type: PropType<CLAlign>;
|
|
147
|
-
default: CLAlign;
|
|
148
|
-
};
|
|
149
|
-
/** Sets the aria-label on the button It should be used when there is no discernable text present, or if this is an icon only */
|
|
150
|
-
ariaLabel: {
|
|
151
|
-
type: StringConstructor;
|
|
152
|
-
};
|
|
153
|
-
/** Set the HTML tag of the text element. The property can be one of `CLTextHtmlTags`, e.g. `p`. */
|
|
154
|
-
as: {
|
|
155
|
-
type: PropType<CLButtonTags>;
|
|
156
|
-
default: string;
|
|
157
|
-
};
|
|
158
|
-
/** The border radius size. The property can be one of `CLBorderRadius`, e.g. `CLBorderRadius.Medium`. */
|
|
159
|
-
borderRadius: {
|
|
160
|
-
type: PropType<CLBorderRadius>;
|
|
161
|
-
};
|
|
162
|
-
/** A `boolean` value which dictates the busy state of the button */
|
|
163
|
-
busy: {
|
|
164
|
-
type: BooleanConstructor;
|
|
165
|
-
};
|
|
166
|
-
/** Sets the color of the button. The property can be one of `CLColors`, e.g. `CLColors.Primary`. */
|
|
167
|
-
color: {
|
|
168
|
-
type: PropType<CLColors>;
|
|
169
|
-
default: CLColors;
|
|
170
|
-
};
|
|
171
|
-
/** A `boolean` value which dictates the disabled state of the button */
|
|
172
|
-
disabled: {
|
|
173
|
-
type: BooleanConstructor;
|
|
174
|
-
};
|
|
175
|
-
/** The `elevated` property displays a shadow to indicate elevation. */
|
|
176
|
-
elevated: {
|
|
177
|
-
type: BooleanConstructor;
|
|
178
|
-
default: boolean;
|
|
179
|
-
};
|
|
180
|
-
/** The form whom the button belongs to. Useful for when buttons are not within a `form` element. */
|
|
181
|
-
form: {
|
|
182
|
-
type: StringConstructor;
|
|
183
|
-
};
|
|
184
|
-
/** A callback function which provides a reference to the button */
|
|
185
|
-
forwardRef: {
|
|
186
|
-
type: PropType<CLButtonForwardRefFunction>;
|
|
187
|
-
};
|
|
188
|
-
/** Sets the height of the button, it's default value is `auto`. */
|
|
189
|
-
height: {
|
|
190
|
-
type: StringConstructor;
|
|
191
|
-
default: string;
|
|
192
|
-
};
|
|
193
|
-
/** Sets the href attribute on the button element. This is useful when the button acts as a link. */
|
|
194
|
-
href: {
|
|
195
|
-
type: StringConstructor;
|
|
196
|
-
};
|
|
197
|
-
/** Sets the icon which is positioned after the button's slot content. */
|
|
198
|
-
iconAfter: {
|
|
199
|
-
type: PropType<CLIconNames>;
|
|
200
|
-
};
|
|
201
|
-
/** Sets the icon which is positioned before the button's slot content. */
|
|
202
|
-
iconBefore: {
|
|
203
|
-
type: PropType<CLIconNames>;
|
|
204
|
-
};
|
|
205
|
-
/** Sets the `iconBefore` size. The property can be one of `CLIconSizes`, e.g. `CLIconSizes.Medium`. */
|
|
206
|
-
iconSize: {
|
|
207
|
-
type: PropType<CLIconSizes>;
|
|
208
|
-
default: CLIconSizes;
|
|
209
|
-
};
|
|
210
|
-
/** Sets the `iconAfter` size. The property can be one of `CLIconSizes`, e.g. `CLIconSizes.Medium`. */
|
|
211
|
-
iconAfterSize: {
|
|
212
|
-
type: PropType<CLIconSizes>;
|
|
213
|
-
default: CLIconSizes;
|
|
214
|
-
};
|
|
215
|
-
/** A callback function to handle click events. */
|
|
216
|
-
onClick: {
|
|
217
|
-
type: FunctionConstructor;
|
|
218
|
-
};
|
|
219
|
-
/** When set to `true` it will display the button as a `CLPill`. */
|
|
220
|
-
pill: {
|
|
221
|
-
type: BooleanConstructor;
|
|
222
|
-
};
|
|
223
|
-
/** When set to `false` it will not render with rounded corners. */
|
|
224
|
-
rounded: {
|
|
225
|
-
type: BooleanConstructor;
|
|
226
|
-
default: boolean;
|
|
227
|
-
};
|
|
228
|
-
/** Sets the button size. The property can be one of `CLSizes`, e.g. `CLSizes.Medium`. */
|
|
229
|
-
size: {
|
|
230
|
-
type: PropType<CLSizes>;
|
|
231
|
-
default: CLSizes;
|
|
232
|
-
};
|
|
233
|
-
/** Sets the target attribute on the Link element. The property can be one of `CLLinkTarget`, e.g. `CLLinkTarget.Self` */
|
|
234
|
-
target: {
|
|
235
|
-
type: PropType<CLLinkTarget>;
|
|
236
|
-
default: CLLinkTarget;
|
|
237
|
-
};
|
|
238
|
-
/** Sets the title attribute. */
|
|
239
|
-
title: {
|
|
240
|
-
type: StringConstructor;
|
|
241
|
-
};
|
|
242
|
-
/** Sets a custom ID used for unit tests. */
|
|
243
|
-
testId: {
|
|
244
|
-
type: StringConstructor;
|
|
245
|
-
default: string;
|
|
246
|
-
};
|
|
247
|
-
/** Sets the button type. The property can be one of `CLButtonTypes`, e.g. `CLButtonTypes.Submit`. */
|
|
248
|
-
type: {
|
|
249
|
-
type: PropType<CLButtonTypes>;
|
|
250
|
-
default: CLButtonTypes;
|
|
251
|
-
};
|
|
252
|
-
/** Sets the color variant. The property can be on of `CLColorVariants`, e.g `CLColorVariants.Soft`. */
|
|
253
|
-
variant: {
|
|
254
|
-
type: PropType<CLColorVariants>;
|
|
255
|
-
default: CLColorVariants;
|
|
256
|
-
};
|
|
257
|
-
/** Sets the width of the button, it's default value is `auto`. */
|
|
258
|
-
width: {
|
|
259
|
-
type: StringConstructor;
|
|
260
|
-
default: string;
|
|
261
|
-
};
|
|
262
|
-
/** When set to `true`, it will remove any horizontal and vertical padding of the slot content. */
|
|
263
|
-
wrap: {
|
|
264
|
-
type: BooleanConstructor;
|
|
265
|
-
default: boolean;
|
|
266
|
-
};
|
|
267
|
-
}>> & Readonly<{}>, {
|
|
268
|
-
color: CLColors;
|
|
269
|
-
width: string;
|
|
270
|
-
height: string;
|
|
271
|
-
variant: CLColorVariants;
|
|
272
|
-
elevated: boolean;
|
|
273
|
-
testId: string;
|
|
274
|
-
type: CLButtonTypes;
|
|
275
|
-
busy: boolean;
|
|
276
|
-
rounded: boolean;
|
|
277
|
-
active: boolean;
|
|
278
|
-
alignContent: CLAlign;
|
|
279
|
-
as: CLButtonTags;
|
|
280
|
-
disabled: boolean;
|
|
281
|
-
iconSize: CLIconSizes;
|
|
282
|
-
iconAfterSize: CLIconSizes;
|
|
283
|
-
pill: boolean;
|
|
284
|
-
size: CLSizes;
|
|
285
|
-
target: CLLinkTarget;
|
|
286
|
-
wrap: boolean;
|
|
287
|
-
}, {}, {}, {}, string, import('vue').ComponentProvideOptions, true, {}, any>;
|
|
288
|
-
export default _default;
|
|
@@ -1,51 +0,0 @@
|
|
|
1
|
-
import { CLAlign, CLCardProps, CLCardTypes, CLColors, CLColorVariants, CLHeadingTypes, CLHeadingLevels, CLLinkTarget } from '../../index.ts';
|
|
2
|
-
declare function __VLS_template(): {
|
|
3
|
-
attrs: Partial<{}>;
|
|
4
|
-
slots: {
|
|
5
|
-
heading?(_: {}): any;
|
|
6
|
-
heading?(_: {}): any;
|
|
7
|
-
byline?(_: {}): any;
|
|
8
|
-
default?(_: {}): any;
|
|
9
|
-
footer?(_: {}): any;
|
|
10
|
-
image?(_: {}): any;
|
|
11
|
-
};
|
|
12
|
-
refs: {
|
|
13
|
-
refExpandedArea: HTMLDivElement;
|
|
14
|
-
slotContent: HTMLDivElement;
|
|
15
|
-
};
|
|
16
|
-
rootEl: HTMLDivElement;
|
|
17
|
-
};
|
|
18
|
-
type __VLS_TemplateResult = ReturnType<typeof __VLS_template>;
|
|
19
|
-
declare const __VLS_component: import('vue').DefineComponent<CLCardProps, {}, {}, {}, {}, import('vue').ComponentOptionsMixin, import('vue').ComponentOptionsMixin, {}, string, import('vue').PublicProps, Readonly<CLCardProps> & Readonly<{}>, {
|
|
20
|
-
color: CLColors;
|
|
21
|
-
width: string;
|
|
22
|
-
height: string;
|
|
23
|
-
variant: CLColorVariants;
|
|
24
|
-
elevated: boolean;
|
|
25
|
-
testId: string;
|
|
26
|
-
type: CLCardTypes;
|
|
27
|
-
align: CLAlign;
|
|
28
|
-
bordered: boolean;
|
|
29
|
-
busy: boolean;
|
|
30
|
-
rounded: boolean;
|
|
31
|
-
active: boolean;
|
|
32
|
-
target: CLLinkTarget;
|
|
33
|
-
compact: boolean;
|
|
34
|
-
imageAltText: string;
|
|
35
|
-
imageHeight: string;
|
|
36
|
-
imageWidth: string;
|
|
37
|
-
padded: boolean;
|
|
38
|
-
titleType: CLHeadingTypes;
|
|
39
|
-
titleHLevel: CLHeadingLevels;
|
|
40
|
-
truncateTitle: boolean;
|
|
41
|
-
}, {}, {}, {}, string, import('vue').ComponentProvideOptions, false, {
|
|
42
|
-
refExpandedArea: HTMLDivElement;
|
|
43
|
-
slotContent: HTMLDivElement;
|
|
44
|
-
}, HTMLDivElement>;
|
|
45
|
-
declare const _default: __VLS_WithTemplateSlots<typeof __VLS_component, __VLS_TemplateResult["slots"]>;
|
|
46
|
-
export default _default;
|
|
47
|
-
type __VLS_WithTemplateSlots<T, S> = T & {
|
|
48
|
-
new (): {
|
|
49
|
-
$slots: S;
|
|
50
|
-
};
|
|
51
|
-
};
|
|
@@ -1,77 +0,0 @@
|
|
|
1
|
-
import { CLBorderRadius, CLColors, CLColorVariants, CLHeadingTypes, CLHeadingLevels, CLIconNames, CLIconSizes, CLSizes, CLTextTypes } from '../../index.ts';
|
|
2
|
-
export interface Props {
|
|
3
|
-
/** When set to `true` adds borders to the disclosure's trigger container and content. */
|
|
4
|
-
bordered?: boolean;
|
|
5
|
-
/** The border radius size. The property can be one of `CLBorderRadius`, e.g. `CLBorderRadius.Medium`. */
|
|
6
|
-
borderRadius?: CLBorderRadius;
|
|
7
|
-
/** Sets the color of the Disclosure. The property can be one of `CLColors`, e.g. `CLColors.Primary`. */
|
|
8
|
-
color?: CLColors;
|
|
9
|
-
/** When set to `true`, it will remove any horizontal padding and overrides the vertical padding of the trigger and slot content. */
|
|
10
|
-
compact?: boolean;
|
|
11
|
-
/** When set to `false`, it will remove any horizontal and vertical padding. */
|
|
12
|
-
contentSpacing?: boolean;
|
|
13
|
-
/** A unique identifier, this is required. It ensures that if multiple disclosures are used, each will be handled properly. */
|
|
14
|
-
disclosureId: string;
|
|
15
|
-
/** Set the expanded state of the disclosure. */
|
|
16
|
-
expanded?: boolean;
|
|
17
|
-
/** Set the icon to display when the disclosure is expanded. */
|
|
18
|
-
expandedIcon?: CLIconNames;
|
|
19
|
-
/** Set the text of the heading which should be displayed in the trigger. */
|
|
20
|
-
heading?: string;
|
|
21
|
-
/** Set the heading type. The property can be one of `CLHeadingTypes`, e.g. `CLHeadingTypes.Title` */
|
|
22
|
-
headingType?: CLHeadingTypes;
|
|
23
|
-
/** Set the heading level. The property can be one of `CLHeadingLevels`, e.g. `CLHeadingLevels.H1` */
|
|
24
|
-
headingLevel?: CLHeadingLevels;
|
|
25
|
-
/** Set the icon to display before the heading text. */
|
|
26
|
-
iconBefore?: CLIconNames;
|
|
27
|
-
/** Set the size of the icon before the heading text. The property can be one of `CLIconSizes`, e.g. `CLIconSizes.Medium` */
|
|
28
|
-
iconBeforeSize?: CLIconSizes;
|
|
29
|
-
/** Set the icon to display when the disclosure is collapsed. */
|
|
30
|
-
iconAfter?: CLIconNames;
|
|
31
|
-
/** Set the size of the icon after the heading text. The property can be one of `CLIconSizes`, e.g. `CLIconSizes.Medium` */
|
|
32
|
-
iconAfterSize?: CLIconSizes;
|
|
33
|
-
/** Set the rounded state of the disclosure. */
|
|
34
|
-
rounded?: boolean;
|
|
35
|
-
/** Set the text of the sub-heading which should be displayed in the trigger after the heading. */
|
|
36
|
-
subHeading?: string;
|
|
37
|
-
/** Set the sub-heading text type. The property can be one of `CLTextTypes`, e.g. `CLTextTypes.Body` */
|
|
38
|
-
subHeadingType?: CLTextTypes;
|
|
39
|
-
/** Sets a custom ID used for unit tests. */
|
|
40
|
-
testId?: string;
|
|
41
|
-
/** Set the size of the trigger button. The property can be one of `CLSizes`, e.g. `CLSizes.Primary` */
|
|
42
|
-
triggerButtonSize?: CLSizes;
|
|
43
|
-
/** Sets the color variant. The property can be on of `CLColorVariants`, e.g `CLColorVariants.Soft`. */
|
|
44
|
-
variant?: CLColorVariants;
|
|
45
|
-
}
|
|
46
|
-
declare function __VLS_template(): {
|
|
47
|
-
attrs: Partial<{}>;
|
|
48
|
-
slots: {
|
|
49
|
-
default?(_: {}): any;
|
|
50
|
-
};
|
|
51
|
-
refs: {};
|
|
52
|
-
rootEl: HTMLDivElement;
|
|
53
|
-
};
|
|
54
|
-
type __VLS_TemplateResult = ReturnType<typeof __VLS_template>;
|
|
55
|
-
declare const __VLS_component: import('vue').DefineComponent<Props, {}, {}, {}, {}, import('vue').ComponentOptionsMixin, import('vue').ComponentOptionsMixin, {}, string, import('vue').PublicProps, Readonly<Props> & Readonly<{}>, {
|
|
56
|
-
color: CLColors;
|
|
57
|
-
variant: CLColorVariants;
|
|
58
|
-
borderRadius: CLBorderRadius;
|
|
59
|
-
testId: string;
|
|
60
|
-
bordered: boolean;
|
|
61
|
-
rounded: boolean;
|
|
62
|
-
iconAfter: CLIconNames;
|
|
63
|
-
iconAfterSize: CLIconSizes;
|
|
64
|
-
contentSpacing: boolean;
|
|
65
|
-
expanded: boolean;
|
|
66
|
-
expandedIcon: CLIconNames;
|
|
67
|
-
headingType: CLHeadingTypes;
|
|
68
|
-
subHeadingType: CLTextTypes;
|
|
69
|
-
triggerButtonSize: CLSizes;
|
|
70
|
-
}, {}, {}, {}, string, import('vue').ComponentProvideOptions, false, {}, HTMLDivElement>;
|
|
71
|
-
declare const _default: __VLS_WithTemplateSlots<typeof __VLS_component, __VLS_TemplateResult["slots"]>;
|
|
72
|
-
export default _default;
|
|
73
|
-
type __VLS_WithTemplateSlots<T, S> = T & {
|
|
74
|
-
new (): {
|
|
75
|
-
$slots: S;
|
|
76
|
-
};
|
|
77
|
-
};
|
|
@@ -1,22 +0,0 @@
|
|
|
1
|
-
import { CLColors, CLColorVariants, CLGenericFunction, CLPaginationType } from '../../../index';
|
|
2
|
-
interface Props {
|
|
3
|
-
color: CLColors;
|
|
4
|
-
currentPage: number;
|
|
5
|
-
enabled: boolean;
|
|
6
|
-
gotoPage: (index: number) => void;
|
|
7
|
-
moreLabel: string;
|
|
8
|
-
moreAriaLabel?: string;
|
|
9
|
-
nextPageEnabled: boolean;
|
|
10
|
-
paginationType: CLPaginationType;
|
|
11
|
-
prefix: string;
|
|
12
|
-
prevPageEnabled: boolean;
|
|
13
|
-
showMore?: CLGenericFunction;
|
|
14
|
-
showNextItems?: CLGenericFunction;
|
|
15
|
-
showPrevItems?: CLGenericFunction;
|
|
16
|
-
totalPages: number;
|
|
17
|
-
variant: CLColorVariants;
|
|
18
|
-
}
|
|
19
|
-
declare const _default: import('vue').DefineComponent<Props, {}, {}, {}, {}, import('vue').ComponentOptionsMixin, import('vue').ComponentOptionsMixin, {}, string, import('vue').PublicProps, Readonly<Props> & Readonly<{}>, {
|
|
20
|
-
moreAriaLabel: string;
|
|
21
|
-
}, {}, {}, {}, string, import('vue').ComponentProvideOptions, false, {}, any>;
|
|
22
|
-
export default _default;
|
|
@@ -1,13 +0,0 @@
|
|
|
1
|
-
import { CLAlign, CLBannerProps, CLColors, CLColorVariants } from '../../index.ts';
|
|
2
|
-
declare const _default: import('vue').DefineComponent<CLBannerProps, {}, {}, {}, {}, import('vue').ComponentOptionsMixin, import('vue').ComponentOptionsMixin, {}, string, import('vue').PublicProps, Readonly<CLBannerProps> & Readonly<{}>, {
|
|
3
|
-
color: CLColors;
|
|
4
|
-
width: string;
|
|
5
|
-
height: string;
|
|
6
|
-
variant: CLColorVariants.Ghost | CLColorVariants.Outline | CLColorVariants.Soft | CLColorVariants.Solid;
|
|
7
|
-
testId: string;
|
|
8
|
-
align: CLAlign;
|
|
9
|
-
bordered: boolean;
|
|
10
|
-
busy: boolean;
|
|
11
|
-
rounded: boolean;
|
|
12
|
-
}, {}, {}, {}, string, import('vue').ComponentProvideOptions, false, {}, HTMLDivElement>;
|
|
13
|
-
export default _default;
|