@box/blueprint-web 12.64.3 → 12.65.0
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
- package/dist/lib-esm/collapsible/collapsible-section.module.js +1 -1
- package/dist/lib-esm/icon-toggle-button/icon-toggle-button.d.ts +1 -0
- package/dist/lib-esm/icon-toggle-button/icon-toggle-button.js +9 -4
- package/dist/lib-esm/icon-toggle-button/icon-toggle-button.module.js +1 -1
- package/dist/lib-esm/index.css +61 -61
- package/dist/lib-esm/primitives/base-text-input/base-text-input.module.js +1 -1
- package/package.json +1 -1
|
@@ -1,4 +1,4 @@
|
|
|
1
1
|
import '../index.css';
|
|
2
|
-
var styles = {"collapsibleSection":"bp_collapsible_section_module_collapsibleSection--
|
|
2
|
+
var styles = {"collapsibleSection":"bp_collapsible_section_module_collapsibleSection--d6e7f","collapsibleSectionHeader":"bp_collapsible_section_module_collapsibleSectionHeader--d6e7f","collapsibleSectionHeaderArrow":"bp_collapsible_section_module_collapsibleSectionHeaderArrow--d6e7f","collapsibleSectionContent":"bp_collapsible_section_module_collapsibleSectionContent--d6e7f","slideDown":"bp_collapsible_section_module_slideDown--d6e7f","slideUp":"bp_collapsible_section_module_slideUp--d6e7f","collapsibleSectionBody":"bp_collapsible_section_module_collapsibleSectionBody--d6e7f"};
|
|
3
3
|
|
|
4
4
|
export { styles as default };
|
|
@@ -1,3 +1,4 @@
|
|
|
1
1
|
import { type IconToggleButtonProps } from './types';
|
|
2
2
|
export declare const iconSizeMap: Record<NonNullable<IconToggleButtonProps['size']>, string>;
|
|
3
|
+
export declare const iconSizeMapModern: Record<NonNullable<IconToggleButtonProps['size']>, string>;
|
|
3
4
|
export declare const IconToggleButton: import("react").ForwardRefExoticComponent<Omit<IconToggleButtonProps, "ref"> & import("react").RefAttributes<HTMLButtonElement>>;
|
|
@@ -1,5 +1,5 @@
|
|
|
1
1
|
import { jsx } from 'react/jsx-runtime';
|
|
2
|
-
import { Size4, Size5, Size6 } from '@box/blueprint-web-assets/tokens/tokens';
|
|
2
|
+
import { Size4, Size5, Size6, bpSize040, bpSize050, bpSize060 } from '@box/blueprint-web-assets/tokens/tokens';
|
|
3
3
|
import clsx from 'clsx';
|
|
4
4
|
import { forwardRef, createElement } from 'react';
|
|
5
5
|
import { useBlueprintModernization } from '../blueprint-modernization-context/useBlueprintModernization.js';
|
|
@@ -11,6 +11,11 @@ const iconSizeMap = {
|
|
|
11
11
|
small: Size5,
|
|
12
12
|
medium: Size6
|
|
13
13
|
};
|
|
14
|
+
const iconSizeMapModern = {
|
|
15
|
+
'x-small': bpSize040,
|
|
16
|
+
small: bpSize050,
|
|
17
|
+
medium: bpSize060
|
|
18
|
+
};
|
|
14
19
|
const IconToggleButton = /*#__PURE__*/forwardRef(({
|
|
15
20
|
className,
|
|
16
21
|
icon,
|
|
@@ -28,12 +33,12 @@ const IconToggleButton = /*#__PURE__*/forwardRef(({
|
|
|
28
33
|
"data-modern": enableModernizedComponents,
|
|
29
34
|
children: /*#__PURE__*/createElement(icon, {
|
|
30
35
|
className: styles.icon,
|
|
31
|
-
height: iconSizeMap[size],
|
|
32
|
-
width: iconSizeMap[size],
|
|
36
|
+
height: enableModernizedComponents ? iconSizeMapModern[size] : iconSizeMap[size],
|
|
37
|
+
width: enableModernizedComponents ? iconSizeMapModern[size] : iconSizeMap[size],
|
|
33
38
|
role: 'presentation'
|
|
34
39
|
})
|
|
35
40
|
});
|
|
36
41
|
});
|
|
37
42
|
IconToggleButton.displayName = 'IconToggleButton';
|
|
38
43
|
|
|
39
|
-
export { IconToggleButton, iconSizeMap };
|
|
44
|
+
export { IconToggleButton, iconSizeMap, iconSizeMapModern };
|
|
@@ -1,4 +1,4 @@
|
|
|
1
1
|
import '../index.css';
|
|
2
|
-
var styles = {"iconToggleButton":"bp_icon_toggle_button_module_iconToggleButton--
|
|
2
|
+
var styles = {"iconToggleButton":"bp_icon_toggle_button_module_iconToggleButton--d9aab","high-contrast":"bp_icon_toggle_button_module_high-contrast--d9aab","icon":"bp_icon_toggle_button_module_icon--d9aab","default":"bp_icon_toggle_button_module_default--d9aab","medium":"bp_icon_toggle_button_module_medium--d9aab","small":"bp_icon_toggle_button_module_small--d9aab","x-small":"bp_icon_toggle_button_module_x-small--d9aab"};
|
|
3
3
|
|
|
4
4
|
export { styles as default };
|
package/dist/lib-esm/index.css
CHANGED
|
@@ -1986,7 +1986,7 @@
|
|
|
1986
1986
|
height:var(--icon-button-size-x-small);
|
|
1987
1987
|
width:var(--icon-button-size-x-small);
|
|
1988
1988
|
}
|
|
1989
|
-
.bp_collapsible_section_module_collapsibleSection--
|
|
1989
|
+
.bp_collapsible_section_module_collapsibleSection--d6e7f[data-modern=false]{
|
|
1990
1990
|
--collapsible-section-padding:var(--space-5);
|
|
1991
1991
|
--collapsible-section-border-radius:var(--radius-3);
|
|
1992
1992
|
--collapsible-section-outline-border-radius:var(--radius-2);
|
|
@@ -1999,12 +1999,12 @@
|
|
|
1999
1999
|
--collapsible-section-content-background-color:var(--surface-surface);
|
|
2000
2000
|
}
|
|
2001
2001
|
|
|
2002
|
-
.bp_collapsible_section_module_collapsibleSection--
|
|
2002
|
+
.bp_collapsible_section_module_collapsibleSection--d6e7f[data-modern=true]{
|
|
2003
2003
|
--collapsible-section-padding:var(--bp-space-050);
|
|
2004
2004
|
--collapsible-section-border-radius:var(--bp-radius-10);
|
|
2005
2005
|
--collapsible-section-outline-border-radius:var(--bp-radius-03);
|
|
2006
2006
|
--collapsible-section-background-color:var(--bp-surface-surface);
|
|
2007
|
-
--collapsible-section-border:var(--bp-border-01) solid var(--bp-border-collapsible-border);
|
|
2007
|
+
--collapsible-section-border:var(--bp-border-01) solid var(--bp-border-collapsible-section-border);
|
|
2008
2008
|
--collapsible-section-outline-width:var(--bp-border-02);
|
|
2009
2009
|
--collapsible-section-outline-offset:var(--bp-space-005);
|
|
2010
2010
|
--collapsible-section-header-focus-color:var(--bp-outline-focus-on-light);
|
|
@@ -2012,10 +2012,10 @@
|
|
|
2012
2012
|
--collapsible-section-content-background-color:var(--bp-surface-surface);
|
|
2013
2013
|
}
|
|
2014
2014
|
|
|
2015
|
-
.bp_collapsible_section_module_collapsibleSection--
|
|
2015
|
+
.bp_collapsible_section_module_collapsibleSection--d6e7f{
|
|
2016
2016
|
width:100%;
|
|
2017
2017
|
}
|
|
2018
|
-
.bp_collapsible_section_module_collapsibleSectionHeader--
|
|
2018
|
+
.bp_collapsible_section_module_collapsibleSectionHeader--d6e7f{
|
|
2019
2019
|
align-items:center;
|
|
2020
2020
|
background:var(--collapsible-section-header-background-color);
|
|
2021
2021
|
border:var(--collapsible-section-border);
|
|
@@ -2032,7 +2032,7 @@
|
|
|
2032
2032
|
user-select:none;
|
|
2033
2033
|
width:100%;
|
|
2034
2034
|
}
|
|
2035
|
-
.bp_collapsible_section_module_collapsibleSectionHeader--
|
|
2035
|
+
.bp_collapsible_section_module_collapsibleSectionHeader--d6e7f:focus::before{
|
|
2036
2036
|
border:var(--collapsible-section-outline-width) solid var(--collapsible-section-header-focus-color);
|
|
2037
2037
|
border-radius:var(--collapsible-section-outline-border-radius);
|
|
2038
2038
|
bottom:var(--collapsible-section-outline-offset);
|
|
@@ -2042,27 +2042,27 @@
|
|
|
2042
2042
|
right:var(--collapsible-section-outline-offset);
|
|
2043
2043
|
top:var(--collapsible-section-outline-offset);
|
|
2044
2044
|
}
|
|
2045
|
-
.bp_collapsible_section_module_collapsibleSectionHeader--
|
|
2045
|
+
.bp_collapsible_section_module_collapsibleSectionHeader--d6e7f[aria-expanded=true],.bp_collapsible_section_module_collapsibleSectionHeader--d6e7f[aria-expanded=true]::before{
|
|
2046
2046
|
border-end-end-radius:0;
|
|
2047
2047
|
border-end-start-radius:0;
|
|
2048
2048
|
}
|
|
2049
|
-
.bp_collapsible_section_module_collapsibleSectionHeaderArrow--
|
|
2049
|
+
.bp_collapsible_section_module_collapsibleSectionHeaderArrow--d6e7f{
|
|
2050
2050
|
display:block;
|
|
2051
2051
|
margin-inline-start:var(--collapsible-section-padding);
|
|
2052
2052
|
}
|
|
2053
|
-
.bp_collapsible_section_module_collapsibleSectionHeaderArrow--
|
|
2053
|
+
.bp_collapsible_section_module_collapsibleSectionHeaderArrow--d6e7f > svg{
|
|
2054
2054
|
vertical-align:middle;
|
|
2055
2055
|
}
|
|
2056
|
-
.bp_collapsible_section_module_collapsibleSectionContent--
|
|
2056
|
+
.bp_collapsible_section_module_collapsibleSectionContent--d6e7f{
|
|
2057
2057
|
overflow:hidden;
|
|
2058
2058
|
}
|
|
2059
|
-
.bp_collapsible_section_module_collapsibleSectionContent--
|
|
2060
|
-
animation:bp_collapsible_section_module_slideDown--
|
|
2059
|
+
.bp_collapsible_section_module_collapsibleSectionContent--d6e7f[data-state=open]{
|
|
2060
|
+
animation:bp_collapsible_section_module_slideDown--d6e7f .25s ease-out;
|
|
2061
2061
|
}
|
|
2062
|
-
.bp_collapsible_section_module_collapsibleSectionContent--
|
|
2063
|
-
animation:bp_collapsible_section_module_slideUp--
|
|
2062
|
+
.bp_collapsible_section_module_collapsibleSectionContent--d6e7f[data-state=closed]{
|
|
2063
|
+
animation:bp_collapsible_section_module_slideUp--d6e7f .25s ease-out;
|
|
2064
2064
|
}
|
|
2065
|
-
.bp_collapsible_section_module_collapsibleSectionBody--
|
|
2065
|
+
.bp_collapsible_section_module_collapsibleSectionBody--d6e7f{
|
|
2066
2066
|
align-items:center;
|
|
2067
2067
|
background:var(--collapsible-section-content-background-color);
|
|
2068
2068
|
border:var(--collapsible-section-border);
|
|
@@ -2075,7 +2075,7 @@
|
|
|
2075
2075
|
padding-inline:var(--collapsible-section-padding);
|
|
2076
2076
|
}
|
|
2077
2077
|
|
|
2078
|
-
@keyframes bp_collapsible_section_module_slideDown--
|
|
2078
|
+
@keyframes bp_collapsible_section_module_slideDown--d6e7f{
|
|
2079
2079
|
from{
|
|
2080
2080
|
height:0;
|
|
2081
2081
|
}
|
|
@@ -2083,7 +2083,7 @@
|
|
|
2083
2083
|
height:var(--radix-collapsible-content-height);
|
|
2084
2084
|
}
|
|
2085
2085
|
}
|
|
2086
|
-
@keyframes bp_collapsible_section_module_slideUp--
|
|
2086
|
+
@keyframes bp_collapsible_section_module_slideUp--d6e7f{
|
|
2087
2087
|
from{
|
|
2088
2088
|
height:var(--radix-collapsible-content-height);
|
|
2089
2089
|
}
|
|
@@ -5768,7 +5768,7 @@
|
|
|
5768
5768
|
height:var(--icon-dual-state-button-small-size);
|
|
5769
5769
|
width:var(--icon-dual-state-button-small-size);
|
|
5770
5770
|
}
|
|
5771
|
-
.bp_icon_toggle_button_module_iconToggleButton--
|
|
5771
|
+
.bp_icon_toggle_button_module_iconToggleButton--d9aab[data-modern=false]{
|
|
5772
5772
|
--icon-toggle-button-radius:var(--radius-2);
|
|
5773
5773
|
--icon-toggle-button-padding-inline:0;
|
|
5774
5774
|
--icon-toggle-button-off-color:var(--text-text-on-light);
|
|
@@ -5791,7 +5791,7 @@
|
|
|
5791
5791
|
--icon-toogle-button-medium-size:var(--size-10);
|
|
5792
5792
|
}
|
|
5793
5793
|
|
|
5794
|
-
.bp_icon_toggle_button_module_iconToggleButton--
|
|
5794
|
+
.bp_icon_toggle_button_module_iconToggleButton--d9aab[data-modern=true]{
|
|
5795
5795
|
--icon-toggle-button-radius:var(--bp-radius-10);
|
|
5796
5796
|
--icon-toggle-button-padding-inline:0;
|
|
5797
5797
|
--icon-toggle-button-off-color:var(--bp-text-text-on-light);
|
|
@@ -5805,7 +5805,7 @@
|
|
|
5805
5805
|
--icon-toggle-button-on-background-hover:var(--bp-surface-toggle-surface-on-hover);
|
|
5806
5806
|
--icon-toggle-button-on-background-pressed:var(--bp-surface-toggle-surface-on-pressed);
|
|
5807
5807
|
--icon-toggle-button-on-border:var(--bp-border-01) solid var(--bp-border-toggle-border-on);
|
|
5808
|
-
--icon-toggle-button-on-border-focus:var(--bp-border-01) solid
|
|
5808
|
+
--icon-toggle-button-on-border-focus:var(--bp-border-01) solid var(--bp-border-toggle-border-off);
|
|
5809
5809
|
--icon-toggle-button-on-color:var(--bp-text-text-on-dark);
|
|
5810
5810
|
--icon-toggle-button-on-icon-color:var(--bp-icon-icon-blue);
|
|
5811
5811
|
--icon-toggle-button-focus-outline:var(--bp-border-02) solid var(--bp-outline-focus-on-light);
|
|
@@ -5814,7 +5814,7 @@
|
|
|
5814
5814
|
--icon-toogle-button-medium-size:var(--bp-size-100);
|
|
5815
5815
|
}
|
|
5816
5816
|
|
|
5817
|
-
.bp_icon_toggle_button_module_iconToggleButton--
|
|
5817
|
+
.bp_icon_toggle_button_module_iconToggleButton--d9aab{
|
|
5818
5818
|
align-items:center;
|
|
5819
5819
|
background:var(--icon-toggle-button-off-background);
|
|
5820
5820
|
border:var(--icon-toggle-button-off-border);
|
|
@@ -5834,52 +5834,52 @@
|
|
|
5834
5834
|
text-decoration:var(--body-default-text-decoration);
|
|
5835
5835
|
text-transform:var(--body-default-text-case);
|
|
5836
5836
|
}
|
|
5837
|
-
.bp_icon_toggle_button_module_iconToggleButton--
|
|
5837
|
+
.bp_icon_toggle_button_module_iconToggleButton--d9aab:disabled{
|
|
5838
5838
|
opacity:.3;
|
|
5839
5839
|
pointer-events:none;
|
|
5840
5840
|
}
|
|
5841
|
-
.bp_icon_toggle_button_module_iconToggleButton--
|
|
5841
|
+
.bp_icon_toggle_button_module_iconToggleButton--d9aab:hover{
|
|
5842
5842
|
background-color:var(--icon-toggle-button-off-background-hover);
|
|
5843
5843
|
}
|
|
5844
|
-
.bp_icon_toggle_button_module_iconToggleButton--
|
|
5844
|
+
.bp_icon_toggle_button_module_iconToggleButton--d9aab[data-focus-visible]{
|
|
5845
5845
|
outline:var(--icon-toggle-button-focus-outline);
|
|
5846
5846
|
}
|
|
5847
|
-
.bp_icon_toggle_button_module_iconToggleButton--
|
|
5847
|
+
.bp_icon_toggle_button_module_iconToggleButton--d9aab:active{
|
|
5848
5848
|
background-color:var(--icon-toggle-button-off-background-pressed);
|
|
5849
5849
|
}
|
|
5850
|
-
.bp_icon_toggle_button_module_iconToggleButton--
|
|
5850
|
+
.bp_icon_toggle_button_module_iconToggleButton--d9aab.bp_icon_toggle_button_module_high-contrast--d9aab .bp_icon_toggle_button_module_icon--d9aab *{
|
|
5851
5851
|
fill:var(--icon-toggle-button-off-icon-color-high-contrast);
|
|
5852
5852
|
}
|
|
5853
|
-
.bp_icon_toggle_button_module_iconToggleButton--
|
|
5853
|
+
.bp_icon_toggle_button_module_iconToggleButton--d9aab.bp_icon_toggle_button_module_default--d9aab .bp_icon_toggle_button_module_icon--d9aab *{
|
|
5854
5854
|
fill:var(--icon-toggle-button-off-icon-color);
|
|
5855
5855
|
}
|
|
5856
|
-
.bp_icon_toggle_button_module_iconToggleButton--
|
|
5856
|
+
.bp_icon_toggle_button_module_iconToggleButton--d9aab[aria-pressed=true]{
|
|
5857
5857
|
background:var(--icon-toggle-button-on-background);
|
|
5858
5858
|
border:var(--icon-toggle-button-on-border);
|
|
5859
5859
|
color:var(--icon-toggle-button-on-color);
|
|
5860
5860
|
}
|
|
5861
|
-
.bp_icon_toggle_button_module_iconToggleButton--
|
|
5861
|
+
.bp_icon_toggle_button_module_iconToggleButton--d9aab[aria-pressed=true] .bp_icon_toggle_button_module_icon--d9aab *{
|
|
5862
5862
|
fill:var(--icon-toggle-button-on-icon-color);
|
|
5863
5863
|
}
|
|
5864
|
-
.bp_icon_toggle_button_module_iconToggleButton--
|
|
5864
|
+
.bp_icon_toggle_button_module_iconToggleButton--d9aab[aria-pressed=true]:hover{
|
|
5865
5865
|
background-color:var(--icon-toggle-button-on-background-hover);
|
|
5866
5866
|
}
|
|
5867
|
-
.bp_icon_toggle_button_module_iconToggleButton--
|
|
5867
|
+
.bp_icon_toggle_button_module_iconToggleButton--d9aab[aria-pressed=true][data-focus-visible]{
|
|
5868
5868
|
border:var(--icon-toggle-button-on-border-focus);
|
|
5869
5869
|
outline:var(--icon-toggle-button-focus-outline);
|
|
5870
5870
|
}
|
|
5871
|
-
.bp_icon_toggle_button_module_iconToggleButton--
|
|
5871
|
+
.bp_icon_toggle_button_module_iconToggleButton--d9aab[aria-pressed=true]:active{
|
|
5872
5872
|
background-color:var(--icon-toggle-button-on-background-pressed);
|
|
5873
5873
|
}
|
|
5874
|
-
.bp_icon_toggle_button_module_iconToggleButton--
|
|
5874
|
+
.bp_icon_toggle_button_module_iconToggleButton--d9aab.bp_icon_toggle_button_module_medium--d9aab{
|
|
5875
5875
|
height:var(--icon-toogle-button-medium-size);
|
|
5876
5876
|
width:var(--icon-toogle-button-medium-size);
|
|
5877
5877
|
}
|
|
5878
|
-
.bp_icon_toggle_button_module_iconToggleButton--
|
|
5878
|
+
.bp_icon_toggle_button_module_iconToggleButton--d9aab.bp_icon_toggle_button_module_small--d9aab{
|
|
5879
5879
|
height:var(--icon-toogle-button-small-size);
|
|
5880
5880
|
width:var(--icon-toogle-button-small-size);
|
|
5881
5881
|
}
|
|
5882
|
-
.bp_icon_toggle_button_module_iconToggleButton--
|
|
5882
|
+
.bp_icon_toggle_button_module_iconToggleButton--d9aab.bp_icon_toggle_button_module_x-small--d9aab{
|
|
5883
5883
|
height:var(--icon-toogle-button-xsmall-size);
|
|
5884
5884
|
width:var(--icon-toogle-button-xsmall-size);
|
|
5885
5885
|
}
|
|
@@ -6504,7 +6504,7 @@ table.bp_inline_table_module_inlineTable--14908[data-modern=true] td:last-child,
|
|
|
6504
6504
|
background:none;
|
|
6505
6505
|
}
|
|
6506
6506
|
|
|
6507
|
-
.bp_base_text_input_module_textInputContainerOuter--
|
|
6507
|
+
.bp_base_text_input_module_textInputContainerOuter--09186[data-modern=false]{
|
|
6508
6508
|
--text-input-border-width:var(--border-1);
|
|
6509
6509
|
--text-input-border-width-focused:var(--border-2);
|
|
6510
6510
|
--text-input-border-width-error:var(--border-2);
|
|
@@ -6535,7 +6535,7 @@ table.bp_inline_table_module_inlineTable--14908[data-modern=true] td:last-child,
|
|
|
6535
6535
|
--text-input-hover-border-color:var(--border-input-border-hover);
|
|
6536
6536
|
}
|
|
6537
6537
|
|
|
6538
|
-
.bp_base_text_input_module_textInputContainerOuter--
|
|
6538
|
+
.bp_base_text_input_module_textInputContainerOuter--09186[data-modern=true]{
|
|
6539
6539
|
--text-input-border-width:var(--bp-border-01);
|
|
6540
6540
|
--text-input-border-width-focused:var(--bp-border-02);
|
|
6541
6541
|
--text-input-border-width-error:var(--bp-border-02);
|
|
@@ -6556,7 +6556,7 @@ table.bp_inline_table_module_inlineTable--14908[data-modern=true] td:last-child,
|
|
|
6556
6556
|
--text-input-error-background:var(--bp-surface-input-surface-error);
|
|
6557
6557
|
--text-input-error-border-color:var(--bp-border-input-border-error);
|
|
6558
6558
|
--text-input-read-only-color:var(--bp-text-text-on-light-secondary);
|
|
6559
|
-
--text-input-read-only-border-color:var(--bp-
|
|
6559
|
+
--text-input-read-only-border-color:var(--bp-gray-20);
|
|
6560
6560
|
--text-input-disabled-color:var(--bp-text-text-on-light);
|
|
6561
6561
|
--text-input-disabled-background:var(--bp-surface-input-surface);
|
|
6562
6562
|
--text-input-disabled-border-color:var(--bp-border-input-border);
|
|
@@ -6566,7 +6566,7 @@ table.bp_inline_table_module_inlineTable--14908[data-modern=true] td:last-child,
|
|
|
6566
6566
|
--text-input-hover-border-color:var(--bp-border-input-border-hover);
|
|
6567
6567
|
}
|
|
6568
6568
|
|
|
6569
|
-
.bp_base_text_input_module_textInputContainerOuter--
|
|
6569
|
+
.bp_base_text_input_module_textInputContainerOuter--09186{
|
|
6570
6570
|
--disabled-opacity:var(--text-input-disabled-opacity-api, 60%);
|
|
6571
6571
|
display:flex;
|
|
6572
6572
|
flex-direction:column;
|
|
@@ -6579,7 +6579,7 @@ table.bp_inline_table_module_inlineTable--14908[data-modern=true] td:last-child,
|
|
|
6579
6579
|
text-decoration:var(--body-default-text-decoration);
|
|
6580
6580
|
text-transform:var(--body-default-text-case);
|
|
6581
6581
|
}
|
|
6582
|
-
.bp_base_text_input_module_textInputContainerOuter--
|
|
6582
|
+
.bp_base_text_input_module_textInputContainerOuter--09186 .bp_base_text_input_module_label--09186{
|
|
6583
6583
|
color:var(--text-input-label-color);
|
|
6584
6584
|
flex:0 0 fit-content;
|
|
6585
6585
|
font-family:var(--body-default-bold-font-family);
|
|
@@ -6593,15 +6593,15 @@ table.bp_inline_table_module_inlineTable--14908[data-modern=true] td:last-child,
|
|
|
6593
6593
|
width:-moz-fit-content;
|
|
6594
6594
|
width:fit-content;
|
|
6595
6595
|
}
|
|
6596
|
-
.bp_base_text_input_module_textInputContainerOuter--
|
|
6596
|
+
.bp_base_text_input_module_textInputContainerOuter--09186 .bp_base_text_input_module_label--09186:not(.bp_base_text_input_module_hidden--09186){
|
|
6597
6597
|
margin-block-end:var(--text-input-row-gap);
|
|
6598
6598
|
}
|
|
6599
|
-
.bp_base_text_input_module_textInputContainerOuter--
|
|
6599
|
+
.bp_base_text_input_module_textInputContainerOuter--09186 .bp_base_text_input_module_textInputContainer--09186{
|
|
6600
6600
|
display:flex;
|
|
6601
6601
|
height:var(--size-10);
|
|
6602
6602
|
position:relative;
|
|
6603
6603
|
}
|
|
6604
|
-
.bp_base_text_input_module_textInputContainerOuter--
|
|
6604
|
+
.bp_base_text_input_module_textInputContainerOuter--09186 .bp_base_text_input_module_textInputContainer--09186 .bp_base_text_input_module_textInput--09186,.bp_base_text_input_module_textInputContainerOuter--09186 .bp_base_text_input_module_textInputContainer--09186 input[type=number].bp_base_text_input_module_textInput--09186,.bp_base_text_input_module_textInputContainerOuter--09186 .bp_base_text_input_module_textInputContainer--09186 input[type=text].bp_base_text_input_module_textInput--09186{
|
|
6605
6605
|
background:var(--text-input-background);
|
|
6606
6606
|
border:var(--text-input-border-width) solid var(--text-input-border-color);
|
|
6607
6607
|
border-radius:var(--text-input-border-radius);
|
|
@@ -6621,77 +6621,77 @@ table.bp_inline_table_module_inlineTable--14908[data-modern=true] td:last-child,
|
|
|
6621
6621
|
text-transform:var(--body-default-text-case);
|
|
6622
6622
|
width:100%;
|
|
6623
6623
|
}
|
|
6624
|
-
.bp_base_text_input_module_textInputContainerOuter--
|
|
6624
|
+
.bp_base_text_input_module_textInputContainerOuter--09186 .bp_base_text_input_module_textInputContainer--09186 .bp_base_text_input_module_textInput--09186:hover,.bp_base_text_input_module_textInputContainerOuter--09186 .bp_base_text_input_module_textInputContainer--09186 input[type=number].bp_base_text_input_module_textInput--09186:hover,.bp_base_text_input_module_textInputContainerOuter--09186 .bp_base_text_input_module_textInputContainer--09186 input[type=text].bp_base_text_input_module_textInput--09186:hover{
|
|
6625
6625
|
box-shadow:var(--text-input-box-shadow);
|
|
6626
6626
|
}
|
|
6627
|
-
.bp_base_text_input_module_textInputContainerOuter--
|
|
6627
|
+
.bp_base_text_input_module_textInputContainerOuter--09186 .bp_base_text_input_module_textInputContainer--09186 .bp_base_text_input_module_textInput--09186::placeholder,.bp_base_text_input_module_textInputContainerOuter--09186 .bp_base_text_input_module_textInputContainer--09186 input[type=number].bp_base_text_input_module_textInput--09186::placeholder,.bp_base_text_input_module_textInputContainerOuter--09186 .bp_base_text_input_module_textInputContainer--09186 input[type=text].bp_base_text_input_module_textInput--09186::placeholder{
|
|
6628
6628
|
color:var(--text-input-placeholder-color);
|
|
6629
6629
|
opacity:1;
|
|
6630
6630
|
}
|
|
6631
|
-
.bp_base_text_input_module_textInputContainerOuter--
|
|
6631
|
+
.bp_base_text_input_module_textInputContainerOuter--09186 .bp_base_text_input_module_textInputContainer--09186 .bp_base_text_input_module_textInput--09186.bp_base_text_input_module_error--09186,.bp_base_text_input_module_textInputContainerOuter--09186 .bp_base_text_input_module_textInputContainer--09186 input[type=number].bp_base_text_input_module_textInput--09186.bp_base_text_input_module_error--09186,.bp_base_text_input_module_textInputContainerOuter--09186 .bp_base_text_input_module_textInputContainer--09186 input[type=text].bp_base_text_input_module_textInput--09186.bp_base_text_input_module_error--09186{
|
|
6632
6632
|
background:var(--text-input-error-background);
|
|
6633
6633
|
border:var(--text-input-border-width-error) solid var(--text-input-error-border-color);
|
|
6634
6634
|
outline:0;
|
|
6635
6635
|
padding-inline-start:var(--text-input-padding-x-error);
|
|
6636
6636
|
}
|
|
6637
|
-
.bp_base_text_input_module_textInputContainerOuter--
|
|
6637
|
+
.bp_base_text_input_module_textInputContainerOuter--09186 .bp_base_text_input_module_textInputContainer--09186 .bp_base_text_input_module_textInput--09186.bp_base_text_input_module_readOnly--09186,.bp_base_text_input_module_textInputContainerOuter--09186 .bp_base_text_input_module_textInputContainer--09186 input[type=number].bp_base_text_input_module_textInput--09186.bp_base_text_input_module_readOnly--09186,.bp_base_text_input_module_textInputContainerOuter--09186 .bp_base_text_input_module_textInputContainer--09186 input[type=text].bp_base_text_input_module_textInput--09186.bp_base_text_input_module_readOnly--09186{
|
|
6638
6638
|
border-color:var(--text-input-read-only-border-color);
|
|
6639
6639
|
box-shadow:var(--text-input-box-shadow);
|
|
6640
6640
|
color:var(--text-input-read-only-color);
|
|
6641
6641
|
}
|
|
6642
|
-
.bp_base_text_input_module_textInputContainerOuter--
|
|
6642
|
+
.bp_base_text_input_module_textInputContainerOuter--09186 .bp_base_text_input_module_textInputContainer--09186 .bp_base_text_input_module_textInput--09186.bp_base_text_input_module_readOnly--09186:focus-visible,.bp_base_text_input_module_textInputContainerOuter--09186 .bp_base_text_input_module_textInputContainer--09186 input[type=number].bp_base_text_input_module_textInput--09186.bp_base_text_input_module_readOnly--09186:focus-visible,.bp_base_text_input_module_textInputContainerOuter--09186 .bp_base_text_input_module_textInputContainer--09186 input[type=text].bp_base_text_input_module_textInput--09186.bp_base_text_input_module_readOnly--09186:focus-visible{
|
|
6643
6643
|
border:var(--text-input-border-width-focused) solid var(--text-input-border-color-focus);
|
|
6644
6644
|
}
|
|
6645
|
-
.bp_base_text_input_module_textInputContainerOuter--
|
|
6645
|
+
.bp_base_text_input_module_textInputContainerOuter--09186 .bp_base_text_input_module_textInputContainer--09186 .bp_base_text_input_module_textInput--09186.bp_base_text_input_module_readOnly--09186:hover,.bp_base_text_input_module_textInputContainerOuter--09186 .bp_base_text_input_module_textInputContainer--09186 input[type=number].bp_base_text_input_module_textInput--09186.bp_base_text_input_module_readOnly--09186:hover,.bp_base_text_input_module_textInputContainerOuter--09186 .bp_base_text_input_module_textInputContainer--09186 input[type=text].bp_base_text_input_module_textInput--09186.bp_base_text_input_module_readOnly--09186:hover{
|
|
6646
6646
|
cursor:default;
|
|
6647
6647
|
}
|
|
6648
|
-
.bp_base_text_input_module_textInputContainerOuter--
|
|
6648
|
+
.bp_base_text_input_module_textInputContainerOuter--09186 .bp_base_text_input_module_textInputContainer--09186 .bp_base_text_input_module_textInput--09186:disabled,.bp_base_text_input_module_textInputContainerOuter--09186 .bp_base_text_input_module_textInputContainer--09186 input[type=number].bp_base_text_input_module_textInput--09186:disabled,.bp_base_text_input_module_textInputContainerOuter--09186 .bp_base_text_input_module_textInputContainer--09186 input[type=text].bp_base_text_input_module_textInput--09186:disabled{
|
|
6649
6649
|
background:var(--text-input-disabled-background);
|
|
6650
6650
|
border-color:var(--text-input-disabled-border-color);
|
|
6651
6651
|
box-shadow:var(--text-input-box-shadow);
|
|
6652
6652
|
color:var(--text-input-disabled-color);
|
|
6653
6653
|
}
|
|
6654
|
-
.bp_base_text_input_module_textInputContainerOuter--
|
|
6654
|
+
.bp_base_text_input_module_textInputContainerOuter--09186 .bp_base_text_input_module_textInputContainer--09186 .bp_base_text_input_module_textInput--09186:disabled:hover,.bp_base_text_input_module_textInputContainerOuter--09186 .bp_base_text_input_module_textInputContainer--09186 input[type=number].bp_base_text_input_module_textInput--09186:disabled:hover,.bp_base_text_input_module_textInputContainerOuter--09186 .bp_base_text_input_module_textInputContainer--09186 input[type=text].bp_base_text_input_module_textInput--09186:disabled:hover{
|
|
6655
6655
|
border-color:var(--text-input-border-color);
|
|
6656
6656
|
}
|
|
6657
|
-
.bp_base_text_input_module_textInputContainerOuter--
|
|
6657
|
+
.bp_base_text_input_module_textInputContainerOuter--09186 .bp_base_text_input_module_textInputContainer--09186 .bp_base_text_input_module_textInput--09186:focus-visible,.bp_base_text_input_module_textInputContainerOuter--09186 .bp_base_text_input_module_textInputContainer--09186 input[type=number].bp_base_text_input_module_textInput--09186:focus-visible,.bp_base_text_input_module_textInputContainerOuter--09186 .bp_base_text_input_module_textInputContainer--09186 input[type=text].bp_base_text_input_module_textInput--09186:focus-visible{
|
|
6658
6658
|
background:var(--text-input-focused-background);
|
|
6659
6659
|
border:var(--text-input-border-width-focused) solid var(--text-input-focused-border-color);
|
|
6660
6660
|
outline:0;
|
|
6661
6661
|
padding-inline-start:var(--text-input-padding-x-focused);
|
|
6662
6662
|
}
|
|
6663
|
-
.bp_base_text_input_module_textInputContainerOuter--
|
|
6663
|
+
.bp_base_text_input_module_textInputContainerOuter--09186 .bp_base_text_input_module_textInputContainer--09186 .bp_base_text_input_module_textInput--09186:has(+ .bp_base_text_input_module_endIcon--09186),.bp_base_text_input_module_textInputContainerOuter--09186 .bp_base_text_input_module_textInputContainer--09186 input[type=number].bp_base_text_input_module_textInput--09186:has(+ .bp_base_text_input_module_endIcon--09186),.bp_base_text_input_module_textInputContainerOuter--09186 .bp_base_text_input_module_textInputContainer--09186 input[type=text].bp_base_text_input_module_textInput--09186:has(+ .bp_base_text_input_module_endIcon--09186){
|
|
6664
6664
|
padding-inline-end:calc(var(--text-input-padding-x) + var(--end-icon-width) + var(--text-input-icon-padding));
|
|
6665
6665
|
}
|
|
6666
|
-
.bp_base_text_input_module_textInputContainerOuter--
|
|
6666
|
+
.bp_base_text_input_module_textInputContainerOuter--09186 .bp_base_text_input_module_textInputContainer--09186 .bp_base_text_input_module_textInput--09186:not(:disabled):not(:focus-visible):not(.bp_base_text_input_module_error--09186):hover,.bp_base_text_input_module_textInputContainerOuter--09186 .bp_base_text_input_module_textInputContainer--09186 input[type=number].bp_base_text_input_module_textInput--09186:not(:disabled):not(:focus-visible):not(.bp_base_text_input_module_error--09186):hover,.bp_base_text_input_module_textInputContainerOuter--09186 .bp_base_text_input_module_textInputContainer--09186 input[type=text].bp_base_text_input_module_textInput--09186:not(:disabled):not(:focus-visible):not(.bp_base_text_input_module_error--09186):hover{
|
|
6667
6667
|
background:var(--text-input-hover-background);
|
|
6668
6668
|
border:var(--border-1) solid var(--text-input-hover-border-color);
|
|
6669
6669
|
}
|
|
6670
|
-
.bp_base_text_input_module_textInputContainerOuter--
|
|
6670
|
+
.bp_base_text_input_module_textInputContainerOuter--09186 .bp_base_text_input_module_textInputContainer--09186 .bp_base_text_input_module_startIcon--09186{
|
|
6671
6671
|
left:calc(var(--text-input-padding-x) + var(--text-input-border-width));
|
|
6672
6672
|
position:absolute;
|
|
6673
6673
|
top:50%;
|
|
6674
6674
|
transform:translateY(-50%);
|
|
6675
6675
|
}
|
|
6676
|
-
.bp_base_text_input_module_textInputContainerOuter--
|
|
6676
|
+
.bp_base_text_input_module_textInputContainerOuter--09186 .bp_base_text_input_module_textInputContainer--09186 .bp_base_text_input_module_startIcon--09186 + input.bp_base_text_input_module_textInput--09186{
|
|
6677
6677
|
padding-inline-start:calc(var(--text-input-padding-x) + var(--text-input-icon-padding) + var(--start-icon-width));
|
|
6678
6678
|
}
|
|
6679
|
-
.bp_base_text_input_module_textInputContainerOuter--
|
|
6679
|
+
.bp_base_text_input_module_textInputContainerOuter--09186 .bp_base_text_input_module_textInputContainer--09186 .bp_base_text_input_module_startIcon--09186 + input.bp_base_text_input_module_textInput--09186:focus-visible{
|
|
6680
6680
|
padding-inline-start:calc(var(--text-input-padding-x-focused) + var(--text-input-icon-padding) + var(--start-icon-width));
|
|
6681
6681
|
}
|
|
6682
|
-
.bp_base_text_input_module_textInputContainerOuter--
|
|
6682
|
+
.bp_base_text_input_module_textInputContainerOuter--09186 .bp_base_text_input_module_textInputContainer--09186 .bp_base_text_input_module_startIcon--09186 + input.bp_base_text_input_module_textInput--09186.bp_base_text_input_module_error--09186{
|
|
6683
6683
|
padding-inline-start:calc(var(--text-input-padding-x-error) + var(--text-input-icon-padding) + var(--start-icon-width));
|
|
6684
6684
|
}
|
|
6685
|
-
.bp_base_text_input_module_textInputContainerOuter--
|
|
6685
|
+
.bp_base_text_input_module_textInputContainerOuter--09186 .bp_base_text_input_module_textInputContainer--09186 .bp_base_text_input_module_endIcon--09186{
|
|
6686
6686
|
position:absolute;
|
|
6687
6687
|
right:calc(var(--text-input-padding-x) + var(--text-input-border-width));
|
|
6688
6688
|
top:50%;
|
|
6689
6689
|
transform:translateY(-50%);
|
|
6690
6690
|
}
|
|
6691
|
-
.bp_base_text_input_module_textInputContainerOuter--
|
|
6691
|
+
.bp_base_text_input_module_textInputContainerOuter--09186.bp_base_text_input_module_disabled--09186{
|
|
6692
6692
|
opacity:var(--disabled-opacity);
|
|
6693
6693
|
}
|
|
6694
|
-
.bp_base_text_input_module_textInputContainerOuter--
|
|
6694
|
+
.bp_base_text_input_module_textInputContainerOuter--09186 .bp_base_text_input_module_inlineError--09186,.bp_base_text_input_module_textInputContainerOuter--09186 .bp_base_text_input_module_subtext--09186{
|
|
6695
6695
|
margin-block-start:var(--text-input-inline-error-subtext-block-margin);
|
|
6696
6696
|
}
|
|
6697
6697
|
.bp_chip_module_chip--d54cf[data-modern=false]{
|
|
@@ -1,4 +1,4 @@
|
|
|
1
1
|
import '../../index.css';
|
|
2
|
-
var styles = {"textInputContainerOuter":"bp_base_text_input_module_textInputContainerOuter--
|
|
2
|
+
var styles = {"textInputContainerOuter":"bp_base_text_input_module_textInputContainerOuter--09186","label":"bp_base_text_input_module_label--09186","hidden":"bp_base_text_input_module_hidden--09186","textInputContainer":"bp_base_text_input_module_textInputContainer--09186","textInput":"bp_base_text_input_module_textInput--09186","error":"bp_base_text_input_module_error--09186","readOnly":"bp_base_text_input_module_readOnly--09186","endIcon":"bp_base_text_input_module_endIcon--09186","startIcon":"bp_base_text_input_module_startIcon--09186","disabled":"bp_base_text_input_module_disabled--09186","inlineError":"bp_base_text_input_module_inlineError--09186","subtext":"bp_base_text_input_module_subtext--09186"};
|
|
3
3
|
|
|
4
4
|
export { styles as default };
|