@remix-run/ui 0.3.0 → 0.4.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/README.md +50 -164
- package/dist/accordion/index.d.ts +46 -0
- package/dist/accordion/index.js +142 -0
- package/dist/accordion/index.js.map +1 -0
- package/dist/accordion/primitives.d.ts +104 -0
- package/dist/accordion/primitives.js +312 -0
- package/dist/accordion/primitives.js.map +1 -0
- package/dist/{components/anchor/anchor.js → anchor/index.js} +1 -1
- package/dist/anchor/index.js.map +1 -0
- package/dist/animation/demos/reordering.js +9 -6
- package/dist/animation/demos/reordering.js.map +1 -1
- package/dist/{components/breadcrumbs/breadcrumbs.js → breadcrumbs/index.js} +19 -19
- package/dist/breadcrumbs/index.js.map +1 -0
- package/dist/button/index.d.ts +15 -0
- package/dist/button/index.js +128 -0
- package/dist/button/index.js.map +1 -0
- package/dist/checkbox/index.d.ts +14 -0
- package/dist/checkbox/index.js +125 -0
- package/dist/checkbox/index.js.map +1 -0
- package/dist/combobox/index.d.ts +21 -0
- package/dist/combobox/index.js +58 -0
- package/dist/combobox/index.js.map +1 -0
- package/dist/{components/combobox/combobox.d.ts → combobox/primitives.d.ts} +3 -7
- package/dist/{components/combobox/combobox.js → combobox/primitives.js} +8 -61
- package/dist/combobox/primitives.js.map +1 -0
- package/dist/input/index.d.ts +13 -0
- package/dist/input/index.js +121 -0
- package/dist/input/index.js.map +1 -0
- package/dist/listbox/flash-attribute.js.map +1 -0
- package/dist/{components/listbox/listbox.d.ts → listbox/index.d.ts} +2 -6
- package/dist/{components/listbox/listbox.js → listbox/index.js} +4 -82
- package/dist/listbox/index.js.map +1 -0
- package/dist/menu/hover-aim.js.map +1 -0
- package/dist/menu/index.d.ts +42 -0
- package/dist/menu/index.js +250 -0
- package/dist/menu/index.js.map +1 -0
- package/dist/{components/menu/menu.d.ts → menu/primitives.d.ts} +3 -32
- package/dist/{components/menu/menu.js → menu/primitives.js} +97 -314
- package/dist/menu/primitives.js.map +1 -0
- package/dist/{components/popover/popover.d.ts → popover/index.d.ts} +2 -4
- package/dist/{components/popover/popover.js → popover/index.js} +5 -48
- package/dist/popover/index.js.map +1 -0
- package/dist/{interactions/outside-click/outside-click-mixin.js → popover/outside-click.js} +1 -1
- package/dist/popover/outside-click.js.map +1 -0
- package/dist/popover/scroll-lock.d.ts +1 -0
- package/dist/{utils → popover}/scroll-lock.js +0 -18
- package/dist/popover/scroll-lock.js.map +1 -0
- package/dist/radio/index.d.ts +12 -0
- package/dist/radio/index.js +77 -0
- package/dist/radio/index.js.map +1 -0
- package/dist/runtime/reconcile.js +11 -5
- package/dist/runtime/reconcile.js.map +1 -1
- package/dist/runtime/vdom.js +3 -0
- package/dist/runtime/vdom.js.map +1 -1
- package/dist/select/index.d.ts +19 -0
- package/dist/select/index.js +95 -0
- package/dist/select/index.js.map +1 -0
- package/dist/select/keydown.js.map +1 -0
- package/dist/{components/select/select.d.ts → select/primitives.d.ts} +4 -6
- package/dist/{components/select/select.js → select/primitives.js} +11 -63
- package/dist/select/primitives.js.map +1 -0
- package/dist/server/stream.js +2 -2
- package/dist/server/stream.js.map +1 -1
- package/dist/shared/focus-styles.d.ts +1 -0
- package/dist/shared/focus-styles.js +2 -0
- package/dist/shared/focus-styles.js.map +1 -0
- package/dist/shared/icons.d.ts +9 -0
- package/dist/shared/icons.js +42 -0
- package/dist/shared/icons.js.map +1 -0
- package/dist/shared/listbox-popover-styles.d.ts +6 -0
- package/dist/shared/listbox-popover-styles.js +137 -0
- package/dist/shared/listbox-popover-styles.js.map +1 -0
- package/dist/shared/style-values.d.ts +78 -0
- package/dist/{theme/presets/rmx-01/index.js → shared/style-values.js} +3 -34
- package/dist/shared/style-values.js.map +1 -0
- package/dist/{interactions/typeahead/typeahead-mixin.js → shared/typeahead.js} +1 -1
- package/dist/shared/typeahead.js.map +1 -0
- package/dist/shared/wait-for-css-transition.js.map +1 -0
- package/dist/shared/wait.js.map +1 -0
- package/dist/tabs/index.d.ts +32 -0
- package/dist/tabs/index.js +157 -0
- package/dist/tabs/index.js.map +1 -0
- package/dist/tabs/primitives.d.ts +57 -0
- package/dist/tabs/primitives.js +238 -0
- package/dist/tabs/primitives.js.map +1 -0
- package/dist/toggle/index.d.ts +9 -0
- package/dist/toggle/index.js +108 -0
- package/dist/toggle/index.js.map +1 -0
- package/dist/toggle/primitives.d.ts +29 -0
- package/dist/toggle/primitives.js +127 -0
- package/dist/toggle/primitives.js.map +1 -0
- package/package.json +73 -44
- package/src/{components/accordion → accordion}/README.md +50 -14
- package/src/accordion/index.tsx +285 -0
- package/src/accordion/primitives.tsx +512 -0
- package/src/{components/anchor → anchor}/README.md +37 -2
- package/src/animation/demos/reordering.tsx +9 -6
- package/src/{components/breadcrumbs → breadcrumbs}/README.md +4 -4
- package/src/{components/breadcrumbs/breadcrumbs.tsx → breadcrumbs/index.tsx} +18 -18
- package/src/button/README.md +44 -0
- package/src/button/index.ts +168 -0
- package/src/checkbox/README.md +59 -0
- package/src/checkbox/index.ts +162 -0
- package/src/{components/combobox → combobox}/README.md +58 -9
- package/src/combobox/index.tsx +112 -0
- package/src/{components/combobox/combobox.tsx → combobox/primitives.tsx} +5 -91
- package/src/input/README.md +52 -0
- package/src/input/index.ts +147 -0
- package/src/{components/listbox → listbox}/README.md +9 -41
- package/src/{components/listbox/listbox.ts → listbox/index.ts} +2 -87
- package/src/{components/menu → menu}/README.md +55 -14
- package/src/menu/index.tsx +354 -0
- package/src/{components/menu/menu.tsx → menu/primitives.tsx} +99 -413
- package/src/{components/popover → popover}/README.md +20 -39
- package/src/{components/popover/popover.ts → popover/index.ts} +3 -57
- package/src/{utils → popover}/scroll-lock.ts +0 -28
- package/src/radio/README.md +53 -0
- package/src/radio/index.ts +100 -0
- package/src/runtime/demos/readme.demo.tsx +16 -14
- package/src/runtime/reconcile.ts +11 -5
- package/src/runtime/vdom.ts +3 -0
- package/src/{components/select → select}/README.md +29 -19
- package/src/select/index.tsx +159 -0
- package/src/{components/select/select.tsx → select/primitives.tsx} +10 -98
- package/src/server/stream.ts +3 -3
- package/src/shared/focus-styles.ts +2 -0
- package/src/shared/icons.tsx +62 -0
- package/src/shared/listbox-popover-styles.ts +146 -0
- package/src/shared/style-values.ts +165 -0
- package/src/tabs/README.md +141 -0
- package/src/tabs/index.tsx +244 -0
- package/src/tabs/primitives.ts +365 -0
- package/src/toggle/README.md +56 -0
- package/src/toggle/index.tsx +134 -0
- package/src/toggle/primitives.ts +192 -0
- package/dist/animation/demos/animation.demo.d.ts +0 -5
- package/dist/animation/demos/animation.demo.js +0 -92
- package/dist/animation/demos/animation.demo.js.map +0 -1
- package/dist/animation/demos/spring.demo.d.ts +0 -6
- package/dist/animation/demos/spring.demo.js +0 -304
- package/dist/animation/demos/spring.demo.js.map +0 -1
- package/dist/components/accordion/accordion.d.ts +0 -92
- package/dist/components/accordion/accordion.js +0 -335
- package/dist/components/accordion/accordion.js.map +0 -1
- package/dist/components/accordion/demos/card.demo.d.ts +0 -7
- package/dist/components/accordion/demos/card.demo.js +0 -59
- package/dist/components/accordion/demos/card.demo.js.map +0 -1
- package/dist/components/accordion/demos/multiple.demo.d.ts +0 -7
- package/dist/components/accordion/demos/multiple.demo.js +0 -20
- package/dist/components/accordion/demos/multiple.demo.js.map +0 -1
- package/dist/components/accordion/demos/overview.demo.d.ts +0 -7
- package/dist/components/accordion/demos/overview.demo.js +0 -20
- package/dist/components/accordion/demos/overview.demo.js.map +0 -1
- package/dist/components/anchor/anchor.js.map +0 -1
- package/dist/components/breadcrumbs/basic.demo.d.ts +0 -6
- package/dist/components/breadcrumbs/basic.demo.js +0 -15
- package/dist/components/breadcrumbs/basic.demo.js.map +0 -1
- package/dist/components/breadcrumbs/breadcrumbs.js.map +0 -1
- package/dist/components/breadcrumbs/separator.demo.d.ts +0 -6
- package/dist/components/breadcrumbs/separator.demo.js +0 -15
- package/dist/components/breadcrumbs/separator.demo.js.map +0 -1
- package/dist/components/button/button.d.ts +0 -105
- package/dist/components/button/button.js +0 -207
- package/dist/components/button/button.js.map +0 -1
- package/dist/components/button/demos/aliases.demo.d.ts +0 -7
- package/dist/components/button/demos/aliases.demo.js +0 -19
- package/dist/components/button/demos/aliases.demo.js.map +0 -1
- package/dist/components/button/demos/basic.demo.d.ts +0 -7
- package/dist/components/button/demos/basic.demo.js +0 -20
- package/dist/components/button/demos/basic.demo.js.map +0 -1
- package/dist/components/button/demos/states.demo.d.ts +0 -7
- package/dist/components/button/demos/states.demo.js +0 -30
- package/dist/components/button/demos/states.demo.js.map +0 -1
- package/dist/components/combobox/combobox.js.map +0 -1
- package/dist/components/combobox/overview.demo.d.ts +0 -7
- package/dist/components/combobox/overview.demo.js +0 -154
- package/dist/components/combobox/overview.demo.js.map +0 -1
- package/dist/components/glyph/glyph.d.ts +0 -14
- package/dist/components/glyph/glyph.js +0 -65
- package/dist/components/glyph/glyph.js.map +0 -1
- package/dist/components/listbox/listbox.js.map +0 -1
- package/dist/components/listbox/overview.demo.d.ts +0 -7
- package/dist/components/listbox/overview.demo.js +0 -65
- package/dist/components/listbox/overview.demo.js.map +0 -1
- package/dist/components/menu/demos/bubbling.demo.d.ts +0 -6
- package/dist/components/menu/demos/bubbling.demo.js +0 -16
- package/dist/components/menu/demos/bubbling.demo.js.map +0 -1
- package/dist/components/menu/demos/context-trigger.demo.d.ts +0 -7
- package/dist/components/menu/demos/context-trigger.demo.js +0 -87
- package/dist/components/menu/demos/context-trigger.demo.js.map +0 -1
- package/dist/components/menu/demos/overview.demo.d.ts +0 -7
- package/dist/components/menu/demos/overview.demo.js +0 -33
- package/dist/components/menu/demos/overview.demo.js.map +0 -1
- package/dist/components/menu/hover-aim.js.map +0 -1
- package/dist/components/menu/menu.js.map +0 -1
- package/dist/components/popover/overview.demo.d.ts +0 -7
- package/dist/components/popover/overview.demo.js +0 -65
- package/dist/components/popover/overview.demo.js.map +0 -1
- package/dist/components/popover/popover.js.map +0 -1
- package/dist/components/select/deconstructed.demo.d.ts +0 -7
- package/dist/components/select/deconstructed.demo.js +0 -54
- package/dist/components/select/deconstructed.demo.js.map +0 -1
- package/dist/components/select/overview.demo.d.ts +0 -6
- package/dist/components/select/overview.demo.js +0 -28
- package/dist/components/select/overview.demo.js.map +0 -1
- package/dist/components/select/select.js.map +0 -1
- package/dist/components/separator/separator.d.ts +0 -2
- package/dist/components/separator/separator.js +0 -15
- package/dist/components/separator/separator.js.map +0 -1
- package/dist/components/tabs/tabs.d.ts +0 -78
- package/dist/components/tabs/tabs.js +0 -339
- package/dist/components/tabs/tabs.js.map +0 -1
- package/dist/interactions/keydown/keydown.js.map +0 -1
- package/dist/interactions/outside-click/outside-click-mixin.js.map +0 -1
- package/dist/interactions/typeahead/typeahead-mixin.js.map +0 -1
- package/dist/runtime/demos/basic.demo.d.ts +0 -6
- package/dist/runtime/demos/basic.demo.js +0 -16
- package/dist/runtime/demos/basic.demo.js.map +0 -1
- package/dist/runtime/demos/controlled-uncontrolled-values.demo.d.ts +0 -6
- package/dist/runtime/demos/controlled-uncontrolled-values.demo.js +0 -77
- package/dist/runtime/demos/controlled-uncontrolled-values.demo.js.map +0 -1
- package/dist/runtime/demos/keyed-list.demo.d.ts +0 -6
- package/dist/runtime/demos/keyed-list.demo.js +0 -62
- package/dist/runtime/demos/keyed-list.demo.js.map +0 -1
- package/dist/runtime/demos/readme.demo.d.ts +0 -5
- package/dist/runtime/demos/readme.demo.js +0 -396
- package/dist/runtime/demos/readme.demo.js.map +0 -1
- package/dist/theme/contract.d.ts +0 -61
- package/dist/theme/contract.js +0 -131
- package/dist/theme/contract.js.map +0 -1
- package/dist/theme/glyph-contract.d.ts +0 -11
- package/dist/theme/glyph-contract.js +0 -34
- package/dist/theme/glyph-contract.js.map +0 -1
- package/dist/theme/presets/rmx-01/glyphs.d.ts +0 -2
- package/dist/theme/presets/rmx-01/glyphs.js +0 -252
- package/dist/theme/presets/rmx-01/glyphs.js.map +0 -1
- package/dist/theme/presets/rmx-01/index.d.ts +0 -4
- package/dist/theme/presets/rmx-01/index.js.map +0 -1
- package/dist/theme/runtime.d.ts +0 -2
- package/dist/theme/runtime.js +0 -84
- package/dist/theme/runtime.js.map +0 -1
- package/dist/theme/theme.d.ts +0 -6
- package/dist/theme/theme.js +0 -5
- package/dist/theme/theme.js.map +0 -1
- package/dist/utils/flash-attribute.js.map +0 -1
- package/dist/utils/scroll-lock.d.ts +0 -3
- package/dist/utils/scroll-lock.js.map +0 -1
- package/dist/utils/wait-for-css-transition.js.map +0 -1
- package/dist/utils/wait.js.map +0 -1
- package/src/animation/demos/animation.demo.tsx +0 -194
- package/src/animation/demos/spring.demo.tsx +0 -385
- package/src/components/accordion/accordion.tsx +0 -565
- package/src/components/accordion/demos/card.demo.tsx +0 -114
- package/src/components/accordion/demos/multiple.demo.tsx +0 -57
- package/src/components/accordion/demos/overview.demo.tsx +0 -57
- package/src/components/breadcrumbs/basic.demo.tsx +0 -18
- package/src/components/breadcrumbs/separator.demo.tsx +0 -19
- package/src/components/button/README.md +0 -44
- package/src/components/button/button.tsx +0 -286
- package/src/components/button/demos/aliases.demo.tsx +0 -28
- package/src/components/button/demos/basic.demo.tsx +0 -31
- package/src/components/button/demos/states.demo.tsx +0 -53
- package/src/components/combobox/overview.demo.tsx +0 -200
- package/src/components/glyph/README.md +0 -72
- package/src/components/glyph/glyph.tsx +0 -110
- package/src/components/listbox/overview.demo.tsx +0 -102
- package/src/components/menu/demos/bubbling.demo.tsx +0 -35
- package/src/components/menu/demos/context-trigger.demo.tsx +0 -133
- package/src/components/menu/demos/overview.demo.tsx +0 -77
- package/src/components/popover/overview.demo.tsx +0 -144
- package/src/components/select/deconstructed.demo.tsx +0 -96
- package/src/components/select/overview.demo.tsx +0 -52
- package/src/components/separator/separator.ts +0 -19
- package/src/components/tabs/README.md +0 -105
- package/src/components/tabs/tabs.tsx +0 -504
- package/src/runtime/demos/basic.demo.tsx +0 -21
- package/src/runtime/demos/controlled-uncontrolled-values.demo.tsx +0 -177
- package/src/runtime/demos/keyed-list.demo.tsx +0 -94
- package/src/theme/README.md +0 -103
- package/src/theme/contract.ts +0 -215
- package/src/theme/glyph-contract.ts +0 -59
- package/src/theme/presets/rmx-01/glyphs.tsx +0 -308
- package/src/theme/presets/rmx-01/index.ts +0 -123
- package/src/theme/runtime.ts +0 -119
- package/src/theme/theme.ts +0 -15
- package/src/utils/scroll-lock/README.md +0 -33
- /package/dist/{components/anchor/anchor.d.ts → anchor/index.d.ts} +0 -0
- /package/dist/{components/breadcrumbs/breadcrumbs.d.ts → breadcrumbs/index.d.ts} +0 -0
- /package/dist/{utils → listbox}/flash-attribute.d.ts +0 -0
- /package/dist/{utils → listbox}/flash-attribute.js +0 -0
- /package/dist/{components/menu → menu}/hover-aim.d.ts +0 -0
- /package/dist/{components/menu → menu}/hover-aim.js +0 -0
- /package/dist/{interactions/outside-click/outside-click-mixin.d.ts → popover/outside-click.d.ts} +0 -0
- /package/dist/{interactions/keydown → select}/keydown.d.ts +0 -0
- /package/dist/{interactions/keydown → select}/keydown.js +0 -0
- /package/dist/{interactions/typeahead/typeahead-mixin.d.ts → shared/typeahead.d.ts} +0 -0
- /package/dist/{utils → shared}/wait-for-css-transition.d.ts +0 -0
- /package/dist/{utils → shared}/wait-for-css-transition.js +0 -0
- /package/dist/{utils → shared}/wait.d.ts +0 -0
- /package/dist/{utils → shared}/wait.js +0 -0
- /package/src/{components/anchor/anchor.ts → anchor/index.ts} +0 -0
- /package/src/{utils → listbox}/flash-attribute.ts +0 -0
- /package/src/{components/menu → menu}/hover-aim.ts +0 -0
- /package/src/{interactions/outside-click/outside-click-mixin.ts → popover/outside-click.ts} +0 -0
- /package/src/{interactions/keydown → select}/keydown.ts +0 -0
- /package/src/{interactions/typeahead/typeahead-mixin.ts → shared/typeahead.ts} +0 -0
- /package/src/{utils → shared}/wait-for-css-transition.ts +0 -0
- /package/src/{utils → shared}/wait.ts +0 -0
|
@@ -0,0 +1,128 @@
|
|
|
1
|
+
import { createMixin, css } from '@remix-run/ui';
|
|
2
|
+
import { renderMixinElement } from "../runtime/mixins/mixin.js";
|
|
3
|
+
const buttonDefaultAttrs = createMixin((handle, hostType) => (props) => {
|
|
4
|
+
if (hostType !== 'button' || props.type !== undefined) {
|
|
5
|
+
return handle.element;
|
|
6
|
+
}
|
|
7
|
+
return renderMixinElement(handle.element, {
|
|
8
|
+
...props,
|
|
9
|
+
type: 'button',
|
|
10
|
+
});
|
|
11
|
+
})();
|
|
12
|
+
const baseStyle = css({
|
|
13
|
+
'--rmx-button-shadow': '0 0 0 0 rgba(0, 0, 0, 0)',
|
|
14
|
+
'--rmx-button-focus-shadow': '0 0 0 1px #3573F6, var(--rmx-button-shadow), 0 0 0 4px rgba(53, 115, 246, 0.1), 0 6px 32px 4px rgba(53, 115, 246, 0.08), inset 0 0 8px 1px rgba(53, 115, 246, 0.05)',
|
|
15
|
+
appearance: 'none',
|
|
16
|
+
margin: 0,
|
|
17
|
+
boxSizing: 'border-box',
|
|
18
|
+
cursor: 'revert',
|
|
19
|
+
display: 'inline-flex',
|
|
20
|
+
alignItems: 'center',
|
|
21
|
+
justifyContent: 'center',
|
|
22
|
+
flexDirection: 'row',
|
|
23
|
+
gap: '4px',
|
|
24
|
+
paddingBlock: 0,
|
|
25
|
+
width: 'max-content',
|
|
26
|
+
maxWidth: '100%',
|
|
27
|
+
borderRadius: '999px',
|
|
28
|
+
fontFamily: '"Inter Variable", Inter, ui-sans-serif, system-ui, sans-serif',
|
|
29
|
+
fontStyle: 'normal',
|
|
30
|
+
fontWeight: 500,
|
|
31
|
+
fontFeatureSettings: '"cv01" on, "ss01" on',
|
|
32
|
+
letterSpacing: 0,
|
|
33
|
+
whiteSpace: 'nowrap',
|
|
34
|
+
textDecoration: 'none',
|
|
35
|
+
userSelect: 'none',
|
|
36
|
+
WebkitUserSelect: 'none',
|
|
37
|
+
verticalAlign: 'top',
|
|
38
|
+
boxShadow: 'var(--rmx-button-shadow)',
|
|
39
|
+
'&:focus-visible': {
|
|
40
|
+
outline: 0,
|
|
41
|
+
boxShadow: 'var(--rmx-button-focus-shadow)',
|
|
42
|
+
},
|
|
43
|
+
'&:disabled, &[aria-disabled="true"]': {
|
|
44
|
+
cursor: 'not-allowed',
|
|
45
|
+
opacity: 0.55,
|
|
46
|
+
},
|
|
47
|
+
});
|
|
48
|
+
const mediumStyle = css({
|
|
49
|
+
height: '26px',
|
|
50
|
+
minHeight: '26px',
|
|
51
|
+
paddingInline: '12px',
|
|
52
|
+
fontSize: '12px',
|
|
53
|
+
lineHeight: '17px',
|
|
54
|
+
'--rmx-button-neutral-shadow-alpha': '0.03',
|
|
55
|
+
});
|
|
56
|
+
const largeStyle = css({
|
|
57
|
+
height: '30px',
|
|
58
|
+
minHeight: '30px',
|
|
59
|
+
paddingInline: '12px',
|
|
60
|
+
fontSize: '13px',
|
|
61
|
+
lineHeight: '20px',
|
|
62
|
+
'--rmx-button-neutral-shadow-alpha': '0.04',
|
|
63
|
+
});
|
|
64
|
+
const neutralStyle = css({
|
|
65
|
+
background: '#FCFCFC',
|
|
66
|
+
border: '1px solid rgba(0, 0, 0, 0.08)',
|
|
67
|
+
'--rmx-button-shadow': '0 -2px 0 -2px rgba(0, 0, 0, 0.06), 0 0 0 1px rgba(255, 255, 255, 0.75), 0 1px 0 #FFFFFF, 0 2px 4px -1px rgb(0 0 0 / var(--rmx-button-neutral-shadow-alpha)), inset 0 2px 0 #FFFFFF, inset 0 -1px 0 rgba(0, 0, 0, 0.05)',
|
|
68
|
+
color: '#101010',
|
|
69
|
+
textShadow: '0 1px 0 #FFFFFF',
|
|
70
|
+
'&:hover:not(:disabled):not([aria-disabled="true"])': {
|
|
71
|
+
background: '#FFFFFF',
|
|
72
|
+
borderColor: 'rgba(0, 0, 0, 0.1)',
|
|
73
|
+
'--rmx-button-shadow': '0 -2px 0 -2px rgba(0, 0, 0, 0.06), 0 0 0 1px rgba(255, 255, 255, 0.8), 0 1px 0 #FFFFFF, 0 3px 6px -2px rgb(0 0 0 / calc(var(--rmx-button-neutral-shadow-alpha) + 0.03)), inset 0 2px 0 #FFFFFF, inset 0 -1px 0 rgba(0, 0, 0, 0.05)',
|
|
74
|
+
},
|
|
75
|
+
'&:active:not(:disabled):not([aria-disabled="true"]), &[aria-pressed="true"]:not(:disabled):not([aria-disabled="true"])': {
|
|
76
|
+
background: '#F7F7F7',
|
|
77
|
+
borderColor: 'rgba(0, 0, 0, 0.12)',
|
|
78
|
+
'--rmx-button-shadow': '0 0 0 1px rgba(255, 255, 255, 0.65), inset 0 1px 2px rgba(0, 0, 0, 0.08), inset 0 -1px 0 rgba(255, 255, 255, 0.8)',
|
|
79
|
+
textShadow: 'none',
|
|
80
|
+
},
|
|
81
|
+
});
|
|
82
|
+
const primaryStyle = css({
|
|
83
|
+
background: 'radial-gradient(50% 50% at 50% 0%, rgba(255, 255, 255, 0.2) 0%, rgba(255, 255, 255, 0) 100%), radial-gradient(49.59% 37.11% at 50.41% 101.56%, rgba(255, 255, 255, 0.15) 0%, rgba(255, 255, 255, 0) 66.46%), #101010',
|
|
84
|
+
border: 0,
|
|
85
|
+
'--rmx-button-shadow': '0 16px 16px -8px rgba(0, 0, 0, 0.1), 0 8px 8px -4px rgba(0, 0, 0, 0.1), 0 4px 4px -2px rgba(0, 0, 0, 0.1), 0 2px 2px -1px rgba(0, 0, 0, 0.1), inset 0 0 4px 2px #101010, inset 0 0 4px 2px rgba(255, 255, 255, 0.1), inset 0 0 12px -6px rgba(255, 255, 255, 0.75)',
|
|
86
|
+
color: '#FFFFFF',
|
|
87
|
+
textShadow: '0 1px 1px #000000',
|
|
88
|
+
'&:hover:not(:disabled):not([aria-disabled="true"])': {
|
|
89
|
+
background: 'radial-gradient(50% 50% at 50% 0%, rgba(255, 255, 255, 0.24) 0%, rgba(255, 255, 255, 0) 100%), radial-gradient(49.59% 37.11% at 50.41% 101.56%, rgba(255, 255, 255, 0.18) 0%, rgba(255, 255, 255, 0) 66.46%), #171717',
|
|
90
|
+
'--rmx-button-shadow': '0 18px 18px -10px rgba(0, 0, 0, 0.14), 0 8px 8px -4px rgba(0, 0, 0, 0.12), 0 4px 4px -2px rgba(0, 0, 0, 0.1), 0 2px 2px -1px rgba(0, 0, 0, 0.1), inset 0 0 4px 2px #101010, inset 0 0 4px 2px rgba(255, 255, 255, 0.13), inset 0 0 12px -6px rgba(255, 255, 255, 0.85)',
|
|
91
|
+
},
|
|
92
|
+
'&:active:not(:disabled):not([aria-disabled="true"]), &[aria-pressed="true"]:not(:disabled):not([aria-disabled="true"])': {
|
|
93
|
+
background: 'radial-gradient(50% 50% at 50% 0%, rgba(255, 255, 255, 0.12) 0%, rgba(255, 255, 255, 0) 100%), radial-gradient(49.59% 37.11% at 50.41% 101.56%, rgba(255, 255, 255, 0.08) 0%, rgba(255, 255, 255, 0) 66.46%), #080808',
|
|
94
|
+
'--rmx-button-shadow': '0 2px 2px -1px rgba(0, 0, 0, 0.14), inset 0 0 4px 2px #050505, inset 0 1px 2px rgba(0, 0, 0, 0.45), inset 0 0 10px -6px rgba(255, 255, 255, 0.55)',
|
|
95
|
+
textShadow: '0 1px 1px #000000',
|
|
96
|
+
},
|
|
97
|
+
'&:active:not(:disabled):not([aria-disabled="true"])': {
|
|
98
|
+
transform: 'translateY(1px)',
|
|
99
|
+
},
|
|
100
|
+
});
|
|
101
|
+
const ghostStyle = css({
|
|
102
|
+
background: 'transparent',
|
|
103
|
+
border: '1px solid transparent',
|
|
104
|
+
'--rmx-button-shadow': '0 0 0 0 rgba(0, 0, 0, 0)',
|
|
105
|
+
color: '#101010',
|
|
106
|
+
textShadow: 'none',
|
|
107
|
+
'&:hover:not(:disabled):not([aria-disabled="true"])': {
|
|
108
|
+
background: 'rgba(16, 16, 16, 0.05)',
|
|
109
|
+
},
|
|
110
|
+
'&:active:not(:disabled):not([aria-disabled="true"]), &[aria-pressed="true"]:not(:disabled):not([aria-disabled="true"])': {
|
|
111
|
+
background: 'rgba(16, 16, 16, 0.08)',
|
|
112
|
+
},
|
|
113
|
+
});
|
|
114
|
+
const sizeStyles = {
|
|
115
|
+
md: mediumStyle,
|
|
116
|
+
lg: largeStyle,
|
|
117
|
+
};
|
|
118
|
+
const toneStyles = {
|
|
119
|
+
neutral: neutralStyle,
|
|
120
|
+
primary: primaryStyle,
|
|
121
|
+
ghost: ghostStyle,
|
|
122
|
+
};
|
|
123
|
+
export function button(options = {}) {
|
|
124
|
+
let { size = 'md', tone = 'neutral' } = options;
|
|
125
|
+
return [buttonDefaultAttrs, baseStyle, sizeStyles[size], toneStyles[tone]];
|
|
126
|
+
}
|
|
127
|
+
export default button;
|
|
128
|
+
//# sourceMappingURL=index.js.map
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"file":"index.js","sourceRoot":"","sources":["../../src/button/index.ts"],"names":[],"mappings":"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"}
|
|
@@ -0,0 +1,14 @@
|
|
|
1
|
+
import type { CSSMixinDescriptor, ElementProps, MixinDescriptor } from '@remix-run/ui';
|
|
2
|
+
export type CheckboxSize = 'md' | 'lg';
|
|
3
|
+
export type CheckboxState = 'checked' | 'mixed' | 'unchecked';
|
|
4
|
+
export interface CheckboxOptions {
|
|
5
|
+
size?: CheckboxSize;
|
|
6
|
+
state?: CheckboxState;
|
|
7
|
+
}
|
|
8
|
+
type CheckboxMixin = readonly [
|
|
9
|
+
MixinDescriptor<Element, [state?: CheckboxState], ElementProps>,
|
|
10
|
+
CSSMixinDescriptor,
|
|
11
|
+
CSSMixinDescriptor
|
|
12
|
+
];
|
|
13
|
+
export declare function checkbox(options?: CheckboxOptions): CheckboxMixin;
|
|
14
|
+
export default checkbox;
|
|
@@ -0,0 +1,125 @@
|
|
|
1
|
+
import { createMixin, css } from '@remix-run/ui';
|
|
2
|
+
import { renderMixinElement } from "../runtime/mixins/mixin.js";
|
|
3
|
+
import { controlFocusShadow } from "../shared/focus-styles.js";
|
|
4
|
+
const checkedSelector = '&:checked, &[aria-checked="true"], &[data-state="checked"]';
|
|
5
|
+
const mixedSelector = '&:indeterminate, &[indeterminate], &[aria-checked="mixed"], &[data-state="mixed"]';
|
|
6
|
+
const checkedMarkSelector = '&:checked::before, &[aria-checked="true"]::before, &[data-state="checked"]::before';
|
|
7
|
+
const mixedMarkSelector = '&:indeterminate::before, &[indeterminate]::before, &[aria-checked="mixed"]::before, &[data-state="mixed"]::before';
|
|
8
|
+
const enabledSelector = ':not(:disabled):not([aria-disabled="true"])';
|
|
9
|
+
const checkedActiveSelector = '&:checked:active:not(:disabled):not([aria-disabled="true"]), &[aria-checked="true"]:active:not(:disabled):not([aria-disabled="true"]), &[data-state="checked"]:active:not(:disabled):not([aria-disabled="true"])';
|
|
10
|
+
const mixedActiveSelector = '&:indeterminate:active:not(:disabled):not([aria-disabled="true"]), &[indeterminate]:active:not(:disabled):not([aria-disabled="true"]), &[aria-checked="mixed"]:active:not(:disabled):not([aria-disabled="true"]), &[data-state="mixed"]:active:not(:disabled):not([aria-disabled="true"])';
|
|
11
|
+
const checkIconUrl = "url(\"data:image/svg+xml,%3Csvg width='12' height='12' viewBox='0 0 12 12' fill='none' xmlns='http://www.w3.org/2000/svg'%3E%3Cg filter='url(%23filter0_d_2_2264)'%3E%3Cpath d='M2.75 5.76562L5.10156 8.25L9.23438 1.75' stroke='white' stroke-width='1.5' stroke-linecap='round' stroke-linejoin='round'/%3E%3Cpath d='M2.75 5.76562L5.10156 8.25L9.23438 1.75' stroke='url(%23paint0_linear_2_2264)' stroke-opacity='0.1' stroke-width='1.5' stroke-linecap='round' stroke-linejoin='round'/%3E%3C/g%3E%3Cdefs%3E%3Cfilter id='filter0_d_2_2264' x='0' y='0' width='11.9845' height='12' filterUnits='userSpaceOnUse' color-interpolation-filters='sRGB'%3E%3CfeFlood flood-opacity='0' result='BackgroundImageFix'/%3E%3CfeColorMatrix in='SourceAlpha' type='matrix' values='0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 127 0' result='hardAlpha'/%3E%3CfeOffset dy='1'/%3E%3CfeGaussianBlur stdDeviation='1'/%3E%3CfeComposite in2='hardAlpha' operator='out'/%3E%3CfeColorMatrix type='matrix' values='0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0.4 0'/%3E%3CfeBlend mode='overlay' in2='BackgroundImageFix' result='effect1_dropShadow_2_2264'/%3E%3CfeBlend mode='normal' in='SourceGraphic' in2='effect1_dropShadow_2_2264' result='shape'/%3E%3C/filter%3E%3ClinearGradient id='paint0_linear_2_2264' x1='5.99219' y1='1.75' x2='5.99219' y2='8.25' gradientUnits='userSpaceOnUse'%3E%3Cstop offset='0.25' stop-color='%233573F6' stop-opacity='0'/%3E%3Cstop offset='1' stop-color='%233573F6'/%3E%3C/linearGradient%3E%3C/defs%3E%3C/svg%3E\")";
|
|
12
|
+
const checkboxAriaChecked = {
|
|
13
|
+
checked: 'true',
|
|
14
|
+
mixed: 'mixed',
|
|
15
|
+
unchecked: 'false',
|
|
16
|
+
};
|
|
17
|
+
const checkboxDefaultAttrs = createMixin((handle, hostType) => (state, props) => {
|
|
18
|
+
let stateProps = state === undefined
|
|
19
|
+
? props
|
|
20
|
+
: {
|
|
21
|
+
...props,
|
|
22
|
+
'aria-checked': props['aria-checked'] ?? checkboxAriaChecked[state],
|
|
23
|
+
'data-state': props['data-state'] ?? state,
|
|
24
|
+
};
|
|
25
|
+
if (hostType !== 'input' || stateProps.type !== undefined) {
|
|
26
|
+
return state === undefined ? handle.element : renderMixinElement(handle.element, stateProps);
|
|
27
|
+
}
|
|
28
|
+
return renderMixinElement(handle.element, {
|
|
29
|
+
...stateProps,
|
|
30
|
+
type: 'checkbox',
|
|
31
|
+
});
|
|
32
|
+
});
|
|
33
|
+
const baseStyle = css({
|
|
34
|
+
appearance: 'none',
|
|
35
|
+
WebkitAppearance: 'none',
|
|
36
|
+
margin: 0,
|
|
37
|
+
boxSizing: 'border-box',
|
|
38
|
+
position: 'relative',
|
|
39
|
+
display: 'inline-grid',
|
|
40
|
+
placeItems: 'center',
|
|
41
|
+
width: 'var(--rmx-checkbox-size)',
|
|
42
|
+
height: 'var(--rmx-checkbox-size)',
|
|
43
|
+
minWidth: 'var(--rmx-checkbox-size)',
|
|
44
|
+
minHeight: 'var(--rmx-checkbox-size)',
|
|
45
|
+
padding: 0,
|
|
46
|
+
border: 0,
|
|
47
|
+
borderRadius: 'var(--rmx-checkbox-radius)',
|
|
48
|
+
background: '#FFFFFF',
|
|
49
|
+
boxShadow: '0 2px 2px -1px rgba(0, 0, 0, 0.05), 0 3px 4px -1.5px rgba(0, 0, 0, 0.05), 0 4px 8px -2px rgba(0, 0, 0, 0.05), 0 5px 16px -2.5px rgba(0, 0, 0, 0.05), 0 0 0 1px rgba(0, 0, 0, 0.12)',
|
|
50
|
+
color: '#FFFFFF',
|
|
51
|
+
verticalAlign: 'middle',
|
|
52
|
+
flex: 'none',
|
|
53
|
+
'&::before': {
|
|
54
|
+
content: '""',
|
|
55
|
+
position: 'absolute',
|
|
56
|
+
opacity: 0,
|
|
57
|
+
pointerEvents: 'none',
|
|
58
|
+
},
|
|
59
|
+
'&:disabled, &[aria-disabled="true"]': {
|
|
60
|
+
opacity: 0.55,
|
|
61
|
+
},
|
|
62
|
+
[`${checkedSelector}, ${mixedSelector}`]: {
|
|
63
|
+
background: 'linear-gradient(180deg, rgba(0, 0, 0, 0) 24.52%, rgba(0, 0, 0, 0.1) 100%), #3573F6',
|
|
64
|
+
backgroundBlendMode: 'overlay, normal',
|
|
65
|
+
borderRadius: 'var(--rmx-checkbox-active-radius)',
|
|
66
|
+
boxShadow: '0 1px 1px -0.5px rgba(9, 68, 190, 0.12), 0 2px 2px -1px rgba(9, 68, 190, 0.12), 0 4px 4px -2px rgba(9, 68, 190, 0.12), 0 8px 8px -4px rgba(9, 68, 190, 0.12), 0 2px 8px rgba(53, 115, 246, 0.4), inset 0 0 3px 1px rgba(0, 0, 0, 0.1)',
|
|
67
|
+
},
|
|
68
|
+
[checkedMarkSelector]: {
|
|
69
|
+
opacity: 1,
|
|
70
|
+
left: '50%',
|
|
71
|
+
top: '50%',
|
|
72
|
+
width: 'var(--rmx-checkbox-check-size)',
|
|
73
|
+
height: 'var(--rmx-checkbox-check-size)',
|
|
74
|
+
background: `${checkIconUrl} center / contain no-repeat`,
|
|
75
|
+
transform: 'translate(-50%, calc(-50% + var(--rmx-checkbox-check-y)))',
|
|
76
|
+
},
|
|
77
|
+
[mixedMarkSelector]: {
|
|
78
|
+
opacity: 1,
|
|
79
|
+
left: '50%',
|
|
80
|
+
top: '50%',
|
|
81
|
+
width: 'var(--rmx-checkbox-mixed-width)',
|
|
82
|
+
height: 'var(--rmx-checkbox-mixed-height)',
|
|
83
|
+
border: 0,
|
|
84
|
+
borderRadius: '999px',
|
|
85
|
+
background: 'currentColor',
|
|
86
|
+
filter: 'drop-shadow(0 1px 2px rgba(0, 0, 0, 0.4))',
|
|
87
|
+
transform: 'translate(-50%, -50%)',
|
|
88
|
+
},
|
|
89
|
+
[`&:active${enabledSelector}`]: {
|
|
90
|
+
boxShadow: '0 1px 1px -0.5px rgba(0, 0, 0, 0.06), 0 0 0 1px rgba(0, 0, 0, 0.14), inset 0 1px 2px rgba(0, 0, 0, 0.08)',
|
|
91
|
+
},
|
|
92
|
+
[`${checkedActiveSelector}, ${mixedActiveSelector}`]: {
|
|
93
|
+
boxShadow: '0 1px 1px -0.5px rgba(9, 68, 190, 0.1), 0 2px 2px -1px rgba(9, 68, 190, 0.1), 0 4px 4px -2px rgba(9, 68, 190, 0.1), 0 6px 8px -4px rgba(9, 68, 190, 0.1), 0 2px 6px rgba(53, 115, 246, 0.32), inset 0 1px 2px rgba(0, 0, 0, 0.3), inset 0 0 3px 1px rgba(0, 0, 0, 0.12)',
|
|
94
|
+
},
|
|
95
|
+
'&:focus-visible': {
|
|
96
|
+
outline: 0,
|
|
97
|
+
boxShadow: controlFocusShadow,
|
|
98
|
+
},
|
|
99
|
+
});
|
|
100
|
+
const sizeStyles = {
|
|
101
|
+
md: css({
|
|
102
|
+
'--rmx-checkbox-size': '16px',
|
|
103
|
+
'--rmx-checkbox-radius': '4px',
|
|
104
|
+
'--rmx-checkbox-active-radius': '5px',
|
|
105
|
+
'--rmx-checkbox-check-size': '12px',
|
|
106
|
+
'--rmx-checkbox-check-y': '1px',
|
|
107
|
+
'--rmx-checkbox-mixed-width': '7px',
|
|
108
|
+
'--rmx-checkbox-mixed-height': '2px',
|
|
109
|
+
}),
|
|
110
|
+
lg: css({
|
|
111
|
+
'--rmx-checkbox-size': '20px',
|
|
112
|
+
'--rmx-checkbox-radius': '5px',
|
|
113
|
+
'--rmx-checkbox-active-radius': '6px',
|
|
114
|
+
'--rmx-checkbox-check-size': '15px',
|
|
115
|
+
'--rmx-checkbox-check-y': '1.25px',
|
|
116
|
+
'--rmx-checkbox-mixed-width': '9px',
|
|
117
|
+
'--rmx-checkbox-mixed-height': '2.25px',
|
|
118
|
+
}),
|
|
119
|
+
};
|
|
120
|
+
export function checkbox(options = {}) {
|
|
121
|
+
let { size = 'md', state } = options;
|
|
122
|
+
return [checkboxDefaultAttrs(state), baseStyle, sizeStyles[size]];
|
|
123
|
+
}
|
|
124
|
+
export default checkbox;
|
|
125
|
+
//# sourceMappingURL=index.js.map
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"file":"index.js","sourceRoot":"","sources":["../../src/checkbox/index.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,WAAW,EAAE,GAAG,EAAE,MAAM,eAAe,CAAA;AAEhD,OAAO,EAAE,kBAAkB,EAAE,MAAM,4BAA4B,CAAA;AAC/D,OAAO,EAAE,kBAAkB,EAAE,MAAM,2BAA2B,CAAA;AAgB9D,MAAM,eAAe,GAAG,4DAA4D,CAAA;AACpF,MAAM,aAAa,GACjB,mFAAmF,CAAA;AACrF,MAAM,mBAAmB,GACvB,oFAAoF,CAAA;AACtF,MAAM,iBAAiB,GACrB,mHAAmH,CAAA;AACrH,MAAM,eAAe,GAAG,6CAA6C,CAAA;AACrE,MAAM,qBAAqB,GACzB,kNAAkN,CAAA;AACpN,MAAM,mBAAmB,GACvB,2RAA2R,CAAA;AAC7R,MAAM,YAAY,GAChB,g9CAAg9C,CAAA;AAEl9C,MAAM,mBAAmB,GAAG;IAC1B,OAAO,EAAE,MAAM;IACf,KAAK,EAAE,OAAO;IACd,SAAS,EAAE,OAAO;CACkD,CAAA;AAEtE,MAAM,oBAAoB,GAAG,WAAW,CACtC,CAAC,MAAM,EAAE,QAAQ,EAAE,EAAE,CAAC,CAAC,KAAK,EAAE,KAAK,EAAE,EAAE;IACrC,IAAI,UAAU,GACZ,KAAK,KAAK,SAAS;QACjB,CAAC,CAAC,KAAK;QACP,CAAC,CAAC;YACE,GAAG,KAAK;YACR,cAAc,EAAE,KAAK,CAAC,cAAc,CAAC,IAAI,mBAAmB,CAAC,KAAK,CAAC;YACnE,YAAY,EAAE,KAAK,CAAC,YAAY,CAAC,IAAI,KAAK;SAC3C,CAAA;IAEP,IAAI,QAAQ,KAAK,OAAO,IAAI,UAAU,CAAC,IAAI,KAAK,SAAS,EAAE,CAAC;QAC1D,OAAO,KAAK,KAAK,SAAS,CAAC,CAAC,CAAC,MAAM,CAAC,OAAO,CAAC,CAAC,CAAC,kBAAkB,CAAC,MAAM,CAAC,OAAO,EAAE,UAAU,CAAC,CAAA;IAC9F,CAAC;IAED,OAAO,kBAAkB,CAAC,MAAM,CAAC,OAAO,EAAE;QACxC,GAAG,UAAU;QACb,IAAI,EAAE,UAAU;KACjB,CAAC,CAAA;AACJ,CAAC,CACF,CAAA;AAED,MAAM,SAAS,GAAuB,GAAG,CAAC;IACxC,UAAU,EAAE,MAAM;IAClB,gBAAgB,EAAE,MAAM;IACxB,MAAM,EAAE,CAAC;IACT,SAAS,EAAE,YAAY;IACvB,QAAQ,EAAE,UAAU;IACpB,OAAO,EAAE,aAAa;IACtB,UAAU,EAAE,QAAQ;IACpB,KAAK,EAAE,0BAA0B;IACjC,MAAM,EAAE,0BAA0B;IAClC,QAAQ,EAAE,0BAA0B;IACpC,SAAS,EAAE,0BAA0B;IACrC,OAAO,EAAE,CAAC;IACV,MAAM,EAAE,CAAC;IACT,YAAY,EAAE,4BAA4B;IAC1C,UAAU,EAAE,SAAS;IACrB,SAAS,EACP,oLAAoL;IACtL,KAAK,EAAE,SAAS;IAChB,aAAa,EAAE,QAAQ;IACvB,IAAI,EAAE,MAAM;IACZ,WAAW,EAAE;QACX,OAAO,EAAE,IAAI;QACb,QAAQ,EAAE,UAAU;QACpB,OAAO,EAAE,CAAC;QACV,aAAa,EAAE,MAAM;KACtB;IACD,qCAAqC,EAAE;QACrC,OAAO,EAAE,IAAI;KACd;IACD,CAAC,GAAG,eAAe,KAAK,aAAa,EAAE,CAAC,EAAE;QACxC,UAAU,EACR,oFAAoF;QACtF,mBAAmB,EAAE,iBAAiB;QACtC,YAAY,EAAE,mCAAmC;QACjD,SAAS,EACP,uOAAuO;KAC1O;IACD,CAAC,mBAAmB,CAAC,EAAE;QACrB,OAAO,EAAE,CAAC;QACV,IAAI,EAAE,KAAK;QACX,GAAG,EAAE,KAAK;QACV,KAAK,EAAE,gCAAgC;QACvC,MAAM,EAAE,gCAAgC;QACxC,UAAU,EAAE,GAAG,YAAY,6BAA6B;QACxD,SAAS,EAAE,2DAA2D;KACvE;IACD,CAAC,iBAAiB,CAAC,EAAE;QACnB,OAAO,EAAE,CAAC;QACV,IAAI,EAAE,KAAK;QACX,GAAG,EAAE,KAAK;QACV,KAAK,EAAE,iCAAiC;QACxC,MAAM,EAAE,kCAAkC;QAC1C,MAAM,EAAE,CAAC;QACT,YAAY,EAAE,OAAO;QACrB,UAAU,EAAE,cAAc;QAC1B,MAAM,EAAE,2CAA2C;QACnD,SAAS,EAAE,uBAAuB;KACnC;IACD,CAAC,WAAW,eAAe,EAAE,CAAC,EAAE;QAC9B,SAAS,EACP,0GAA0G;KAC7G;IACD,CAAC,GAAG,qBAAqB,KAAK,mBAAmB,EAAE,CAAC,EAAE;QACpD,SAAS,EACP,yQAAyQ;KAC5Q;IACD,iBAAiB,EAAE;QACjB,OAAO,EAAE,CAAC;QACV,SAAS,EAAE,kBAAkB;KAC9B;CACF,CAAC,CAAA;AAEF,MAAM,UAAU,GAAG;IACjB,EAAE,EAAE,GAAG,CAAC;QACN,qBAAqB,EAAE,MAAM;QAC7B,uBAAuB,EAAE,KAAK;QAC9B,8BAA8B,EAAE,KAAK;QACrC,2BAA2B,EAAE,MAAM;QACnC,wBAAwB,EAAE,KAAK;QAC/B,4BAA4B,EAAE,KAAK;QACnC,6BAA6B,EAAE,KAAK;KACrC,CAAC;IACF,EAAE,EAAE,GAAG,CAAC;QACN,qBAAqB,EAAE,MAAM;QAC7B,uBAAuB,EAAE,KAAK;QAC9B,8BAA8B,EAAE,KAAK;QACrC,2BAA2B,EAAE,MAAM;QACnC,wBAAwB,EAAE,QAAQ;QAClC,4BAA4B,EAAE,KAAK;QACnC,6BAA6B,EAAE,QAAQ;KACxC,CAAC;CACyD,CAAA;AAE7D,MAAM,UAAU,QAAQ,CAAC,UAA2B,EAAE;IACpD,IAAI,EAAE,IAAI,GAAG,IAAI,EAAE,KAAK,EAAE,GAAG,OAAO,CAAA;IACpC,OAAO,CAAC,oBAAoB,CAAC,KAAK,CAAC,EAAE,SAAS,EAAE,UAAU,CAAC,IAAI,CAAC,CAAC,CAAA;AACnE,CAAC;AAED,eAAe,QAAQ,CAAA"}
|
|
@@ -0,0 +1,21 @@
|
|
|
1
|
+
import type { CSSMixinDescriptor, Handle, Props, RemixNode } from '@remix-run/ui';
|
|
2
|
+
import type { SearchValue } from '../shared/typeahead.ts';
|
|
3
|
+
export interface ComboboxProps extends Omit<Props<'div'>, 'children'> {
|
|
4
|
+
children?: RemixNode;
|
|
5
|
+
defaultValue?: string | null;
|
|
6
|
+
disabled?: boolean;
|
|
7
|
+
inputId?: string;
|
|
8
|
+
name?: string;
|
|
9
|
+
placeholder?: string;
|
|
10
|
+
}
|
|
11
|
+
export interface ComboboxOptionProps extends Omit<Props<'div'>, 'children'> {
|
|
12
|
+
children?: RemixNode;
|
|
13
|
+
disabled?: boolean;
|
|
14
|
+
label: string;
|
|
15
|
+
searchValue?: SearchValue;
|
|
16
|
+
value: string;
|
|
17
|
+
}
|
|
18
|
+
export declare const inputStyle: CSSMixinDescriptor;
|
|
19
|
+
export declare const popoverStyle: CSSMixinDescriptor;
|
|
20
|
+
export declare function Combobox(handle: Handle<ComboboxProps>): () => RemixNode;
|
|
21
|
+
export declare function ComboboxOption(handle: Handle<ComboboxOptionProps>): () => RemixNode;
|
|
@@ -0,0 +1,58 @@
|
|
|
1
|
+
import { jsx as _jsx, jsxs as _jsxs } from "@remix-run/ui/jsx-runtime";
|
|
2
|
+
import { createElement, css } from '@remix-run/ui';
|
|
3
|
+
import * as combobox from '@remix-run/ui/combobox/primitives';
|
|
4
|
+
import { CheckIcon } from "../shared/icons.js";
|
|
5
|
+
import { listboxIndicatorStyle, listboxLabelStyle, listboxListStyle, listboxOptionStyle, popoverSurfaceStyle, } from "../shared/listbox-popover-styles.js";
|
|
6
|
+
import { componentStyleValues as styles } from "../shared/style-values.js";
|
|
7
|
+
const comboboxPopoverCss = css({
|
|
8
|
+
opacity: 0,
|
|
9
|
+
'&:popover-open': {
|
|
10
|
+
opacity: 1,
|
|
11
|
+
},
|
|
12
|
+
'&:not(:popover-open)': {
|
|
13
|
+
pointerEvents: 'none',
|
|
14
|
+
},
|
|
15
|
+
'&[data-show-reason="nav"]:not(:popover-open)': {
|
|
16
|
+
transition: 'opacity 180ms ease-in, overlay 180ms ease-in, display 180ms ease-in',
|
|
17
|
+
transitionBehavior: 'allow-discrete',
|
|
18
|
+
},
|
|
19
|
+
'&[data-show-reason="hint"]:not(:popover-open)': {
|
|
20
|
+
transition: 'none',
|
|
21
|
+
transitionBehavior: 'normal',
|
|
22
|
+
},
|
|
23
|
+
});
|
|
24
|
+
const comboboxInputCss = css({
|
|
25
|
+
minHeight: styles.control.height.sm,
|
|
26
|
+
width: '100%',
|
|
27
|
+
paddingInline: styles.space.sm,
|
|
28
|
+
border: `0.5px solid ${styles.colors.border.default}`,
|
|
29
|
+
borderRadius: styles.radius.md,
|
|
30
|
+
backgroundColor: styles.surface.lvl0,
|
|
31
|
+
color: styles.colors.text.primary,
|
|
32
|
+
fontFamily: styles.fontFamily.sans,
|
|
33
|
+
fontSize: styles.fontSize.sm,
|
|
34
|
+
lineHeight: styles.lineHeight.normal,
|
|
35
|
+
boxShadow: 'inset 0 1px 0 rgb(255 255 255 / 0.7)',
|
|
36
|
+
'&:focus-visible': {
|
|
37
|
+
outline: `2px solid ${styles.colors.focus.ring}`,
|
|
38
|
+
outlineOffset: styles.space.none,
|
|
39
|
+
},
|
|
40
|
+
'&[data-surface-visible="true"][aria-activedescendant]:focus-visible': {
|
|
41
|
+
outline: 'none',
|
|
42
|
+
},
|
|
43
|
+
});
|
|
44
|
+
export const inputStyle = comboboxInputCss;
|
|
45
|
+
export const popoverStyle = comboboxPopoverCss;
|
|
46
|
+
export function Combobox(handle) {
|
|
47
|
+
return () => {
|
|
48
|
+
let { children, defaultValue, disabled, inputId, name, placeholder, ...divProps } = handle.props;
|
|
49
|
+
return (_jsx(combobox.Context, { defaultValue: defaultValue, disabled: disabled, name: name, children: _jsxs("div", { ...divProps, children: [_jsx("input", { defaultValue: defaultValue ?? undefined, id: inputId, mix: [inputStyle, combobox.input()], placeholder: placeholder }), _jsx("div", { mix: [popoverSurfaceStyle, popoverStyle, combobox.popover()], children: _jsx("div", { mix: [listboxListStyle, combobox.list()], children: children }) }), name && _jsx("input", { mix: combobox.hiddenInput() })] }) }));
|
|
50
|
+
};
|
|
51
|
+
}
|
|
52
|
+
export function ComboboxOption(handle) {
|
|
53
|
+
return () => {
|
|
54
|
+
let { children, disabled, label, mix, searchValue, value, ...divProps } = handle.props;
|
|
55
|
+
return (_jsxs("div", { ...divProps, mix: [listboxOptionStyle, combobox.option({ disabled, label, searchValue, value }), mix], children: [_jsx(CheckIcon, { mix: listboxIndicatorStyle }), _jsx("span", { mix: listboxLabelStyle, children: children ?? label })] }));
|
|
56
|
+
};
|
|
57
|
+
}
|
|
58
|
+
//# sourceMappingURL=index.js.map
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"file":"index.js","sourceRoot":"","sources":["../../src/combobox/index.tsx"],"names":[],"mappings":"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"}
|
|
@@ -1,11 +1,9 @@
|
|
|
1
|
-
import { on, type
|
|
2
|
-
import * as listbox from '../listbox/
|
|
3
|
-
import { type SearchValue } from '
|
|
1
|
+
import { on, type Dispatched, type ElementProps, type Handle, type MixinFactory, type Props, type RemixNode } from '@remix-run/ui';
|
|
2
|
+
import * as listbox from '../listbox/index.ts';
|
|
3
|
+
import { type SearchValue } from '../shared/typeahead.ts';
|
|
4
4
|
declare const COMBOBOX_CHANGE_EVENT: "rmx:combobox-change";
|
|
5
5
|
type ComboboxChangeHandler<target extends HTMLElement> = (event: Dispatched<ComboboxChangeEvent, target>, signal: AbortSignal) => void | Promise<void>;
|
|
6
6
|
type ShowReason = 'hint' | 'nav';
|
|
7
|
-
export declare const inputStyle: CSSMixinDescriptor;
|
|
8
|
-
export declare const popoverStyle: CSSMixinDescriptor;
|
|
9
7
|
declare global {
|
|
10
8
|
interface HTMLElementEventMap {
|
|
11
9
|
[COMBOBOX_CHANGE_EVENT]: ComboboxChangeEvent;
|
|
@@ -97,5 +95,3 @@ export declare const list: MixinFactory<HTMLElement, [], ElementProps>;
|
|
|
97
95
|
export declare const option: MixinFactory<HTMLElement, [options: ComboboxOptionOptions], ElementProps>;
|
|
98
96
|
export { popoverMixin as popover };
|
|
99
97
|
export declare function onComboboxChange<target extends HTMLElement>(handler: ComboboxChangeHandler<target>, captureBoolean?: boolean): ReturnType<typeof on<target, typeof COMBOBOX_CHANGE_EVENT>>;
|
|
100
|
-
export declare function Combobox(handle: Handle<ComboboxProps>): () => RemixNode;
|
|
101
|
-
export declare function ComboboxOption(handle: Handle<ComboboxOptionProps>): () => RemixNode;
|
|
@@ -1,53 +1,12 @@
|
|
|
1
|
-
import { jsx as _jsx
|
|
2
|
-
import { attrs,
|
|
3
|
-
import
|
|
4
|
-
import * as
|
|
5
|
-
import
|
|
6
|
-
import {
|
|
7
|
-
import {} from "
|
|
8
|
-
import { waitForCssTransition } from "../../utils/wait-for-css-transition.js";
|
|
9
|
-
import { wait } from "../../utils/wait.js";
|
|
1
|
+
import { jsx as _jsx } from "@remix-run/ui/jsx-runtime";
|
|
2
|
+
import { attrs, createMixin, on, ref, } from '@remix-run/ui';
|
|
3
|
+
import * as listbox from "../listbox/index.js";
|
|
4
|
+
import * as popover from "../popover/index.js";
|
|
5
|
+
import {} from "../shared/typeahead.js";
|
|
6
|
+
import { waitForCssTransition } from "../shared/wait-for-css-transition.js";
|
|
7
|
+
import { wait } from "../shared/wait.js";
|
|
10
8
|
const COMBOBOX_CHANGE_EVENT = 'rmx:combobox-change';
|
|
11
9
|
const INPUT_COMMIT_DELAY_MS = 50;
|
|
12
|
-
const comboboxPopoverCss = css({
|
|
13
|
-
opacity: 0,
|
|
14
|
-
'&:popover-open': {
|
|
15
|
-
opacity: 1,
|
|
16
|
-
},
|
|
17
|
-
'&:not(:popover-open)': {
|
|
18
|
-
pointerEvents: 'none',
|
|
19
|
-
},
|
|
20
|
-
'&[data-show-reason="nav"]:not(:popover-open)': {
|
|
21
|
-
transition: 'opacity 180ms ease-in, overlay 180ms ease-in, display 180ms ease-in',
|
|
22
|
-
transitionBehavior: 'allow-discrete',
|
|
23
|
-
},
|
|
24
|
-
'&[data-show-reason="hint"]:not(:popover-open)': {
|
|
25
|
-
transition: 'none',
|
|
26
|
-
transitionBehavior: 'normal',
|
|
27
|
-
},
|
|
28
|
-
});
|
|
29
|
-
const comboboxInputCss = css({
|
|
30
|
-
minHeight: theme.control.height.sm,
|
|
31
|
-
width: '100%',
|
|
32
|
-
paddingInline: theme.space.sm,
|
|
33
|
-
border: `0.5px solid ${theme.colors.border.default}`,
|
|
34
|
-
borderRadius: theme.radius.md,
|
|
35
|
-
backgroundColor: theme.surface.lvl0,
|
|
36
|
-
color: theme.colors.text.primary,
|
|
37
|
-
fontFamily: theme.fontFamily.sans,
|
|
38
|
-
fontSize: theme.fontSize.sm,
|
|
39
|
-
lineHeight: theme.lineHeight.normal,
|
|
40
|
-
boxShadow: 'inset 0 1px 0 rgb(255 255 255 / 0.7)',
|
|
41
|
-
'&:focus-visible': {
|
|
42
|
-
outline: `2px solid ${theme.colors.focus.ring}`,
|
|
43
|
-
outlineOffset: theme.space.none,
|
|
44
|
-
},
|
|
45
|
-
'&[data-surface-visible="true"][aria-activedescendant]:focus-visible': {
|
|
46
|
-
outline: 'none',
|
|
47
|
-
},
|
|
48
|
-
});
|
|
49
|
-
export const inputStyle = comboboxInputCss;
|
|
50
|
-
export const popoverStyle = comboboxPopoverCss;
|
|
51
10
|
export class ComboboxChangeEvent extends Event {
|
|
52
11
|
label;
|
|
53
12
|
optionId;
|
|
@@ -691,16 +650,4 @@ const combobox = {
|
|
|
691
650
|
export function onComboboxChange(handler, captureBoolean) {
|
|
692
651
|
return on(COMBOBOX_CHANGE_EVENT, handler, captureBoolean);
|
|
693
652
|
}
|
|
694
|
-
|
|
695
|
-
return () => {
|
|
696
|
-
let { children, defaultValue, disabled, inputId, name, placeholder, ...divProps } = handle.props;
|
|
697
|
-
return (_jsx(combobox.Context, { defaultValue: defaultValue, disabled: disabled, name: name, children: _jsxs("div", { ...divProps, children: [_jsx("input", { defaultValue: defaultValue ?? undefined, id: inputId, mix: [inputStyle, combobox.input()], placeholder: placeholder }), _jsx("div", { mix: [popover.surfaceStyle, popoverStyle, combobox.popover()], children: _jsx("div", { mix: [popover.contentStyle, listbox.listStyle, combobox.list()], children: children }) }), name && _jsx("input", { mix: combobox.hiddenInput() })] }) }));
|
|
698
|
-
};
|
|
699
|
-
}
|
|
700
|
-
export function ComboboxOption(handle) {
|
|
701
|
-
return () => {
|
|
702
|
-
let { children, disabled, label, mix, searchValue, value, ...divProps } = handle.props;
|
|
703
|
-
return (_jsxs("div", { ...divProps, mix: [listbox.optionStyle, combobox.option({ disabled, label, searchValue, value }), mix], children: [_jsx(Glyph, { mix: listbox.glyphStyle, name: "check" }), _jsx("span", { mix: listbox.labelStyle, children: children ?? label })] }));
|
|
704
|
-
};
|
|
705
|
-
}
|
|
706
|
-
//# sourceMappingURL=combobox.js.map
|
|
653
|
+
//# sourceMappingURL=primitives.js.map
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"file":"primitives.js","sourceRoot":"","sources":["../../src/combobox/primitives.tsx"],"names":[],"mappings":"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"}
|
|
@@ -0,0 +1,13 @@
|
|
|
1
|
+
import type { CSSMixinDescriptor } from '@remix-run/ui';
|
|
2
|
+
export type InputSize = 'md' | 'lg';
|
|
3
|
+
export interface InputOptions {
|
|
4
|
+
size?: InputSize;
|
|
5
|
+
}
|
|
6
|
+
type InputMixin = readonly [CSSMixinDescriptor, CSSMixinDescriptor];
|
|
7
|
+
interface InputFunction {
|
|
8
|
+
(options?: InputOptions): InputMixin;
|
|
9
|
+
root(options?: InputOptions): InputMixin;
|
|
10
|
+
field(): CSSMixinDescriptor;
|
|
11
|
+
}
|
|
12
|
+
export declare const input: InputFunction;
|
|
13
|
+
export default input;
|