@cdx-ui/components 0.0.1-beta.80 → 0.0.1-beta.82
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/lib/commonjs/components/Input/styles.js +17 -6
- package/lib/commonjs/components/Input/styles.js.map +1 -1
- package/lib/commonjs/components/Select/styles.js +9 -3
- package/lib/commonjs/components/Select/styles.js.map +1 -1
- package/lib/commonjs/providers/toast/insets-container.js +7 -1
- package/lib/commonjs/providers/toast/insets-container.js.map +1 -1
- package/lib/module/components/Input/styles.js +17 -6
- package/lib/module/components/Input/styles.js.map +1 -1
- package/lib/module/components/Select/styles.js +9 -3
- package/lib/module/components/Select/styles.js.map +1 -1
- package/lib/module/providers/toast/insets-container.js +9 -3
- package/lib/module/providers/toast/insets-container.js.map +1 -1
- package/lib/typescript/components/Input/styles.d.ts.map +1 -1
- package/lib/typescript/components/Select/styles.d.ts.map +1 -1
- package/lib/typescript/providers/toast/insets-container.d.ts.map +1 -1
- package/package.json +4 -4
- package/src/components/Input/styles.ts +22 -8
- package/src/components/Select/styles.ts +26 -13
- package/src/providers/toast/insets-container.tsx +5 -3
|
@@ -6,16 +6,20 @@ Object.defineProperty(exports, "__esModule", {
|
|
|
6
6
|
exports.inputSlotVariants = exports.inputRootVariants = exports.inputIconVariants = exports.inputFieldVariants = exports.inputFieldPlaceholderVariants = void 0;
|
|
7
7
|
var _classVarianceAuthority = require("class-variance-authority");
|
|
8
8
|
var _primitives = require("../../styles/primitives");
|
|
9
|
-
const inputRootVariants = exports.inputRootVariants = (0, _classVarianceAuthority.cva)(['w-full flex-row items-center overflow-hidden', 'bg-surface-primary', 'border-solid border-stroke-primary', 'web:border-default native:border-[length:var(--border-width-default)]', 'rounded-[var(--border-radius-default)]', _primitives.TRANSITION_COLORS, 'data-[disabled=true]:bg-surface-secondary', 'data-[disabled=true]:opacity-[var(--opacity-disabled)]', _primitives.DISABLED_CURSOR, 'data-[readonly=true]:cursor-default', 'data-[readonly=true]:bg-surface-secondary', 'web:data-[hover=true]:data-[focus=false]:data-[invalid=false]:border-stroke-hover',
|
|
9
|
+
const inputRootVariants = exports.inputRootVariants = (0, _classVarianceAuthority.cva)(['w-full flex-row items-center overflow-hidden', 'bg-surface-primary', 'border-solid border-stroke-primary', 'web:border-default native:border-[length:var(--border-width-default)]', 'rounded-[var(--border-radius-default)]', _primitives.TRANSITION_COLORS, 'data-[disabled=true]:bg-surface-secondary', 'data-[disabled=true]:opacity-[var(--opacity-disabled)]', _primitives.DISABLED_CURSOR, 'data-[readonly=true]:cursor-default', 'data-[readonly=true]:bg-surface-secondary', 'web:data-[hover=true]:data-[focus=false]:data-[invalid=false]:border-stroke-hover',
|
|
10
|
+
// Web: inset ring avoids a border-width change so the shell never shifts on focus and
|
|
11
|
+
// no per-size padding compensation is required.
|
|
12
|
+
'web:data-[focus=true]:ring-inset', 'web:data-[focus=true]:ring-[length:var(--border-width-focused)]', 'web:data-[focus=true]:data-[invalid=false]:ring-stroke-action', 'web:data-[focus=true]:data-[invalid=true]:ring-stroke-danger',
|
|
13
|
+
// Native: thicker border on focus; size variants below subtract a hairline of padding
|
|
14
|
+
// so layout doesn't shift by 1px.
|
|
15
|
+
'native:data-[focus=true]:border-[length:var(--border-width-focused)]', 'native:data-[focus=true]:data-[invalid=false]:border-stroke-action', 'native:data-[focus=true]:data-[invalid=true]:border-stroke-danger', 'data-[invalid=true]:border-stroke-danger'], {
|
|
10
16
|
variants: {
|
|
11
17
|
variant: {
|
|
12
18
|
outline: []
|
|
13
19
|
},
|
|
14
20
|
size: {
|
|
15
|
-
default: ['h-11 min-h-11 px-4 py-3 gap-4',
|
|
16
|
-
|
|
17
|
-
'data-[focus=true]:px-[calc(var(--spacing-4)-var(--spacing-px))]', 'data-[focus=true]:py-[calc(var(--spacing-3)-var(--spacing-px))]'],
|
|
18
|
-
small: ['h-8 min-h-8 px-3 py-2 gap-1.5', 'data-[focus=true]:px-[calc(var(--spacing-3)-var(--spacing-px))]', 'data-[focus=true]:py-[calc(var(--spacing-2)-var(--spacing-px))]']
|
|
21
|
+
default: ['h-11 min-h-11 px-4 py-3 gap-4', 'native:data-[focus=true]:px-[calc(var(--spacing-4)-var(--spacing-px))]', 'native:data-[focus=true]:py-[calc(var(--spacing-3)-var(--spacing-px))]'],
|
|
22
|
+
small: ['h-8 min-h-8 px-3 py-2 gap-1.5', 'native:data-[focus=true]:px-[calc(var(--spacing-3)-var(--spacing-px))]', 'native:data-[focus=true]:py-[calc(var(--spacing-2)-var(--spacing-px))]']
|
|
19
23
|
}
|
|
20
24
|
},
|
|
21
25
|
defaultVariants: {
|
|
@@ -23,7 +27,14 @@ const inputRootVariants = exports.inputRootVariants = (0, _classVarianceAuthorit
|
|
|
23
27
|
size: 'default'
|
|
24
28
|
}
|
|
25
29
|
});
|
|
26
|
-
const inputFieldVariants = exports.inputFieldVariants = (0, _classVarianceAuthority.cva)([
|
|
30
|
+
const inputFieldVariants = exports.inputFieldVariants = (0, _classVarianceAuthority.cva)([
|
|
31
|
+
// `min-w-0` is critical on web: without it, a flex item defaults to `min-width: auto`,
|
|
32
|
+
// which is the input's intrinsic content width. When the shell ancestor uses
|
|
33
|
+
// `overflow-hidden` (for rounded corners), focusing the input via `<label htmlFor>`
|
|
34
|
+
// would make the browser auto-scroll the shell to bring the input into view — visually
|
|
35
|
+
// collapsing the left padding to zero. With `min-w-0` the field can shrink below its
|
|
36
|
+
// intrinsic width so the shell never overflows and never gets scrolled.
|
|
37
|
+
'flex-1 min-w-0 justify-center bg-transparent p-0', 'text-content-primary', 'placeholder:text-content-tertiary', 'web:outline-none', 'tracking-normal'], {
|
|
27
38
|
variants: {
|
|
28
39
|
size: {
|
|
29
40
|
default: 'text-[0.875rem]',
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"names":["_classVarianceAuthority","require","_primitives","inputRootVariants","exports","cva","TRANSITION_COLORS","DISABLED_CURSOR","variants","variant","outline","size","default","small","defaultVariants","inputFieldVariants","inputSlotVariants","inputIconVariants","inputFieldPlaceholderVariants"],"sourceRoot":"../../../../src","sources":["components/Input/styles.ts"],"mappings":";;;;;;AAAA,IAAAA,uBAAA,GAAAC,OAAA;AACA,IAAAC,WAAA,GAAAD,OAAA;AAEO,MAAME,iBAAiB,GAAAC,OAAA,CAAAD,iBAAA,GAAG,IAAAE,2BAAG,EAClC,CACE,8CAA8C,EAC9C,oBAAoB,EACpB,oCAAoC,EACpC,uEAAuE,EACvE,wCAAwC,EACxCC,6BAAiB,EACjB,2CAA2C,EAC3C,wDAAwD,EACxDC,2BAAe,EACf,qCAAqC,EACrC,2CAA2C,EAC3C,mFAAmF,
|
|
1
|
+
{"version":3,"names":["_classVarianceAuthority","require","_primitives","inputRootVariants","exports","cva","TRANSITION_COLORS","DISABLED_CURSOR","variants","variant","outline","size","default","small","defaultVariants","inputFieldVariants","inputSlotVariants","inputIconVariants","inputFieldPlaceholderVariants"],"sourceRoot":"../../../../src","sources":["components/Input/styles.ts"],"mappings":";;;;;;AAAA,IAAAA,uBAAA,GAAAC,OAAA;AACA,IAAAC,WAAA,GAAAD,OAAA;AAEO,MAAME,iBAAiB,GAAAC,OAAA,CAAAD,iBAAA,GAAG,IAAAE,2BAAG,EAClC,CACE,8CAA8C,EAC9C,oBAAoB,EACpB,oCAAoC,EACpC,uEAAuE,EACvE,wCAAwC,EACxCC,6BAAiB,EACjB,2CAA2C,EAC3C,wDAAwD,EACxDC,2BAAe,EACf,qCAAqC,EACrC,2CAA2C,EAC3C,mFAAmF;AACnF;AACA;AACA,kCAAkC,EAClC,iEAAiE,EACjE,+DAA+D,EAC/D,8DAA8D;AAC9D;AACA;AACA,sEAAsE,EACtE,oEAAoE,EACpE,mEAAmE,EACnE,0CAA0C,CAC3C,EACD;EACEC,QAAQ,EAAE;IACRC,OAAO,EAAE;MACPC,OAAO,EAAE;IACX,CAAC;IACDC,IAAI,EAAE;MACJC,OAAO,EAAE,CACP,+BAA+B,EAC/B,wEAAwE,EACxE,wEAAwE,CACzE;MACDC,KAAK,EAAE,CACL,+BAA+B,EAC/B,wEAAwE,EACxE,wEAAwE;IAE5E;EACF,CAAC;EACDC,eAAe,EAAE;IACfL,OAAO,EAAE,SAAS;IAClBE,IAAI,EAAE;EACR;AACF,CACF,CAAC;AAEM,MAAMI,kBAAkB,GAAAX,OAAA,CAAAW,kBAAA,GAAG,IAAAV,2BAAG,EACnC;AACE;AACA;AACA;AACA;AACA;AACA;AACA,kDAAkD,EAClD,sBAAsB,EACtB,mCAAmC,EACnC,kBAAkB,EAClB,iBAAiB,CAClB,EACD;EACEG,QAAQ,EAAE;IACRG,IAAI,EAAE;MACJC,OAAO,EAAE,iBAAiB;MAC1BC,KAAK,EAAE;IACT;EACF,CAAC;EACDC,eAAe,EAAE;IACfH,IAAI,EAAE;EACR;AACF,CACF,CAAC;AAEM,MAAMK,iBAAiB,GAAAZ,OAAA,CAAAY,iBAAA,GAAG,IAAAX,2BAAG,EAAC,CAAC,kDAAkD,CAAC,CAAC;AAEnF,MAAMY,iBAAiB,GAAAb,OAAA,CAAAa,iBAAA,GAAG,IAAAZ,2BAAG,EAAC,CAAC,uBAAuB,CAAC,EAAE;EAC9DG,QAAQ,EAAE;IACRG,IAAI,EAAE;MACJC,OAAO,EAAE,QAAQ;MACjBC,KAAK,EAAE;IACT;EACF,CAAC;EACDC,eAAe,EAAE;IACfH,IAAI,EAAE;EACR;AACF,CAAC,CAAC;AAEK,MAAMO,6BAA6B,GAAAd,OAAA,CAAAc,6BAAA,GAAG,IAAAb,2BAAG,EAAC,CAAC,yBAAyB,CAAC,CAAC","ignoreList":[]}
|
|
@@ -9,14 +9,20 @@ var _classVarianceAuthority = require("class-variance-authority");
|
|
|
9
9
|
var _primitives = require("../../styles/primitives");
|
|
10
10
|
// ── Trigger ─────────────────────────────────────────────────
|
|
11
11
|
|
|
12
|
-
const selectTriggerVariants = exports.selectTriggerVariants = (0, _classVarianceAuthority.cva)(['flex w-full min-w-0 flex-row items-center justify-between text-start', 'bg-surface-primary', 'border border-stroke-primary', 'rounded-[var(--border-radius-default)]', _primitives.TRANSITION_COLORS, 'data-[disabled=true]:bg-surface-secondary', 'data-[disabled=true]:opacity-[var(--opacity-disabled)]', _primitives.DISABLED_CURSOR, 'data-[readonly=true]:cursor-default', 'data-[readonly=true]:bg-surface-secondary', 'web:
|
|
12
|
+
const selectTriggerVariants = exports.selectTriggerVariants = (0, _classVarianceAuthority.cva)(['flex w-full min-w-0 flex-row items-center justify-between text-start', 'bg-surface-primary', 'border border-stroke-primary', 'rounded-[var(--border-radius-default)]', _primitives.TRANSITION_COLORS, 'data-[disabled=true]:bg-surface-secondary', 'data-[disabled=true]:opacity-[var(--opacity-disabled)]', _primitives.DISABLED_CURSOR, 'data-[readonly=true]:cursor-default', 'data-[readonly=true]:bg-surface-secondary', 'web:data-[hover=true]:data-[focus=false]:data-[invalid=false]:border-stroke-hover',
|
|
13
|
+
// Web: inset ring avoids a border-width change so no padding compensation is needed.
|
|
14
|
+
'web:data-[focus=true]:ring-inset', 'web:data-[focus=true]:ring-[length:var(--border-width-focused)]', 'web:data-[focus=true]:data-[invalid=false]:ring-stroke-action', 'web:data-[focus=true]:data-[invalid=true]:ring-stroke-danger', 'web:data-[state=open]:ring-inset', 'web:data-[state=open]:ring-[length:var(--border-width-focused)]', 'web:data-[state=open]:data-[invalid=false]:ring-stroke-action', 'web:data-[state=open]:data-[invalid=true]:ring-stroke-danger',
|
|
15
|
+
// Native: thicker border; size variants below compensate the layout shift.
|
|
16
|
+
'native:data-[focus=true]:border-[length:var(--border-width-focused)]', 'native:data-[focus=true]:data-[invalid=false]:border-stroke-action', 'native:data-[focus=true]:data-[invalid=true]:border-stroke-danger', 'native:data-[state=open]:border-[length:var(--border-width-focused)]', 'native:data-[state=open]:data-[invalid=false]:border-stroke-action', 'native:data-[state=open]:data-[invalid=true]:border-stroke-danger', 'data-[invalid=true]:border-stroke-danger'], {
|
|
13
17
|
variants: {
|
|
14
18
|
variant: {
|
|
15
19
|
outline: []
|
|
16
20
|
},
|
|
17
21
|
size: {
|
|
18
|
-
default: ['h-11 min-h-11 px-4 py-3 gap-4',
|
|
19
|
-
|
|
22
|
+
default: ['h-11 min-h-11 px-4 py-3 gap-4',
|
|
23
|
+
// Native only: subtract one hairline so the wider focus border doesn't shift layout.
|
|
24
|
+
'native:data-[focus=true]:px-[calc(var(--spacing-4)-var(--spacing-px))]', 'native:data-[focus=true]:py-[calc(var(--spacing-3)-var(--spacing-px))]', 'native:data-[state=open]:px-[calc(var(--spacing-4)-var(--spacing-px))]', 'native:data-[state=open]:py-[calc(var(--spacing-3)-var(--spacing-px))]'],
|
|
25
|
+
small: ['h-8 min-h-8 px-3 py-2 gap-1.5', 'native:data-[focus=true]:px-[calc(var(--spacing-3)-var(--spacing-px))]', 'native:data-[focus=true]:py-[calc(var(--spacing-2)-var(--spacing-px))]', 'native:data-[state=open]:px-[calc(var(--spacing-3)-var(--spacing-px))]', 'native:data-[state=open]:py-[calc(var(--spacing-2)-var(--spacing-px))]']
|
|
20
26
|
}
|
|
21
27
|
},
|
|
22
28
|
defaultVariants: {
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"names":["_reactNative","require","_classVarianceAuthority","_primitives","selectTriggerVariants","exports","cva","TRANSITION_COLORS","DISABLED_CURSOR","variants","variant","outline","size","default","small","defaultVariants","selectValueVariants","selectIconVariants","selectContentVariants","Platform","select","web","selectItemVariants","selectItemLabelVariants"],"sourceRoot":"../../../../src","sources":["components/Select/styles.ts"],"mappings":";;;;;;AAAA,IAAAA,YAAA,GAAAC,OAAA;AACA,IAAAC,uBAAA,GAAAD,OAAA;AACA,IAAAE,WAAA,GAAAF,OAAA;AAEA;;AAEO,MAAMG,qBAAqB,GAAAC,OAAA,CAAAD,qBAAA,GAAG,IAAAE,2BAAG,EACtC,CACE,sEAAsE,EACtE,oBAAoB,EACpB,8BAA8B,EAC9B,wCAAwC,EACxCC,6BAAiB,EACjB,2CAA2C,EAC3C,wDAAwD,EACxDC,2BAAe,EACf,qCAAqC,EACrC,2CAA2C,EAC3C,
|
|
1
|
+
{"version":3,"names":["_reactNative","require","_classVarianceAuthority","_primitives","selectTriggerVariants","exports","cva","TRANSITION_COLORS","DISABLED_CURSOR","variants","variant","outline","size","default","small","defaultVariants","selectValueVariants","selectIconVariants","selectContentVariants","Platform","select","web","selectItemVariants","selectItemLabelVariants"],"sourceRoot":"../../../../src","sources":["components/Select/styles.ts"],"mappings":"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","ignoreList":[]}
|
|
@@ -9,6 +9,12 @@ var _reactNative = require("react-native");
|
|
|
9
9
|
var _reactNativeSafeAreaContext = require("react-native-safe-area-context");
|
|
10
10
|
var _primitives = require("@cdx-ui/primitives");
|
|
11
11
|
var _jsxRuntime = require("react/jsx-runtime");
|
|
12
|
+
const ZERO_INSETS = {
|
|
13
|
+
top: 0,
|
|
14
|
+
bottom: 0,
|
|
15
|
+
left: 0,
|
|
16
|
+
right: 0
|
|
17
|
+
};
|
|
12
18
|
/**
|
|
13
19
|
* Container component that applies inset padding to position toasts
|
|
14
20
|
* away from screen edges and safe areas
|
|
@@ -33,7 +39,7 @@ function InsetsContainer({
|
|
|
33
39
|
resumeAll,
|
|
34
40
|
hide
|
|
35
41
|
}) {
|
|
36
|
-
const safeAreaInsets = (0,
|
|
42
|
+
const safeAreaInsets = (0, _react.useContext)(_reactNativeSafeAreaContext.SafeAreaInsetsContext) ?? ZERO_INSETS;
|
|
37
43
|
const finalInsets = (0, _react.useMemo)(() => {
|
|
38
44
|
return {
|
|
39
45
|
top: insets?.top ?? safeAreaInsets.top + (_reactNative.Platform.OS === 'ios' ? 0 : 12),
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"names":["_react","require","_reactNative","_reactNativeSafeAreaContext","_primitives","_jsxRuntime","InsetsContainer","insets","announceLabel","contentWrapper","children","disableFullWindowOverlay","unstable_accessibilityContainerViewIsModal","pauseAll","resumeAll","hide","safeAreaInsets","
|
|
1
|
+
{"version":3,"names":["_react","require","_reactNative","_reactNativeSafeAreaContext","_primitives","_jsxRuntime","ZERO_INSETS","top","bottom","left","right","InsetsContainer","insets","announceLabel","contentWrapper","children","disableFullWindowOverlay","unstable_accessibilityContainerViewIsModal","pauseAll","resumeAll","hide","safeAreaInsets","useContext","SafeAreaInsetsContext","finalInsets","useMemo","Platform","OS","pauseSourcesRef","useRef","Set","pauseAllRef","resumeAllRef","current","addPauseSource","useCallback","source","wasEmpty","size","add","removePauseSource","delete","containerRef","hideRef","useEffect","node","sources","handleVisibilityChange","document","hidden","isInsideToast","el","HTMLElement","closest","handlePointerOver","e","target","handlePointerOut","relatedTarget","handleFocusIn","handleFocusOut","handleKeyDown","event","key","stopPropagation","addEventListener","removeEventListener","clear","content","jsx","View","ref","className","role","style","paddingTop","paddingBottom","paddingLeft","paddingRight","FullWindowOverlay"],"sourceRoot":"../../../../src","sources":["providers/toast/insets-container.tsx"],"mappings":"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","ignoreList":[]}
|
|
@@ -2,16 +2,20 @@
|
|
|
2
2
|
|
|
3
3
|
import { cva } from 'class-variance-authority';
|
|
4
4
|
import { DISABLED_CURSOR, TRANSITION_COLORS } from '../../styles/primitives';
|
|
5
|
-
export const inputRootVariants = cva(['w-full flex-row items-center overflow-hidden', 'bg-surface-primary', 'border-solid border-stroke-primary', 'web:border-default native:border-[length:var(--border-width-default)]', 'rounded-[var(--border-radius-default)]', TRANSITION_COLORS, 'data-[disabled=true]:bg-surface-secondary', 'data-[disabled=true]:opacity-[var(--opacity-disabled)]', DISABLED_CURSOR, 'data-[readonly=true]:cursor-default', 'data-[readonly=true]:bg-surface-secondary', 'web:data-[hover=true]:data-[focus=false]:data-[invalid=false]:border-stroke-hover',
|
|
5
|
+
export const inputRootVariants = cva(['w-full flex-row items-center overflow-hidden', 'bg-surface-primary', 'border-solid border-stroke-primary', 'web:border-default native:border-[length:var(--border-width-default)]', 'rounded-[var(--border-radius-default)]', TRANSITION_COLORS, 'data-[disabled=true]:bg-surface-secondary', 'data-[disabled=true]:opacity-[var(--opacity-disabled)]', DISABLED_CURSOR, 'data-[readonly=true]:cursor-default', 'data-[readonly=true]:bg-surface-secondary', 'web:data-[hover=true]:data-[focus=false]:data-[invalid=false]:border-stroke-hover',
|
|
6
|
+
// Web: inset ring avoids a border-width change so the shell never shifts on focus and
|
|
7
|
+
// no per-size padding compensation is required.
|
|
8
|
+
'web:data-[focus=true]:ring-inset', 'web:data-[focus=true]:ring-[length:var(--border-width-focused)]', 'web:data-[focus=true]:data-[invalid=false]:ring-stroke-action', 'web:data-[focus=true]:data-[invalid=true]:ring-stroke-danger',
|
|
9
|
+
// Native: thicker border on focus; size variants below subtract a hairline of padding
|
|
10
|
+
// so layout doesn't shift by 1px.
|
|
11
|
+
'native:data-[focus=true]:border-[length:var(--border-width-focused)]', 'native:data-[focus=true]:data-[invalid=false]:border-stroke-action', 'native:data-[focus=true]:data-[invalid=true]:border-stroke-danger', 'data-[invalid=true]:border-stroke-danger'], {
|
|
6
12
|
variants: {
|
|
7
13
|
variant: {
|
|
8
14
|
outline: []
|
|
9
15
|
},
|
|
10
16
|
size: {
|
|
11
|
-
default: ['h-11 min-h-11 px-4 py-3 gap-4',
|
|
12
|
-
|
|
13
|
-
'data-[focus=true]:px-[calc(var(--spacing-4)-var(--spacing-px))]', 'data-[focus=true]:py-[calc(var(--spacing-3)-var(--spacing-px))]'],
|
|
14
|
-
small: ['h-8 min-h-8 px-3 py-2 gap-1.5', 'data-[focus=true]:px-[calc(var(--spacing-3)-var(--spacing-px))]', 'data-[focus=true]:py-[calc(var(--spacing-2)-var(--spacing-px))]']
|
|
17
|
+
default: ['h-11 min-h-11 px-4 py-3 gap-4', 'native:data-[focus=true]:px-[calc(var(--spacing-4)-var(--spacing-px))]', 'native:data-[focus=true]:py-[calc(var(--spacing-3)-var(--spacing-px))]'],
|
|
18
|
+
small: ['h-8 min-h-8 px-3 py-2 gap-1.5', 'native:data-[focus=true]:px-[calc(var(--spacing-3)-var(--spacing-px))]', 'native:data-[focus=true]:py-[calc(var(--spacing-2)-var(--spacing-px))]']
|
|
15
19
|
}
|
|
16
20
|
},
|
|
17
21
|
defaultVariants: {
|
|
@@ -19,7 +23,14 @@ export const inputRootVariants = cva(['w-full flex-row items-center overflow-hid
|
|
|
19
23
|
size: 'default'
|
|
20
24
|
}
|
|
21
25
|
});
|
|
22
|
-
export const inputFieldVariants = cva([
|
|
26
|
+
export const inputFieldVariants = cva([
|
|
27
|
+
// `min-w-0` is critical on web: without it, a flex item defaults to `min-width: auto`,
|
|
28
|
+
// which is the input's intrinsic content width. When the shell ancestor uses
|
|
29
|
+
// `overflow-hidden` (for rounded corners), focusing the input via `<label htmlFor>`
|
|
30
|
+
// would make the browser auto-scroll the shell to bring the input into view — visually
|
|
31
|
+
// collapsing the left padding to zero. With `min-w-0` the field can shrink below its
|
|
32
|
+
// intrinsic width so the shell never overflows and never gets scrolled.
|
|
33
|
+
'flex-1 min-w-0 justify-center bg-transparent p-0', 'text-content-primary', 'placeholder:text-content-tertiary', 'web:outline-none', 'tracking-normal'], {
|
|
23
34
|
variants: {
|
|
24
35
|
size: {
|
|
25
36
|
default: 'text-[0.875rem]',
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"names":["cva","DISABLED_CURSOR","TRANSITION_COLORS","inputRootVariants","variants","variant","outline","size","default","small","defaultVariants","inputFieldVariants","inputSlotVariants","inputIconVariants","inputFieldPlaceholderVariants"],"sourceRoot":"../../../../src","sources":["components/Input/styles.ts"],"mappings":";;AAAA,SAASA,GAAG,QAA2B,0BAA0B;AACjE,SAASC,eAAe,EAAEC,iBAAiB,QAAQ,yBAAyB;AAE5E,OAAO,MAAMC,iBAAiB,GAAGH,GAAG,CAClC,CACE,8CAA8C,EAC9C,oBAAoB,EACpB,oCAAoC,EACpC,uEAAuE,EACvE,wCAAwC,EACxCE,iBAAiB,EACjB,2CAA2C,EAC3C,wDAAwD,EACxDD,eAAe,EACf,qCAAqC,EACrC,2CAA2C,EAC3C,mFAAmF,
|
|
1
|
+
{"version":3,"names":["cva","DISABLED_CURSOR","TRANSITION_COLORS","inputRootVariants","variants","variant","outline","size","default","small","defaultVariants","inputFieldVariants","inputSlotVariants","inputIconVariants","inputFieldPlaceholderVariants"],"sourceRoot":"../../../../src","sources":["components/Input/styles.ts"],"mappings":";;AAAA,SAASA,GAAG,QAA2B,0BAA0B;AACjE,SAASC,eAAe,EAAEC,iBAAiB,QAAQ,yBAAyB;AAE5E,OAAO,MAAMC,iBAAiB,GAAGH,GAAG,CAClC,CACE,8CAA8C,EAC9C,oBAAoB,EACpB,oCAAoC,EACpC,uEAAuE,EACvE,wCAAwC,EACxCE,iBAAiB,EACjB,2CAA2C,EAC3C,wDAAwD,EACxDD,eAAe,EACf,qCAAqC,EACrC,2CAA2C,EAC3C,mFAAmF;AACnF;AACA;AACA,kCAAkC,EAClC,iEAAiE,EACjE,+DAA+D,EAC/D,8DAA8D;AAC9D;AACA;AACA,sEAAsE,EACtE,oEAAoE,EACpE,mEAAmE,EACnE,0CAA0C,CAC3C,EACD;EACEG,QAAQ,EAAE;IACRC,OAAO,EAAE;MACPC,OAAO,EAAE;IACX,CAAC;IACDC,IAAI,EAAE;MACJC,OAAO,EAAE,CACP,+BAA+B,EAC/B,wEAAwE,EACxE,wEAAwE,CACzE;MACDC,KAAK,EAAE,CACL,+BAA+B,EAC/B,wEAAwE,EACxE,wEAAwE;IAE5E;EACF,CAAC;EACDC,eAAe,EAAE;IACfL,OAAO,EAAE,SAAS;IAClBE,IAAI,EAAE;EACR;AACF,CACF,CAAC;AAED,OAAO,MAAMI,kBAAkB,GAAGX,GAAG,CACnC;AACE;AACA;AACA;AACA;AACA;AACA;AACA,kDAAkD,EAClD,sBAAsB,EACtB,mCAAmC,EACnC,kBAAkB,EAClB,iBAAiB,CAClB,EACD;EACEI,QAAQ,EAAE;IACRG,IAAI,EAAE;MACJC,OAAO,EAAE,iBAAiB;MAC1BC,KAAK,EAAE;IACT;EACF,CAAC;EACDC,eAAe,EAAE;IACfH,IAAI,EAAE;EACR;AACF,CACF,CAAC;AAED,OAAO,MAAMK,iBAAiB,GAAGZ,GAAG,CAAC,CAAC,kDAAkD,CAAC,CAAC;AAE1F,OAAO,MAAMa,iBAAiB,GAAGb,GAAG,CAAC,CAAC,uBAAuB,CAAC,EAAE;EAC9DI,QAAQ,EAAE;IACRG,IAAI,EAAE;MACJC,OAAO,EAAE,QAAQ;MACjBC,KAAK,EAAE;IACT;EACF,CAAC;EACDC,eAAe,EAAE;IACfH,IAAI,EAAE;EACR;AACF,CAAC,CAAC;AAEF,OAAO,MAAMO,6BAA6B,GAAGd,GAAG,CAAC,CAAC,yBAAyB,CAAC,CAAC","ignoreList":[]}
|
|
@@ -6,14 +6,20 @@ import { DISABLED_CURSOR, TRANSITION_COLORS } from '../../styles/primitives';
|
|
|
6
6
|
|
|
7
7
|
// ── Trigger ─────────────────────────────────────────────────
|
|
8
8
|
|
|
9
|
-
export const selectTriggerVariants = cva(['flex w-full min-w-0 flex-row items-center justify-between text-start', 'bg-surface-primary', 'border border-stroke-primary', 'rounded-[var(--border-radius-default)]', TRANSITION_COLORS, 'data-[disabled=true]:bg-surface-secondary', 'data-[disabled=true]:opacity-[var(--opacity-disabled)]', DISABLED_CURSOR, 'data-[readonly=true]:cursor-default', 'data-[readonly=true]:bg-surface-secondary', 'web:
|
|
9
|
+
export const selectTriggerVariants = cva(['flex w-full min-w-0 flex-row items-center justify-between text-start', 'bg-surface-primary', 'border border-stroke-primary', 'rounded-[var(--border-radius-default)]', TRANSITION_COLORS, 'data-[disabled=true]:bg-surface-secondary', 'data-[disabled=true]:opacity-[var(--opacity-disabled)]', DISABLED_CURSOR, 'data-[readonly=true]:cursor-default', 'data-[readonly=true]:bg-surface-secondary', 'web:data-[hover=true]:data-[focus=false]:data-[invalid=false]:border-stroke-hover',
|
|
10
|
+
// Web: inset ring avoids a border-width change so no padding compensation is needed.
|
|
11
|
+
'web:data-[focus=true]:ring-inset', 'web:data-[focus=true]:ring-[length:var(--border-width-focused)]', 'web:data-[focus=true]:data-[invalid=false]:ring-stroke-action', 'web:data-[focus=true]:data-[invalid=true]:ring-stroke-danger', 'web:data-[state=open]:ring-inset', 'web:data-[state=open]:ring-[length:var(--border-width-focused)]', 'web:data-[state=open]:data-[invalid=false]:ring-stroke-action', 'web:data-[state=open]:data-[invalid=true]:ring-stroke-danger',
|
|
12
|
+
// Native: thicker border; size variants below compensate the layout shift.
|
|
13
|
+
'native:data-[focus=true]:border-[length:var(--border-width-focused)]', 'native:data-[focus=true]:data-[invalid=false]:border-stroke-action', 'native:data-[focus=true]:data-[invalid=true]:border-stroke-danger', 'native:data-[state=open]:border-[length:var(--border-width-focused)]', 'native:data-[state=open]:data-[invalid=false]:border-stroke-action', 'native:data-[state=open]:data-[invalid=true]:border-stroke-danger', 'data-[invalid=true]:border-stroke-danger'], {
|
|
10
14
|
variants: {
|
|
11
15
|
variant: {
|
|
12
16
|
outline: []
|
|
13
17
|
},
|
|
14
18
|
size: {
|
|
15
|
-
default: ['h-11 min-h-11 px-4 py-3 gap-4',
|
|
16
|
-
|
|
19
|
+
default: ['h-11 min-h-11 px-4 py-3 gap-4',
|
|
20
|
+
// Native only: subtract one hairline so the wider focus border doesn't shift layout.
|
|
21
|
+
'native:data-[focus=true]:px-[calc(var(--spacing-4)-var(--spacing-px))]', 'native:data-[focus=true]:py-[calc(var(--spacing-3)-var(--spacing-px))]', 'native:data-[state=open]:px-[calc(var(--spacing-4)-var(--spacing-px))]', 'native:data-[state=open]:py-[calc(var(--spacing-3)-var(--spacing-px))]'],
|
|
22
|
+
small: ['h-8 min-h-8 px-3 py-2 gap-1.5', 'native:data-[focus=true]:px-[calc(var(--spacing-3)-var(--spacing-px))]', 'native:data-[focus=true]:py-[calc(var(--spacing-2)-var(--spacing-px))]', 'native:data-[state=open]:px-[calc(var(--spacing-3)-var(--spacing-px))]', 'native:data-[state=open]:py-[calc(var(--spacing-2)-var(--spacing-px))]']
|
|
17
23
|
}
|
|
18
24
|
},
|
|
19
25
|
defaultVariants: {
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"names":["Platform","cva","DISABLED_CURSOR","TRANSITION_COLORS","selectTriggerVariants","variants","variant","outline","size","default","small","defaultVariants","selectValueVariants","selectIconVariants","selectContentVariants","select","web","selectItemVariants","selectItemLabelVariants"],"sourceRoot":"../../../../src","sources":["components/Select/styles.ts"],"mappings":";;AAAA,SAASA,QAAQ,QAAQ,cAAc;AACvC,SAASC,GAAG,QAA2B,0BAA0B;AACjE,SAASC,eAAe,EAAEC,iBAAiB,QAAQ,yBAAyB;;AAE5E;;AAEA,OAAO,MAAMC,qBAAqB,GAAGH,GAAG,CACtC,CACE,sEAAsE,EACtE,oBAAoB,EACpB,8BAA8B,EAC9B,wCAAwC,EACxCE,iBAAiB,EACjB,2CAA2C,EAC3C,wDAAwD,EACxDD,eAAe,EACf,qCAAqC,EACrC,2CAA2C,EAC3C,
|
|
1
|
+
{"version":3,"names":["Platform","cva","DISABLED_CURSOR","TRANSITION_COLORS","selectTriggerVariants","variants","variant","outline","size","default","small","defaultVariants","selectValueVariants","selectIconVariants","selectContentVariants","select","web","selectItemVariants","selectItemLabelVariants"],"sourceRoot":"../../../../src","sources":["components/Select/styles.ts"],"mappings":"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","ignoreList":[]}
|
|
@@ -1,10 +1,16 @@
|
|
|
1
1
|
"use strict";
|
|
2
2
|
|
|
3
|
-
import { useCallback, useEffect, useMemo, useRef } from 'react';
|
|
3
|
+
import { useCallback, useContext, useEffect, useMemo, useRef } from 'react';
|
|
4
4
|
import { Platform, View } from 'react-native';
|
|
5
|
-
import {
|
|
5
|
+
import { SafeAreaInsetsContext } from 'react-native-safe-area-context';
|
|
6
6
|
import { FullWindowOverlay } from '@cdx-ui/primitives';
|
|
7
7
|
import { jsx as _jsx } from "react/jsx-runtime";
|
|
8
|
+
const ZERO_INSETS = {
|
|
9
|
+
top: 0,
|
|
10
|
+
bottom: 0,
|
|
11
|
+
left: 0,
|
|
12
|
+
right: 0
|
|
13
|
+
};
|
|
8
14
|
/**
|
|
9
15
|
* Container component that applies inset padding to position toasts
|
|
10
16
|
* away from screen edges and safe areas
|
|
@@ -29,7 +35,7 @@ export function InsetsContainer({
|
|
|
29
35
|
resumeAll,
|
|
30
36
|
hide
|
|
31
37
|
}) {
|
|
32
|
-
const safeAreaInsets =
|
|
38
|
+
const safeAreaInsets = useContext(SafeAreaInsetsContext) ?? ZERO_INSETS;
|
|
33
39
|
const finalInsets = useMemo(() => {
|
|
34
40
|
return {
|
|
35
41
|
top: insets?.top ?? safeAreaInsets.top + (Platform.OS === 'ios' ? 0 : 12),
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"names":["useCallback","useEffect","useMemo","useRef","Platform","View","
|
|
1
|
+
{"version":3,"names":["useCallback","useContext","useEffect","useMemo","useRef","Platform","View","SafeAreaInsetsContext","FullWindowOverlay","jsx","_jsx","ZERO_INSETS","top","bottom","left","right","InsetsContainer","insets","announceLabel","contentWrapper","children","disableFullWindowOverlay","unstable_accessibilityContainerViewIsModal","pauseAll","resumeAll","hide","safeAreaInsets","finalInsets","OS","pauseSourcesRef","Set","pauseAllRef","resumeAllRef","current","addPauseSource","source","wasEmpty","size","add","removePauseSource","delete","containerRef","hideRef","node","sources","handleVisibilityChange","document","hidden","isInsideToast","el","HTMLElement","closest","handlePointerOver","e","target","handlePointerOut","relatedTarget","handleFocusIn","handleFocusOut","handleKeyDown","event","key","stopPropagation","addEventListener","removeEventListener","clear","content","ref","className","role","style","paddingTop","paddingBottom","paddingLeft","paddingRight"],"sourceRoot":"../../../../src","sources":["providers/toast/insets-container.tsx"],"mappings":"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","ignoreList":[]}
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"styles.d.ts","sourceRoot":"","sources":["../../../../src/components/Input/styles.ts"],"names":[],"mappings":"AAAA,OAAO,EAAO,KAAK,YAAY,EAAE,MAAM,0BAA0B,CAAC;AAGlE,eAAO,MAAM,iBAAiB;;;
|
|
1
|
+
{"version":3,"file":"styles.d.ts","sourceRoot":"","sources":["../../../../src/components/Input/styles.ts"],"names":[],"mappings":"AAAA,OAAO,EAAO,KAAK,YAAY,EAAE,MAAM,0BAA0B,CAAC;AAGlE,eAAO,MAAM,iBAAiB;;;8EAkD7B,CAAC;AAEF,eAAO,MAAM,kBAAkB;;8EAyB9B,CAAC;AAEF,eAAO,MAAM,iBAAiB,oFAA4D,CAAC;AAE3F,eAAO,MAAM,iBAAiB;;8EAU5B,CAAC;AAEH,eAAO,MAAM,6BAA6B,oFAAmC,CAAC;AAE9E,MAAM,MAAM,iBAAiB,GAAG,YAAY,CAAC,OAAO,iBAAiB,CAAC,CAAC"}
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"styles.d.ts","sourceRoot":"","sources":["../../../../src/components/Select/styles.ts"],"names":[],"mappings":"AACA,OAAO,EAAO,KAAK,YAAY,EAAE,MAAM,0BAA0B,CAAC;AAKlE,eAAO,MAAM,qBAAqB;;;
|
|
1
|
+
{"version":3,"file":"styles.d.ts","sourceRoot":"","sources":["../../../../src/components/Select/styles.ts"],"names":[],"mappings":"AACA,OAAO,EAAO,KAAK,YAAY,EAAE,MAAM,0BAA0B,CAAC;AAKlE,eAAO,MAAM,qBAAqB;;;8EA2DjC,CAAC;AAIF,eAAO,MAAM,mBAAmB;;8EAkB/B,CAAC;AAIF,eAAO,MAAM,kBAAkB;;8EAiB9B,CAAC;AAIF,eAAO,MAAM,qBAAqB,oFAWhC,CAAC;AAIH,eAAO,MAAM,kBAAkB;;8EAsB9B,CAAC;AAIF,eAAO,MAAM,uBAAuB;;8EAanC,CAAC;AAEF,MAAM,MAAM,kBAAkB,GAAG,YAAY,CAAC,OAAO,qBAAqB,CAAC,CAAC"}
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"insets-container.d.ts","sourceRoot":"","sources":["../../../../src/providers/toast/insets-container.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,EAAE,SAAS,EAAE,MAAM,OAAO,CAAC;AAKvC,OAAO,KAAK,EAAE,WAAW,EAAE,MAAM,SAAS,CAAC;
|
|
1
|
+
{"version":3,"file":"insets-container.d.ts","sourceRoot":"","sources":["../../../../src/providers/toast/insets-container.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,EAAE,SAAS,EAAE,MAAM,OAAO,CAAC;AAKvC,OAAO,KAAK,EAAE,WAAW,EAAE,MAAM,SAAS,CAAC;AAI3C,UAAU,oBAAoB;IAC5B;;;;OAIG;IACH,wBAAwB,EAAE,OAAO,CAAC;IAClC;;;;;;;;OAQG;IACH,0CAA0C,CAAC,EAAE,OAAO,CAAC;IACrD;;;;;OAKG;IACH,MAAM,CAAC,EAAE,WAAW,CAAC;IACrB;;;;OAIG;IACH,aAAa,CAAC,EAAE,MAAM,CAAC;IACvB;;;;;OAKG;IACH,cAAc,CAAC,EAAE,CAAC,QAAQ,EAAE,SAAS,KAAK,KAAK,CAAC,YAAY,CAAC;IAC7D;;OAEG;IACH,QAAQ,EAAE,MAAM,IAAI,CAAC;IACrB;;OAEG;IACH,SAAS,EAAE,MAAM,IAAI,CAAC;IACtB;;OAEG;IACH,IAAI,EAAE,MAAM,IAAI,CAAC;IACjB;;OAEG;IACH,QAAQ,EAAE,SAAS,CAAC;CACrB;AAED;;;;;;;;;;;;GAYG;AACH,wBAAgB,eAAe,CAAC,EAC9B,MAAM,EACN,aAA+B,EAC/B,cAAc,EACd,QAAQ,EACR,wBAAwB,EACxB,0CAA0C,EAC1C,QAAQ,EACR,SAAS,EACT,IAAI,GACL,EAAE,QAAQ,CAAC,oBAAoB,CAAC,2CAgJhC"}
|
package/package.json
CHANGED
|
@@ -1,6 +1,6 @@
|
|
|
1
1
|
{
|
|
2
2
|
"name": "@cdx-ui/components",
|
|
3
|
-
"version": "0.0.1-beta.
|
|
3
|
+
"version": "0.0.1-beta.82",
|
|
4
4
|
"main": "lib/commonjs/index.js",
|
|
5
5
|
"module": "lib/module/index.js",
|
|
6
6
|
"react-native": "src/index.ts",
|
|
@@ -67,9 +67,9 @@
|
|
|
67
67
|
"@gorhom/bottom-sheet": "^5.2.6",
|
|
68
68
|
"class-variance-authority": "^0.7.1",
|
|
69
69
|
"uniwind": "1.10.0",
|
|
70
|
-
"@cdx-ui/
|
|
71
|
-
"@cdx-ui/
|
|
72
|
-
"@cdx-ui/
|
|
70
|
+
"@cdx-ui/icons": "0.0.1-beta.82",
|
|
71
|
+
"@cdx-ui/utils": "0.0.1-beta.82",
|
|
72
|
+
"@cdx-ui/primitives": "0.0.1-beta.82"
|
|
73
73
|
},
|
|
74
74
|
"devDependencies": {
|
|
75
75
|
"@react-navigation/bottom-tabs": "*",
|
|
@@ -15,8 +15,17 @@ export const inputRootVariants = cva(
|
|
|
15
15
|
'data-[readonly=true]:cursor-default',
|
|
16
16
|
'data-[readonly=true]:bg-surface-secondary',
|
|
17
17
|
'web:data-[hover=true]:data-[focus=false]:data-[invalid=false]:border-stroke-hover',
|
|
18
|
-
|
|
19
|
-
|
|
18
|
+
// Web: inset ring avoids a border-width change so the shell never shifts on focus and
|
|
19
|
+
// no per-size padding compensation is required.
|
|
20
|
+
'web:data-[focus=true]:ring-inset',
|
|
21
|
+
'web:data-[focus=true]:ring-[length:var(--border-width-focused)]',
|
|
22
|
+
'web:data-[focus=true]:data-[invalid=false]:ring-stroke-action',
|
|
23
|
+
'web:data-[focus=true]:data-[invalid=true]:ring-stroke-danger',
|
|
24
|
+
// Native: thicker border on focus; size variants below subtract a hairline of padding
|
|
25
|
+
// so layout doesn't shift by 1px.
|
|
26
|
+
'native:data-[focus=true]:border-[length:var(--border-width-focused)]',
|
|
27
|
+
'native:data-[focus=true]:data-[invalid=false]:border-stroke-action',
|
|
28
|
+
'native:data-[focus=true]:data-[invalid=true]:border-stroke-danger',
|
|
20
29
|
'data-[invalid=true]:border-stroke-danger',
|
|
21
30
|
],
|
|
22
31
|
{
|
|
@@ -27,14 +36,13 @@ export const inputRootVariants = cva(
|
|
|
27
36
|
size: {
|
|
28
37
|
default: [
|
|
29
38
|
'h-11 min-h-11 px-4 py-3 gap-4',
|
|
30
|
-
|
|
31
|
-
'data-[focus=true]:
|
|
32
|
-
'data-[focus=true]:py-[calc(var(--spacing-3)-var(--spacing-px))]',
|
|
39
|
+
'native:data-[focus=true]:px-[calc(var(--spacing-4)-var(--spacing-px))]',
|
|
40
|
+
'native:data-[focus=true]:py-[calc(var(--spacing-3)-var(--spacing-px))]',
|
|
33
41
|
],
|
|
34
42
|
small: [
|
|
35
43
|
'h-8 min-h-8 px-3 py-2 gap-1.5',
|
|
36
|
-
'data-[focus=true]:px-[calc(var(--spacing-3)-var(--spacing-px))]',
|
|
37
|
-
'data-[focus=true]:py-[calc(var(--spacing-2)-var(--spacing-px))]',
|
|
44
|
+
'native:data-[focus=true]:px-[calc(var(--spacing-3)-var(--spacing-px))]',
|
|
45
|
+
'native:data-[focus=true]:py-[calc(var(--spacing-2)-var(--spacing-px))]',
|
|
38
46
|
],
|
|
39
47
|
},
|
|
40
48
|
},
|
|
@@ -47,7 +55,13 @@ export const inputRootVariants = cva(
|
|
|
47
55
|
|
|
48
56
|
export const inputFieldVariants = cva(
|
|
49
57
|
[
|
|
50
|
-
|
|
58
|
+
// `min-w-0` is critical on web: without it, a flex item defaults to `min-width: auto`,
|
|
59
|
+
// which is the input's intrinsic content width. When the shell ancestor uses
|
|
60
|
+
// `overflow-hidden` (for rounded corners), focusing the input via `<label htmlFor>`
|
|
61
|
+
// would make the browser auto-scroll the shell to bring the input into view — visually
|
|
62
|
+
// collapsing the left padding to zero. With `min-w-0` the field can shrink below its
|
|
63
|
+
// intrinsic width so the shell never overflows and never gets scrolled.
|
|
64
|
+
'flex-1 min-w-0 justify-center bg-transparent p-0',
|
|
51
65
|
'text-content-primary',
|
|
52
66
|
'placeholder:text-content-tertiary',
|
|
53
67
|
'web:outline-none',
|
|
@@ -16,11 +16,23 @@ export const selectTriggerVariants = cva(
|
|
|
16
16
|
DISABLED_CURSOR,
|
|
17
17
|
'data-[readonly=true]:cursor-default',
|
|
18
18
|
'data-[readonly=true]:bg-surface-secondary',
|
|
19
|
-
'web:hover:data-[focus=false]:data-[invalid=false]:border-stroke-hover',
|
|
20
|
-
|
|
21
|
-
'data-[focus=true]:
|
|
22
|
-
'data-[
|
|
23
|
-
'data-[
|
|
19
|
+
'web:data-[hover=true]:data-[focus=false]:data-[invalid=false]:border-stroke-hover',
|
|
20
|
+
// Web: inset ring avoids a border-width change so no padding compensation is needed.
|
|
21
|
+
'web:data-[focus=true]:ring-inset',
|
|
22
|
+
'web:data-[focus=true]:ring-[length:var(--border-width-focused)]',
|
|
23
|
+
'web:data-[focus=true]:data-[invalid=false]:ring-stroke-action',
|
|
24
|
+
'web:data-[focus=true]:data-[invalid=true]:ring-stroke-danger',
|
|
25
|
+
'web:data-[state=open]:ring-inset',
|
|
26
|
+
'web:data-[state=open]:ring-[length:var(--border-width-focused)]',
|
|
27
|
+
'web:data-[state=open]:data-[invalid=false]:ring-stroke-action',
|
|
28
|
+
'web:data-[state=open]:data-[invalid=true]:ring-stroke-danger',
|
|
29
|
+
// Native: thicker border; size variants below compensate the layout shift.
|
|
30
|
+
'native:data-[focus=true]:border-[length:var(--border-width-focused)]',
|
|
31
|
+
'native:data-[focus=true]:data-[invalid=false]:border-stroke-action',
|
|
32
|
+
'native:data-[focus=true]:data-[invalid=true]:border-stroke-danger',
|
|
33
|
+
'native:data-[state=open]:border-[length:var(--border-width-focused)]',
|
|
34
|
+
'native:data-[state=open]:data-[invalid=false]:border-stroke-action',
|
|
35
|
+
'native:data-[state=open]:data-[invalid=true]:border-stroke-danger',
|
|
24
36
|
'data-[invalid=true]:border-stroke-danger',
|
|
25
37
|
],
|
|
26
38
|
{
|
|
@@ -31,17 +43,18 @@ export const selectTriggerVariants = cva(
|
|
|
31
43
|
size: {
|
|
32
44
|
default: [
|
|
33
45
|
'h-11 min-h-11 px-4 py-3 gap-4',
|
|
34
|
-
|
|
35
|
-
'data-[focus=true]:
|
|
36
|
-
'data-[
|
|
37
|
-
'data-[state=open]:
|
|
46
|
+
// Native only: subtract one hairline so the wider focus border doesn't shift layout.
|
|
47
|
+
'native:data-[focus=true]:px-[calc(var(--spacing-4)-var(--spacing-px))]',
|
|
48
|
+
'native:data-[focus=true]:py-[calc(var(--spacing-3)-var(--spacing-px))]',
|
|
49
|
+
'native:data-[state=open]:px-[calc(var(--spacing-4)-var(--spacing-px))]',
|
|
50
|
+
'native:data-[state=open]:py-[calc(var(--spacing-3)-var(--spacing-px))]',
|
|
38
51
|
],
|
|
39
52
|
small: [
|
|
40
53
|
'h-8 min-h-8 px-3 py-2 gap-1.5',
|
|
41
|
-
'data-[focus=true]:px-[calc(var(--spacing-3)-var(--spacing-px))]',
|
|
42
|
-
'data-[focus=true]:py-[calc(var(--spacing-2)-var(--spacing-px))]',
|
|
43
|
-
'data-[state=open]:px-[calc(var(--spacing-3)-var(--spacing-px))]',
|
|
44
|
-
'data-[state=open]:py-[calc(var(--spacing-2)-var(--spacing-px))]',
|
|
54
|
+
'native:data-[focus=true]:px-[calc(var(--spacing-3)-var(--spacing-px))]',
|
|
55
|
+
'native:data-[focus=true]:py-[calc(var(--spacing-2)-var(--spacing-px))]',
|
|
56
|
+
'native:data-[state=open]:px-[calc(var(--spacing-3)-var(--spacing-px))]',
|
|
57
|
+
'native:data-[state=open]:py-[calc(var(--spacing-2)-var(--spacing-px))]',
|
|
45
58
|
],
|
|
46
59
|
},
|
|
47
60
|
},
|
|
@@ -1,10 +1,12 @@
|
|
|
1
1
|
import type { ReactNode } from 'react';
|
|
2
|
-
import { useCallback, useEffect, useMemo, useRef } from 'react';
|
|
2
|
+
import { useCallback, useContext, useEffect, useMemo, useRef } from 'react';
|
|
3
3
|
import { Platform, View } from 'react-native';
|
|
4
|
-
import {
|
|
4
|
+
import { SafeAreaInsetsContext, type EdgeInsets } from 'react-native-safe-area-context';
|
|
5
5
|
import { FullWindowOverlay } from '@cdx-ui/primitives';
|
|
6
6
|
import type { ToastInsets } from './types';
|
|
7
7
|
|
|
8
|
+
const ZERO_INSETS: EdgeInsets = { top: 0, bottom: 0, left: 0, right: 0 };
|
|
9
|
+
|
|
8
10
|
interface InsetsContainerProps {
|
|
9
11
|
/**
|
|
10
12
|
* When true, uses a regular View instead of FullWindowOverlay on iOS.
|
|
@@ -84,7 +86,7 @@ export function InsetsContainer({
|
|
|
84
86
|
resumeAll,
|
|
85
87
|
hide,
|
|
86
88
|
}: Readonly<InsetsContainerProps>) {
|
|
87
|
-
const safeAreaInsets =
|
|
89
|
+
const safeAreaInsets = useContext(SafeAreaInsetsContext) ?? ZERO_INSETS;
|
|
88
90
|
|
|
89
91
|
const finalInsets = useMemo(() => {
|
|
90
92
|
return {
|