Skip to content

Reorganize sample apps and add new demo apps for UI5 controls - #684

Merged
oblomov-dev merged 49 commits into
standardfrom
claude/ui5-samples-ai-demokit-s5n5sg
Jul 19, 2026
Merged

Reorganize sample apps and add new demo apps for UI5 controls#684
oblomov-dev merged 49 commits into
standardfrom
claude/ui5-samples-ai-demokit-s5n5sg

Conversation

@oblomov-dev

Copy link
Copy Markdown
Member

Summary

This PR reorganizes the sample app structure and adds new demo applications showcasing additional UI5 controls and features. The main changes include renaming the primary index apps, moving apps between compatibility tiers, and introducing new demo apps for tree controls, date/time pickers, and other UI5 components.

Key Changes

App Reorganization

  • Renamed z2ui5_cl_sample_app_001z2ui5_cl_demo_app_g00 (primary demo index for src/01)
  • Renamed z2ui5_cl_sample_app_000z2ui5_cl_sample_app_g01 (extended samples index for src/00)
  • Updated documentation in AGENTS.md to reflect new categorization: "Basic I", "Basic II", and "Control Library"

New Demo Apps Added

  • z2ui5_cl_demo_app_453: Product table with dimensions and attributes
  • z2ui5_cl_demo_app_454: Product filtering with category grouping
  • z2ui5_cl_demo_app_455: Product list with category display
  • z2ui5_cl_demo_app_456: Calendar with appointments and scheduling
  • z2ui5_cl_demo_app_457: Date picker control
  • z2ui5_cl_demo_app_458: Input spinner/stepper control
  • z2ui5_cl_demo_app_459: Product list with filtering
  • z2ui5_cl_demo_app_460: Tree control (2-level hierarchy)
  • z2ui5_cl_demo_app_461: Tree control (2-level with file structure)
  • z2ui5_cl_demo_app_462: Tree control (3-level hierarchy)
  • z2ui5_cl_demo_app_463: Tree control (3-level with expanded nodes)
  • z2ui5_cl_demo_app_464: Message box and dialog examples

Apps Moved Between Tiers

  • Moved several apps from src/00/08 (extended) to src/01/02 (basic) for broader availability
  • Removed z2ui5_cl_demo_app_370 and z2ui5_cl_demo_app_451 from extended tier

Code Quality Improvements

  • Fixed class name casing inconsistencies (e.g., Z2UI5_CL_DEMO_APP_008z2ui5_cl_demo_app_008)
  • Updated XML file encoding declarations for consistency
  • Refactored view display patterns in multiple apps to use intermediate DATA(page) variables for better readability
  • Removed obsolete package descriptors from src/00/04, src/00/08, and src/01/05

Documentation Updates

  • Updated AGENTS.md to reflect new folder structure and app categorization
  • Updated scripts/generate-launchpad.js comments to reference new index app names

Build Configuration

  • Updated abaplint configuration to reference new branch for UI5 samples

https://claude.ai/code/session_018JnhapjtGyzgxzuzUoeeXW

claude and others added 30 commits July 18, 2026 11:37
Three new samples in framework - new (beta) (00/08), demoing the two
framework additions on the same branch:

- 453 Formatter - demo kit pack: one table using weightStateByValue,
  round2DP, dimensions, stockStatusState/-Icon and deliveryStatusState
  from the curated z2ui5/model/formatter module via core:require
- 454 Binding Call - filter and sort via backend event:
  binding_call_by_id applies a declarative filter/sorter to the list's
  items binding after the response - the model stays untouched
- 455 Binding Call - live filter without roundtrip:
  cs_event-binding_call wired via _event_client on liveChange, the query
  resolved client-side from the event - zero backend contact

Overview catalog regenerated.

Co-Authored-By: Claude Fable 5 <noreply@anthropic.com>
Claude-Session: https://claude.ai/code/session_018JnhapjtGyzgxzuzUoeeXW
453 chained two object_status cells without get_parent( ) - the builder
navigates into child-less controls too, so the second ObjectStatus nested
inside the first and view creation failed with "Cannot add direct child
without default aggregation" (live find). Fixed and the per-method
navigation rule documented in AGENTS.md.

456 (framework - new (beta)): the object-typed calendar date properties
(CalendarAppointment startDate/endDate, PlanningCalendar startDate) demand
real JS Date objects - a plain string binding crashes view creation. The
sample keeps plain ISO strings in the model and converts at the point of
use via Formatter.DateCreateObject from the curated module, so no other
binding of a timestamp field changes type.

Both view structures verified headless against the OpenUI5 runtime
(states, icons, round2DP, dimensions, appointments render; no errors).
Overview catalog regenerated.

Co-Authored-By: Claude Fable 5 <noreply@anthropic.com>
Claude-Session: https://claude.ai/code/session_018JnhapjtGyzgxzuzUoeeXW
The smallest possible demo of the object-typed date property pattern:
one DatePicker whose dateValue converts the model's ISO string via
Formatter.DateCreateObject, one Text proving the model itself stays a
plain string. Companion to the full PlanningCalendar sample 456.
Verified headless (real Date on the control, field renders the long
format, model string unchanged). Overview catalog regenerated.

Co-Authored-By: Claude Fable 5 <noreply@anthropic.com>
Claude-Session: https://claude.ai/code/session_018JnhapjtGyzgxzuzUoeeXW
An Integer-typed two-way binding plus a list bound to {message>/} - the
new framework wiring collects failed control validations automatically
(valueState included) and clears them on valid input; the sample has no
event handling at all. Overview catalog regenerated.

Co-Authored-By: Claude Fable 5 <noreply@anthropic.com>
Claude-Session: https://claude.ai/code/session_018JnhapjtGyzgxzuzUoeeXW
framework - action (01/02): a sap.m.Table with a dnd:DragDropInfo
(dropPosition Between); the drop event ships dragged/drop index and
position through client-side resolved $-args (the shipped app-307
pattern), ABAP reorders the table and view_model_update refreshes the
list - no new framework feature needed. The DragDropInfo goes through
_generic because the typed builder method lacks dropPosition.

View structure verified headless (DragDropInfo attached, rows render).
Also documents the clas.xml UTF-8 BOM convention in AGENTS.md (two human
BOM fixes today). Overview catalog regenerated.

Co-Authored-By: Claude Fable 5 <noreply@anthropic.com>
Claude-Session: https://claude.ai/code/session_018JnhapjtGyzgxzuzUoeeXW
Co-Authored-By: Claude Fable 5 <noreply@anthropic.com>
Claude-Session: https://claude.ai/code/session_018JnhapjtGyzgxzuzUoeeXW
456 (PlanningCalendar) and 457 (DatePicker) referenced hardcoded model
paths that were never registered through a bind call - the frontend
received no data for them, which surfaced as "Date must be a JavaScript
or UI5Date date object" on the object-typed startDate (live find). The
paths now come from client->_bind_edit( path = abap_true ) inline; 450,
453, 454 and 455 switched from one-way _bind to _bind_edit. Rule
recorded in AGENTS.md: binding paths always come from a bind call, never
hardcoded.

Co-Authored-By: Claude Fable 5 <noreply@anthropic.com>
Claude-Session: https://claude.ai/code/session_018JnhapjtGyzgxzuzUoeeXW
No rename needed (FOLDER_LOGIC=PREFIX); both overview catalogs
regenerated - the tile moved from sample_app_001 (framework - action)
to sample_app_000 (framework - new (beta)).

Co-Authored-By: Claude Fable 5 <noreply@anthropic.com>
Claude-Session: https://claude.ai/code/session_018JnhapjtGyzgxzuzUoeeXW
framework - new (beta): three samples showing nested ABAP tables as
sap.m.Tree models.

- 460 Tree - nested model: three NODES levels serialize into nested JSON
  arrays and bind directly, no flattening
- 461 Tree - drag and drop: DragDropInfo (dropPosition On) ships both
  binding context paths via client-side resolved $-args; ABAP moves the
  node between the nested tables and view_model_update refreshes
- 462 Tree - inside a popup: the same nested table bound in a Dialog via
  factory_popup, closed client-side (cs_event-popup_close)

Verified headless against the OpenUI5 runtime: three levels render and
expand, the DnD config attaches, context paths arrive as /T_NODES/n/NODES/m
- the exact format the 461 parser expects. Overview catalog regenerated.

Co-Authored-By: Claude Fable 5 <noreply@anthropic.com>
Claude-Session: https://claude.ai/code/session_018JnhapjtGyzgxzuzUoeeXW
Both overview catalogs regenerated - the tile moved from sample_app_001
to sample_app_000.

Co-Authored-By: Claude Fable 5 <noreply@anthropic.com>
Claude-Session: https://claude.ai/code/session_018JnhapjtGyzgxzuzUoeeXW
The binding context paths of two-way bound items arrive as
/XX/T_NODES/0/NODES/1 (debugger find) - the parser expected them without
the two-way model prefix and always hit the not-supported toast. It now
parses from the END of the path and validates the segment names, so any
prefix depth works.

Co-Authored-By: Claude Fable 5 <noreply@anthropic.com>
Claude-Session: https://claude.ai/code/session_018JnhapjtGyzgxzuzUoeeXW
The dialog tree gets the invisible z2ui5.cc.Tree companion (tree_id),
which snapshots the expand state before every roundtrip and re-applies
it after rendering. Closing therefore goes through a backend event
(popup_destroy) instead of the client-side popup_close - the snapshot
runs while the dialog still exists. Reopening shows the same nodes
expanded. Requires the cc Tree slot-resolution fix from the abap2UI5
branch (the companion previously only searched the MAIN slot).

Co-Authored-By: Claude Fable 5 <noreply@anthropic.com>
Claude-Session: https://claude.ai/code/session_018JnhapjtGyzgxzuzUoeeXW
Same z2ui5.cc.Tree companion as 462. The move event now answers with a
full view rebuild instead of view_model_update - the companion re-applies
the snapshotted expand state only when it renders, a pure model refresh
would leave the rebuilt tree binding collapsed.

Co-Authored-By: Claude Fable 5 <noreply@anthropic.com>
Claude-Session: https://claude.ai/code/session_018JnhapjtGyzgxzuzUoeeXW
Both overview catalogs regenerated for the graduated samples (450, 453,
456-462 moved out of framework - new (beta) upstream). 454 and 455 move
BACK to 00/08: they call binding_call_by_id / cs_event-binding_call,
which exist only on the abap2UI5 feature branch - src/01 is
syntax-checked against the abap2UI5 main dependency (src/00 is in
noIssues), so they graduate only once the framework branch is merged.
abaplint back to 0 issues.

Co-Authored-By: Claude Fable 5 <noreply@anthropic.com>
Claude-Session: https://claude.ai/code/session_018JnhapjtGyzgxzuzUoeeXW
454 (Binding Call - filter and sort) and 455 (live filter) move to
src/01/02 as requested. So the syntax check still resolves the new
binding_call_by_id / cs_event-binding_call API, the abap2UI5 dependency
in abaplint.jsonc and abap_cloud.jsonc is temporarily pinned to the
claude/ui5-samples-ai-demokit-s5n5sg feature branch - REVERT the pin to
the default branch once that abap2UI5 branch is merged. abap_702.jsonc
keeps its 702 downport branch (the API reaches it via auto_downport
after the merge; until then the 702 build flags 454/455). Overview
catalogs regenerated.

Co-Authored-By: Claude Fable 5 <noreply@anthropic.com>
Claude-Session: https://claude.ai/code/session_018JnhapjtGyzgxzuzUoeeXW
461 message strip now describes the actual behavior (full redraw + cc.Tree
keeps nodes expanded), not the view_model_update it does not use; a drop
onto a file's own parent folder is a no-op. 459 guards a row dropped onto
itself. No behavior change to the happy path.

Co-Authored-By: Claude Fable 5 <noreply@anthropic.com>
Claude-Session: https://claude.ai/code/session_018JnhapjtGyzgxzuzUoeeXW
The fourth tree sample, next to 460-462 in framework - use cases: each
node is a sap.m.CustomTreeItem holding an Input bound two-way to the node
text, so renaming a node writes back into the nested ABAP table (the
"Show model" button reads the roots back and toasts them). The
z2ui5.cc.Tree companion preserves the expand state across the roundtrip.
CustomTreeItem is built via _generic (no typed builder method). Editable
rendering and two-way write-back verified headless against the OpenUI5
runtime. Overview catalog regenerated.

Co-Authored-By: Claude Fable 5 <noreply@anthropic.com>
Claude-Session: https://claude.ai/code/session_018JnhapjtGyzgxzuzUoeeXW
framework - use cases (01/06): two buttons that each surface an unhandled
error so the new flow can be exercised live - a raised exception and a
genuine runtime dump (divide by zero). Both propagate uncaught, the
roundtrip returns HTTP 500 and the client shows the friendly "unexpected
error" popup (Details -> DebugTool Error tab, Restart -> reload). Overview
catalog regenerated.

Co-Authored-By: Claude Fable 5 <noreply@anthropic.com>
Claude-Session: https://claude.ai/code/session_018JnhapjtGyzgxzuzUoeeXW
Consolidate the three framework sample packages into one:
- 01/05 (framework - extended Controls) and 01/06 (framework - use cases)
  move into 01/02, which is renamed from "framework - action" to
  "framework - use cases" (42 samples total).
- Class names are folder-independent (FOLDER_LOGIC=PREFIX), so no renames
  and navigation is unaffected.
- Update the AGENTS.md §1 tree and the "where to file a demo" note to the
  single package; check-agents-structure passes.
- Regenerate both overview catalogs (npm run launchpad); the sample_app_001
  overview now shows one "framework - use cases" group. abaplint: 0 issues.

Co-Authored-By: Claude Opus 4.8 <noreply@anthropic.com>
Claude-Session: https://claude.ai/code/session_018JnhapjtGyzgxzuzUoeeXW
The "This overview is still under construction / classic overview" message
strip now lives on the extended overview (sample_app_000) instead of the
basic one (sample_app_001). sample_app_000 gains the class_exists( ) guard
(mirroring sample_app_001) so the strip's link to the classic overview app
only renders when z2ui5_cl_demo_app_000 is present.

Co-Authored-By: Claude Opus 4.8 <noreply@anthropic.com>
Claude-Session: https://claude.ai/code/session_018JnhapjtGyzgxzuzUoeeXW
…etter change

Make the controls section (01/08 demo-kit rebuilds) of the overview compact:
- Generator strips the namespace prefix from the header (sap.m.Switch -> Switch;
  the group heading already names the namespace) and truncates the description
  to one line (CONTROLS_SUB_MAX, word-boundary, + " ...") so it never wraps.
- New block_base( ) drives the blank-line grouping: in controls groups a block
  is all consecutive controls sharing the same first letter, so a blank line
  separates letter groups only (Button, ButtonGroup | Carousel); elsewhere the
  existing Roman-numeral base is kept. Added to both overview apps to keep them
  identical in shape.
- Document the rules in AGENTS.md (§3 block_base, §4 controls header/sub).

Regenerated both catalogs; abaplint 0 issues.

Co-Authored-By: Claude Opus 4.8 <noreply@anthropic.com>
Claude-Session: https://claude.ai/code/session_018JnhapjtGyzgxzuzUoeeXW
…trol Library)

Sync the AGENTS.md §1 tree to the renamed src/01 CTEXTs and regenerate the
overview catalogs so the group headings match. abaplint 0 issues.

Co-Authored-By: Claude Opus 4.8 <noreply@anthropic.com>
Claude-Session: https://claude.ai/code/session_018JnhapjtGyzgxzuzUoeeXW
git mv z2ui5_cl_demo_app_464 from 01/02 (Extended) to 01/01 (Basics) and
regenerate the overview catalogs. abaplint 0 issues.

Co-Authored-By: Claude Opus 4.8 <noreply@anthropic.com>
Claude-Session: https://claude.ai/code/session_018JnhapjtGyzgxzuzUoeeXW
Replace the "under construction" warning strip on sample_app_000 with an
Information strip: the Basic samples target maximum compatibility (plain
OpenUI5, every UI5 release since 1.71, ABAP Cloud and 7.02), while the
Extended samples here can need a specific system, so each one's ABAP stack /
UI5 release / other prerequisites must be checked. The classic-overview link
is kept (appended when that app exists). Doc note in AGENTS.md §3 updated.

Co-Authored-By: Claude Opus 4.8 <noreply@anthropic.com>
Claude-Session: https://claude.ai/code/session_018JnhapjtGyzgxzuzUoeeXW
oblomov-dev and others added 19 commits July 19, 2026 11:58
Pick up the latest class DESCRIPT changes in the sample_app_001 catalog.
abaplint 0 issues.

Co-Authored-By: Claude Opus 4.8 <noreply@anthropic.com>
Claude-Session: https://claude.ai/code/session_018JnhapjtGyzgxzuzUoeeXW
…les)

Reword the info message strip to explicitly distinguish the basic samples
(maximum compatibility) from the extended samples (may need a specific system).

Co-Authored-By: Claude Opus 4.8 <noreply@anthropic.com>
Claude-Session: https://claude.ai/code/session_018JnhapjtGyzgxzuzUoeeXW
Sync the AGENTS.md §1 tree to the renamed src/01 CTEXTs (01/01 -> "Basic I",
01/02 -> "Basic II") and regenerate the overview catalogs so the group
headings match. abaplint 0 issues.

Co-Authored-By: Claude Opus 4.8 <noreply@anthropic.com>
Claude-Session: https://claude.ai/code/session_018JnhapjtGyzgxzuzUoeeXW
…ample_app_g01

- z2ui5_cl_sample_app_001 (basic overview, src/01) -> z2ui5_cl_demo_app_g00
- z2ui5_cl_sample_app_000 (extended overview, src/00) -> z2ui5_cl_sample_app_g01
- Update every reference: the classes' own CLSNAME/definition, the two
  cross-navigation links (class_exists guard + app_start URLs), the generator
  TARGETS, and the AGENTS.md §3/§4 docs.
- Since demo_app_g00 now shares the z2ui5_cl_demo_app* prefix the generator
  uses to find sample tiles, add an OVERVIEW_APPS skip so an overview never
  lists itself. Regenerated catalogs (334 tiles unchanged); abaplint 0 issues.

Co-Authored-By: Claude Opus 4.8 <noreply@anthropic.com>
Claude-Session: https://claude.ai/code/session_018JnhapjtGyzgxzuzUoeeXW
Pick up the latest src/01/02 class DESCRIPT changes in the demo_app_g00 catalog.
abaplint 0 issues.

Co-Authored-By: Claude Opus 4.8 <noreply@anthropic.com>
Claude-Session: https://claude.ai/code/session_018JnhapjtGyzgxzuzUoeeXW
Drop the inter-block sapUiSmallMarginTop gap in sample_app_g01's view_display
so every sample lists directly under the previous one; keep the per-group H3
titles and the column alignment. Documented the basic/extended difference in
AGENTS.md §3. abaplint 0 issues.

Co-Authored-By: Claude Opus 4.8 <noreply@anthropic.com>
Claude-Session: https://claude.ai/code/session_018JnhapjtGyzgxzuzUoeeXW
- Sync AGENTS.md §1 tree to the reworked src/00 (new 00/00 "extended",
  removed 00/04 "use of z2ui5" and 00/08 "beta"); update the §2 restriction
  list and §4 ordering example accordingly.
- Z2UI5_CL_DEMO_APP_445 DESCRIPT: "Model - Device Model in views and popups"
  -> "Model - Device Model".
- Regenerate both overview catalogs. check:agents passes, abaplint 0 issues.

Co-Authored-By: Claude Opus 4.8 <noreply@anthropic.com>
Claude-Session: https://claude.ai/code/session_018JnhapjtGyzgxzuzUoeeXW
- Add an explanatory intro MessageStrip (Information, showicon, sapUiSmallMargin)
  to every sample in 01/01 and 01/02 that lacked one, describing what it demos.
- 01/02: append (C)/(A)/(A,C) markers to the DESCRIPT of samples that use a
  custom control (_z2ui5 / z2ui5 cc namespace) and/or a frontend action
  (_event_client, follow_up_action, control_call, binding_call, drag&drop).
- Rename 073 -> "Browser - Open an URL in a new tab" and 316 -> "Browser -
  Open Telephon, Email usw".
- Remove the unusual footer Back button from the MessageToast (381) and
  MessageBox (382) samples (the shell already has the nav-back button).
- Regenerate both overview catalogs. abaplint 0 issues, structure check passes.

Co-Authored-By: Claude Opus 4.8 <noreply@anthropic.com>
Claude-Session: https://claude.ai/code/session_018JnhapjtGyzgxzuzUoeeXW
The device / frontend-info form is a read-only display, so disable all its
inputs (enabled = abap_false).

Co-Authored-By: Claude Opus 4.8 <noreply@anthropic.com>
Claude-Session: https://claude.ai/code/session_018JnhapjtGyzgxzuzUoeeXW
…ead-only inputs)

Record the conventions established while curating 01/01 and 01/02: every sample
opens with an explanatory MessageStrip; 01/02 DESCRIPTs carry (A)/(C)/(A,C)
capability markers; read-only info forms disable their inputs; no redundant
footer Back button.

Co-Authored-By: Claude Opus 4.8 <noreply@anthropic.com>
Claude-Session: https://claude.ai/code/session_018JnhapjtGyzgxzuzUoeeXW
- 325 (Input - Clipboard) and 017 (ObjectPage): remove `heading( `uxap` )`
  on ObjectPageSection. sap.uxap.ObjectPageSection has no `heading`
  aggregation, so on 1.71 UI5 resolved `<uxap:heading>` as a control and
  failed with "failed to load sap/uxap/heading.js". In 017 the one
  non-empty heading (a message strip) is moved into the first sub-section.
- 189 (Focus - Jump with the focus): set the SimpleForm `editable` so the
  label/input pairs render aligned on one row (matches sample 133).
- 01/02 titles: page title now carries the class-description text where it
  was missing (045 was a copy-paste of 006's title; 078, 120, 316, 448,
  449 now name the actual feature).

Full static audit of all 195 sample classes in package 01: no other
"failed to load" control-load risks on 1.71 remain.

Co-Authored-By: Claude Opus 4.8 <noreply@anthropic.com>
Claude-Session: https://claude.ai/code/session_018JnhapjtGyzgxzuzUoeeXW
…ligned info

In the Binding Call filter/sort list samples the category was bound to the
StandardListItem `info` slot, which right-aligns it to the far edge of the
list and looks disconnected on a wide screen. Bind it to `description`
instead, so the category reads as a subtitle under the product name.

Co-Authored-By: Claude Opus 4.8 <noreply@anthropic.com>
Claude-Session: https://claude.ai/code/session_018JnhapjtGyzgxzuzUoeeXW
The ui.Table Default Filtering sample built its page directly on the view
(view->page(...)); every other sample starts from view->shell( )->page(...).
Add the shell for a consistent frame.

Co-Authored-By: Claude Opus 4.8 <noreply@anthropic.com>
Claude-Session: https://claude.ai/code/session_018JnhapjtGyzgxzuzUoeeXW
Add conventions learned while fixing samples: watch for phantom-control 404s
on 1.71 (heading on ObjectPageSection, <footer> on Dialog); SimpleForm needs
editable=abap_true for aligned rows; StandardListItem info vs description;
page title should carry the DESCRIPT text; start views from shell( )->page( );
give search_field an explicit placeholder.

Co-Authored-By: Claude Opus 4.8 <noreply@anthropic.com>
Claude-Session: https://claude.ai/code/session_018JnhapjtGyzgxzuzUoeeXW
@oblomov-dev
oblomov-dev merged commit 5a72fe8 into standard Jul 19, 2026
2 of 6 checks passed
@oblomov-dev
oblomov-dev deleted the claude/ui5-samples-ai-demokit-s5n5sg branch July 19, 2026 16:54
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment

Labels

None yet

Projects

None yet

Development

Successfully merging this pull request may close these issues.

2 participants