@m3e/icon-button 1.0.0-rc.1 → 1.0.0-rc.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/README.md +1 -2
- package/dist/custom-elements.json +2915 -12
- package/dist/html-custom-data.json +3 -3
- package/dist/index.js +2 -1
- package/dist/index.js.map +1 -1
- package/dist/index.min.js +1 -1
- package/dist/index.min.js.map +1 -1
- package/package.json +3 -3
- package/cem.config.mjs +0 -16
- package/demo/index.html +0 -103
- package/dist/src/IconButtonElement.d.ts +0 -316
- package/dist/src/IconButtonElement.d.ts.map +0 -1
- package/dist/src/IconButtonShape.d.ts +0 -3
- package/dist/src/IconButtonShape.d.ts.map +0 -1
- package/dist/src/IconButtonSize.d.ts +0 -3
- package/dist/src/IconButtonSize.d.ts.map +0 -1
- package/dist/src/IconButtonVariant.d.ts +0 -3
- package/dist/src/IconButtonVariant.d.ts.map +0 -1
- package/dist/src/IconButtonWidth.d.ts +0 -3
- package/dist/src/IconButtonWidth.d.ts.map +0 -1
- package/dist/src/index.d.ts +0 -6
- package/dist/src/index.d.ts.map +0 -1
- package/dist/src/styles/IconButtonSizeStyle.d.ts +0 -7
- package/dist/src/styles/IconButtonSizeStyle.d.ts.map +0 -1
- package/dist/src/styles/IconButtonSizeToken.d.ts +0 -26
- package/dist/src/styles/IconButtonSizeToken.d.ts.map +0 -1
- package/dist/src/styles/IconButtonStyle.d.ts +0 -7
- package/dist/src/styles/IconButtonStyle.d.ts.map +0 -1
- package/dist/src/styles/IconButtonVariantStyle.d.ts +0 -7
- package/dist/src/styles/IconButtonVariantStyle.d.ts.map +0 -1
- package/dist/src/styles/IconButtonVariantToken.d.ts +0 -61
- package/dist/src/styles/IconButtonVariantToken.d.ts.map +0 -1
- package/dist/src/styles/index.d.ts +0 -4
- package/dist/src/styles/index.d.ts.map +0 -1
- package/eslint.config.mjs +0 -13
- package/rollup.config.js +0 -32
- package/src/IconButtonElement.ts +0 -514
- package/src/IconButtonShape.ts +0 -2
- package/src/IconButtonSize.ts +0 -2
- package/src/IconButtonVariant.ts +0 -2
- package/src/IconButtonWidth.ts +0 -2
- package/src/index.ts +0 -5
- package/src/styles/IconButtonSizeStyle.ts +0 -95
- package/src/styles/IconButtonSizeToken.ts +0 -215
- package/src/styles/IconButtonStyle.ts +0 -184
- package/src/styles/IconButtonVariantStyle.ts +0 -123
- package/src/styles/IconButtonVariantToken.ts +0 -854
- package/src/styles/index.ts +0 -3
- package/tsconfig.json +0 -9
package/package.json
CHANGED
|
@@ -1,10 +1,10 @@
|
|
|
1
1
|
{
|
|
2
2
|
"name": "@m3e/icon-button",
|
|
3
|
-
"version": "1.0.0-rc.
|
|
3
|
+
"version": "1.0.0-rc.2",
|
|
4
4
|
"description": "Icon Button for M3E",
|
|
5
5
|
"author": "matraic <matraic@yahoo.com>",
|
|
6
6
|
"license": "MIT",
|
|
7
|
-
"homepage": "https://matraic.github.io/m3e/",
|
|
7
|
+
"homepage": "https://matraic.github.io/m3e/#/components/icon-button.html",
|
|
8
8
|
"repository": {
|
|
9
9
|
"type": "git",
|
|
10
10
|
"url": "git+https://github.com/matraic/m3e.git"
|
|
@@ -27,7 +27,7 @@
|
|
|
27
27
|
"clean": "rimraf dist"
|
|
28
28
|
},
|
|
29
29
|
"peerDependencies": {
|
|
30
|
-
"@m3e/core": "1.0.0-rc.
|
|
30
|
+
"@m3e/core": "1.0.0-rc.2",
|
|
31
31
|
"lit": "^3.3.0"
|
|
32
32
|
},
|
|
33
33
|
"devDependencies": {
|
package/cem.config.mjs
DELETED
|
@@ -1,16 +0,0 @@
|
|
|
1
|
-
import { customElementVsCodePlugin } from "custom-element-vs-code-integration";
|
|
2
|
-
|
|
3
|
-
export default {
|
|
4
|
-
globs: ["src/**/*.ts"],
|
|
5
|
-
exclude: ["src/**/*.spec.ts"],
|
|
6
|
-
packagejson: true,
|
|
7
|
-
outdir: "dist",
|
|
8
|
-
litelement: true,
|
|
9
|
-
plugins: [
|
|
10
|
-
customElementVsCodePlugin({
|
|
11
|
-
outdir: "dist",
|
|
12
|
-
htmlFileName: "html-custom-data.json",
|
|
13
|
-
cssFileName: "css-custom-data.json",
|
|
14
|
-
}),
|
|
15
|
-
],
|
|
16
|
-
};
|
package/demo/index.html
DELETED
|
@@ -1,103 +0,0 @@
|
|
|
1
|
-
<!doctype html>
|
|
2
|
-
<html lang="en" style="overflow-y: auto">
|
|
3
|
-
<head>
|
|
4
|
-
<title>Icon Button for M3E</title>
|
|
5
|
-
<meta charset="utf-8" />
|
|
6
|
-
<meta name="viewport" content="width=device-width, initial-scale=1" />
|
|
7
|
-
<meta name="description" content="Icon Button for M3E" />
|
|
8
|
-
<base href="./" />
|
|
9
|
-
<link rel="preconnect" href="https://fonts.googleapis.com" />
|
|
10
|
-
<link rel="preconnect" href="https://fonts.gstatic.com" crossorigin />
|
|
11
|
-
<link
|
|
12
|
-
href="https://fonts.googleapis.com/css2?family=Roboto:ital,wght@0,100..900;1,100..900&display=swap"
|
|
13
|
-
rel="stylesheet"
|
|
14
|
-
/>
|
|
15
|
-
<link
|
|
16
|
-
href="https://fonts.googleapis.com/css2?family=Material+Symbols+Outlined:opsz,wght,FILL,GRAD@24,400,0..1,0"
|
|
17
|
-
rel="stylesheet"
|
|
18
|
-
/>
|
|
19
|
-
<script type="importmap">
|
|
20
|
-
{
|
|
21
|
-
"imports": {
|
|
22
|
-
"lit": "https://cdn.jsdelivr.net/npm/lit@3.3.0/+esm",
|
|
23
|
-
"@m3e/core": "../../core/dist/index.min.js"
|
|
24
|
-
}
|
|
25
|
-
}
|
|
26
|
-
</script>
|
|
27
|
-
<script type="module" src="../../icon/dist/index.min.js"></script>
|
|
28
|
-
<script type="module" src="../../theme/dist/index.min.js"></script>
|
|
29
|
-
<script type="module" src="../dist/index.min.js"></script>
|
|
30
|
-
<style>
|
|
31
|
-
body {
|
|
32
|
-
font-family: "Roboto";
|
|
33
|
-
}
|
|
34
|
-
*:not(:defined) {
|
|
35
|
-
display: none;
|
|
36
|
-
}
|
|
37
|
-
</style>
|
|
38
|
-
</head>
|
|
39
|
-
<body>
|
|
40
|
-
<m3e-theme strong-focus>
|
|
41
|
-
<m3e-icon-button variant="filled"><m3e-icon name="home"></m3e-icon></m3e-icon-button>
|
|
42
|
-
<m3e-icon-button variant="tonal"><m3e-icon name="home"></m3e-icon></m3e-icon-button>
|
|
43
|
-
<m3e-icon-button variant="outlined"><m3e-icon name="home"></m3e-icon></m3e-icon-button>
|
|
44
|
-
<m3e-icon-button variant="standard"><m3e-icon name="home"></m3e-icon></m3e-icon-button>
|
|
45
|
-
<br /><br />
|
|
46
|
-
<m3e-icon-button variant="filled" disabled-interactive><m3e-icon name="home"></m3e-icon></m3e-icon-button>
|
|
47
|
-
<m3e-icon-button variant="tonal" disabled-interactive><m3e-icon name="home"></m3e-icon></m3e-icon-button>
|
|
48
|
-
<m3e-icon-button variant="outlined" disabled-interactive><m3e-icon name="home"></m3e-icon></m3e-icon-button>
|
|
49
|
-
<m3e-icon-button variant="standard" disabled-interactive><m3e-icon name="home"></m3e-icon></m3e-icon-button>
|
|
50
|
-
<br /><br />
|
|
51
|
-
<m3e-icon-button variant="filled" disabled><m3e-icon name="home"></m3e-icon></m3e-icon-button>
|
|
52
|
-
<m3e-icon-button variant="tonal" disabled><m3e-icon name="home"></m3e-icon></m3e-icon-button>
|
|
53
|
-
<m3e-icon-button variant="outlined" disabled><m3e-icon name="home"></m3e-icon></m3e-icon-button>
|
|
54
|
-
<m3e-icon-button variant="standard" disabled><m3e-icon name="home"></m3e-icon></m3e-icon-button>
|
|
55
|
-
<br /><br />
|
|
56
|
-
<m3e-icon-button variant="filled" size="extra-small"><m3e-icon name="home"></m3e-icon></m3e-icon-button>
|
|
57
|
-
<m3e-icon-button variant="filled" size="small"><m3e-icon name="home"></m3e-icon></m3e-icon-button>
|
|
58
|
-
<m3e-icon-button variant="filled" size="medium"><m3e-icon name="home"></m3e-icon></m3e-icon-button>
|
|
59
|
-
<br /><br />
|
|
60
|
-
<m3e-icon-button variant="filled" size="large"><m3e-icon name="home"></m3e-icon></m3e-icon-button>
|
|
61
|
-
<m3e-icon-button variant="filled" size="extra-large"><m3e-icon name="home"></m3e-icon></m3e-icon-button>
|
|
62
|
-
<br /><br />
|
|
63
|
-
<m3e-icon-button variant="filled" size="extra-small" shape="square">
|
|
64
|
-
<m3e-icon name="home"></m3e-icon>
|
|
65
|
-
</m3e-icon-button>
|
|
66
|
-
<m3e-icon-button variant="filled" size="small" shape="square"><m3e-icon name="home"></m3e-icon></m3e-icon-button>
|
|
67
|
-
<m3e-icon-button variant="filled" size="medium" shape="square"><m3e-icon name="home"></m3e-icon></m3e-icon-button>
|
|
68
|
-
<br /><br />
|
|
69
|
-
<m3e-icon-button variant="filled" size="large" shape="square"><m3e-icon name="home"></m3e-icon></m3e-icon-button>
|
|
70
|
-
<m3e-icon-button variant="filled" size="extra-large" shape="square">
|
|
71
|
-
<m3e-icon name="home"></m3e-icon>
|
|
72
|
-
</m3e-icon-button>
|
|
73
|
-
<br /><br />
|
|
74
|
-
<m3e-icon-button variant="filled" toggle><m3e-icon name="home"></m3e-icon></m3e-icon-button>
|
|
75
|
-
<m3e-icon-button variant="tonal" toggle><m3e-icon name="home"></m3e-icon></m3e-icon-button>
|
|
76
|
-
<m3e-icon-button variant="outlined" toggle><m3e-icon name="home"></m3e-icon></m3e-icon-button>
|
|
77
|
-
<m3e-icon-button variant="standard" toggle><m3e-icon name="home"></m3e-icon></m3e-icon-button>
|
|
78
|
-
<br /><br />
|
|
79
|
-
<m3e-icon-button variant="filled" toggle disabled><m3e-icon name="home"></m3e-icon></m3e-icon-button>
|
|
80
|
-
<m3e-icon-button variant="tonal" toggle disabled><m3e-icon name="home"></m3e-icon></m3e-icon-button>
|
|
81
|
-
<m3e-icon-button variant="outlined" toggle disabled><m3e-icon name="home"></m3e-icon></m3e-icon-button>
|
|
82
|
-
<m3e-icon-button variant="standard" toggle disabled><m3e-icon name="home"></m3e-icon></m3e-icon-button>
|
|
83
|
-
<br /><br />
|
|
84
|
-
<m3e-icon-button variant="filled" toggle disabled-interactive><m3e-icon name="home"></m3e-icon></m3e-icon-button>
|
|
85
|
-
<m3e-icon-button variant="tonal" toggle disabled-interactive><m3e-icon name="home"></m3e-icon></m3e-icon-button>
|
|
86
|
-
<m3e-icon-button variant="outlined" toggle disabled-interactive>
|
|
87
|
-
<m3e-icon name="home"></m3e-icon>
|
|
88
|
-
</m3e-icon-button>
|
|
89
|
-
<m3e-icon-button variant="standard" toggle disabled-interactive>
|
|
90
|
-
<m3e-icon name="home"></m3e-icon>
|
|
91
|
-
</m3e-icon-button>
|
|
92
|
-
<br /><br />
|
|
93
|
-
<m3e-icon-button variant="filled" toggle shape="square"><m3e-icon name="home"></m3e-icon></m3e-icon-button>
|
|
94
|
-
<m3e-icon-button variant="tonal" toggle shape="square"><m3e-icon name="home"></m3e-icon></m3e-icon-button>
|
|
95
|
-
<m3e-icon-button variant="outlined" toggle shape="square"><m3e-icon name="home"></m3e-icon></m3e-icon-button>
|
|
96
|
-
<m3e-icon-button variant="standard" toggle shape="square"><m3e-icon name="home"></m3e-icon></m3e-icon-button>
|
|
97
|
-
<br /><br />
|
|
98
|
-
<m3e-icon-button href="https://m3.material.io/components/icon-buttons/overview" target="_blank" variant="filled">
|
|
99
|
-
<m3e-icon name="home"></m3e-icon>
|
|
100
|
-
</m3e-icon-button>
|
|
101
|
-
</m3e-theme>
|
|
102
|
-
</body>
|
|
103
|
-
</html>
|
|
@@ -1,316 +0,0 @@
|
|
|
1
|
-
import { CSSResultGroup, LitElement, PropertyValues } from "lit";
|
|
2
|
-
import { IconButtonSize } from "./IconButtonSize";
|
|
3
|
-
import { IconButtonShape } from "./IconButtonShape";
|
|
4
|
-
import { IconButtonVariant } from "./IconButtonVariant";
|
|
5
|
-
import { IconButtonWidth } from "./IconButtonWidth";
|
|
6
|
-
declare const M3eIconButtonElement_base: import("node_modules/@m3e/core/dist/src/shared/mixins/Constructor").Constructor<import("@m3e/core").LinkButtonMixin> & import("node_modules/@m3e/core/dist/src/shared/mixins/Constructor").Constructor<import("@m3e/core").FormSubmitterMixin> & import("node_modules/@m3e/core/dist/src/shared/mixins/Constructor").Constructor & import("node_modules/@m3e/core/dist/src/shared/mixins/Constructor").Constructor<import("@m3e/core").DisabledInteractiveMixin> & import("node_modules/@m3e/core/dist/src/shared/mixins/Constructor").Constructor<import("@m3e/core").DisabledMixin> & import("node_modules/@m3e/core/dist/src/shared/mixins/Constructor").Constructor<import("@m3e/core").AttachInternalsMixin> & typeof LitElement;
|
|
7
|
-
/**
|
|
8
|
-
* @summary
|
|
9
|
-
* An icon button users interact with to perform a supplementary action.
|
|
10
|
-
*
|
|
11
|
-
* @description
|
|
12
|
-
* The `m3e-icon-button` component is a semantic, expressive UI primitive for triggering actions with a single icon.
|
|
13
|
-
* Designed according to Material Design 3 guidelines, it supports five four variants, specified using the
|
|
14
|
-
* `variant` attribute—`filled`, `tonal`, `outlined`, and `standard`—each with dynamic elevation, shape morphing, and
|
|
15
|
-
* adaptive color theming. The component responds to interaction states (hover, focus, press, disabled) with smooth motion
|
|
16
|
-
* transitions, ensuring emotional clarity and visual hierarchy.
|
|
17
|
-
*
|
|
18
|
-
* The component is accessible by default, with ARIA roles, contrast-safe color tokens, and strong focus indicators.
|
|
19
|
-
* It supports optional icons and states for binary actions. When using `m3e-icon` for icons, `filled` is automatically
|
|
20
|
-
* set based on the selected state of a toggle button. It can also function as a link or be used to submit form data.
|
|
21
|
-
*
|
|
22
|
-
* Native disabled `<button>` elements cannot receive focus. This can be problematic in some cases because it can prevent you
|
|
23
|
-
* from telling the user why the button is disabled. You can use the `disabled-interactive` attribute to style a `m3e-icon-button`
|
|
24
|
-
* as disabled but allow for it to receive focus. The button will have `aria-disabled="true"` for assistive technology.
|
|
25
|
-
*
|
|
26
|
-
* @example
|
|
27
|
-
* The following example illustrates changing the appearance from `standard` (default) to `filled` using the `variant`
|
|
28
|
-
* attribute, changing the size using the `size` attribute, and enabling toggle behavior using the `toggle` attribute.
|
|
29
|
-
*
|
|
30
|
-
* ```html
|
|
31
|
-
* <m3e-icon-button variant="filled" size="large" toggle selected>
|
|
32
|
-
* <m3e-icon name="favorite"></m3e-icon>
|
|
33
|
-
* </m3e-icon-button>
|
|
34
|
-
* ```
|
|
35
|
-
*
|
|
36
|
-
* @tag m3e-icon-button
|
|
37
|
-
*
|
|
38
|
-
* @slot - Renders the icon of the button.
|
|
39
|
-
* @slot selected - Renders an icon, when selected.
|
|
40
|
-
*
|
|
41
|
-
* @attr disabled - Whether the element is disabled.
|
|
42
|
-
* @attr disabled-interactive - Whether the element is disabled and interactive.
|
|
43
|
-
* @attr download - A value indicating whether the `target` of the link button will be downloaded, optionally specifying the new name of the file.
|
|
44
|
-
* @attr href - The URL to which the link button points.
|
|
45
|
-
* @attr name - The name of the element, submitted as a pair with the element's `value` as part of form data, when the element is used to submit a form.
|
|
46
|
-
* @attr rel - The relationship between the `target` of the link button and the document.
|
|
47
|
-
* @attr selected - Whether the toggle button is selected.
|
|
48
|
-
* @attr shape - The shape of the button.
|
|
49
|
-
* @attr size - The size of the button.
|
|
50
|
-
* @attr target - The target of the link button.
|
|
51
|
-
* @attr toggle - Whether the button will toggle between selected and unselected states.
|
|
52
|
-
* @attr type - The type of the element.
|
|
53
|
-
* @attr value - The value associated with the element's name when it's submitted with form data.
|
|
54
|
-
* @attr variant - The appearance variant of the button.
|
|
55
|
-
* @attr width - The width of the button.
|
|
56
|
-
*
|
|
57
|
-
* @fires input - Dispatched when a toggle button's selected state changes.
|
|
58
|
-
* @fires change - Dispatched when a toggle button's selected state changes.
|
|
59
|
-
*
|
|
60
|
-
* @cssprop --m3e-icon-button-extra-small-container-height - Height of the extra-small container.
|
|
61
|
-
* @cssprop --m3e-icon-button-extra-small-outline-thickness - Outline thickness for extra-small.
|
|
62
|
-
* @cssprop --m3e-icon-button-extra-small-icon-size - Icon size for extra-small.
|
|
63
|
-
* @cssprop --m3e-icon-button-extra-small-shape-round - Corner radius for round extra-small.
|
|
64
|
-
* @cssprop --m3e-icon-button-extra-small-shape-square - Corner radius for square extra-small.
|
|
65
|
-
* @cssprop --m3e-icon-button-extra-small-selected-shape-round - Corner radius for selected round extra-small.
|
|
66
|
-
* @cssprop --m3e-icon-button-extra-small-selected-shape-square - Corner radius for selected square extra-small.
|
|
67
|
-
* @cssprop --m3e-icon-button-extra-small-shape-pressed-morph - Corner radius for pressed extra-small.
|
|
68
|
-
* @cssprop --m3e-icon-button-extra-small-narrow-leading-space - Leading space for extra-small (narrow).
|
|
69
|
-
* @cssprop --m3e-icon-button-extra-small-narrow-trailing-space - Trailing space for extra-small (narrow).
|
|
70
|
-
* @cssprop --m3e-icon-button-extra-small-default-leading-space - Leading space for extra-small (default).
|
|
71
|
-
* @cssprop --m3e-icon-button-extra-small-default-trailing-space - Trailing space for extra-small (default).
|
|
72
|
-
* @cssprop --m3e-icon-button-extra-small-wide-leading-space - Leading space for extra-small (wide).
|
|
73
|
-
* @cssprop --m3e-icon-button-extra-small-wide-trailing-space - Trailing space for extra-small (wide).
|
|
74
|
-
* @cssprop --m3e-icon-button-small-container-height - Height of the small container.
|
|
75
|
-
* @cssprop --m3e-icon-button-small-outline-thickness - Outline thickness for small.
|
|
76
|
-
* @cssprop --m3e-icon-button-small-icon-size - Icon size for small.
|
|
77
|
-
* @cssprop --m3e-icon-button-small-shape-round - Corner radius for round small.
|
|
78
|
-
* @cssprop --m3e-icon-button-small-shape-square - Corner radius for square small.
|
|
79
|
-
* @cssprop --m3e-icon-button-small-selected-shape-round - Corner radius for selected round small.
|
|
80
|
-
* @cssprop --m3e-icon-button-small-selected-shape-square - Corner radius for selected square small.
|
|
81
|
-
* @cssprop --m3e-icon-button-small-shape-pressed-morph - Corner radius for pressed small.
|
|
82
|
-
* @cssprop --m3e-icon-button-small-narrow-leading-space - Leading space for small (narrow).
|
|
83
|
-
* @cssprop --m3e-icon-button-small-narrow-trailing-space - Trailing space for small (narrow).
|
|
84
|
-
* @cssprop --m3e-icon-button-small-default-leading-space - Leading space for small (default).
|
|
85
|
-
* @cssprop --m3e-icon-button-small-default-trailing-space - Trailing space for small (default).
|
|
86
|
-
* @cssprop --m3e-icon-button-small-wide-leading-space - Leading space for small (wide).
|
|
87
|
-
* @cssprop --m3e-icon-button-small-wide-trailing-space - Trailing space for small (wide).
|
|
88
|
-
* @cssprop --m3e-icon-button-medium-container-height - Height of the medium container.
|
|
89
|
-
* @cssprop --m3e-icon-button-medium-outline-thickness - Outline thickness for medium.
|
|
90
|
-
* @cssprop --m3e-icon-button-medium-icon-size - Icon size for medium.
|
|
91
|
-
* @cssprop --m3e-icon-button-medium-shape-round - Corner radius for round medium.
|
|
92
|
-
* @cssprop --m3e-icon-button-medium-shape-square - Corner radius for square medium.
|
|
93
|
-
* @cssprop --m3e-icon-button-medium-selected-shape-round - Corner radius for selected round medium.
|
|
94
|
-
* @cssprop --m3e-icon-button-medium-selected-shape-square - Corner radius for selected square medium.
|
|
95
|
-
* @cssprop --m3e-icon-button-medium-shape-pressed-morph - Corner radius for pressed medium.
|
|
96
|
-
* @cssprop --m3e-icon-button-medium-narrow-leading-space - Leading space for medium (narrow).
|
|
97
|
-
* @cssprop --m3e-icon-button-medium-narrow-trailing-space - Trailing space for medium (narrow).
|
|
98
|
-
* @cssprop --m3e-icon-button-medium-default-leading-space - Leading space for medium (default).
|
|
99
|
-
* @cssprop --m3e-icon-button-medium-default-trailing-space - Trailing space for medium (default).
|
|
100
|
-
* @cssprop --m3e-icon-button-medium-wide-leading-space - Leading space for medium (wide).
|
|
101
|
-
* @cssprop --m3e-icon-button-medium-wide-trailing-space - Trailing space for medium (wide).
|
|
102
|
-
* @cssprop --m3e-icon-button-large-container-height - Height of the large container.
|
|
103
|
-
* @cssprop --m3e-icon-button-large-outline-thickness - Outline thickness for large.
|
|
104
|
-
* @cssprop --m3e-icon-button-large-icon-size - Icon size for large.
|
|
105
|
-
* @cssprop --m3e-icon-button-large-shape-round - Corner radius for round large.
|
|
106
|
-
* @cssprop --m3e-icon-button-large-shape-square - Corner radius for square large.
|
|
107
|
-
* @cssprop --m3e-icon-button-large-selected-shape-round - Corner radius for selected round large.
|
|
108
|
-
* @cssprop --m3e-icon-button-large-selected-shape-square - Corner radius for selected square large.
|
|
109
|
-
* @cssprop --m3e-icon-button-large-shape-pressed-morph - Corner radius for pressed large.
|
|
110
|
-
* @cssprop --m3e-icon-button-large-narrow-leading-space - Leading space for large (narrow).
|
|
111
|
-
* @cssprop --m3e-icon-button-large-narrow-trailing-space - Trailing space for large (narrow).
|
|
112
|
-
* @cssprop --m3e-icon-button-large-default-leading-space - Leading space for large (default).
|
|
113
|
-
* @cssprop --m3e-icon-button-large-default-trailing-space - Trailing space for large (default).
|
|
114
|
-
* @cssprop --m3e-icon-button-large-wide-leading-space - Leading space for large (wide).
|
|
115
|
-
* @cssprop --m3e-icon-button-large-wide-trailing-space - Trailing space for large (wide).
|
|
116
|
-
* @cssprop --m3e-icon-button-extra-large-container-height - Height of the extra-large container.
|
|
117
|
-
* @cssprop --m3e-icon-button-extra-large-outline-thickness - Outline thickness for extra-large.
|
|
118
|
-
* @cssprop --m3e-icon-button-extra-large-icon-size - Icon size for extra-large.
|
|
119
|
-
* @cssprop --m3e-icon-button-extra-large-shape-round - Corner radius for round extra-large.
|
|
120
|
-
* @cssprop --m3e-icon-button-extra-large-shape-square - Corner radius for square extra-large.
|
|
121
|
-
* @cssprop --m3e-icon-button-extra-large-selected-shape-round - Corner radius for selected round extra-large.
|
|
122
|
-
* @cssprop --m3e-icon-button-extra-large-selected-shape-square - Corner radius for selected square extra-large.
|
|
123
|
-
* @cssprop --m3e-icon-button-extra-large-shape-pressed-morph - Corner radius for pressed extra-large.
|
|
124
|
-
* @cssprop --m3e-icon-button-extra-large-narrow-leading-space - Leading space for extra-large (narrow).
|
|
125
|
-
* @cssprop --m3e-icon-button-extra-large-narrow-trailing-space - Trailing space for extra-large (narrow).
|
|
126
|
-
* @cssprop --m3e-icon-button-extra-large-default-leading-space - Leading space for extra-large (default).
|
|
127
|
-
* @cssprop --m3e-icon-button-extra-large-default-trailing-space - Trailing space for extra-large (default).
|
|
128
|
-
* @cssprop --m3e-icon-button-extra-large-wide-leading-space - Leading space for extra-large (wide).
|
|
129
|
-
* @cssprop --m3e-icon-button-extra-large-wide-trailing-space - Trailing space for extra-large (wide).
|
|
130
|
-
* @cssprop --m3e-outlined-icon-button-icon-color - Default icon color for outlined variant.
|
|
131
|
-
* @cssprop --m3e-outlined-icon-button-outline-color - Default outline color for outlined variant.
|
|
132
|
-
* @cssprop --m3e-outlined-icon-button-unselected-icon-color - Unselected icon color for outlined variant.
|
|
133
|
-
* @cssprop --m3e-outlined-icon-button-selected-icon-color - Selected icon color for outlined variant.
|
|
134
|
-
* @cssprop --m3e-outlined-icon-button-selected-container-color - Selected container background color for outlined variant.
|
|
135
|
-
* @cssprop --m3e-outlined-icon-button-disabled-container-color - Container background color when disabled (outlined).
|
|
136
|
-
* @cssprop --m3e-outlined-icon-button-disabled-container-opacity - Opacity of container when disabled (outlined).
|
|
137
|
-
* @cssprop --m3e-outlined-icon-button-disabled-icon-color - Icon color when disabled (outlined).
|
|
138
|
-
* @cssprop --m3e-outlined-icon-button-disabled-icon-opacity - Icon opacity when disabled (outlined).
|
|
139
|
-
* @cssprop --m3e-outlined-icon-button-disabled-outline-color - Outline color when disabled (outlined).
|
|
140
|
-
* @cssprop --m3e-outlined-icon-button-hover-icon-color - Icon color on hover (outlined).
|
|
141
|
-
* @cssprop --m3e-outlined-icon-button-hover-outline-color - Outline color on hover (outlined).
|
|
142
|
-
* @cssprop --m3e-outlined-icon-button-hover-state-layer-color - State layer color on hover (outlined).
|
|
143
|
-
* @cssprop --m3e-outlined-icon-button-hover-state-layer-opacity - State layer opacity on hover (outlined).
|
|
144
|
-
* @cssprop --m3e-outlined-icon-button-hover-unselected-icon-color - Unselected icon color on hover (outlined).
|
|
145
|
-
* @cssprop --m3e-outlined-icon-button-hover-unselected-state-layer-color - Unselected state layer color on hover (outlined).
|
|
146
|
-
* @cssprop --m3e-outlined-icon-button-hover-selected-icon-color - Selected icon color on hover (outlined).
|
|
147
|
-
* @cssprop --m3e-outlined-icon-button-hover-selected-state-layer-color - Selected state layer color on hover (outlined).
|
|
148
|
-
* @cssprop --m3e-outlined-icon-button-focus-icon-color - Icon color on focus (outlined).
|
|
149
|
-
* @cssprop --m3e-outlined-icon-button-focus-outline-color - Outline color on focus (outlined).
|
|
150
|
-
* @cssprop --m3e-outlined-icon-button-focus-state-layer-color - State layer color on focus (outlined).
|
|
151
|
-
* @cssprop --m3e-outlined-icon-button-focus-state-layer-opacity - State layer opacity on focus (outlined).
|
|
152
|
-
* @cssprop --m3e-outlined-icon-button-focus-unselected-icon-color - Unselected icon color on focus (outlined).
|
|
153
|
-
* @cssprop --m3e-outlined-icon-button-focus-unselected-state-layer-color - Unselected state layer color on focus (outlined).
|
|
154
|
-
* @cssprop --m3e-outlined-icon-button-focus-selected-icon-color - Selected icon color on focus (outlined).
|
|
155
|
-
* @cssprop --m3e-outlined-icon-button-focus-selected-state-layer-color - Selected state layer color on focus (outlined).
|
|
156
|
-
* @cssprop --m3e-outlined-icon-button-pressed-icon-color - Icon color on pressed (outlined).
|
|
157
|
-
* @cssprop --m3e-outlined-icon-button-pressed-outline-color - Outline color on pressed (outlined).
|
|
158
|
-
* @cssprop --m3e-outlined-icon-button-pressed-state-layer-color - State layer color on pressed (outlined).
|
|
159
|
-
* @cssprop --m3e-outlined-icon-button-pressed-state-layer-opacity - State layer opacity on pressed (outlined).
|
|
160
|
-
* @cssprop --m3e-outlined-icon-button-pressed-unselected-icon-color - Unselected icon color on pressed (outlined).
|
|
161
|
-
* @cssprop --m3e-outlined-icon-button-pressed-unselected-state-layer-color - Unselected state layer color on pressed (outlined).
|
|
162
|
-
* @cssprop --m3e-outlined-icon-button-pressed-selected-icon-color - Selected icon color on pressed (outlined).
|
|
163
|
-
* @cssprop --m3e-outlined-icon-button-pressed-selected-state-layer-color - Selected state layer color on pressed (outlined).
|
|
164
|
-
* @cssprop --m3e-filled-icon-button-icon-color - Default icon color for filled variant.
|
|
165
|
-
* @cssprop --m3e-filled-icon-button-container-color - Default container background color for filled variant.
|
|
166
|
-
* @cssprop --m3e-filled-icon-button-unselected-icon-color - Unselected icon color for filled variant.
|
|
167
|
-
* @cssprop --m3e-filled-icon-button-unselected-container-color - Unselected container background color for filled variant.
|
|
168
|
-
* @cssprop --m3e-filled-icon-button-selected-icon-color - Selected icon color for filled variant.
|
|
169
|
-
* @cssprop --m3e-filled-icon-button-selected-container-color - Selected container background color for filled variant.
|
|
170
|
-
* @cssprop --m3e-filled-icon-button-disabled-container-color - Container background color when disabled (filled).
|
|
171
|
-
* @cssprop --m3e-filled-icon-button-disabled-container-opacity - Opacity of container when disabled (filled).
|
|
172
|
-
* @cssprop --m3e-filled-icon-button-disabled-icon-color - Icon color when disabled (filled).
|
|
173
|
-
* @cssprop --m3e-filled-icon-button-disabled-icon-opacity - Icon opacity when disabled (filled).
|
|
174
|
-
* @cssprop --m3e-filled-icon-button-hover-icon-color - Icon color on hover (filled).
|
|
175
|
-
* @cssprop --m3e-filled-icon-button-hover-state-layer-color - State layer color on hover (filled).
|
|
176
|
-
* @cssprop --m3e-filled-icon-button-hover-state-layer-opacity - State layer opacity on hover (filled).
|
|
177
|
-
* @cssprop --m3e-filled-icon-button-hover-unselected-icon-color - Unselected icon color on hover (filled).
|
|
178
|
-
* @cssprop --m3e-filled-icon-button-hover-unselected-state-layer-color - Unselected state layer color on hover (filled).
|
|
179
|
-
* @cssprop --m3e-filled-icon-button-hover-selected-icon-color - Selected icon color on hover (filled).
|
|
180
|
-
* @cssprop --m3e-filled-icon-button-hover-selected-state-layer-color - Selected state layer color on hover (filled).
|
|
181
|
-
* @cssprop --m3e-filled-icon-button-focus-icon-color - Icon color on focus (filled).
|
|
182
|
-
* @cssprop --m3e-filled-icon-button-focus-state-layer-color - State layer color on focus (filled).
|
|
183
|
-
* @cssprop --m3e-filled-icon-button-focus-state-layer-opacity - State layer opacity on focus (filled).
|
|
184
|
-
* @cssprop --m3e-filled-icon-button-focus-unselected-icon-color - Unselected icon color on focus (filled).
|
|
185
|
-
* @cssprop --m3e-filled-icon-button-focus-unselected-state-layer-color - Unselected state layer color on focus (filled).
|
|
186
|
-
* @cssprop --m3e-filled-icon-button-focus-selected-icon-color - Selected icon color on focus (filled).
|
|
187
|
-
* @cssprop --m3e-filled-icon-button-focus-selected-state-layer-color - Selected state layer color on focus (filled).
|
|
188
|
-
* @cssprop --m3e-filled-icon-button-pressed-icon-color - Icon color on pressed (filled).
|
|
189
|
-
* @cssprop --m3e-filled-icon-button-pressed-state-layer-color - State layer color on pressed (filled).
|
|
190
|
-
* @cssprop --m3e-filled-icon-button-pressed-state-layer-opacity - State layer opacity on pressed (filled).
|
|
191
|
-
* @cssprop --m3e-filled-icon-button-pressed-unselected-icon-color - Unselected icon color on pressed (filled).
|
|
192
|
-
* @cssprop --m3e-filled-icon-button-pressed-unselected-state-layer-color - Unselected state layer color on pressed (filled).
|
|
193
|
-
* @cssprop --m3e-filled-icon-button-pressed-selected-icon-color - Selected icon color on pressed (filled).
|
|
194
|
-
* @cssprop --m3e-filled-icon-button-pressed-selected-state-layer-color - Selected state layer color on pressed (filled).
|
|
195
|
-
* @cssprop --m3e-tonal-icon-button-icon-color - Default icon color for tonal variant.
|
|
196
|
-
* @cssprop --m3e-tonal-icon-button-container-color - Default container background color for tonal variant.
|
|
197
|
-
* @cssprop --m3e-tonal-icon-button-unselected-icon-color - Unselected icon color for tonal variant.
|
|
198
|
-
* @cssprop --m3e-tonal-icon-button-unselected-container-color - Unselected container background color for tonal variant.
|
|
199
|
-
* @cssprop --m3e-tonal-icon-button-selected-icon-color - Selected icon color for tonal variant.
|
|
200
|
-
* @cssprop --m3e-tonal-icon-button-selected-container-color - Selected container background color for tonal variant.
|
|
201
|
-
* @cssprop --m3e-tonal-icon-button-disabled-container-color - Container background color when disabled (tonal).
|
|
202
|
-
* @cssprop --m3e-tonal-icon-button-disabled-container-opacity - Opacity of container when disabled (tonal).
|
|
203
|
-
* @cssprop --m3e-tonal-icon-button-disabled-icon-color - Icon color when disabled (tonal).
|
|
204
|
-
* @cssprop --m3e-tonal-icon-button-disabled-icon-opacity - Icon opacity when disabled (tonal).
|
|
205
|
-
* @cssprop --m3e-tonal-icon-button-hover-icon-color - Icon color on hover (tonal).
|
|
206
|
-
* @cssprop --m3e-tonal-icon-button-hover-state-layer-color - State layer color on hover (tonal).
|
|
207
|
-
* @cssprop --m3e-tonal-icon-button-hover-state-layer-opacity - State layer opacity on hover (tonal).
|
|
208
|
-
* @cssprop --m3e-tonal-icon-button-hover-unselected-icon-color - Unselected icon color on hover (tonal).
|
|
209
|
-
* @cssprop --m3e-tonal-icon-button-hover-unselected-state-layer-color - Unselected state layer color on hover (tonal).
|
|
210
|
-
* @cssprop --m3e-tonal-icon-button-hover-selected-icon-color - Selected icon color on hover (tonal).
|
|
211
|
-
* @cssprop --m3e-tonal-icon-button-hover-selected-state-layer-color - Selected state layer color on hover (tonal).
|
|
212
|
-
* @cssprop --m3e-tonal-icon-button-focus-icon-color - Icon color on focus (tonal).
|
|
213
|
-
* @cssprop --m3e-tonal-icon-button-focus-state-layer-color - State layer color on focus (tonal).
|
|
214
|
-
* @cssprop --m3e-tonal-icon-button-focus-state-layer-opacity - State layer opacity on focus (tonal).
|
|
215
|
-
* @cssprop --m3e-tonal-icon-button-focus-unselected-icon-color - Unselected icon color on focus (tonal).
|
|
216
|
-
* @cssprop --m3e-tonal-icon-button-focus-unselected-state-layer-color - Unselected state layer color on focus (tonal).
|
|
217
|
-
* @cssprop --m3e-tonal-icon-button-focus-selected-icon-color - Selected icon color on focus (tonal).
|
|
218
|
-
* @cssprop --m3e-tonal-icon-button-focus-selected-state-layer-color - Selected state layer color on focus (tonal).
|
|
219
|
-
* @cssprop --m3e-tonal-icon-button-pressed-icon-color - Icon color on pressed (tonal).
|
|
220
|
-
* @cssprop --m3e-tonal-icon-button-pressed-state-layer-color - State layer color on pressed (tonal).
|
|
221
|
-
* @cssprop --m3e-tonal-icon-button-pressed-state-layer-opacity - State layer opacity on pressed (tonal).
|
|
222
|
-
* @cssprop --m3e-tonal-icon-button-pressed-unselected-icon-color - Unselected icon color on pressed (tonal).
|
|
223
|
-
* @cssprop --m3e-tonal-icon-button-pressed-unselected-state-layer-color - Unselected state layer color on pressed (tonal).
|
|
224
|
-
* @cssprop --m3e-tonal-icon-button-pressed-selected-icon-color - Selected icon color on pressed (tonal).
|
|
225
|
-
* @cssprop --m3e-tonal-icon-button-pressed-selected-state-layer-color - Selected state layer color on pressed (tonal).
|
|
226
|
-
* @cssprop --m3e-standard-icon-button-icon-color - Default icon color for standard variant.
|
|
227
|
-
* @cssprop --m3e-standard-icon-button-unselected-icon-color - Unselected icon color for standard variant.
|
|
228
|
-
* @cssprop --m3e-standard-icon-button-selected-icon-color - Selected icon color for standard variant.
|
|
229
|
-
* @cssprop --m3e-standard-icon-button-disabled-container-color - Container background color when disabled (standard).
|
|
230
|
-
* @cssprop --m3e-standard-icon-button-disabled-container-opacity - Opacity of container when disabled (standard).
|
|
231
|
-
* @cssprop --m3e-standard-icon-button-disabled-icon-color - Icon color when disabled (standard).
|
|
232
|
-
* @cssprop --m3e-standard-icon-button-disabled-icon-opacity - Icon opacity when disabled (standard).
|
|
233
|
-
* @cssprop --m3e-standard-icon-button-hover-icon-color - Icon color on hover (standard).
|
|
234
|
-
* @cssprop --m3e-standard-icon-button-hover-state-layer-color - State layer color on hover (standard).
|
|
235
|
-
* @cssprop --m3e-standard-icon-button-hover-state-layer-opacity - State layer opacity on hover (standard).
|
|
236
|
-
* @cssprop --m3e-standard-icon-button-hover-unselected-icon-color - Unselected icon color on hover (standard).
|
|
237
|
-
* @cssprop --m3e-standard-icon-button-hover-unselected-state-layer-color - Unselected state layer color on hover (standard).
|
|
238
|
-
* @cssprop --m3e-standard-icon-button-hover-selected-icon-color - Selected icon color on hover (standard).
|
|
239
|
-
* @cssprop --m3e-standard-icon-button-hover-selected-state-layer-color - Selected state layer color on hover (standard).
|
|
240
|
-
* @cssprop --m3e-standard-icon-button-focus-icon-color - Icon color on focus (standard).
|
|
241
|
-
* @cssprop --m3e-standard-icon-button-focus-state-layer-color - State layer color on focus (standard).
|
|
242
|
-
* @cssprop --m3e-standard-icon-button-focus-state-layer-opacity - State layer opacity on focus (standard).
|
|
243
|
-
* @cssprop --m3e-standard-icon-button-focus-unselected-icon-color - Unselected icon color on focus (standard).
|
|
244
|
-
* @cssprop --m3e-standard-icon-button-focus-unselected-state-layer-color - Unselected state layer color on focus (standard).
|
|
245
|
-
* @cssprop --m3e-standard-icon-button-focus-selected-icon-color - Selected icon color on focus (standard).
|
|
246
|
-
* @cssprop --m3e-standard-icon-button-focus-selected-state-layer-color - Selected state layer color on focus (standard).
|
|
247
|
-
* @cssprop --m3e-standard-icon-button-pressed-icon-color - Icon color on pressed (standard).
|
|
248
|
-
* @cssprop --m3e-standard-icon-button-pressed-state-layer-color - State layer color on pressed (standard).
|
|
249
|
-
* @cssprop --m3e-standard-icon-button-pressed-state-layer-opacity - State layer opacity on pressed (standard).
|
|
250
|
-
* @cssprop --m3e-standard-icon-button-pressed-unselected-icon-color - Unselected icon color on pressed (standard).
|
|
251
|
-
* @cssprop --m3e-standard-icon-button-pressed-unselected-state-layer-color - Unselected state layer color on pressed (standard).
|
|
252
|
-
* @cssprop --m3e-standard-icon-button-pressed-selected-icon-color - Selected icon color on pressed (standard).
|
|
253
|
-
* @cssprop --m3e-standard-icon-button-pressed-selected-state-layer-color - Selected state layer color on pressed (standard).
|
|
254
|
-
*/
|
|
255
|
-
export declare class M3eIconButtonElement extends M3eIconButtonElement_base {
|
|
256
|
-
#private;
|
|
257
|
-
/** The styles of the element. */
|
|
258
|
-
static styles: CSSResultGroup;
|
|
259
|
-
/** @private */ private readonly _base?;
|
|
260
|
-
/** @private */ private readonly _elevation?;
|
|
261
|
-
/** @private */ private readonly _focusRing?;
|
|
262
|
-
/** @private */ private readonly _stateLayer?;
|
|
263
|
-
/** @private */ private readonly _ripple?;
|
|
264
|
-
constructor();
|
|
265
|
-
/**
|
|
266
|
-
* The appearance variant of the button.
|
|
267
|
-
* @default "standard"
|
|
268
|
-
*/
|
|
269
|
-
variant: IconButtonVariant;
|
|
270
|
-
/**
|
|
271
|
-
* The shape of the button.
|
|
272
|
-
* @default "rounded"
|
|
273
|
-
*/
|
|
274
|
-
shape: IconButtonShape;
|
|
275
|
-
/**
|
|
276
|
-
* The size of the button.
|
|
277
|
-
* @default "small"
|
|
278
|
-
*/
|
|
279
|
-
size: IconButtonSize;
|
|
280
|
-
/**
|
|
281
|
-
* The width of the button.
|
|
282
|
-
* @default "default"
|
|
283
|
-
*/
|
|
284
|
-
width: IconButtonWidth;
|
|
285
|
-
/**
|
|
286
|
-
* Whether the button will toggle between selected and unselected states.
|
|
287
|
-
* @default false
|
|
288
|
-
*/
|
|
289
|
-
toggle: boolean;
|
|
290
|
-
/**
|
|
291
|
-
* Whether the toggle button is selected.
|
|
292
|
-
* @default false
|
|
293
|
-
*/
|
|
294
|
-
selected: boolean;
|
|
295
|
-
/** Whether the button is contained by a button group. */
|
|
296
|
-
get grouped(): boolean;
|
|
297
|
-
/** @inheritdoc */
|
|
298
|
-
render(): unknown;
|
|
299
|
-
/** @inheritdoc */
|
|
300
|
-
connectedCallback(): void;
|
|
301
|
-
/** @inheritdoc */
|
|
302
|
-
disconnectedCallback(): void;
|
|
303
|
-
/** @inheritdoc */
|
|
304
|
-
protected firstUpdated(_changedProperties: PropertyValues<this>): void;
|
|
305
|
-
/** @inheritdoc */
|
|
306
|
-
protected updated(_changedProperties: PropertyValues<this>): void;
|
|
307
|
-
/** @private */
|
|
308
|
-
private _handleResize;
|
|
309
|
-
}
|
|
310
|
-
declare global {
|
|
311
|
-
interface HTMLElementTagNameMap {
|
|
312
|
-
"m3e-icon-button": M3eIconButtonElement;
|
|
313
|
-
}
|
|
314
|
-
}
|
|
315
|
-
export {};
|
|
316
|
-
//# sourceMappingURL=IconButtonElement.d.ts.map
|
|
@@ -1 +0,0 @@
|
|
|
1
|
-
{"version":3,"file":"IconButtonElement.d.ts","sourceRoot":"","sources":["../../src/IconButtonElement.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,cAAc,EAAQ,UAAU,EAAW,cAAc,EAAE,MAAM,KAAK,CAAC;AAwBhF,OAAO,EAAE,cAAc,EAAE,MAAM,kBAAkB,CAAC;AAClD,OAAO,EAAE,eAAe,EAAE,MAAM,mBAAmB,CAAC;AACpD,OAAO,EAAE,iBAAiB,EAAE,MAAM,qBAAqB,CAAC;AAGxD,OAAO,EAAE,eAAe,EAAE,MAAM,mBAAmB,CAAC;;AAEpD;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;GAuPG;AACH,qBACa,oBAAqB,SAAQ,yBAEzC;;IACC,iCAAiC;IACjC,OAAgB,MAAM,EAAE,cAAc,CAAkE;IAExG,eAAe,CAAiB,OAAO,CAAC,QAAQ,CAAC,KAAK,CAAC,CAAc;IACrE,eAAe,CAAsB,OAAO,CAAC,QAAQ,CAAC,UAAU,CAAC,CAAsB;IACvF,eAAe,CAAuB,OAAO,CAAC,QAAQ,CAAC,UAAU,CAAC,CAAsB;IACxF,eAAe,CAAwB,OAAO,CAAC,QAAQ,CAAC,WAAW,CAAC,CAAuB;IAC3F,eAAe,CAAmB,OAAO,CAAC,QAAQ,CAAC,OAAO,CAAC,CAAmB;;IA2D9E;;;OAGG;IAC0B,OAAO,EAAE,iBAAiB,CAAc;IAErE;;;OAGG;IAC0B,KAAK,EAAE,eAAe,CAAa;IAEhE;;;OAGG;IAC0B,IAAI,EAAE,cAAc,CAAW;IAE5D;;;OAGG;IAC0B,KAAK,EAAE,eAAe,CAAa;IAEhE;;;OAGG;IACyC,MAAM,UAAS;IAE3D;;;OAGG;IACyC,QAAQ,UAAS;IAE7D,yDAAyD;IACzD,IAAI,OAAO,YAEV;IAED,kBAAkB;IACT,MAAM,IAAI,OAAO;IAsB1B,kBAAkB;IACT,iBAAiB,IAAI,IAAI;IAMlC,kBAAkB;IACT,oBAAoB,IAAI,IAAI;IAYrC,kBAAkB;cACC,YAAY,CAAC,kBAAkB,EAAE,cAAc,CAAC,IAAI,CAAC,GAAG,IAAI;IAK/E,kBAAkB;cACC,OAAO,CAAC,kBAAkB,EAAE,cAAc,CAAC,IAAI,CAAC,GAAG,IAAI;IAqB1E,eAAe;IAEf,OAAO,CAAC,aAAa;CA4CtB;AAED,OAAO,CAAC,MAAM,CAAC;IACb,UAAU,qBAAqB;QAC7B,iBAAiB,EAAE,oBAAoB,CAAC;KACzC;CACF"}
|
|
@@ -1 +0,0 @@
|
|
|
1
|
-
{"version":3,"file":"IconButtonShape.d.ts","sourceRoot":"","sources":["../../src/IconButtonShape.ts"],"names":[],"mappings":"AAAA,+DAA+D;AAC/D,MAAM,MAAM,eAAe,GAAG,SAAS,GAAG,QAAQ,CAAC"}
|
|
@@ -1 +0,0 @@
|
|
|
1
|
-
{"version":3,"file":"IconButtonSize.d.ts","sourceRoot":"","sources":["../../src/IconButtonSize.ts"],"names":[],"mappings":"AAAA,sDAAsD;AACtD,MAAM,MAAM,cAAc,GAAG,aAAa,GAAG,OAAO,GAAG,QAAQ,GAAG,OAAO,GAAG,aAAa,CAAC"}
|
|
@@ -1 +0,0 @@
|
|
|
1
|
-
{"version":3,"file":"IconButtonVariant.d.ts","sourceRoot":"","sources":["../../src/IconButtonVariant.ts"],"names":[],"mappings":"AAAA,oEAAoE;AACpE,MAAM,MAAM,iBAAiB,GAAG,QAAQ,GAAG,OAAO,GAAG,UAAU,GAAG,UAAU,CAAC"}
|
|
@@ -1 +0,0 @@
|
|
|
1
|
-
{"version":3,"file":"IconButtonWidth.d.ts","sourceRoot":"","sources":["../../src/IconButtonWidth.ts"],"names":[],"mappings":"AAAA,+DAA+D;AAC/D,MAAM,MAAM,eAAe,GAAG,SAAS,GAAG,QAAQ,GAAG,MAAM,CAAC"}
|
package/dist/src/index.d.ts
DELETED
package/dist/src/index.d.ts.map
DELETED
|
@@ -1 +0,0 @@
|
|
|
1
|
-
{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../src/index.ts"],"names":[],"mappings":"AAAA,cAAc,qBAAqB,CAAC;AACpC,cAAc,mBAAmB,CAAC;AAClC,cAAc,kBAAkB,CAAC;AACjC,cAAc,qBAAqB,CAAC;AACpC,cAAc,mBAAmB,CAAC"}
|
|
@@ -1 +0,0 @@
|
|
|
1
|
-
{"version":3,"file":"IconButtonSizeStyle.d.ts","sourceRoot":"","sources":["../../../src/styles/IconButtonSizeStyle.ts"],"names":[],"mappings":"AAAA,OAAO,EAAkB,cAAc,EAAa,MAAM,KAAK,CAAC;AAoFhE;;;GAGG;AACH,eAAO,MAAM,mBAAmB,EAAE,cAMjC,CAAC"}
|
|
@@ -1,26 +0,0 @@
|
|
|
1
|
-
import { CSSResult } from "lit";
|
|
2
|
-
import { IconButtonSize } from "../IconButtonSize";
|
|
3
|
-
/** @private */
|
|
4
|
-
type _IconButtonSizeToken = {
|
|
5
|
-
containerHeight: CSSResult;
|
|
6
|
-
outlineThickness: CSSResult;
|
|
7
|
-
iconSize: CSSResult;
|
|
8
|
-
shapeRound: CSSResult;
|
|
9
|
-
shapeSquare: CSSResult;
|
|
10
|
-
selectedShapeRound: CSSResult;
|
|
11
|
-
selectedShapeSquare: CSSResult;
|
|
12
|
-
shapePressedMorph: CSSResult;
|
|
13
|
-
narrowLeadingSpace: CSSResult;
|
|
14
|
-
narrowTrailingSpace: CSSResult;
|
|
15
|
-
defaultLeadingSpace: CSSResult;
|
|
16
|
-
defaultTrailingSpace: CSSResult;
|
|
17
|
-
wideLeadingSpace: CSSResult;
|
|
18
|
-
wideTrailingSpace: CSSResult;
|
|
19
|
-
};
|
|
20
|
-
/**
|
|
21
|
-
* Component design tokens that control the `M3eIconButtonElement` for all size variants.
|
|
22
|
-
* @internal
|
|
23
|
-
*/
|
|
24
|
-
export declare const IconButtonSizeToken: Record<IconButtonSize, _IconButtonSizeToken>;
|
|
25
|
-
export {};
|
|
26
|
-
//# sourceMappingURL=IconButtonSizeToken.d.ts.map
|
|
@@ -1 +0,0 @@
|
|
|
1
|
-
{"version":3,"file":"IconButtonSizeToken.d.ts","sourceRoot":"","sources":["../../../src/styles/IconButtonSizeToken.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,SAAS,EAAa,MAAM,KAAK,CAAC;AAI3C,OAAO,EAAE,cAAc,EAAE,MAAM,mBAAmB,CAAC;AAEnD,eAAe;AACf,KAAK,oBAAoB,GAAG;IAC1B,eAAe,EAAE,SAAS,CAAC;IAC3B,gBAAgB,EAAE,SAAS,CAAC;IAC5B,QAAQ,EAAE,SAAS,CAAC;IACpB,UAAU,EAAE,SAAS,CAAC;IACtB,WAAW,EAAE,SAAS,CAAC;IACvB,kBAAkB,EAAE,SAAS,CAAC;IAC9B,mBAAmB,EAAE,SAAS,CAAC;IAC/B,iBAAiB,EAAE,SAAS,CAAC;IAC7B,kBAAkB,EAAE,SAAS,CAAC;IAC9B,mBAAmB,EAAE,SAAS,CAAC;IAC/B,mBAAmB,EAAE,SAAS,CAAC;IAC/B,oBAAoB,EAAE,SAAS,CAAC;IAChC,gBAAgB,EAAE,SAAS,CAAC;IAC5B,iBAAiB,EAAE,SAAS,CAAC;CAC9B,CAAC;AAEF;;;GAGG;AACH,eAAO,MAAM,mBAAmB,EAAE,MAAM,CAAC,cAAc,EAAE,oBAAoB,CA0LnE,CAAC"}
|
|
@@ -1 +0,0 @@
|
|
|
1
|
-
{"version":3,"file":"IconButtonStyle.d.ts","sourceRoot":"","sources":["../../../src/styles/IconButtonStyle.ts"],"names":[],"mappings":"AAAA,OAAO,EAAO,cAAc,EAAa,MAAM,KAAK,CAAC;AAIrD;;;GAGG;AACH,eAAO,MAAM,eAAe,EAAE,cA+K7B,CAAC"}
|
|
@@ -1 +0,0 @@
|
|
|
1
|
-
{"version":3,"file":"IconButtonVariantStyle.d.ts","sourceRoot":"","sources":["../../../src/styles/IconButtonVariantStyle.ts"],"names":[],"mappings":"AAAA,OAAO,EAAkB,cAAc,EAAa,MAAM,KAAK,CAAC;AA2GhE;;;GAGG;AACH,eAAO,MAAM,sBAAsB,EAAE,cAWpC,CAAC"}
|