@sakura-ui/sakura-ui 0.4.1 → 0.5.0

package/packages/forms/dist/types/components/Checkbox.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"Checkbox.d.ts","sourceRoot":"","sources":["../../../src/components/Checkbox.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,EAAE,EAAE,KAAK,qBAAqB,EAAE,MAAM,OAAO,CAAA;AAGzD,OAAO,EACL,KAAK,SAAS,EAIf,MAAM,cAAc,CAAA;AAErB,yBAAiB,QAAQ,CAAC;IACxB,UAAiB,KAAM,SAAQ,IAAI,CAAC,qBAAqB,CAAC,OAAO,CAAC,EAAE,MAAM,CAAC;QACzE,IAAI,CAAC,EAAE,SAAS,CAAA;KACjB;CACF;AAED,eAAO,MAAM,QAAQ;YAAW,QAAQ,CAAC,KAAK;;CA0E7C,CAAA"}
+{"version":3,"file":"Checkbox.d.ts","sourceRoot":"","sources":["../../../src/components/Checkbox.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,EAAE,EAAE,KAAK,qBAAqB,EAAE,MAAM,OAAO,CAAA;AAGzD,OAAO,EACL,KAAK,SAAS,EAIf,MAAM,cAAc,CAAA;AAErB,yBAAiB,QAAQ,CAAC;IACxB,UAAiB,KAAM,SAAQ,IAAI,CAAC,qBAAqB,CAAC,OAAO,CAAC,EAAE,MAAM,CAAC;QACzE,IAAI,CAAC,EAAE,SAAS,CAAA;KACjB;CACF;AAED,eAAO,MAAM,QAAQ;YAAW,QAAQ,CAAC,KAAK;;CAyE7C,CAAA"}

package/packages/forms/dist/types/components/FileInput.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"FileInput.d.ts","sourceRoot":"","sources":["../../../src/components/FileInput.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,EAAE,EAAE,KAAK,qBAAqB,EAAE,MAAM,OAAO,CAAA;AAGzD,OAAO,KAAK,EAAE,SAAS,EAAE,MAAM,cAAc,CAAA;AAE7C,yBAAiB,SAAS,CAAC;IACzB,UAAiB,KAAM,SAAQ,IAAI,CAAC,qBAAqB,CAAC,OAAO,CAAC,EAAE,MAAM,CAAC;QACzE,IAAI,CAAC,EAAE,SAAS,CAAA;KACjB;CACF;AAED,eAAO,MAAM,SAAS;YAAW,SAAS,CAAC,KAAK;;CA2F/C,CAAA"}
+{"version":3,"file":"FileInput.d.ts","sourceRoot":"","sources":["../../../src/components/FileInput.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,EAAE,EAAE,KAAK,qBAAqB,EAAE,MAAM,OAAO,CAAA;AAGzD,OAAO,KAAK,EAAE,SAAS,EAAE,MAAM,cAAc,CAAA;AAE7C,yBAAiB,SAAS,CAAC;IACzB,UAAiB,KAAM,SAAQ,IAAI,CAAC,qBAAqB,CAAC,OAAO,CAAC,EAAE,MAAM,CAAC;QACzE,IAAI,CAAC,EAAE,SAAS,CAAA;KACjB;CACF;AAED,eAAO,MAAM,SAAS;YAAW,SAAS,CAAC,KAAK;;CAsF/C,CAAA"}

package/packages/forms/dist/types/components/Input.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"Input.d.ts","sourceRoot":"","sources":["../../../src/components/Input.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,EAAE,EAAE,KAAK,qBAAqB,EAAE,MAAM,OAAO,CAAA;AAGzD,OAAO,EACL,KAAK,SAAS,EAGf,MAAM,cAAc,CAAA;AAErB,yBAAiB,KAAK,CAAC;IACrB,UAAiB,KAAM,SAAQ,IAAI,CAAC,qBAAqB,CAAC,OAAO,CAAC,EAAE,MAAM,CAAC;QACzE,IAAI,CAAC,EAAE,SAAS,CAAA;KACjB;CACF;AAED,eAAO,MAAM,KAAK;YAAW,KAAK,CAAC,KAAK;;CAuBvC,CAAA"}
+{"version":3,"file":"Input.d.ts","sourceRoot":"","sources":["../../../src/components/Input.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,EAAE,EAAE,KAAK,qBAAqB,EAAE,MAAM,OAAO,CAAA;AAGzD,OAAO,EACL,KAAK,SAAS,EAGf,MAAM,cAAc,CAAA;AAErB,yBAAiB,KAAK,CAAC;IACrB,UAAiB,KAAM,SAAQ,IAAI,CAAC,qBAAqB,CAAC,OAAO,CAAC,EAAE,MAAM,CAAC;QACzE,IAAI,CAAC,EAAE,SAAS,CAAA;KACjB;CACF;AAED,eAAO,MAAM,KAAK;YAAW,KAAK,CAAC,KAAK;;CAsBvC,CAAA"}

package/packages/forms/dist/types/components/Radio.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"Radio.d.ts","sourceRoot":"","sources":["../../../src/components/Radio.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,EAAE,EAAE,KAAK,qBAAqB,EAAE,MAAM,OAAO,CAAA;AAGzD,OAAO,EACL,KAAK,SAAS,EAIf,MAAM,cAAc,CAAA;AAErB,yBAAiB,KAAK,CAAC;IACrB,UAAiB,KAAM,SAAQ,IAAI,CAAC,qBAAqB,CAAC,OAAO,CAAC,EAAE,MAAM,CAAC;QACzE,IAAI,CAAC,EAAE,SAAS,CAAA;KACjB;CACF;AAED,eAAO,MAAM,KAAK;YAAW,KAAK,CAAC,KAAK;;CAiEvC,CAAA"}
+{"version":3,"file":"Radio.d.ts","sourceRoot":"","sources":["../../../src/components/Radio.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,EAAE,EAAE,KAAK,qBAAqB,EAAE,MAAM,OAAO,CAAA;AAGzD,OAAO,EACL,KAAK,SAAS,EAIf,MAAM,cAAc,CAAA;AAErB,yBAAiB,KAAK,CAAC;IACrB,UAAiB,KAAM,SAAQ,IAAI,CAAC,qBAAqB,CAAC,OAAO,CAAC,EAAE,MAAM,CAAC;QACzE,IAAI,CAAC,EAAE,SAAS,CAAA;KACjB;CACF;AAED,eAAO,MAAM,KAAK;YAAW,KAAK,CAAC,KAAK;;CA8DvC,CAAA"}

package/packages/forms/dist/types/components/Select.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"Select.d.ts","sourceRoot":"","sources":["../../../src/components/Select.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,EAAE,EAAE,KAAK,qBAAqB,EAAE,MAAM,OAAO,CAAA;AAGzD,OAAO,EACL,KAAK,SAAS,EAGf,MAAM,cAAc,CAAA;AAErB,yBAAiB,MAAM,CAAC;IACtB,UAAiB,KAAM,SAAQ,IAAI,CAAC,qBAAqB,CAAC,QAAQ,CAAC,EAAE,MAAM,CAAC;QAC1E,IAAI,CAAC,EAAE,SAAS,CAAA;KACjB;CACF;AAED,eAAO,MAAM,MAAM;YAAW,MAAM,CAAC,KAAK;;CA2DzC,CAAA"}
+{"version":3,"file":"Select.d.ts","sourceRoot":"","sources":["../../../src/components/Select.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,EAAE,EAAE,KAAK,qBAAqB,EAAE,MAAM,OAAO,CAAA;AAGzD,OAAO,EACL,KAAK,SAAS,EAGf,MAAM,cAAc,CAAA;AAErB,yBAAiB,MAAM,CAAC;IACtB,UAAiB,KAAM,SAAQ,IAAI,CAAC,qBAAqB,CAAC,QAAQ,CAAC,EAAE,MAAM,CAAC;QAC1E,IAAI,CAAC,EAAE,SAAS,CAAA;KACjB;CACF;AAED,eAAO,MAAM,MAAM;YAAW,MAAM,CAAC,KAAK;;CA0DzC,CAAA"}

package/packages/forms/dist/types/components/Textarea.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"Textarea.d.ts","sourceRoot":"","sources":["../../../src/components/Textarea.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,EAAE,EAAE,KAAK,qBAAqB,EAAE,MAAM,OAAO,CAAA;AAIzD,yBAAiB,QAAQ,CAAC;IACxB,UAAiB,KAAM,SAAQ,qBAAqB,CAAC,UAAU,CAAC;KAAG;CACpE;AAED,eAAO,MAAM,QAAQ;YAAW,QAAQ,CAAC,KAAK;;CAyD7C,CAAA"}
+{"version":3,"file":"Textarea.d.ts","sourceRoot":"","sources":["../../../src/components/Textarea.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,EAAE,EAAE,KAAK,qBAAqB,EAAE,MAAM,OAAO,CAAA;AAIzD,yBAAiB,QAAQ,CAAC;IACxB,UAAiB,KAAM,SAAQ,qBAAqB,CAAC,UAAU,CAAC;KAAG;CACpE;AAED,eAAO,MAAM,QAAQ;YAAW,QAAQ,CAAC,KAAK;;CAwD7C,CAAA"}

package/packages/forms/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@sakura-ui/forms",
-  "version": "0.4.1",
+  "version": "0.4.2",
   "description": "",
   "keywords": [],
   "author": "glassonion1",

package/packages/forms/src/components/Checkbox.tsx

@@ -68,7 +68,6 @@ export const Checkbox = (props: Checkbox.Props) => {
           aria-describedby={ctx.helperTextId}
           aria-errormessage={ctx.errorMessageId}
           aria-invalid={ctx.isInvalid ?? false}
-          aria-required={ctx.isRequired ?? false}
           {...restProps}
         />
         <span className={cx(styleCheck, iconStyles[size])}>

package/packages/forms/src/components/FileInput.tsx

@@ -81,12 +81,10 @@ export const FileInput = (props: FileInput.Props) => {
     `
   }
 
-  // TODO: aria-required is not valid on input[type=file] and role="button" does not
-  // describe a file picker. Both need to be reworked (the required attribute changes
-  // form submission behaviour), so they are tracked separately from this change.
+  // The accessible name comes from the associated label (LabelControl, or a label
+  // supplied by the caller). Do not set aria-label here: it would override that name
+  // and every file input on a page would announce the same thing.
   return (
-    // biome-ignore lint/a11y/useAriaPropsSupportedByRole: see the TODO above
-    // biome-ignore lint/a11y/useSemanticElements: see the TODO above
     <input
       type="file"
       id={id || ctx.id}
@@ -94,9 +92,6 @@ export const FileInput = (props: FileInput.Props) => {
       aria-describedby={ctx.helperTextId}
       aria-errormessage={ctx.errorMessageId}
       aria-invalid={ctx.isInvalid ?? false}
-      aria-required={ctx.isRequired ?? false}
-      role="button"
-      aria-label="File Upload"
       {...restProps}
     />
   )

package/packages/forms/src/components/Input.tsx

@@ -32,7 +32,6 @@ export const Input = (props: Input.Props) => {
       aria-describedby={ctx.helperTextId}
       aria-errormessage={ctx.errorMessageId}
       aria-invalid={ctx.isInvalid ?? false}
-      aria-required={ctx.isRequired ?? false}
       {...restProps}
     />
   )

package/packages/forms/src/components/Radio.tsx

@@ -59,8 +59,6 @@ export const Radio = (props: Radio.Props) => {
       )}
     >
       <span className="flex items-center">
-        {/* TODO: aria-required belongs on the radiogroup (FieldsetControl), not on each radio */}
-        {/* biome-ignore lint/a11y/useAriaPropsSupportedByRole: see the TODO above */}
         <input
           id={radioId}
           className={styleInput}
@@ -68,7 +66,6 @@ export const Radio = (props: Radio.Props) => {
           aria-describedby={ctx.helperTextId}
           aria-errormessage={ctx.errorMessageId}
           aria-invalid={ctx.isInvalid ?? false}
-          aria-required={ctx.isRequired ?? false}
           {...restProps}
         />
         <span

package/packages/forms/src/components/Select.tsx

@@ -50,7 +50,6 @@ export const Select = (props: Select.Props) => {
         aria-describedby={ctx.helperTextId}
         aria-errormessage={ctx.errorMessageId}
         aria-invalid={ctx.isInvalid ?? false}
-        aria-required={ctx.isRequired ?? false}
         {...restProps}
       >
         {children}

package/packages/forms/src/components/Textarea.tsx

@@ -47,7 +47,6 @@ export const Textarea = (props: Textarea.Props) => {
         aria-describedby={ctx.helperTextId}
         aria-errormessage={ctx.errorMessageId}
         aria-invalid={ctx.isInvalid ?? false}
-        aria-required={ctx.isRequired ?? false}
         onChange={onChangeHandler}
         {...restProps}
       >

package/packages/forms/tests/FileInput.test.tsx

@@ -2,17 +2,42 @@ import React from 'react'
 import { describe, it, expect, vi } from 'vitest'
 import { render, screen } from '@testing-library/react'
 
-import { FileInput } from '../src'
+import { FileInput, LabelControl } from '../src'
 
 describe('FileInput', () => {
-  it('should render a file input with a label text', async () => {
-    render(<FileInput />)
+  it('should render a file input', async () => {
+    // input[type=file] maps to no ARIA role, so it cannot be queried by role
+    const { container } = render(<FileInput />)
 
-    const input = screen.getByRole('button')
+    const input = container.querySelector('input[type="file"]')
 
     expect(input).toBeInTheDocument()
+  })
+
+  it('should take its accessible name from the surrounding label', async () => {
+    render(
+      <LabelControl labelText="添付書類">
+        <FileInput />
+      </LabelControl>
+    )
+
+    const input = screen.getByLabelText('添付書類')
+
+    expect(input).toBeInTheDocument()
+    // Asserting the accessible name rather than using getByLabelText alone:
+    // getByLabelText also matches aria-label, so it would still pass if the
+    // component set a generic name of its own and shadowed the label.
+    expect(input).toHaveAccessibleName('添付書類')
+  })
+
+  it('should be required when the label control marks it as required', async () => {
+    render(
+      <LabelControl labelText="添付書類" isRequired>
+        <FileInput />
+      </LabelControl>
+    )
 
-    expect(screen.getByLabelText('File Upload')).toBeInTheDocument()
+    expect(screen.getByLabelText(/添付書類/)).toBeRequired()
   })
 
   it('should pass an object to the ref property', async () => {

package/packages/helper/.turbo/turbo-build.log

@@ -9,4 +9,4 @@ rendering chunks...
 computing gzip size...
 dist/index.es.js  2.90 kB │ gzip: 1.00 kB
 dist/index.cjs.js  2.72 kB │ gzip: 0.99 kB
-✓ built in 303ms
+✓ built in 168ms

package/packages/markdown/.turbo/turbo-build.log

@@ -1,12 +1,12 @@
 $ rimraf dist
 $ run-p build:*
 $ vite build
+$ tsc && tsc-alias
 vite v7.3.6 building client environment for production...
 transforming...
-$ tsc && tsc-alias
 ✓ 365 modules transformed.
 rendering chunks...
 computing gzip size...
-dist/index.es.js  554.27 kB │ gzip: 141.23 kB
-dist/index.cjs.js  377.84 kB │ gzip: 117.18 kB
-✓ built in 4.49s
+dist/index.es.js  554.82 kB │ gzip: 141.39 kB
+dist/index.cjs.js  378.23 kB │ gzip: 117.29 kB
+✓ built in 2.18s