Skip to content

Releases: xormania/uxor

0.3.0

Choose a tag to compare

@github-actions github-actions released this 19 Oct 01:08
e2a9ae8

Added

  • oauth: installed Symfony authentication with Google, Facebook and GitHub, single-use provider-bound attempts, PKCE and Google ID-token validation, safe return paths and explicit account connections.

  • oauth-provider-button: provider sign-in links with full browser navigation, no Turbo prefetch and Google's official light and dark button artwork served locally.

  • social-login: login and registration cards with provider choices, safe authentication feedback and an optional password-form slot.

  • connected-accounts: account connection settings with distinct CSRF-protected POST forms, provider subjects for disconnection, preserved settings return paths and explained unavailable actions.

  • The Composer package xormania/uxor, from this repository (composer.json, packages/uxor/): agent guidance and
    development tools for projects using the kit, as a development dependency. It brings three Mate skills (setup,
    build, verify), seven Mate tools (uxor_*), the vendor/bin/uxor command line and UXor's docs as bundled
    references (uxor:// resources). Recipes still install with ux:install. The references are generated from this
    repository's docs, recipe READMEs and manifests, and CI checks they are up to date; their index identifies them by
    the digest of the files they copy, not by a commit.

0.2.0

Choose a tag to compare

@github-actions github-actions released this 12 Oct 02:38
9b2fa73

Added

  • data-table: a server-driven table (search, filters, sortable columns, page size, pages) in a Turbo Frame, with
    the PHP classes a table extends (AbstractDataTable) copied into src/UXor/DataTable/. A table counts its
    rows (countRows()), then loads one page once (loadRows()); no page starts past maxRows() rows (10,000), so a
    request never makes the database skip more. Filter::choice() takes array<int|string, string> choices. Back and
    Forward walk every state, and the data-table controller makes the form show the URL's state in every field; Back
    pressed while a change is still loading cancels the change, so the URL and the table never disagree. Its checks of
    Turbo's cached copies are the turbo recipe's module, which it installs with it.
  • data-table-live: data-table as a Live Component (AbstractLiveDataTable), with row selection for bulk actions;
    its state is in the URL. The selection holds at most maxSelection() ids (1,000) of at most 128 characters,
    enforced on what the browser sends before anything uses it; leaving the page drops it, and Back and Forward do not
    bring it back. Its checks of Turbo's cached copies are the turbo recipe's module, which it installs with it.
  • autocomplete: searchable selects with Symfony UX Autocomplete (Tom Select), styled with the theme, through the
    form theme ('autocomplete' => true) or the Autocomplete component. Its autocomplete-sync controller keeps Tom
    Select showing the <select>'s value after a Live re-render, a form reset and Back, and the hidden <select> keeps
    its label's name (aria-labelledby).
  • popover: free content anchored to a button, in a non-modal dialog; it closes on Escape, a click outside or when
    the focus leaves it, and before Turbo caches the page. Beside a frame visit promoted to history (a data table's
    pages) it stays open, and Back shows it closed. Its checks of Turbo's cached copies are the turbo recipe's module,
    which it installs with it.
  • calendar: pick a date, several dates or a range, with hidden inputs for forms (dispatching input and change)
    and a model prop for Live Components; invalid dates are ignored, and a range never spans a disabled day. It
    follows a reset of its form, unless a listener cancels the reset.
  • date-picker: a Calendar in a Popover, opened from a button or a field where the date can be typed; a
    DateType with 'block_prefix' => 'flowbite_date_picker' renders as one through the form theme.
  • dropzone: file uploads with Symfony UX Dropzone, styled with the theme: drag and drop or browse, a preview of
    the picked image, several files that add up across picks; focus follows a pick or a removal, and a file dropped
    outside the input is refused. In a POST form, the file picked shows again after Back and Forward. Its checks of
    Turbo's cached copies are the turbo recipe's module, which it installs with it.
  • chart: charts drawn with Symfony UX Chart.js in the theme's colors, light and dark, each with its data as a table;
    from arrays or a ChartBuilderInterface chart, updated in place by Live Components.
  • editor: a rich text editor (Tiptap) storing restricted HTML, with a keyboard-friendly toolbar, a link dialog and
    a counter; EditorType sanitizes every submit with symfony/html-sanitizer and refuses too long input (a 422 with the
    field's error, never a cut value), and the flowbite_editor_html filter prints stored HTML. White space is stored as
    the editor shows it, and the server counts characters as the counter does. Back, also from a frame visit promoted to
    history, builds the editor again with its content.
  • markdown-editor: a Markdown field, a native textarea with a toolbar writing Markdown and a Preview tab rendered on
    the server by a Live Component; MarkdownType refuses too long input, and the flowbite_markdown_html filter prints
    stored Markdown the same way (CommonMark without raw HTML or images, then sanitized). Back keeps what was typed.
  • side-nav: a multi-level navigation tree (WAI-ARIA tree view): links in branches that open and close at any depth,
    arrow keys, Home, End and type-ahead, the branch of the current page open, and the open branches kept across Turbo
    visits, Back and Forward in sessionStorage (two trees sharing a storageKey agree). Its current-link marking is
    the navigation recipe's module, which it installs with it.
  • mobile-nav: the app's navigation on small screens, in a modal Drawer opened by a menu button in the Navbar
    (menu block); the focus goes to the current page, and the drawer closes on a link, Escape, the backdrop, before
    Turbo caches the page and when the screen grows to the sidebar's width. Its link-follow check and its closing when
    the screen grows are the navigation recipe's module, which it installs with it.
  • nav-menu: the navbar's menu, a disclosure navigation: links and buttons opening submenus of links, nested at any
    depth; opening one closes the others, Escape closes the innermost and focuses its button, a click outside, the
    focus leaving and Turbo caching the page close them all; the current page and its submenus are marked, a submenu
    near the edge opens towards the other side, and the same menu opens in place in a MobileNav. Its current-link
    marking and its link-follow check are the navigation recipe's module, which it installs with it.
  • section-nav: vertical tabs that navigate between the pages of one area (settings): links with
    aria-current="page" marked by the server or from the URL, a column on large screens and a strip that scrolls
    sideways, with the current section in view, on small ones. Its current-link marking is the navigation recipe's
    module, which it installs with it.
  • floating: the positioning that dropdown, popover (so date-picker) and tooltip share, one JavaScript
    module (assets/lib/uxor-floating.js) that those recipes install with them: placement, flip, shift into
    the viewport, following the trigger on scroll and resize.
  • turbo: what the recipes ask about Turbo's copies of a page, one JavaScript module
    (assets/lib/uxor-turbo.js) that the recipes using it install with them: whether a turbo:before-cache
    comes from a frame visit promoted to history, whether an element is data-turbo-permanent, and whether a controller
    connects in a cached copy.
  • navigation: what the navigation recipes share, one JavaScript module (assets/lib/uxor-navigation.js):
    marking the current page's link, giving the rendered aria-current back, whether a click on a link navigates this
    tab, closing a navigation opened over the page when the screen grows.
  • theme: chart series roles chart-1 to chart-6 and chart-other, checked for contrast in both themes.
  • A gallery of every recipe and every example of its README, light and dark, with its code and install command, on
    GitHub Pages (https://xormania.github.io/uxor/), published with each release.
  • FOR-AGENTS.md, a page for the coding agent given the repository's URL (setup, which recipe for what, the rules,
    every recipe), and llms.txt, every page with one line, linking the files of this release. Both are written from
    README.md's recipe tables and checked in CI.
  • SECURITY.md: how to report a vulnerability privately.

Changed

  • Breaking: the kit is now UXor, at https://github.com/xormania/uxor (gallery:
    https://xormania.github.io/uxor/). ux:install … --kit= commands that name the old repository
    (xormania/flowbite-xor) stop working: the toolkit expects GitHub's archive to hold a folder named
    <repository>-<version>, and after the rename GitHub names it uxor-<version>. Reinstall with
    --kit=https://github.com/xormania/uxor (or …/uxor:<version>). The kit's own names change with it:

    • theme: assets/styles/flowbite-xor.css is now assets/styles/uxor.css. In assets/styles/app.css, replace
      @import './flowbite-xor.css'; with @import './uxor.css';, then delete the old file (it is yours, so carry
      any change you made to it over first).
    • autocomplete, dropzone, editor: assets/styles/flowbite-xor-autocomplete.css, flowbite-xor-dropzone.css
      and flowbite-xor-editor.css are now uxor-autocomplete.css, uxor-dropzone.css and uxor-editor.css: change
      their @import in app.css the same way. The spinner's keyframes flowbite-xor-autocomplete-spin are now
      uxor-autocomplete-spin.
    • floating, turbo, navigation: assets/lib/flowbite-xor-floating.js, flowbite-xor-turbo.js and
      flowbite-xor-navigation.js are now uxor-floating.js, uxor-turbo.js and uxor-navigation.js; the recipes'
      controllers import the new names. A controller of your own that imports ../lib/flowbite-xor-<name>.js imports
      ../lib/uxor-<name>.js.
    • PHP: the namespace App\FlowbiteXor\… is now App\UXor\…, copied into src/UXor/ instead of
      src/FlowbiteXor/ (data-table, data-table-live, editor, markdown-editor). Replace every
      use App\FlowbiteXor\ with use App\UXor\ (tables extending AbstractDataTable or AbstractLiveDataTable,
      forms using EditorType or MarkdownType), then delete src/FlowbiteXor/.

    0.1.0 shipped only the theme's stylesheet under its old name; the other files above were renamed before their
    first release and matter only to a project that installed them from dev. After reinstalling, delete the old
    files, which ux:install does not remove.

  • Installing without a version (--kit=https://github.com/xormania/uxor) installs main, which now holds
    the last release only; --kit=https://github.com/xormania/uxor:dev installs the work merged since.

  • theme: on-fill roles in uxor.css, the color of text on a solid fill (fg-on-brand, fg-on-success,
    fg-on-danger, fg-on-warning, fg-on-dark) and of the toggle's knob (knob). All are white, so nothing looks
    different,...

Read more

0.1.0

Choose a tag to compare

@github-actions github-actions released this 12 Oct 02:38
a517397

Added

  • theme: Flowbite's color roles for light and dark, with contrast fixes.
  • theme-toggle: a button switching between light and dark; the choice is remembered per browser.
  • 22 components from the official flowbite-4 kit (alert, avatar, badge, button, button-group, card,
    checkbox, dropdown, indicator, input, kbd, label, modal, pagination, radio, select,
    skeleton, spinner, table, tabs, textarea, toggle), with Stimulus controllers instead of Flowbite's
    JavaScript.
  • Components the official kit lacks: breadcrumb, drawer, empty-state, navbar, page-header, progress,
    sidebar, stat-card, toast, tooltip.
  • form-theme, a Symfony form theme rendering through the kit's components, and form-field, the labelled control
    with help text and errors it renders each row with.
  • layouts: base, app (sidebar, navbar, page header, toasts), auth, settings, error and blank.
  • Blocks: dashboard-home, login, signup, forgot-password, settings-profile, not-found.