kumo_ui 1.7.0
kumo_ui: ^1.7.0 copied to clipboard
A mobile-first Flutter implementation of Cloudflare's Kumo UI design system, built using pure widgets.dart.
1.7.0 #
A pure-Dart chart subsystem, under lib/src/charts/ and exported from the
barrel: no charting package, no WebView, and no paint body that allocates.
KumoChartContaineris the surface, and the reason a streaming chart keeps up with its data: a tick repaints only the dynamic layer. The background grid sits behind its ownRepaintBoundaryon a context whoserepaintis null, so it rasterises once per layout rather than once per frame, and a tick does not rebuild the widget tree —CustomPainter.repaintdrives it.KumoChartLayeris the layer contract: allocate inprepare()(once per layout), only mutate inpaint().KumoTimeseriesChartstreams a line and an area over a sliding window.KumoSeriesBufferholds points in twoFloat64Lists read through a start offset, so an append never allocates and a wrap never copies.KumoTimeWindowis the viewport and is pure Dart — no canvas, noBuildContext, no widgets — so a slide is aMatrix4translation rather than a reprojection of history.KumoLttbdownsamples to the plot's pixel width, keeping the extremes that carry the shape, and every array it touches is caller-owned.KumoSankeyChartlays a flow network out withKumoSankeySolver: longest-path depths via Kahn's algorithm, so a cycle terminates instead of hanging, and one shared vertical scale per column, so a node cannot overlap its neighbour. Dangling endpoints drop their ribbon rather than throwing.KumoGeoMapChartdraws a choropleth from GeoJSON.KumoGeoJsonParserreads an already-decodedMap, so the package takes no position on how the bytes arrived;KumoGeoProjectionflattens the globe into a unit square; and paths are compiled once in world coordinates, which makes a pan, a zoom and a resize one matrix over geometry that is never rebuilt.KumoCanvasis the escape hatch for anything the families do not cover: a painter callback handed a rawCanvas, with the surface, the plot rect, the gridlines and axis ticks, the resolved tokens and the repaint split managed around it.KumoCanvasGridLayeris the grid it places behind you.KumoChartColorsis the chart palette, deliberately outsideKumoColorsso a series reads the same in both schemes: semantic status tones, a five-slot categorical cycle, and a sequential ramp whose dark-mode order is reversed so the most prominent step is always the largest value.KumoRingBuffer,KumoDataBuffer,KumoChartControllerandKumoStreamingChartSourcecoalesce a burst of socket messages into one flush per frame, with backpressure that keeps the newest points rather than the oldest.KumoDrawerScaffold's static lookups no longer dereference a missing scope. A context outside the scaffold asserts in debug with a message that names the cause (a callback closing over the context that created the scaffold) and the fix, and is a no-op in release instead of throwing a bare null-check. The newKumoDrawerScaffold.hasScaffoldis the non-asserting probe, which separates "there is no scaffold" from "the scaffold is not docked".- The barrel re-exports the paint primitives the chart surface is built from
(
Canvas,Paint,PaintingStyle,Path,Rect,Offset,Size,StrokeCap,StrokeJoin), so drawing your own chart is still one import. - The bundled example is now a
ShellRouteapp: aKumoDrawerScaffoldaround every page, a deep-linkable route per chart family, and a live timeseries fed by a simulated socket whose buffer outlives the route that draws it.
1.6.0 #
KumoDrawerScaffold, covering upstream's Sidebar. Coverage moves to 26 of 45.
- Upstream Kumo's sidebar is one adaptive component: an
asiderail on a wide viewport and a navigation drawer belowmobileBreakpoint.KumoDrawerScaffoldis the same idea in Flutter. AbovekKumoBreakpointthe drawer is docked beside the page and cannot be dismissed, because there is room for it. Below it the drawer is hidden untilopen, then slides over ascrimthat dismisses on tap, with Escape-to-close and focus moved inside. KumoDraweris the panel: an optional pinned header and footer around a scrollable nav area, and an icon-only collapsed rail (isCollapsed).KumoDrawerItemkeeps the package's 48px tap height, insets the selected fill into a pill, and carriesSemantics(selected:)so the current destination is announced rather than only painted.KumoDrawerGrouplabels a run of items.KumoDrawerScaffold.isDocked(context)lets a page decide whether to render a menu affordance at all, so a desktop build does not show a button that does nothing.- Not ported from upstream: collapsible sub-menus, drag-to-resize, peeking,
sliding views, and the full-screen-on-mobile sheet is opt-in via
fullScreenOnMobilerather than automatic.
1.5.0 #
Four more upstream components, moving coverage to 25 of 45.
KumoRadio<T>closes the highest-value gap in the form set. It mirrorsKumoCheckboxdeliberately: an 18px control, one 48px tap target per row, the brand signal when chosen, and a mutually exclusive group announced to assistive technology.KumoBanneris the persistent counterpart toKumoToast: an inline message that stays where you put it, with four kinds, an optional action and an optional dismiss. It upgrades Banner from partial to covered, because a transient toast could not carry a message the user needs to read twice.KumoSensitiveInputadds a reveal toggle for secrets the user has to verify, composingKumoInputrather than reimplementing it.KumoTooltipshows a short label on hover (desktop) or long press (touch), and attaches the same text as a semantics tooltip for platforms with no hover.
1.4.0 #
The screen shell, plus the primitives the component set was missing.
KumoScaffoldis the Material-free answer toScaffold: it paints the canvas, insets for the system UI, keeps the body above the software keyboard, and gives a screen a pinnedheader, a scrollingchildand an optionalbottomBar. It replaces theColoredBox+SafeArea+SingleChildScrollViewboilerplate every screen was repeating.- Seven new widgets, closing gaps against Cloudflare's Kumo component set:
KumoLoader(indeterminate progress, drawn withCustomPaintrather than Material's indicator),KumoEmpty(an empty state that names a reason and an action, not just "No data"),KumoSkeleton(a static placeholder line),KumoLink,KumoLabel,KumoMeter(determinate progress) andKumoInputArea's job. KumoInputgainedmaxLinesandminLines, so a multi-line area is the same field rather than a near-duplicate widget. Multi-line fields align aprefixIconto the first line.- The example's settings route now uses
KumoScaffold, and a new Primitives section demonstrates the added widgets. - Corrected a claim in the 1.0.0 entry: it listed "metric blocks, and telemetry charts", which the package has never contained.
1.3.0 #
Navigator 2.0 support: KumoApp.router.
KumoApp.routeris theMaterialApp.routerequivalent. It drivesWidgetsApp.routerfrom aRouterConfig, or from a rawRouterDelegateplusRouteInformationParser, and keeps the scheme resolution, theme wrapper and platform-brightness observerKumoAppalready had. go_router and auto_route both hand over aRouterConfig, so they plug in unchanged.home,routes,initialRoute,onGenerateRouteandnavigatorKeyare absent from that constructor, mirroringMaterialApp.router: a router owns the navigator, andWidgetsApp.routerasserts they cannot be combined.- Re-export the router types (
RouterConfig,RouterDelegate,RouteInformationParser,RouteInformationProvider,BackButtonDispatcher,RouteInformation) andInheritedWidget, so both paths stay usable from the single import. - go_router stays Material-free under
KumoApp.router: it chooses its page type from the app it finds itself in and falls back toNoTransitionPageunder a plainWidgetsApp. Asserted by test rather than assumed. - The bundled example is now a routed app:
KumoApp.routerwith/and/settings. Its theme mode reaches the pages through anInheritedWidget, because a route builder does not re-run when the app rebuilds.
1.2.0 #
KumoApp, the app entry point.
KumoAppcollapses the theme and theWidgetsAppwiring into one widget, the wayMaterialAppdoes, and derives the root text style and the task-switcher color from the scheme in scope.runApp(KumoApp(home: HomeScreen()))is a complete app, with no nested theming.KumoThemeMode(system,light,dark) picks the scheme and defaults tosystem, so an app follows the platform setting and repaints when it changes.KumoColors.dark()now accepts the same per-token overrides asKumoColors.light(), so the two schemes read as peers.WidgetsBindingandWidgetsBindingObserverare no longer re-exported. They were added in 1.1.0 for the example's manual brightness wiring, whichKumoAppnow owns; both stay available frompackage:flutter/widgets.dart.BrightnessandBuilderremain in the barrel.- The bundled example is now a single
KumoApp.
1.1.0 #
Light and dark color modes.
KumoColors.light()joinsKumoColors.dark(), withKumoColors.of(brightness)to pick a scheme and abrightnessfield to read it back. Both schemes clear WCAG 2.1 AA (4.5:1 for text, 3:1 for non-text), verified by the same test suite rather than by eye.KumoLightPalettecarries the light half of the raw scale. The dark accents cannot be reused on light surfaces: the brand orange is 2.6:1 on white, so the lightorange5is deepened until it clears AA as text.KumoTextStylesandKumoTypography.resolve(colors)expose the type scale tinted for one scheme, andKumoTheme.textStylesOf(context)resolves it for the active one. Components paint with those instead of the dark-only statics, which is what makes the light scheme legible.- New
scrimtoken drives the modal and bottom-sheet barriers, so the light scheme dims its background instead of washing it black. - The checkbox check glyph now uses
canvas, the same tone the primary button uses for its label. That lifts it from 2.9:1 to 7.12:1 on the dark fill. - Fixed: the toast overlay layer captured the colors of whichever toast opened it, so toasts shown after a color-mode switch kept the previous scheme.
- The bundled example gains a System / Light / Dark selector plus sections for
the bottom sheet, the inline toast, every toast kind, the raw palette and
kKumoBreakpoint, so every public widget is demonstrated. - Additive only: no existing signature changed, and
const KumoColors()is still the dark scheme.
1.0.2 #
Documentation and packaging release.
- README now documents every public widget, enum and theming token, adding
KumoListItem,KumoBreadcrumbItem,KumoDataPair,KumoBottomSheetItem, theKumoButtonVariant/KumoBadgeVariant/KumoToastKindenums, and theKumoToastManager/KumoResponsiveLayout.isDesktophelpers. - Adds a screenshots gallery backed by the new
doc/images/phone captures of the bundled example app. - No public API changes;
1.0.2is a drop-in replacement for1.0.1.
1.0.1 #
Developer-experience release.
lib/kumo_ui.dartnow re-exports the core Flutter widget primitives (Widget,Column,Text,Color,WidgetsApp,Navigatorand friends), so an app can build a Kumo screen from a singleimport 'package:kumo_ui/kumo_ui.dart';.- Re-exports come from
package:flutter/widgets.dartonly. No Material or Cupertino symbols are exposed. - There is no
Marginre-export: Flutter has no such class, and spacing is expressed withEdgeInsets. - The bundled example now compiles without importing
package:flutter/widgets.dart.
1.0.0 #
- Initial stable release of
kumo_ui. - Complete component suite including inputs, navigation and responsive layouts.
0.1.0-beta.1 #
Initial public preview of the Kumo UI component set for Flutter.
- Added
KumoTheme,KumoColors,KumoPaletteandKumoTypography, with thekKumoBreakpointmobile/desktop switchover constant. - Added form controls:
KumoInput,KumoSwitch,KumoCheckbox,KumoSelect<T>,KumoSegmentedControl<T>andKumoButton. - Added navigation widgets:
KumoBreadcrumb,KumoTabsandKumoPagination. - Added structure widgets:
KumoHeader,KumoListGroupwithKumoListItem,KumoDataGridwithKumoDataCard,KumoAccordion,KumoBottomSheetwithKumoBottomSheetItem, andKumoResponsiveLayout. - Added content and overlay widgets:
KumoCodeBlock,KumoModal,KumoToastwithKumoToastManager, andKumoBadge. KumoPaletteexposes the raw ten-stepgray0–gray9ramp plus theorange5,blue5,red5,green5andamber5accents, and everyKumoColorstoken resolves to a step of it.- Every text token clears WCAG 2.1 AA (4.5:1) against each surface it is painted on, verified by a contrast test suite.
- Interactive widgets carry
Semanticsannotations, keep a 48px minimum touch target, and show a:focus-visible-style focus ring with Enter/Space activation. - Web targets throw
UnsupportedErrorthroughKumoTheme.of, and the library is built withoutmaterial.dartorcupertino.dart.