forked from
stevedylan.dev/sequoia
A CLI for publishing standard.site documents to ATProto
chore: updated docs
authored by
Steve
and committed by
tangled.org
6788c7d2
e3e5db9e
+37
-5
+37
-5
docs/docs/pages/subscribe.mdx
+37
-5
docs/docs/pages/subscribe.mdx
···
1
1
# Subscribe
2
2
3
-
Sequoia provides a subscribe button web component that lets your readers subscribe to your publication directly from your site using their Bluesky account.
3
+
Sequoia provides a subscribe button web component that lets your readers subscribe to your publication directly from your site using their AT Protocol account.
4
4
5
5
## Setup
6
6
···
93
93
React.HTMLAttributes<HTMLElement> & {
94
94
'publication-uri'?: string;
95
95
'callback-uri'?: string;
96
+
'button-type'?: 'sequoia' | 'bluesky' | 'blacksky' | 'atmosphere' | 'plain';
96
97
label?: string;
98
+
'unsubscribe-label'?: string;
97
99
hide?: string;
98
100
},
99
101
HTMLElement
···
132
134
|-----------|------|---------|-------------|
133
135
| `publication-uri` | `string` | - | AT Protocol URI for the publication. Optional if a `/.well-known/site.standard.publication` endpoint exists on the host site. |
134
136
| `callback-uri` | `string` | `https://sequoia.pub/subscribe` | Redirect URI used for the OAuth authentication flow. |
135
-
| `label` | `string` | `Subscribe on Bluesky` | Button label text. |
137
+
| `button-type` | `string` | `sequoia` | Branding style for the button. Accepted values: `sequoia`, `bluesky`, `blacksky`, `atmosphere`, `plain`. |
138
+
| `label` | `string` | - | Override the subscribe button label text. Defaults to the `button-type` label (e.g. "Subscribe on Sequoia"). |
139
+
| `unsubscribe-label` | `string` | `Unsubscribe` | Override the unsubscribe button label text. |
136
140
| `hide` | `string` | - | Set to `"auto"` to hide the component if no publication URI is detected. |
137
141
142
+
#### Button Types
143
+
144
+
The `button-type` attribute controls which icon and default label the button uses:
145
+
146
+
| Type | Icon | Default Label |
147
+
|------|------|---------------|
148
+
| `sequoia` | Sequoia tree | Subscribe on Sequoia |
149
+
| `bluesky` | Bluesky butterfly | Subscribe on Bluesky |
150
+
| `blacksky` | Blacksky star | Subscribe on Blacksky |
151
+
| `atmosphere` | Atmosphere @ | Subscribe on Atmosphere |
152
+
| `plain` | None | Subscribe |
153
+
138
154
```html
139
-
<!-- Use attributes for explicit control -->
155
+
<!-- Default Sequoia branding -->
156
+
<sequoia-subscribe></sequoia-subscribe>
157
+
158
+
<!-- Bluesky branding -->
159
+
<sequoia-subscribe button-type="bluesky"></sequoia-subscribe>
160
+
161
+
<!-- Blacksky branding -->
162
+
<sequoia-subscribe button-type="blacksky"></sequoia-subscribe>
163
+
164
+
<!-- Atmosphere branding -->
165
+
<sequoia-subscribe button-type="atmosphere"></sequoia-subscribe>
166
+
167
+
<!-- Plain text, no icon -->
168
+
<sequoia-subscribe button-type="plain"></sequoia-subscribe>
169
+
170
+
<!-- Custom labels -->
140
171
<sequoia-subscribe
141
-
publication-uri="at://did:plc:example/site.standard.publication/abc123"
142
-
label="Follow on Bluesky">
172
+
label="Follow this publication"
173
+
unsubscribe-label="Stop following">
143
174
</sequoia-subscribe>
144
175
```
145
176
···
176
207
| `--sequoia-accent-color` | `#2563eb` | Button background color |
177
208
| `--sequoia-secondary-color` | `#6b7280` | Secondary text color |
178
209
| `--sequoia-border-radius` | `8px` | Border radius for the button |
210
+
| `--sequoia-icon-display` | `inline-block` | Set to `none` to hide the button icon |
179
211
180
212
### Example: Match Site Theme
181
213