Repository navigation
merging fork back to main - #49
Open
goodidea-kp wants to merge 91 commits into
Open
goodidea-kp wants to merge 91 commits into
goodidea-kp wants to merge 91 commits into
Conversation
Migration 0.21
the added calendar use an example, fix minor warnings, add accordion example
fix defect and add step
Add GitHub Pages workflow and enhance documentation configuration
* Remove `docs-pages` GitHub Pages workflow * Add `bread_crumbs` component example page * Rename `bread_crumbs_example` module to `bread_crumbs_example_page` for consistency with other example pages * Rename `bread_crumbs_example` module to `bread_crumbs_example_page` for consistency with other example pages
…he catalog and comments for clarification (#18)
* Bump Yew-related dependencies and update package version to 0.4.2 * Refactor: Replace `#[function_component]` with `#[component]` across all components and bump Yew to 0.22.0 - Updated Yew from version 0.21.0 to 0.22.0. - Replaced the `#[function_component]` attribute with the `#[component]` attribute for all components to align with the updated API. - Adjusted `yew-router` to version 0.19 for compatibility. - Updated the `ybc` dependency to use a local path reference. * Bump Yew to 0.22 in basic example dependencies
- Introduced `<dialog>`-based modal controller for `Modal` and `ModalCard` components. - Added support for controlled and uncontrolled modal states. - Replaced `ModalCloser` with `ModalController`. - Updated modal examples to leverage the new context-based controller. - Upgraded `web-sys` and `derive_more` dependencies to support new features. - Updated catalog YAML to document changes in modal usage and API. - Bumped crate version to `0.4.3`.
- Introduced controlled and uncontrolled state management for `Tabs`, `Accordion`, `Navbar`, and `Panel` components. - Added ARIA attributes for better accessibility, including labels and roles for interactive elements. - Improved keyboard navigation and event handling for components such as `TabItem`, `AccordionItem`, and `NavbarDropdown`. - Updated responsive and interactive behaviors across components to align with accessibility standards.
…lete` component - Introduce new accessibility attributes (`aria-*`, `role`, `tabindex`) for `Button` and `Delete` components. - Replace Font Awesome modal close buttons with `Delete` components for consistency.
…`ybc-catalog`, and example projects (#23) - Upgrade `yew` to 0.23.0 with CSR feature. - Update `yew-router` to 0.20.0. - Adjust exports for `router`-dependent features. - Bump package versions for `ybc` (0.4.5) and `ybc-catalog` (0.1.1).
* Fix ModalCard title/body overflowing the viewport for long content .modal-card-title has flex-shrink:0 in Bulma with no min-width override, so a long unbroken string (a hostname, an ARN) in the title forces modal-card-head wider than the card instead of wrapping; centering then pushes the whole dialog off-screen on both sides. Add min-width:0 on the head/title, overflow-wrap on the title, and overflow-x on the body as a backstop for wide table content, in the same DIALOG_STYLE block that already patches other Bulma/<dialog> quirks per instance. * Bump version from 0.4.5 to 0.4.6
* Fix ModalCard title/body overflowing the viewport for long content .modal-card-title has flex-shrink:0 in Bulma with no min-width override, so a long unbroken string (a hostname, an ARN) in the title forces modal-card-head wider than the card instead of wrapping; centering then pushes the whole dialog off-screen on both sides. Add min-width:0 on the head/title, overflow-wrap on the title, and overflow-x on the body as a backstop for wide table content, in the same DIALOG_STYLE block that already patches other Bulma/<dialog> quirks per instance. * Bump version from 0.4.5 to 0.4.6
The first fix (#24) only addressed .modal-card-title's flex-shrink:0 by adding min-width:0 — which doesn't actually override flex-shrink:0 (an explicit "never shrink" declaration, not the default min-width:auto floor that min-width:0 fixes). The title kept clipping instead of wrapping. Three problems fixed here, verified against a standalone repro of the actual DOM/CSS at both desktop and mobile widths: 1. .modal-card-title needs flex-shrink:1 (not just min-width:0) to actually participate in shrinking so overflow-wrap can wrap it. 2. Bulma centers .modal-card/.modal-content via `margin: 0 auto` (desktop) or a fixed side margin (mobile), which fights this component's own flexbox centering (align-items/justify-content on the dialog) once content can't shrink to fit. Reset margin to 0 so flexbox is the only positioning mechanism. 3. A CSS-variable-based per-instance width override only takes effect inside Bulma's own min-width:769px media query; below that breakpoint it's silently ignored. Cap with max-width (not width) using calc(100vw - 2rem) so the card can never exceed the viewport at any breakpoint.
Bulma `.panel-tabs` is filter navigation, not a WAI-ARIA tablist widget: it has no roving tabindex / arrow-key contract and no linked tabpanels, and its children are plain links rather than role="tab". Emitting role="tablist" therefore trips axe `aria-required-children` (critical) on every consumer. Render it as a labelled role="navigation" region instead. The real accessible tablist widget remains available via Tabs/TabItem/TabPanel in tabs.rs. Bumps to 0.4.7. Co-authored-by: Claude Opus 4.8 <noreply@anthropic.com>
Neither component exposed the HTML maxlength attribute, so a consuming app had no way to cap input length client-side even when the backend enforces one (e.g. a DB column's varchar length) -- the only feedback was a server round-trip after the fact. Optional (#[prop_or_default]), so existing call sites are unaffected.
* - Add `TabsProvider` component and enhance Tabs functionality - Introduce `TabsProvider` for managing tab state context and `Tabs`, `TabItem`, `TabPanel` coordination. - Update `Tabs` to support both controlled and uncontrolled modes with inheritance from `TabsProvider`. - Add example for Tabs component and custom tab styling. - Enhance `basic` example with a new section demonstrating `TabsProvider` integration. - Add `TabsProvider`-backed `Tabs` example and implement custom SCSS for high-contrast styling. - Add `repro_example` module and update routes. - Integrate `ReproRoute` for example routing. - Create minimal reproducible case for desync bug using nested `Switch` and `Tabs`. - Add development script. - Introduce `scripts_dev_serve.sh` for running `trunk serve` at port `8124`. * Bump version to 0.4.9 in Cargo.toml
…ode (#30) * fix(calendar): guard bulma-calendar destroy() against a removed DOM node detach_date_picker called bulma-calendar's destroy(), which internally does document.getElementById(id).remove(). When a Yew component hosting a Calendar unmounts, Yew removes the DOM node before this cleanup effect runs, so getElementById returns null and .remove() throws an uncaught TypeError (observed navigating away from a page with a date picker). The instance is being discarded regardless, so wrap destroy() in try/catch and swallow a teardown-time failure. Bump to 0.4.10. * chore: cargo fmt (pre-existing drift in tabs.rs, blocks CI fmt check) * chore: drop unused JsCast import in calendar.rs
* change web-sys version * feat(form): accessible ids, labels, validation state and RadioGroup Every form control (Select, MultiSelect, Input, TextArea, Checkbox, Radio, File) gains an optional `id` rendered on the native element. Field mints an id, points `<label for>` at it and shares it through the new FieldContext, so a labelled Field + control pair is bound with no explicit ids. Grouped/addons fields opt out to avoid duplicate ids. Also: - Field help renders as `<p class="help">` with an id, and controls emit `aria-describedby`; `help_has_error` now marks the control `aria-invalid` + `is-danger`. - `invalid` and `required` props on all controls. - `autocomplete` and `inputmode` (new InputMode enum) on Input. - `placeholder` on Select: a disabled, empty-valued first option so `required` rejects an untouched select. - RadioGroup: fieldset + legend wrapper naming a set of radios. Co-Authored-By: Claude Fable 5.1 <noreply@anthropic.com> * added chart * fix(chart): add the PieChart source file missed by "added chart" The previous commit registered `pub mod chart` in components/mod.rs and exported PieChart from lib.rs, but the module file itself was left untracked, so every checkout other than the author's failed with E0583. Co-Authored-By: Claude Fable 5.1 <noreply@anthropic.com> --------- Co-authored-by: Claude Fable 5.1 <noreply@anthropic.com>
…s look, one test hook
Bulma's .input { display: inline-flex } beat the hidden attribute, so the
native fallback stayed on screen beside the picker. Clicks and tests then
reached the wrong control. The fallback is now hidden with display: none
too, and restored on unmount.
The picker's input now keeps its own class, which leaves room for the
icon, and takes only the fallback's modifiers (is-small, is-danger, ...).
data-testid and data-cy move to it while it is mounted, so a test finds
exactly one control.
Regression test with the real bulma-calendar 7.1.1 bundle; it fails on
the previous adapter. Version 0.4.13.
Co-Authored-By: Claude Opus 5.5 <noreply@anthropic.com>
bulma-calendar 7.1.1's own Cancel does not close the picker in a real browser (Chromium, standalone page), though it does under jsdom. A person who pressed Cancel stayed stuck with the picker open. The adapter now closes it on Cancel and leaves the value as it was, and the listener is removed on unmount. Version 0.4.14. Co-authored-by: Claude Opus 5.5 <noreply@anthropic.com>
…kills (#34) A modal body that scrolls now says so: CSS-only scroll shadows (covers in the body's colour scroll with the content, shadows stay at the edges), a dark edge in light mode and a light edge in dark mode, nothing on a body that fits. macOS hides overlay scrollbars, and a long form looked complete (Bastion BASTION-108). The .claude/skills directory is now tracked (rust-code-style, ui-cognitive-simplicity with its new poka-yoke section, ui-page-modernization); the rest of .claude stays ignored. Co-authored-by: Claude Opus 5.5 <noreply@anthropic.com>
…eachable PaginationItem (#35) * feat(a11y): Callout, CopyButton, ReasonedButton, IconText; keyboard-reachable PaginationItem Bastion BASTION-101, step 1 of the UI & accessibility epic: - Callout: a light notification whose severity picks the role (alert for danger, status otherwise) and an icon, so colour is never the only signal (WCAG 1.4.1, 4.1.3). - CopyButton: copies, says "Copied" for two seconds through a polite live region, and shows a refused clipboard in words instead of panicking. - ReasonedButton: aria-disabled (stays focusable), a visible reason and aria-describedby, instead of disabled + a title nobody on a keyboard sees. - IconText: Bulma .icon-text with the icon always aria-hidden. - PaginationItem renders a <button> (an <a> without href is not reachable by keyboard) with aria-current="page"; Notification takes a role. Rendered-HTML tests per component (tests/a11y_primitives.rs, yew ssr as a dev-dependency only). Co-Authored-By: Claude Opus 5.5 <noreply@anthropic.com> * feat(a11y): reason shown elsewhere, quiet callouts, callout ids Found migrating the Bastion console (BASTION-101): - ReasonedButton.reason_elsewhere points aria-describedby at a reason already on the page (one line for a whole toolbar, or a notice beside the button) instead of repeating it; the reason line is a <span> so the button can sit in a phrasing-only parent. - Callout.quiet: inside a persistent aria-live region it takes no role of its own, so it is not announced twice; Callout.id for aria-describedby. Two more rendered-HTML tests (10). Co-Authored-By: Claude Opus 5.5 <noreply@anthropic.com> --------- Co-authored-by: Claude Opus 5.5 <noreply@anthropic.com>
This file contains hidden or bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
Sign up for free
to join this conversation on GitHub.
Already have an account?
Sign in to comment
1 participant
Add this suggestion to a batch that can be applied as a single commit.This suggestion is invalid because no changes were made to the code.Suggestions cannot be applied while the pull request is closed.Suggestions cannot be applied while viewing a subset of changes.Only one suggestion per line can be applied in a batch.Add this suggestion to a batch that can be applied as a single commit.Applying suggestions on deleted lines is not supported.You must change the existing code in this line in order to create a valid suggestion.Outdated suggestions cannot be applied.This suggestion has been applied or marked resolved.Suggestions cannot be applied from pending reviews.Suggestions cannot be applied on multi-line comments.Suggestions cannot be applied while the pull request is queued to merge.Suggestion cannot be applied right now. Please check back later.
No description provided.