@umxr/bagsy 0.0.0-stage → 0.2.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.
Files changed (26) hide show
  1. package/LICENSE +21 -0
  2. package/README.md +257 -2
  3. package/dist/chunk-CJV4SIV7.js +244 -0
  4. package/dist/chunk-CJV4SIV7.js.map +1 -0
  5. package/dist/chunk-QV3JPND6.js +375 -0
  6. package/dist/chunk-QV3JPND6.js.map +1 -0
  7. package/dist/client-CXCgpFGa.d.ts +169 -0
  8. package/dist/element.d.ts +169 -0
  9. package/dist/element.js +566 -0
  10. package/dist/element.js.map +1 -0
  11. package/dist/hydrogen.d.ts +73 -0
  12. package/dist/hydrogen.js +89 -0
  13. package/dist/hydrogen.js.map +1 -0
  14. package/dist/index.d.ts +103 -0
  15. package/dist/index.js +65 -0
  16. package/dist/index.js.map +1 -0
  17. package/dist/react.d.ts +174 -0
  18. package/dist/react.js +403 -0
  19. package/dist/react.js.map +1 -0
  20. package/dist/relay-0l6VcQp9.d.ts +25 -0
  21. package/dist/server.d.ts +96 -0
  22. package/dist/server.js +10 -0
  23. package/dist/server.js.map +1 -0
  24. package/dist/styles.css +157 -0
  25. package/dist/transport-Chh09xIP.d.ts +1022 -0
  26. package/package.json +89 -4
package/dist/styles.css ADDED
@@ -0,0 +1,157 @@
1
+ /*
2
+ * Bagsy default styles. Every selector is wrapped in :where() so it has the
3
+ * lowest possible specificity: any theme rule wins without !important.
4
+ *
5
+ * Customise with custom properties on any ancestor:
6
+ * --bagsy-accent, --bagsy-color, --bagsy-background, --bagsy-border,
7
+ * --bagsy-radius, --bagsy-padding, --bagsy-gap, --bagsy-card-min, --bagsy-image-ratio
8
+ * or target parts: bagsy-button::part(button | icon | label).
9
+ */
10
+
11
+ :where(bagsy-button) {
12
+ display: inline-block;
13
+ }
14
+
15
+ :where(bagsy-button)::part(button) {
16
+ all: unset;
17
+ box-sizing: border-box;
18
+ cursor: pointer;
19
+ display: inline-flex;
20
+ align-items: center;
21
+ justify-content: center;
22
+ gap: 0.4em;
23
+ padding: var(--bagsy-padding, 0.5em 0.8em);
24
+ border: var(--bagsy-border, 1px solid currentColor);
25
+ border-radius: var(--bagsy-radius, 999px);
26
+ color: var(--bagsy-color, inherit);
27
+ background: var(--bagsy-background, transparent);
28
+ font: inherit;
29
+ line-height: 1;
30
+ }
31
+
32
+ :where(bagsy-button)::part(button):focus-visible {
33
+ outline: 2px solid var(--bagsy-accent, currentColor);
34
+ outline-offset: 2px;
35
+ }
36
+
37
+ :where(bagsy-button[aria-busy='true'])::part(button) {
38
+ cursor: progress;
39
+ opacity: 0.7;
40
+ }
41
+
42
+ :where(bagsy-button)::part(icon) {
43
+ width: 1.15em;
44
+ height: 1.15em;
45
+ transition: fill 0.15s, stroke 0.15s;
46
+ }
47
+
48
+ :where(bagsy-button[saved])::part(icon) {
49
+ fill: var(--bagsy-accent, currentColor);
50
+ stroke: var(--bagsy-accent, currentColor);
51
+ }
52
+
53
+ :where(bagsy-button[icon-only])::part(label) {
54
+ position: absolute;
55
+ width: 1px;
56
+ height: 1px;
57
+ overflow: hidden;
58
+ clip-path: inset(50%);
59
+ white-space: nowrap;
60
+ }
61
+
62
+ /* Wishlist page */
63
+
64
+ :where(bagsy-wishlist) {
65
+ display: block;
66
+ }
67
+
68
+ :where(.bagsy-wishlist__grid) {
69
+ list-style: none;
70
+ margin: 0;
71
+ padding: 0;
72
+ display: grid;
73
+ gap: var(--bagsy-gap, 1.5rem);
74
+ grid-template-columns: repeat(auto-fill, minmax(min(100%, var(--bagsy-card-min, 12rem)), 1fr));
75
+ }
76
+
77
+ :where(.bagsy-wishlist__item) {
78
+ position: relative;
79
+ display: flex;
80
+ flex-direction: column;
81
+ gap: 0.5rem;
82
+ }
83
+
84
+ :where(.bagsy-wishlist__image) {
85
+ width: 100%;
86
+ height: auto;
87
+ aspect-ratio: var(--bagsy-image-ratio, 1);
88
+ object-fit: cover;
89
+ display: block;
90
+ }
91
+
92
+ :where(.bagsy-wishlist__title) {
93
+ color: inherit;
94
+ text-decoration: none;
95
+ }
96
+
97
+ :where(.bagsy-wishlist__title)::after {
98
+ content: '';
99
+ position: absolute;
100
+ inset: 0;
101
+ }
102
+
103
+ :where(.bagsy-wishlist__item bagsy-button) {
104
+ position: absolute;
105
+ top: 0.5rem;
106
+ right: 0.5rem;
107
+ z-index: 1;
108
+ --bagsy-background: #fff;
109
+ --bagsy-padding: 0.5em;
110
+ }
111
+
112
+ :where(.bagsy-wishlist__variant) {
113
+ font-size: 0.875em;
114
+ opacity: 0.8;
115
+ }
116
+
117
+ :where(.bagsy-wishlist__actions) {
118
+ display: flex;
119
+ flex-wrap: wrap;
120
+ align-items: center;
121
+ gap: 0.75rem;
122
+ margin-block-end: var(--bagsy-gap, 1.5rem);
123
+ }
124
+
125
+ :where(.bagsy-wishlist__share, .bagsy-wishlist__unshare) {
126
+ font: inherit;
127
+ cursor: pointer;
128
+ padding: var(--bagsy-padding, 0.5em 0.8em);
129
+ border: var(--bagsy-border, 1px solid currentColor);
130
+ border-radius: var(--bagsy-radius, 999px);
131
+ color: var(--bagsy-color, inherit);
132
+ background: var(--bagsy-background, transparent);
133
+ }
134
+
135
+ :where(.bagsy-wishlist__unshare) {
136
+ border-color: transparent;
137
+ text-decoration: underline;
138
+ }
139
+
140
+ :where(.bagsy-wishlist__share, .bagsy-wishlist__unshare):focus-visible {
141
+ outline: 2px solid var(--bagsy-accent, currentColor);
142
+ outline-offset: 2px;
143
+ }
144
+
145
+ :where(.bagsy-wishlist__shared) {
146
+ margin-block: 0 var(--bagsy-gap, 1.5rem);
147
+ }
148
+
149
+ /* A shared list isn't "your" wishlist: hide the Wishlist page block's heading. */
150
+ :where(.bagsy-page:has(bagsy-wishlist[shared-view])) :where(.bagsy-page__heading) {
151
+ display: none;
152
+ }
153
+
154
+ :where(.bagsy-wishlist__sold-out) {
155
+ opacity: 0.7;
156
+ font-size: 0.875em;
157
+ }