@startupjs-ui/modal 0.2.0-alpha.0 → 0.2.0-alpha.1

package/CHANGELOG.md

@@ -3,6 +3,17 @@
 All notable changes to this project will be documented in this file.
 See [Conventional Commits](https://conventionalcommits.org) for commit guidelines.
 
+# [0.2.0-alpha.1](https://github.com/startupjs/startupjs-ui/compare/v0.2.0-alpha.0...v0.2.0-alpha.1) (2026-04-10)
+
+
+### Bug Fixes
+
+* **dialogs:** use 'alertdialog' role for confirm(), prompt(), alert() ([ae2989f](https://github.com/startupjs/startupjs-ui/commit/ae2989fd6cf7b19a189330b3a180226727efc3fe))
+
+
+
+
+
 # [0.2.0-alpha.0](https://github.com/startupjs/startupjs-ui/compare/v0.1.22...v0.2.0-alpha.0) (2026-03-27)
 
 

package/README.mdx

@@ -160,6 +160,7 @@ The modal can automatically display action buttons at the bottom:
 | `$visible` | `any` | | Scoped model for two-way visibility binding |
 | `ref` | `RefObject` | | Imperative ref exposing `open()` and `close()` |
 | `title` | `string` | | Header title text |
+| `role` | `string` | `'dialog'` | Accessible role for the modal surface on web |
 | `cancelLabel` | `string` | `'Cancel'` | Label for the cancel button |
 | `confirmLabel` | `string` | `'Confirm'` | Label for the confirm button |
 | `showCross` | `boolean` | `true` | Whether to show a close icon in the header |

package/index.d.ts

@@ -2,7 +2,7 @@
 // DO NOT MODIFY THIS FILE - IT IS AUTOMATICALLY GENERATED ON COMMITS.
 
 import { type ReactNode, type ComponentType, type RefObject } from 'react';
-import { type StyleProp, type ViewStyle } from 'react-native';
+import { type StyleProp, type ViewStyle, type ViewProps } from 'react-native';
 type SupportedOrientation = 'portrait' | 'portrait-upside-down' | 'landscape' | 'landscape-left' | 'landscape-right';
 export declare const _PropsJsonSchema: {};
 export interface ModalProps {
@@ -22,6 +22,8 @@ export interface ModalProps {
     ref?: RefObject<any>;
     /** Header title text */
     title?: string;
+    /** Accessible role for the modal surface on web @default 'dialog' */
+    role?: ViewProps['role'];
     /** Label for cancel action @default 'Cancel' */
     cancelLabel?: string;
     /** Label for confirm action @default 'Confirm' */

package/index.tsx

@@ -5,7 +5,7 @@ import React, {
   type ComponentType,
   type RefObject
 } from 'react'
-import { SafeAreaView, Modal as RNModal, type StyleProp, type ViewStyle } from 'react-native'
+import { SafeAreaView, Modal as RNModal, type StyleProp, type ViewStyle, type ViewProps } from 'react-native'
 import { pug, observer, $ } from 'startupjs'
 import { themed } from '@startupjs-ui/core'
 import Portal from '@startupjs-ui/portal'
@@ -48,6 +48,8 @@ export interface ModalProps {
   ref?: RefObject<any>
   /** Header title text */
   title?: string
+  /** Accessible role for the modal surface on web @default 'dialog' */
+  role?: ViewProps['role']
   /** Label for cancel action @default 'Cancel' */
   cancelLabel?: string
   /** Label for confirm action @default 'Confirm' */
@@ -95,6 +97,7 @@ function ModalRoot ({
   $visible,
   ref,
   title,
+  role,
   cancelLabel = DEFAULT_CANCEL_LABEL,
   confirmLabel = DEFAULT_CONFIRM_LABEL,
   showCross = true,
@@ -175,6 +178,7 @@ function ModalRoot ({
             modalStyle=modalStyle
             variant=variant
             title=title
+            role=role
             cancelLabel=cancelLabel
             confirmLabel=confirmLabel
             showCross=showCross

package/layout.tsx

@@ -1,5 +1,5 @@
 import React, { useId, type ReactNode, type ComponentType } from 'react'
-import { View, TouchableOpacity, type StyleProp, type ViewStyle } from 'react-native'
+import { View, TouchableOpacity, type StyleProp, type ViewStyle, type ViewProps } from 'react-native'
 import { pug, observer } from 'startupjs'
 import { themed } from '@startupjs-ui/core'
 import ModalHeader from './ModalHeader'
@@ -18,6 +18,8 @@ export interface ModalLayoutProps {
   variant?: 'window' | 'fullscreen'
   /** Title rendered when no custom header provided */
   title?: string
+  /** Accessible role for the modal surface on web @default 'dialog' */
+  role?: ViewProps['role']
   /** DEPRECATED: use cancelLabel instead */
   dismissLabel?: string
   /** Cancel action label @default 'Cancel' */
@@ -48,6 +50,7 @@ function Modal ({
   children,
   variant,
   title,
+  role,
   dismissLabel,
   cancelLabel = DEFAULT_CANCEL_LABEL,
   confirmLabel = DEFAULT_CONFIRM_LABEL,
@@ -205,8 +208,8 @@ function Modal ({
       ModalElement.modal(
         style=modalStyle
         styleName=[variant]
-        role='dialog'
-        aria-modal=true
+        role=role ?? 'dialog'
+        aria-modal
         aria-label=titleId ? undefined : dialogTitle
         aria-labelledby=titleId
       )

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@startupjs-ui/modal",
-  "version": "0.2.0-alpha.0",
+  "version": "0.2.0-alpha.1",
   "publishConfig": {
     "access": "public"
   },
@@ -8,18 +8,18 @@
   "types": "index.d.ts",
   "type": "module",
   "dependencies": {
-    "@startupjs-ui/button": "^0.2.0-alpha.0",
-    "@startupjs-ui/core": "^0.2.0-alpha.0",
-    "@startupjs-ui/div": "^0.2.0-alpha.0",
-    "@startupjs-ui/icon": "^0.2.0-alpha.0",
-    "@startupjs-ui/portal": "^0.2.0-alpha.0",
-    "@startupjs-ui/scroll-view": "^0.2.0-alpha.0",
-    "@startupjs-ui/span": "^0.2.0-alpha.0"
+    "@startupjs-ui/button": "^0.2.0-alpha.1",
+    "@startupjs-ui/core": "^0.2.0-alpha.1",
+    "@startupjs-ui/div": "^0.2.0-alpha.1",
+    "@startupjs-ui/icon": "^0.2.0-alpha.1",
+    "@startupjs-ui/portal": "^0.2.0-alpha.1",
+    "@startupjs-ui/scroll-view": "^0.2.0-alpha.1",
+    "@startupjs-ui/span": "^0.2.0-alpha.1"
   },
   "peerDependencies": {
     "react": "*",
     "react-native": "*",
     "startupjs": "*"
   },
-  "gitHead": "a428246a18d0e7f77809043c8240253240d11d66"
+  "gitHead": "b48004779559b16c96a2a1995dab13b998eafce9"
 }