summaryrefslogtreecommitdiff
path: root/ui/lib/components
Commit message (Collapse)AuthorAge
* Remove the (entirely unused and unusable) `body` property from `Message`.Owen Jacobson2025-07-08
|
* Rename "channel" to "conversation" throughout the client.Owen Jacobson2025-07-03
| | | | Existing client state, stored in local storage, is migrated to new keys (that mention "conversation" instead of "channel" where appropriate) the first time the client loads.
* Move the `/ch` channel view to `/c` (for conversation).Owen Jacobson2025-07-03
|
* tools/reformatOwen Jacobson2025-06-11
|
* Use browser-native methods to hide elements, not CSS alone.Owen Jacobson2025-05-22
| | | | The hidden `textarea` used to attach the form value to the DOM was being included in the ARIA accessibility tree, at least in testing (I didn't check in a browser). While we could suppress this iwth `aria-role="hidden"`, the WHATWG recommendation is to Not Do That, and to find another way to hide the element, instead. Marking the element as hidden accomplishes that goal, _and_ gets rid of a style rule.
* Restore the placeholder when the editable input is emptied out after ↵Owen Jacobson2025-05-13
| | | | | | modification. This also avoids using `placeholder` on elements where it's nonstandard, like `<div>`s.
* Support non-mouse accessibility.Owen Jacobson2025-05-13
| | | | | * Give the input `div` a marker to tell screen readers &c that it is a textbox. * Ensure that it participates in tab order. (Zero is a sentinel value, see <https://developer.mozilla.org/en-US/docs/Web/HTML/Reference/Global_attributes/tabindex>.)
* Make the resulting form more amenable to normal DOM operations.Owen Jacobson2025-05-13
| | | | | | | | | | | | | | This is purely an aesthetic choice: * The DOM `reset()` function can be used to clear the form, but can't be used to clear editable DIVs. Binding the editable div to a (hidden) form field allows `reset()` to clear both. * We can find the target `form` element out of the event, but the API needed to do so differs between events dispatched to form controls and events dispatched to random DOM nodes. Using `closest('form')` works for both kinds of event target. In practice, there is little need to make sure the message input form uses "normal" DOM APIs for functional reasons. Everything inside `MessageInput` is controllable through the component's script. This change isn't based on a functional need, but rather in the hopes that integrating with the DOM APIs makes it easier for _code we don't control_ - screen readers, password managers, saved-form support in browsers, &c - to integrate with Pilcrow. It is purely speculative. (This also used to be necessary because Firefox didn't support `contenteditable="plaintext-only"`, but [support was added in March][ff-pto] [ff-pto]: https://www.mozilla.org/en-US/firefox/136.0/releasenotes/#:~:text=The%20value%20plaintext%2Donly%20can%20now%20be%20specified%20for%20the%20contenteditable%20attribute%2C%20making%20the%20raw%20text%20of%20an%20element%20editable%20but%20without%20supporting%20rich%20text%20formatting.
* Implement the disabled state:Owen Jacobson2025-05-13
| | | | | * Suppress input (including paste) while the input is disabled. * Style the input to make it visible that it's not accepting input.
* Send multi-line messages as multiple lines.Owen Jacobson2025-05-13
| | | | For whatever reason, `innerText` captures interior line breaks, while `textContent` does not. Wild. DOM APIs.
* Fix up input to be a contenteditable divKit La Touche2025-05-11
|
* Render messages as ghosts when there's a pending delete, too.Owen Jacobson2025-05-06
|
* Render "ghost" messages for unsent messages.Owen Jacobson2025-05-06
| | | | | | | | | | | There is a subtle race conditon in this code, which is likely not fixable without a protocol change: * Ghost messages can disappear before their "real" message replacement shows up, if the client finishes sending (i.e., receives an HTTP response on the POST) before the server delivers the real message. * Ghost messages can be duplicated briefly, if the client receives the real message before the client finishes sending. Both happen in practice; we make no ordering guarantees between requests. To aviod this, we'd to give clients a way to correlate pending sends with received messages. This would require fundamentally the same capabilities, like per-operation nonces, that preventing duplicate operations will require.
* Un-nest `Message` from `MessageRun`.Owen Jacobson2025-05-06
| | | | | | A `MessageRun` is a visual container with a specific layout - bordered, with a drop shadow, with a name badge on the top-left, which is either positioned to the left (`other-message`) or right (`own-message`). It is content-agnostic. This facilitates putting things besides live messages inside of a message run. As a side effect, this gets rid of ActiveChannel; most of what it was doing makes more sense living in the channel view's `+page.svelte`.
* Don't scroll all the time as messages are addedKit La Touche2025-02-25
| | | | Only once on load, then once per new message.
* Hoist global state access out of individual components.Owen Jacobson2025-02-21
| | | | | | | | Access to "global" (maybe "external?") state is now handled at the top level of the component hierarchy, in `+page.svelte`, `+layout.svelte`, and their associated scripts. State is otherwise passed down through props, and changes are passed up through callbacks. This is - hopefully - groundwork for refactoring state management a bit. I wanted to move access to state out to a smaller number of places, so that I have fewer places to update to implement reconnect logic. My broader goal is to make it easier to refactor these kinds of external side effects, as well, though no such changes are in this branch. This change also makes testing a mile easier, since tests can interact with props and callbacks instead of emulating the whole HTTP request stack and the Pilcrow API. This change removes do-very-little tests.
* Add missing awaits on goto() callsOwen Jacobson2025-02-21
|
* Be a bit more careful with the nesting of anchors and list items.Owen Jacobson2025-02-21
| | | | Browsers cope with weird nestings mostly fine, but there's no upside for us in testing that.
* Remove unused type attribute on textareaOwen Jacobson2025-02-21
|
* npm formatOwen Jacobson2025-02-15
|
* Add placeholder to message inputKit La Touche2025-01-28
|
* npm run formatOwen Jacobson2025-01-11
|
* Use margins, rather than alternating float/non-float elements, to lay out ↵Owen Jacobson2025-01-11
| | | | own/other messages.
* Stylize channel badgesKit La Touche2025-01-05
|
* A bit more stylingKit La Touche2025-01-05
|
* Stylize more betterKit La Touche2025-01-05
|
* Fix invite copy buttonKit La Touche2025-01-04
|
* Add username class to username spanKit La Touche2025-01-04
|
* Just oh so many stylesKit La Touche2025-01-01
|
* Strip out Tailwind etcKit La Touche2024-12-30
|
* Merge branch 'main' into wip/stylizeKit La Touche2024-12-03
|\
| * Style Channels differently when they have unreadsKit La Touche2024-11-29
| | | | | | | | I dunno, I like the fleuron. Maybe it's too twee?
| * Use Luxon dates on Message store and componentKit La Touche2024-11-29
| | | | | | | | | | | | This includes jamming the "at" of a message into a data- attribute on the Message component, so that it can later be used by parent components via Plain Old Javascript and the .dataset attribute of an HTML node.
* | Add styling for pre blocks in messagesKit La Touche2024-11-30
| |
* | Merge branch 'main' into wip/stylizeKit La Touche2024-11-28
|\|
| * Best-guess an ARIA role for this element.Owen Jacobson2024-11-26
| | | | | | | | Svelte's lint complains if you add interaction to a div but don't give that div an ARIA role.
| * Use store.set where appropriateKit La Touche2024-11-22
| | | | | | | | If you're setting it to a static value, use set.
| * Clean up extraneous variablesKit La Touche2024-11-22
| | | | | | | | Just use state, don't derive from a non-state local variable.
| * HTML-ify message bodies once, on receipt, and not every time the message is ↵Owen Jacobson2024-11-15
| | | | | | | | | | | | rendered. ~16% of the `hi development` channel's rendering time was taken up on this.
* | Merge branch 'main' into wip/stylizeKit La Touche2024-11-11
|\|
| * Deletable messages.Owen Jacobson2024-11-08
| | | | | | | | This also fixes some rendering jank with the message timestamp chip.
* | Style own messagesKit La Touche2024-11-11
| |
* | Style blockquotesKit La Touche2024-11-11
| |
* | Try to style blockquotesKit La Touche2024-11-11
|/ | | | But it's not working. Why?
* Better choices of margins and capsOwen Jacobson2024-11-07
|
* Factor out the elements of the `/me` page, and style them a little.Owen Jacobson2024-11-07
|
* Be more consistent around margins and padding for the "main" paneOwen Jacobson2024-11-07
|
* Sort out padding and wrapping for the chat inputOwen Jacobson2024-11-07
|
* Backport multiline logic from prop/multiline-shiftKit La Touche2024-11-07
|
* Split message runs after ten minutes' silence.Owen Jacobson2024-11-06
| | | | I've also refactored how runs are processed, to avoid re-splitting runs every time the channel view is rendered. They're generated when messages are ingested into the `$messages` store, instead.