@tylertech/forge 3.10.4-dev.0 → 3.10.4
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.
|
@@ -112,26 +112,6 @@
|
|
|
112
112
|
"description": "The spacing between the content within the badge.",
|
|
113
113
|
"values": []
|
|
114
114
|
},
|
|
115
|
-
{
|
|
116
|
-
"name": "--forge-bottom-sheet-desktop-max-width",
|
|
117
|
-
"description": "The maximum width of the bottom sheet on desktop.",
|
|
118
|
-
"values": []
|
|
119
|
-
},
|
|
120
|
-
{
|
|
121
|
-
"name": "--forge-bottom-sheet-desktop-min-width",
|
|
122
|
-
"description": "The minimum width of the bottom sheet on desktop.",
|
|
123
|
-
"values": []
|
|
124
|
-
},
|
|
125
|
-
{
|
|
126
|
-
"name": "--forge-bottom-sheet-animation-duration",
|
|
127
|
-
"description": "The duration of the bottom sheet animation to fullscreen.",
|
|
128
|
-
"values": []
|
|
129
|
-
},
|
|
130
|
-
{
|
|
131
|
-
"name": "--forge-bottom-sheet-animation-timing",
|
|
132
|
-
"description": "The timing function of the bottom sheet animation to fullscreen.",
|
|
133
|
-
"values": []
|
|
134
|
-
},
|
|
135
115
|
{
|
|
136
116
|
"name": "--forge-banner-background",
|
|
137
117
|
"description": "The background color of the banner.",
|
|
@@ -172,6 +152,26 @@
|
|
|
172
152
|
"description": "The transition easing function.",
|
|
173
153
|
"values": []
|
|
174
154
|
},
|
|
155
|
+
{
|
|
156
|
+
"name": "--forge-bottom-sheet-desktop-max-width",
|
|
157
|
+
"description": "The maximum width of the bottom sheet on desktop.",
|
|
158
|
+
"values": []
|
|
159
|
+
},
|
|
160
|
+
{
|
|
161
|
+
"name": "--forge-bottom-sheet-desktop-min-width",
|
|
162
|
+
"description": "The minimum width of the bottom sheet on desktop.",
|
|
163
|
+
"values": []
|
|
164
|
+
},
|
|
165
|
+
{
|
|
166
|
+
"name": "--forge-bottom-sheet-animation-duration",
|
|
167
|
+
"description": "The duration of the bottom sheet animation to fullscreen.",
|
|
168
|
+
"values": []
|
|
169
|
+
},
|
|
170
|
+
{
|
|
171
|
+
"name": "--forge-bottom-sheet-animation-timing",
|
|
172
|
+
"description": "The timing function of the bottom sheet animation to fullscreen.",
|
|
173
|
+
"values": []
|
|
174
|
+
},
|
|
175
175
|
{
|
|
176
176
|
"name": "--forge-button-primary-color",
|
|
177
177
|
"description": "The primary color of the button.",
|
|
@@ -1727,71 +1727,6 @@
|
|
|
1727
1727
|
"description": "The font size of the icon.",
|
|
1728
1728
|
"values": []
|
|
1729
1729
|
},
|
|
1730
|
-
{
|
|
1731
|
-
"name": "--forge-inline-message-background",
|
|
1732
|
-
"description": "The background color.",
|
|
1733
|
-
"values": []
|
|
1734
|
-
},
|
|
1735
|
-
{
|
|
1736
|
-
"name": "--forge-inline-message-color",
|
|
1737
|
-
"description": "The text color.",
|
|
1738
|
-
"values": []
|
|
1739
|
-
},
|
|
1740
|
-
{
|
|
1741
|
-
"name": "--forge-inline-message-shape",
|
|
1742
|
-
"description": "The shape (border) radius.",
|
|
1743
|
-
"values": []
|
|
1744
|
-
},
|
|
1745
|
-
{
|
|
1746
|
-
"name": "--forge-inline-message-padding",
|
|
1747
|
-
"description": "The padding around the content.",
|
|
1748
|
-
"values": []
|
|
1749
|
-
},
|
|
1750
|
-
{
|
|
1751
|
-
"name": "--forge-inline-message-padding-inline",
|
|
1752
|
-
"description": "The inline padding around the content.",
|
|
1753
|
-
"values": []
|
|
1754
|
-
},
|
|
1755
|
-
{
|
|
1756
|
-
"name": "--forge-inline-message-padding-block",
|
|
1757
|
-
"description": "The block padding around the content.",
|
|
1758
|
-
"values": []
|
|
1759
|
-
},
|
|
1760
|
-
{
|
|
1761
|
-
"name": "--forge-inline-message-border-width",
|
|
1762
|
-
"description": "The border width.",
|
|
1763
|
-
"values": []
|
|
1764
|
-
},
|
|
1765
|
-
{
|
|
1766
|
-
"name": "--forge-inline-message-border-style",
|
|
1767
|
-
"description": "The border style. Defaults to `none`.",
|
|
1768
|
-
"values": []
|
|
1769
|
-
},
|
|
1770
|
-
{
|
|
1771
|
-
"name": "--forge-inline-message-border-color",
|
|
1772
|
-
"description": "The border color.",
|
|
1773
|
-
"values": []
|
|
1774
|
-
},
|
|
1775
|
-
{
|
|
1776
|
-
"name": "--forge-inline-message-gap",
|
|
1777
|
-
"description": "The gap/space between the content elements.",
|
|
1778
|
-
"values": []
|
|
1779
|
-
},
|
|
1780
|
-
{
|
|
1781
|
-
"name": "--forge-inline-message-icon-gap",
|
|
1782
|
-
"description": "The gap/space between the icon and the content.",
|
|
1783
|
-
"values": []
|
|
1784
|
-
},
|
|
1785
|
-
{
|
|
1786
|
-
"name": "--forge-inline-message-content-gap",
|
|
1787
|
-
"description": "The gap/space between the title and the message.",
|
|
1788
|
-
"values": []
|
|
1789
|
-
},
|
|
1790
|
-
{
|
|
1791
|
-
"name": "--forge-inline-message-icon-color",
|
|
1792
|
-
"description": "The icon color.",
|
|
1793
|
-
"values": []
|
|
1794
|
-
},
|
|
1795
1730
|
{
|
|
1796
1731
|
"name": "--forge-icon-button-display",
|
|
1797
1732
|
"description": "The display property of the button.",
|
|
@@ -2042,6 +1977,71 @@
|
|
|
2042
1977
|
"description": "The color of the focus indicator.",
|
|
2043
1978
|
"values": []
|
|
2044
1979
|
},
|
|
1980
|
+
{
|
|
1981
|
+
"name": "--forge-inline-message-background",
|
|
1982
|
+
"description": "The background color.",
|
|
1983
|
+
"values": []
|
|
1984
|
+
},
|
|
1985
|
+
{
|
|
1986
|
+
"name": "--forge-inline-message-color",
|
|
1987
|
+
"description": "The text color.",
|
|
1988
|
+
"values": []
|
|
1989
|
+
},
|
|
1990
|
+
{
|
|
1991
|
+
"name": "--forge-inline-message-shape",
|
|
1992
|
+
"description": "The shape (border) radius.",
|
|
1993
|
+
"values": []
|
|
1994
|
+
},
|
|
1995
|
+
{
|
|
1996
|
+
"name": "--forge-inline-message-padding",
|
|
1997
|
+
"description": "The padding around the content.",
|
|
1998
|
+
"values": []
|
|
1999
|
+
},
|
|
2000
|
+
{
|
|
2001
|
+
"name": "--forge-inline-message-padding-inline",
|
|
2002
|
+
"description": "The inline padding around the content.",
|
|
2003
|
+
"values": []
|
|
2004
|
+
},
|
|
2005
|
+
{
|
|
2006
|
+
"name": "--forge-inline-message-padding-block",
|
|
2007
|
+
"description": "The block padding around the content.",
|
|
2008
|
+
"values": []
|
|
2009
|
+
},
|
|
2010
|
+
{
|
|
2011
|
+
"name": "--forge-inline-message-border-width",
|
|
2012
|
+
"description": "The border width.",
|
|
2013
|
+
"values": []
|
|
2014
|
+
},
|
|
2015
|
+
{
|
|
2016
|
+
"name": "--forge-inline-message-border-style",
|
|
2017
|
+
"description": "The border style. Defaults to `none`.",
|
|
2018
|
+
"values": []
|
|
2019
|
+
},
|
|
2020
|
+
{
|
|
2021
|
+
"name": "--forge-inline-message-border-color",
|
|
2022
|
+
"description": "The border color.",
|
|
2023
|
+
"values": []
|
|
2024
|
+
},
|
|
2025
|
+
{
|
|
2026
|
+
"name": "--forge-inline-message-gap",
|
|
2027
|
+
"description": "The gap/space between the content elements.",
|
|
2028
|
+
"values": []
|
|
2029
|
+
},
|
|
2030
|
+
{
|
|
2031
|
+
"name": "--forge-inline-message-icon-gap",
|
|
2032
|
+
"description": "The gap/space between the icon and the content.",
|
|
2033
|
+
"values": []
|
|
2034
|
+
},
|
|
2035
|
+
{
|
|
2036
|
+
"name": "--forge-inline-message-content-gap",
|
|
2037
|
+
"description": "The gap/space between the title and the message.",
|
|
2038
|
+
"values": []
|
|
2039
|
+
},
|
|
2040
|
+
{
|
|
2041
|
+
"name": "--forge-inline-message-icon-color",
|
|
2042
|
+
"description": "The icon color.",
|
|
2043
|
+
"values": []
|
|
2044
|
+
},
|
|
2045
2045
|
{
|
|
2046
2046
|
"name": "--forge-label-value-align",
|
|
2047
2047
|
"description": "Aligns the label and value. Possible values: `start` (default), `center`, `end`.",
|
|
@@ -5625,11 +5625,6 @@
|
|
|
5625
5625
|
"description": "The focus indicator element."
|
|
5626
5626
|
},
|
|
5627
5627
|
{ "name": "::part(svg)", "description": "The internal SVG element." },
|
|
5628
|
-
{ "name": "::part(root)", "description": "The root layout element." },
|
|
5629
|
-
{
|
|
5630
|
-
"name": "::part(container)",
|
|
5631
|
-
"description": "The container element for the title and message content."
|
|
5632
|
-
},
|
|
5633
5628
|
{ "name": "::part(root)", "description": "The root container element." },
|
|
5634
5629
|
{
|
|
5635
5630
|
"name": "::part(focus-indicator)",
|
|
@@ -5639,6 +5634,11 @@
|
|
|
5639
5634
|
"name": "::part(state-layer)",
|
|
5640
5635
|
"description": "The state-layer surface element."
|
|
5641
5636
|
},
|
|
5637
|
+
{ "name": "::part(root)", "description": "The root layout element." },
|
|
5638
|
+
{
|
|
5639
|
+
"name": "::part(container)",
|
|
5640
|
+
"description": "The container element for the title and message content."
|
|
5641
|
+
},
|
|
5642
5642
|
{
|
|
5643
5643
|
"name": "::part(root)",
|
|
5644
5644
|
"description": "The root layout container element."
|
|
@@ -172,50 +172,50 @@
|
|
|
172
172
|
"references": []
|
|
173
173
|
},
|
|
174
174
|
{
|
|
175
|
-
"name": "forge-
|
|
176
|
-
"description": "
|
|
175
|
+
"name": "forge-banner",
|
|
176
|
+
"description": "Banners are used to inform users of important information, such as errors, warnings, or success messages.\n---\n\n\n### **Events:**\n - **forge-banner-before-dismiss** - Dispatched before the banner is dismissed. Cancelable to prevent dismissal.\n- **forge-banner-dismissed** - Dispatched when the banner is dismissed.\n\n### **Slots:**\n - _default_ - The content of the banner.\n- **icon** - The icon to display.\n- **button** - The optional button to display.\n\n### **CSS Properties:**\n - **--forge-banner-background** - The background color of the banner. _(default: undefined)_\n- **--forge-banner-color** - The text color of the banner. _(default: undefined)_\n- **--forge-banner-icon-color** - The color of the icon. _(default: undefined)_\n- **--forge-banner-gap** - The gap between the contents. _(default: undefined)_\n- **--forge-banner-padding-inline** - The inline padding. _(default: undefined)_\n- **--forge-banner-padding-block** - The block padding. _(default: undefined)_\n- **--forge-banner-transition-duration** - The transition duration. _(default: undefined)_\n- **--forge-banner-transition-easing** - The transition easing function. _(default: undefined)_",
|
|
177
177
|
"attributes": [
|
|
178
178
|
{
|
|
179
|
-
"name": "
|
|
180
|
-
"description": "
|
|
179
|
+
"name": "dismissed",
|
|
180
|
+
"description": "Controls the visibility of the banner.",
|
|
181
181
|
"values": []
|
|
182
182
|
},
|
|
183
|
-
{
|
|
184
|
-
"name": "mode",
|
|
185
|
-
"description": "The mode of the bottom sheet.",
|
|
186
|
-
"values": [{ "name": "BottomSheetMode" }]
|
|
187
|
-
},
|
|
188
183
|
{
|
|
189
184
|
"name": "persistent",
|
|
190
|
-
"description": "
|
|
185
|
+
"description": "Controls the visibility of the built-in dismiss button.",
|
|
191
186
|
"values": []
|
|
192
187
|
},
|
|
193
188
|
{
|
|
194
|
-
"name": "
|
|
195
|
-
"description": "
|
|
196
|
-
"values": []
|
|
189
|
+
"name": "theme",
|
|
190
|
+
"description": "The theme of the banner.",
|
|
191
|
+
"values": [{ "name": "BannerTheme" }]
|
|
197
192
|
}
|
|
198
193
|
],
|
|
199
194
|
"references": []
|
|
200
195
|
},
|
|
201
196
|
{
|
|
202
|
-
"name": "forge-
|
|
203
|
-
"description": "
|
|
197
|
+
"name": "forge-bottom-sheet",
|
|
198
|
+
"description": "Bottom sheets slide up from the bottom of the screen to reveal more content and/or actions that the user can take.\n---\n\n\n### **Events:**\n - **forge-bottom-sheet-before-close** - Fires before the bottom sheet closes.\n- **forge-bottom-sheet-close** - Fires after the bottom sheet closes.\n- **forge-bottom-sheet-open** - Fires after the bottom sheet opens.\n- **forge-bottom-sheet-drag-start** - Fires when the bottom sheet starts to be dragged.\n- **forge-bottom-sheet-dragged** - Fires when the bottom sheet is dragged.\n- **forge-bottom-sheet-drag-end** - Fires when the bottom sheet drag ends.\n- **forge-bottom-sheet-drag-cancel** - Fires when the bottom sheet drag is cancelled.\n- **forge-bottom-sheet-fullscreen** - Fires when the bottom sheet is toggled to fullscreen.\n\n### **Slots:**\n - _default_ - The content of the bottom sheet. This is a passthrough slot to the dialog surface.\n\n### **CSS Properties:**\n - **--forge-bottom-sheet-desktop-max-width** - The maximum width of the bottom sheet on desktop. _(default: undefined)_\n- **--forge-bottom-sheet-desktop-min-width** - The minimum width of the bottom sheet on desktop. _(default: undefined)_\n- **--forge-bottom-sheet-animation-duration** - The duration of the bottom sheet animation to fullscreen. _(default: undefined)_\n- **--forge-bottom-sheet-animation-timing** - The timing function of the bottom sheet animation to fullscreen. _(default: undefined)_\n\n### **CSS Parts:**\n - **root** - The root element of the bottom sheet.\n- **surface** - The surface element of the bottom sheet within th dialog.",
|
|
204
199
|
"attributes": [
|
|
205
200
|
{
|
|
206
|
-
"name": "
|
|
207
|
-
"description": "
|
|
201
|
+
"name": "open",
|
|
202
|
+
"description": "Whether the bottom sheet is open.",
|
|
208
203
|
"values": []
|
|
209
204
|
},
|
|
205
|
+
{
|
|
206
|
+
"name": "mode",
|
|
207
|
+
"description": "The mode of the bottom sheet.",
|
|
208
|
+
"values": [{ "name": "BottomSheetMode" }]
|
|
209
|
+
},
|
|
210
210
|
{
|
|
211
211
|
"name": "persistent",
|
|
212
|
-
"description": "
|
|
212
|
+
"description": "Whether the bottom sheet is persistent.",
|
|
213
213
|
"values": []
|
|
214
214
|
},
|
|
215
215
|
{
|
|
216
|
-
"name": "
|
|
217
|
-
"description": "
|
|
218
|
-
"values": [
|
|
216
|
+
"name": "fullscreen",
|
|
217
|
+
"description": "Whether the bottom sheet is fullscreen.",
|
|
218
|
+
"values": []
|
|
219
219
|
}
|
|
220
220
|
],
|
|
221
221
|
"references": []
|
|
@@ -1186,18 +1186,6 @@
|
|
|
1186
1186
|
],
|
|
1187
1187
|
"references": []
|
|
1188
1188
|
},
|
|
1189
|
-
{
|
|
1190
|
-
"name": "forge-inline-message",
|
|
1191
|
-
"description": "Inline messages are used to provide feedback to the user about a specific action or state.\n---\n\n\n### **Slots:**\n - _default_ - The message text.\n- **title** - The title of the inline message.\n- **icon** - The icon to display.\n\n### **CSS Properties:**\n - **--forge-inline-message-background** - The background color. _(default: undefined)_\n- **--forge-inline-message-color** - The text color. _(default: undefined)_\n- **--forge-inline-message-shape** - The shape (border) radius. _(default: undefined)_\n- **--forge-inline-message-padding** - The padding around the content. _(default: undefined)_\n- **--forge-inline-message-padding-inline** - The inline padding around the content. _(default: undefined)_\n- **--forge-inline-message-padding-block** - The block padding around the content. _(default: undefined)_\n- **--forge-inline-message-border-width** - The border width. _(default: undefined)_\n- **--forge-inline-message-border-style** - The border style. Defaults to `none`. _(default: undefined)_\n- **--forge-inline-message-border-color** - The border color. _(default: undefined)_\n- **--forge-inline-message-gap** - The gap/space between the content elements. _(default: undefined)_\n- **--forge-inline-message-icon-gap** - The gap/space between the icon and the content. _(default: undefined)_\n- **--forge-inline-message-content-gap** - The gap/space between the title and the message. _(default: undefined)_\n- **--forge-inline-message-icon-color** - The icon color. _(default: undefined)_\n\n### **CSS Parts:**\n - **root** - The root layout element.\n- **container** - The container element for the title and message content.",
|
|
1192
|
-
"attributes": [
|
|
1193
|
-
{
|
|
1194
|
-
"name": "theme",
|
|
1195
|
-
"description": "The theme to apply.",
|
|
1196
|
-
"values": [{ "name": "InlineMessageTheme" }]
|
|
1197
|
-
}
|
|
1198
|
-
],
|
|
1199
|
-
"references": []
|
|
1200
|
-
},
|
|
1201
1189
|
{
|
|
1202
1190
|
"name": "forge-icon-button",
|
|
1203
1191
|
"description": "\n---\n\n\n### **Events:**\n - **click** - Fires when the button is clicked.\n- **forge-icon-button-toggle** - Fires when the icon button is toggled. Only applies in `toggle` mode.\n\n### **Methods:**\n - **click(): _void_** - Clicks the button.\n- **focus(options: _ExperimentalFocusOptions_): _void_** - Focuses the button.\n\n### **Slots:**\n - _default_ - This is a default/unnamed slot for the icon.\n- **on** - The icon to show when in `toggle` mode when toggled \"on\".\n- **start** - Elements to logically render before the icon.\n- **end** - Elements to logically render after the icon.\n- **badge** - Absolutely positions the element in the top-end corner of the button (typically reserved for badge-like content).\n\n### **CSS Properties:**\n - **--forge-icon-button-display** - The display property of the button. _(default: undefined)_\n- **--forge-icon-button-size** - The height and min-width of the button. _(default: undefined)_\n- **--forge-icon-button-gap** - The gap between the icon content. _(default: undefined)_\n- **--forge-icon-button-icon-color** - The color of the icon. _(default: undefined)_\n- **--forge-icon-button-background-color** - The background color of the button. _(default: undefined)_\n- **--forge-icon-button-icon-size** - The size of the icon. _(default: undefined)_\n- **--forge-icon-button-cursor** - The cursor of the button. _(default: undefined)_\n- **--forge-icon-button-padding** - The inline padding of the button. _(default: undefined)_\n- **--forge-icon-button-border** - The border of the button. _(default: undefined)_\n- **--forge-icon-button-shadow** - The shadow of the button. _(default: undefined)_\n- **--forge-icon-button-transition-duration** - The transition duration of the button. _(default: undefined)_\n- **--forge-icon-button-transition-timing** - The transition timing of the button. _(default: undefined)_\n- **--forge-icon-button-shape** - The shape of the button. _(default: undefined)_\n- **--forge-icon-button-shape-start-start** - The start-start border-radius of the button. _(default: undefined)_\n- **--forge-icon-button-shape-start-end** - The start-end border-radius of the button. _(default: undefined)_\n- **--forge-icon-button-shape-end-start** - The end-start border-radius of the button. _(default: undefined)_\n- **--forge-icon-button-shape-end-end** - The end-end border-radius of the button. _(default: undefined)_\n- **--forge-icon-button-shape-squared** - The squared border-radius of the button. _(default: undefined)_\n- **--forge-icon-button-outlined-border-width** - The border width when in the outlined variant. _(default: undefined)_\n- **--forge-icon-button-outlined-border-style** - The border style when in the outlined variant. _(default: undefined)_\n- **--forge-icon-button-outlined-border-color** - The border color when in the outlined variant. _(default: undefined)_\n- **--forge-icon-button-tonal-icon-color** - The icon color when in the tonal variant. _(default: undefined)_\n- **--forge-icon-button-tonal-background-color** - The background color when in the tonal variant. _(default: undefined)_\n- **--forge-icon-button-filled-icon-color** - The icon color when in the filled variant. _(default: undefined)_\n- **--forge-icon-button-filled-background-color** - The background color when in the filled variant. _(default: undefined)_\n- **--forge-icon-button-raised-shadow** - The shadow when in the raised variant. _(default: undefined)_\n- **--forge-icon-button-raised-hover-shadow** - The shadow when in the raised variant and hovered. _(default: undefined)_\n- **--forge-icon-button-raised-active-shadow** - The shadow when in the raised variant and active. _(default: undefined)_\n- **--forge-icon-button-raised-disabled-shadow** - The shadow when in the raised variant and disabled. _(default: undefined)_\n- **--forge-icon-button-density-small-size** - The size of the button when in the small density. _(default: undefined)_\n- **--forge-icon-button-density-small-padding** - The padding of the button when in the small density. _(default: undefined)_\n- **--forge-icon-button-density-small-icon-size** - The size of the icon when in the small density. _(default: undefined)_\n- **--forge-icon-button-density-medium-size** - The size of the button when in the medium density. _(default: undefined)_\n- **--forge-icon-button-density-medium-padding** - The padding of the button when in the medium density. _(default: undefined)_\n- **--forge-icon-button-density-large-size** - The size of the button when in the large density. _(default: undefined)_\n- **--forge-icon-button-toggle-on-background-color** - The background color of the when in toggle mode and toggled on. _(default: undefined)_\n- **--forge-icon-button-toggle-on-icon-color** - The color of the icon when in toggle mode and toggled on. _(default: undefined)_\n- **--forge-icon-button-outlined-toggle-on-background-color** - The background color when in the outlined variant and toggled on. _(default: undefined)_\n- **--forge-icon-button-outlined-toggle-on-icon-color** - The icon color when in the outlined variant and toggled on. _(default: undefined)_\n- **--forge-icon-button-tonal-toggle-background-color** - The background color when in the tonal variant and toggled. _(default: undefined)_\n- **--forge-icon-button-tonal-toggle-on-background-color** - The background color when in the tonal variant and toggled on. _(default: undefined)_\n- **--forge-icon-button-tonal-toggle-on-icon-color** - The icon color when in the tonal variant and toggled on. _(default: undefined)_\n- **--forge-icon-button-filled-toggle-background-color** - The background color when in the filled variant and toggled. _(default: undefined)_\n- **--forge-icon-button-filled-toggle-icon-color** - The icon color when in the filled variant and toggled. _(default: undefined)_\n- **--forge-icon-button-filled-toggle-on-background-color** - The background color when in the filled variant and toggled on. _(default: undefined)_\n- **--forge-icon-button-filled-toggle-on-icon-color** - The icon color when in the filled variant and toggled on. _(default: undefined)_\n- **--forge-icon-button-disabled-cursor** - The cursor when the button is disabled. _(default: undefined)_\n- **--forge-icon-button-disabled-opacity** - The opacity when the button is disabled. _(default: undefined)_\n- **--forge-icon-button-popover-icon-padding** - The padding of the popover icon. _(default: undefined)_\n- **--forge-icon-button-focus-indicator-color** - The color of the focus indicator. _(default: undefined)_\n\n### **CSS Parts:**\n - **root** - The root container element.\n- **focus-indicator** - The focus-indicator indicator element.\n- **state-layer** - The state-layer surface element.",
|
|
@@ -1235,6 +1223,18 @@
|
|
|
1235
1223
|
],
|
|
1236
1224
|
"references": []
|
|
1237
1225
|
},
|
|
1226
|
+
{
|
|
1227
|
+
"name": "forge-inline-message",
|
|
1228
|
+
"description": "Inline messages are used to provide feedback to the user about a specific action or state.\n---\n\n\n### **Slots:**\n - _default_ - The message text.\n- **title** - The title of the inline message.\n- **icon** - The icon to display.\n\n### **CSS Properties:**\n - **--forge-inline-message-background** - The background color. _(default: undefined)_\n- **--forge-inline-message-color** - The text color. _(default: undefined)_\n- **--forge-inline-message-shape** - The shape (border) radius. _(default: undefined)_\n- **--forge-inline-message-padding** - The padding around the content. _(default: undefined)_\n- **--forge-inline-message-padding-inline** - The inline padding around the content. _(default: undefined)_\n- **--forge-inline-message-padding-block** - The block padding around the content. _(default: undefined)_\n- **--forge-inline-message-border-width** - The border width. _(default: undefined)_\n- **--forge-inline-message-border-style** - The border style. Defaults to `none`. _(default: undefined)_\n- **--forge-inline-message-border-color** - The border color. _(default: undefined)_\n- **--forge-inline-message-gap** - The gap/space between the content elements. _(default: undefined)_\n- **--forge-inline-message-icon-gap** - The gap/space between the icon and the content. _(default: undefined)_\n- **--forge-inline-message-content-gap** - The gap/space between the title and the message. _(default: undefined)_\n- **--forge-inline-message-icon-color** - The icon color. _(default: undefined)_\n\n### **CSS Parts:**\n - **root** - The root layout element.\n- **container** - The container element for the title and message content.",
|
|
1229
|
+
"attributes": [
|
|
1230
|
+
{
|
|
1231
|
+
"name": "theme",
|
|
1232
|
+
"description": "The theme to apply.",
|
|
1233
|
+
"values": [{ "name": "InlineMessageTheme" }]
|
|
1234
|
+
}
|
|
1235
|
+
],
|
|
1236
|
+
"references": []
|
|
1237
|
+
},
|
|
1238
1238
|
{
|
|
1239
1239
|
"name": "forge-keyboard-shortcut",
|
|
1240
1240
|
"description": "\n---\n\n\n### **Events:**\n - **forge-keyboard-shortcut-activate** - Event fired when the keyboard shortcut is activated.",
|
|
@@ -14,7 +14,7 @@ import { IconComponent, IconRegistry } from '../../icon';
|
|
|
14
14
|
import { StateLayerComponent } from '../../state-layer';
|
|
15
15
|
import { FocusIndicatorComponent } from '../../focus-indicator';
|
|
16
16
|
const template = '<template><div class=\"forge-split-view-panel\" id=\"root\" part=\"root\"><div class=\"forge-split-view-panel__handle\" id=\"handle\" part=\"handle\" role=\"separator\" aria-controls=\"content\" aria-grabbed=\"false\" tabindex=\"0\"><forge-icon class=\"forge-split-view-panel__icon\" id=\"icon\" part=\"icon\"></forge-icon><forge-state-layer target=\"handle\" id=\"state-layer\" exportparts=\"surface:state-layer\"></forge-state-layer><forge-focus-indicator inward target=\"handle\" part=\"focus-indicator\"></forge-focus-indicator></div><div class=\"forge-split-view-panel__content\" id=\"content\" part=\"content\" role=\"group\"><slot></slot></div></div></template>';
|
|
17
|
-
const styles = '.forge-split-view-panel{display:flex;width:100%;height:100%;overflow:hidden}.forge-split-view-panel__handle{color:var(--forge-theme-text-medium,rgba(0,0,0,.6));background-color:var(--forge-theme-outline,#e0e0e0);position:relative;display:flex;flex-shrink:0;justify-content:center;align-items:center;outline:0}.forge-split-view-panel__content{flex:1;overflow:hidden}.forge-split-view-panel--closed{display:none}.forge-split-view-panel--disabled #handle{pointer-events:none}.forge-split-view-panel--disabled .forge-split-view-panel__icon{display:none}.forge-split-view-panel[orientation=horizontal]{min-width:var(--forge-split-view-handle-width,8px);width:calc(var(--forge-split-view-panel-size,unset) + var(--forge-split-view-handle-width,8px));flex-direction:row}.forge-split-view-panel[orientation=horizontal] .forge-split-view-panel__handle{width:var(--forge-split-view-handle-width,8px);cursor:var(--forge-split-view-panel-cursor)}.forge-split-view-panel[orientation=horizontal].forge-split-view-panel--closing[resizable=end]{position:absolute;top:0;left:0;animation-name:
|
|
17
|
+
const styles = '.forge-split-view-panel{display:flex;width:100%;height:100%;overflow:hidden}.forge-split-view-panel__handle{color:var(--forge-theme-text-medium,rgba(0,0,0,.6));background-color:var(--forge-theme-outline,#e0e0e0);position:relative;display:flex;flex-shrink:0;justify-content:center;align-items:center;outline:0}.forge-split-view-panel__content{flex:1;overflow:hidden}.forge-split-view-panel--closed{display:none}.forge-split-view-panel--disabled #handle{pointer-events:none}.forge-split-view-panel--disabled .forge-split-view-panel__icon{display:none}.forge-split-view-panel[orientation=horizontal]{min-width:var(--forge-split-view-handle-width,8px);width:calc(var(--forge-split-view-panel-size,unset) + var(--forge-split-view-handle-width,8px));flex-direction:row}.forge-split-view-panel[orientation=horizontal] .forge-split-view-panel__handle{width:var(--forge-split-view-handle-width,8px);cursor:var(--forge-split-view-panel-cursor)}.forge-split-view-panel[orientation=horizontal].forge-split-view-panel--closing[resizable=end]{position:absolute;top:0;left:0;animation-name:uqqok2l;animation-duration:var(--forge-animation-duration-medium2, 300ms);animation-timing-function:var(--forge-animation-easing-standard,cubic-bezier(0.2,0,0,1))}@keyframes uqqok2l{from{transform:none}to{transform:translateX(-100%)}}.forge-split-view-panel[orientation=horizontal].forge-split-view-panel--closing[resizable=start]{position:absolute;top:0;right:0;animation-name:uqqok3h;animation-duration:var(--forge-animation-duration-medium2, 300ms);animation-timing-function:var(--forge-animation-easing-standard,cubic-bezier(0.2,0,0,1))}@keyframes uqqok3h{from{transform:none}to{transform:translateX(100%)}}.forge-split-view-panel[orientation=horizontal].forge-split-view-panel--opening[resizable=end]{position:absolute;top:0;left:0;animation-name:uqqok46;animation-duration:var(--forge-animation-duration-medium2, 300ms);animation-timing-function:var(--forge-animation-easing-standard,cubic-bezier(0.2,0,0,1));animation-direction:reverse}@keyframes uqqok46{from{transform:none}to{transform:translateX(-100%)}}.forge-split-view-panel[orientation=horizontal].forge-split-view-panel--opening[resizable=start]{position:absolute;top:0;right:0;animation-name:uqqok4t;animation-duration:var(--forge-animation-duration-medium2, 300ms);animation-timing-function:var(--forge-animation-easing-standard,cubic-bezier(0.2,0,0,1));animation-direction:reverse}@keyframes uqqok4t{from{transform:none}to{transform:translateX(100%)}}.forge-split-view-panel[orientation=vertical]{min-height:var(--forge-split-view-handle-width,8px);height:calc(var(--forge-split-view-panel-size,unset) + var(--forge-split-view-handle-width,8px));flex-direction:column}.forge-split-view-panel[orientation=vertical] .forge-split-view-panel__handle{height:var(--forge-split-view-handle-width,8px);cursor:var(--forge-split-view-panel-cursor)}.forge-split-view-panel[orientation=vertical].forge-split-view-panel--closing[resizable=end]{position:absolute;top:0;left:0;animation-name:uqqok5m;animation-duration:var(--forge-animation-duration-medium2, 300ms);animation-timing-function:var(--forge-animation-easing-standard,cubic-bezier(0.2,0,0,1))}@keyframes uqqok5m{from{transform:none}to{transform:translateY(-100%)}}.forge-split-view-panel[orientation=vertical].forge-split-view-panel--closing[resizable=start]{position:absolute;bottom:0;left:0;animation-name:uqqok6i;animation-duration:var(--forge-animation-duration-medium2, 300ms);animation-timing-function:var(--forge-animation-easing-standard,cubic-bezier(0.2,0,0,1))}@keyframes uqqok6i{from{transform:none}to{transform:translateY(100%)}}.forge-split-view-panel[orientation=vertical].forge-split-view-panel--opening[resizable=end]{position:absolute;top:0;left:0;animation-name:uqqok6t;animation-duration:var(--forge-animation-duration-medium2, 300ms);animation-timing-function:var(--forge-animation-easing-standard,cubic-bezier(0.2,0,0,1));animation-direction:reverse}@keyframes uqqok6t{from{transform:none}to{transform:translateY(-100%)}}.forge-split-view-panel[orientation=vertical].forge-split-view-panel--opening[resizable=start]{position:absolute;bottom:0;left:0;animation-name:uqqok7f;animation-duration:var(--forge-animation-duration-medium2, 300ms);animation-timing-function:var(--forge-animation-easing-standard,cubic-bezier(0.2,0,0,1));animation-direction:reverse}@keyframes uqqok7f{from{transform:none}to{transform:translateY(100%)}}:host{z-index:var(--forge-split-view-animating-layer)!important;display:block;position:relative;height:100%;width:100%;flex:0}:host([hidden]){display:none}:host(:not([resizable=start],[resizable=end])){flex:1}:host(:not([resizable=start],[resizable=end])) .forge-split-view-panel{width:100%;height:100%;min-width:0;min-height:0}:host(:not([resizable=start],[resizable=end])) .forge-split-view-panel__handle{display:none}forge-focus-indicator{--forge-focus-indicator-active-width:2px}';
|
|
18
18
|
/**
|
|
19
19
|
* @tag forge-split-view-panel
|
|
20
20
|
*
|
package/package.json
CHANGED
|
@@ -1,7 +1,7 @@
|
|
|
1
1
|
{
|
|
2
2
|
"name": "@tylertech/forge",
|
|
3
3
|
"description": "Tyler Forge™ Web Components library",
|
|
4
|
-
"version": "3.10.4
|
|
4
|
+
"version": "3.10.4",
|
|
5
5
|
"author": "Tyler Technologies, Inc.",
|
|
6
6
|
"license": "Apache-2.0",
|
|
7
7
|
"repository": {
|
|
@@ -21,4 +21,4 @@
|
|
|
21
21
|
"tslib": "^2.8.1"
|
|
22
22
|
},
|
|
23
23
|
"customElements": "custom-elements.json"
|
|
24
|
-
}
|
|
24
|
+
}
|