@godxjp/ui 30.9.0 → 31.0.3

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
Files changed (56) hide show
  1. package/README.md +2 -1
  2. package/agent/START-HERE.md +1 -1
  3. package/agent/components/PrefetchLink.json +3 -3
  4. package/agent/components-index.json +1 -1
  5. package/agent/components.json +3 -3
  6. package/agent/index.json +2 -2
  7. package/agent/llms.txt +3 -3
  8. package/agent/patterns/settings-page-responsive.json +1 -1
  9. package/agent/patterns.json +1 -1
  10. package/dist/components/query/index.d.ts +0 -2
  11. package/dist/components/query/index.js +0 -2
  12. package/dist/components/react-router/index.d.ts +2 -0
  13. package/dist/components/react-router/index.js +4 -0
  14. package/dist/contracts/measurement.json +1 -1
  15. package/dist/i18n/translate.d.ts +2 -0
  16. package/dist/i18n/translate.js +7 -0
  17. package/dist/i18n/use-translation.d.ts +5 -4
  18. package/dist/i18n/use-translation.js +28 -7
  19. package/dist/styles/alert-layout.css +4 -2
  20. package/dist/styles/layers.json +1 -1
  21. package/docs/CONSUMER-RULES.md +2 -2
  22. package/docs/data-display/permission-matrix.tsx +30 -28
  23. package/docs/data-entry/cascader.tsx +22 -20
  24. package/docs/data-entry/date-picker.tsx +47 -43
  25. package/docs/data-entry/form-field/examples/a11y-contract.tsx +80 -76
  26. package/docs/data-entry/form-field/examples/create-form.tsx +33 -31
  27. package/docs/data-entry/form-field/index.tsx +61 -57
  28. package/docs/data-entry/form.tsx +112 -106
  29. package/docs/data-entry/input.tsx +297 -270
  30. package/docs/data-entry/label.tsx +11 -9
  31. package/docs/data-entry/number-input.tsx +86 -78
  32. package/docs/data-entry/radio-group.tsx +33 -26
  33. package/docs/data-entry/rating.tsx +29 -25
  34. package/docs/data-entry/select-matrix.tsx +49 -47
  35. package/docs/data-entry/select.tsx +38 -35
  36. package/docs/data-entry/slider.tsx +45 -41
  37. package/docs/data-entry/textarea.tsx +44 -42
  38. package/docs/data-entry/time-picker.tsx +51 -47
  39. package/docs/feedback/sheet.tsx +84 -79
  40. package/docs/foundation/theme-editor.tsx +133 -124
  41. package/docs/general/button/examples/form-actions.tsx +17 -15
  42. package/docs/layout/auth-recovery/examples/password-recovery.tsx +31 -29
  43. package/docs/layout/auth-shell-registration.tsx +75 -72
  44. package/docs/layout/auth-shell-variants.tsx +55 -51
  45. package/docs/layout/space-compact.tsx +11 -8
  46. package/docs/{query → react-router}/prefetch-link.tsx +1 -1
  47. package/docs/showcase/caimono-price-comparison.tsx +59 -51
  48. package/docs/showcase/case3-approval-workflow.tsx +27 -25
  49. package/docs/showcase/case4-login.tsx +37 -34
  50. package/docs/showcase/permission-matrix.tsx +44 -42
  51. package/docs/showcase/theme-customization.tsx +108 -99
  52. package/package.json +6 -2
  53. package/scripts/consumer-rule.md +22 -0
  54. package/scripts/ui-audit.mjs +99 -2
  55. /package/dist/components/{query → react-router}/prefetch-link.d.ts +0 -0
  56. /package/dist/components/{query → react-router}/prefetch-link.js +0 -0
package/docs/data-entry/form.tsx CHANGED
@@ -773,45 +773,47 @@ export default function Demo() {
773
773
  </CardDescription>
774
774
  </CardHeader>
775
775
  <CardContent>
776
- <Flex direction="col" gap="md">
777
- <Field
778
- id="f-terms"
779
- label="利用規約に同意する"
780
- description="同意しないと送信できません"
781
- >
782
- <Checkbox id="f-terms" checked={terms} onCheckedChange={(c) => setTerms(!!c)} />
783
- </Field>
784
- <FormField id="f-channels" label="通知チャネル" helper="複数選択可">
785
- <CheckboxGroup
786
- value={channels}
787
- onValueChange={setChannels}
788
- options={[
789
- { value: "email", label: "メール" },
790
- { value: "slack", label: "Slack" },
791
- { value: "sms", label: "SMS" },
792
- ]}
793
- />
794
- </FormField>
795
- <FormField id="f-rounding" label="端数処理">
796
- <RadioGroup
797
- value={rounding}
798
- onValueChange={setRounding}
799
- orientation="horizontal"
800
- options={[
801
- { value: "round", label: "四捨五入" },
802
- { value: "floor", label: "切り捨て" },
803
- { value: "ceil", label: "切り上げ" },
804
- ]}
805
- />
806
- </FormField>
807
- <Field
808
- id="f-active"
809
- label="取引を有効にする"
810
- description="無効にすると新規取引を登録できません"
811
- >
812
- <Switch id="f-active" checked={active} onCheckedChange={setActive} />
813
- </Field>
814
- </Flex>
776
+ <Form>
777
+ <Flex direction="col" gap="md">
778
+ <Field
779
+ id="f-terms"
780
+ label="利用規約に同意する"
781
+ description="同意しないと送信できません"
782
+ >
783
+ <Checkbox id="f-terms" checked={terms} onCheckedChange={(c) => setTerms(!!c)} />
784
+ </Field>
785
+ <FormField id="f-channels" label="通知チャネル" helper="複数選択可">
786
+ <CheckboxGroup
787
+ value={channels}
788
+ onValueChange={setChannels}
789
+ options={[
790
+ { value: "email", label: "メール" },
791
+ { value: "slack", label: "Slack" },
792
+ { value: "sms", label: "SMS" },
793
+ ]}
794
+ />
795
+ </FormField>
796
+ <FormField id="f-rounding" label="端数処理">
797
+ <RadioGroup
798
+ value={rounding}
799
+ onValueChange={setRounding}
800
+ orientation="horizontal"
801
+ options={[
802
+ { value: "round", label: "四捨五入" },
803
+ { value: "floor", label: "切り捨て" },
804
+ { value: "ceil", label: "切り上げ" },
805
+ ]}
806
+ />
807
+ </FormField>
808
+ <Field
809
+ id="f-active"
810
+ label="取引を有効にする"
811
+ description="無効にすると新規取引を登録できません"
812
+ >
813
+ <Switch id="f-active" checked={active} onCheckedChange={setActive} />
814
+ </Field>
815
+ </Flex>
816
+ </Form>
815
817
  </CardContent>
816
818
  </Card>
817
819
 
@@ -823,28 +825,30 @@ export default function Demo() {
823
825
  </CardDescription>
824
826
  </CardHeader>
825
827
  <CardContent>
826
- <Flex direction="col" gap="md">
827
- <FormField id="f-tax" label={`消費税率: ${taxRate[0]}%`} helper="0% / 8% / 10%">
828
- <Slider
829
- id="f-tax"
830
- value={taxRate}
831
- onValueChange={setTaxRate}
832
- min={0}
833
- max={10}
834
- step={2}
835
- name="tax_rate"
836
- aria-label="消費税率"
837
- />
838
- </FormField>
839
- <FormField id="f-score" label="取引先評価">
840
- <Rating
841
- name="vendor_score"
842
- aria-label="取引先評価"
843
- value={score}
844
- onValueChange={setScore}
845
- />
846
- </FormField>
847
- </Flex>
828
+ <Form>
829
+ <Flex direction="col" gap="md">
830
+ <FormField id="f-tax" label={`消費税率: ${taxRate[0]}%`} helper="0% / 8% / 10%">
831
+ <Slider
832
+ id="f-tax"
833
+ value={taxRate}
834
+ onValueChange={setTaxRate}
835
+ min={0}
836
+ max={10}
837
+ step={2}
838
+ name="tax_rate"
839
+ aria-label="消費税率"
840
+ />
841
+ </FormField>
842
+ <FormField id="f-score" label="取引先評価">
843
+ <Rating
844
+ name="vendor_score"
845
+ aria-label="取引先評価"
846
+ value={score}
847
+ onValueChange={setScore}
848
+ />
849
+ </FormField>
850
+ </Flex>
851
+ </Form>
848
852
  </CardContent>
849
853
  </Card>
850
854
 
@@ -931,51 +935,53 @@ export default function Demo() {
931
935
  </CardDescription>
932
936
  </CardHeader>
933
937
  <CardContent>
934
- <Flex direction="col" gap="md">
935
- <FormField id="f-tags" label="ラベル" helper="Enter またはカンマで追加">
936
- <TagInput
937
- value={tags}
938
- onValueChange={setTags}
939
- placeholder="ラベルを追加…"
940
- name="labels"
941
- />
942
- </FormField>
943
- <FormField id="f-period2" label="集計期間">
944
- <ToggleGroup
945
- type="single"
946
- value={period2}
947
- onValueChange={(v) => {
948
- if (v) setPeriod2(v);
949
- }}
950
- >
951
- <ToggleGroupItem value="daily">日次</ToggleGroupItem>
952
- <ToggleGroupItem value="monthly">月次</ToggleGroupItem>
953
- <ToggleGroupItem value="yearly">年次</ToggleGroupItem>
954
- </ToggleGroup>
955
- </FormField>
956
- <FormField id="f-otp" label="認証コード" helper="メールに届いた6桁の数字">
957
- <InputOTP id="f-otp" maxLength={6} value={otp} onChange={setOtp}>
958
- <InputOTPGroup>
959
- <InputOTPSlot index={0} />
960
- <InputOTPSlot index={1} />
961
- <InputOTPSlot index={2} />
962
- <InputOTPSlot index={3} />
963
- <InputOTPSlot index={4} />
964
- <InputOTPSlot index={5} />
965
- </InputOTPGroup>
966
- </InputOTP>
967
- </FormField>
968
- <FormField id="f-files" label="添付ファイル" helper="PDF・Excel（最大5件）">
969
- <Upload
970
- variant="dropzone"
971
- value={files}
972
- onValueChange={setFiles}
973
- accept=".pdf,.xlsx,.csv"
974
- maxCount={5}
975
- onUpload={noopUpload}
976
- />
977
- </FormField>
978
- </Flex>
938
+ <Form>
939
+ <Flex direction="col" gap="md">
940
+ <FormField id="f-tags" label="ラベル" helper="Enter またはカンマで追加">
941
+ <TagInput
942
+ value={tags}
943
+ onValueChange={setTags}
944
+ placeholder="ラベルを追加…"
945
+ name="labels"
946
+ />
947
+ </FormField>
948
+ <FormField id="f-period2" label="集計期間">
949
+ <ToggleGroup
950
+ type="single"
951
+ value={period2}
952
+ onValueChange={(v) => {
953
+ if (v) setPeriod2(v);
954
+ }}
955
+ >
956
+ <ToggleGroupItem value="daily">日次</ToggleGroupItem>
957
+ <ToggleGroupItem value="monthly">月次</ToggleGroupItem>
958
+ <ToggleGroupItem value="yearly">年次</ToggleGroupItem>
959
+ </ToggleGroup>
960
+ </FormField>
961
+ <FormField id="f-otp" label="認証コード" helper="メールに届いた6桁の数字">
962
+ <InputOTP id="f-otp" maxLength={6} value={otp} onChange={setOtp}>
963
+ <InputOTPGroup>
964
+ <InputOTPSlot index={0} />
965
+ <InputOTPSlot index={1} />
966
+ <InputOTPSlot index={2} />
967
+ <InputOTPSlot index={3} />
968
+ <InputOTPSlot index={4} />
969
+ <InputOTPSlot index={5} />
970
+ </InputOTPGroup>
971
+ </InputOTP>
972
+ </FormField>
973
+ <FormField id="f-files" label="添付ファイル" helper="PDF・Excel（最大5件）">
974
+ <Upload
975
+ variant="dropzone"
976
+ value={files}
977
+ onValueChange={setFiles}
978
+ accept=".pdf,.xlsx,.csv"
979
+ maxCount={5}
980
+ onUpload={noopUpload}
981
+ />
982
+ </FormField>
983
+ </Flex>
984
+ </Form>
979
985
  </CardContent>
980
986
  </Card>
981
987