@openreachtech/furo-vue 1.3.1
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.
- package/LICENSE +9 -0
- package/README.ja.md +334 -0
- package/README.md +333 -0
- package/index.js +11 -0
- package/lib/assets/css/furo/0010.variables-palette-color-scale.css +298 -0
- package/lib/assets/css/furo/0020.variables-z-index.css +10 -0
- package/lib/assets/css/furo/0030.variables-semantic-color.css +178 -0
- package/lib/assets/css/furo/0035.variables-semantic-dimension.css +104 -0
- package/lib/assets/css/furo/0040.variables-component-furo.css +28 -0
- package/lib/assets/css/furo/0050.furo-editor-content.css +22 -0
- package/lib/assets/css/furo.css +15 -0
- package/lib/components/atoms/FuroAvatar/FuroAvatar.vue +135 -0
- package/lib/components/atoms/FuroAvatar/FuroAvatarContext.js +147 -0
- package/lib/components/atoms/FuroBadge/FuroBadge.vue +240 -0
- package/lib/components/atoms/FuroBadge/FuroBadgeContext.js +298 -0
- package/lib/components/atoms/FuroButton/ButtonEmitPayload.js +44 -0
- package/lib/components/atoms/FuroButton/FuroButton.vue +301 -0
- package/lib/components/atoms/FuroButton/FuroButtonContext.js +328 -0
- package/lib/components/atoms/FuroCheckbox/CheckboxEmitPayload.js +106 -0
- package/lib/components/atoms/FuroCheckbox/FuroCheckbox.vue +173 -0
- package/lib/components/atoms/FuroCheckbox/FuroCheckboxContext.js +682 -0
- package/lib/components/atoms/FuroEmailField/EmailFieldEmitPayload.js +74 -0
- package/lib/components/atoms/FuroEmailField/FuroEmailField.vue +119 -0
- package/lib/components/atoms/FuroEmailField/FuroEmailFieldContext.js +311 -0
- package/lib/components/atoms/FuroFileField/FileFieldEmitPayload.js +80 -0
- package/lib/components/atoms/FuroFileField/FuroFileField.vue +128 -0
- package/lib/components/atoms/FuroFileField/FuroFileFieldContext.js +195 -0
- package/lib/components/atoms/FuroIcon/FuroIcon.vue +74 -0
- package/lib/components/atoms/FuroIcon/FuroIconContext.js +293 -0
- package/lib/components/atoms/FuroIcon/FuroIconRegistry.js +617 -0
- package/lib/components/atoms/FuroIcon/FuroIconifyRendererContext.js +101 -0
- package/lib/components/atoms/FuroIcon/furoIconData.js +164 -0
- package/lib/components/atoms/FuroIcon/iconRenderers.js +62 -0
- package/lib/components/atoms/FuroIcon/icons.js +7 -0
- package/lib/components/atoms/FuroNumberField/FuroNumberField.vue +213 -0
- package/lib/components/atoms/FuroNumberField/FuroNumberFieldContext.js +442 -0
- package/lib/components/atoms/FuroNumberField/NumberFieldEmitPayload.js +162 -0
- package/lib/components/atoms/FuroPasswordField/FuroPasswordField.vue +119 -0
- package/lib/components/atoms/FuroPasswordField/FuroPasswordFieldContext.js +311 -0
- package/lib/components/atoms/FuroPasswordField/PasswordFieldEmitPayload.js +74 -0
- package/lib/components/atoms/FuroRadio/FuroRadio.vue +193 -0
- package/lib/components/atoms/FuroRadio/FuroRadioContext.js +557 -0
- package/lib/components/atoms/FuroRadio/RadioEmitPayload.js +72 -0
- package/lib/components/atoms/FuroSwitch/FuroSwitch.vue +165 -0
- package/lib/components/atoms/FuroSwitch/FuroSwitchContext.js +440 -0
- package/lib/components/atoms/FuroSwitch/SwitchEmitPayload.js +86 -0
- package/lib/components/atoms/FuroTextField/FuroTextField.vue +119 -0
- package/lib/components/atoms/FuroTextField/FuroTextFieldContext.js +311 -0
- package/lib/components/atoms/FuroTextField/TextFieldEmitPayload.js +83 -0
- package/lib/components/atoms/FuroTextarea/FuroTextarea.vue +121 -0
- package/lib/components/atoms/FuroTextarea/FuroTextareaContext.js +322 -0
- package/lib/components/atoms/FuroTextarea/TextareaEmitPayload.js +83 -0
- package/lib/components/atoms/FuroToggle/FuroToggle.vue +172 -0
- package/lib/components/atoms/FuroToggle/FuroToggleContext.js +410 -0
- package/lib/components/atoms/FuroToggle/ToggleEmitPayload.js +86 -0
- package/lib/components/molecules/FuroAccordion/AccordionEmitPayload.js +80 -0
- package/lib/components/molecules/FuroAccordion/FuroAccordion.vue +219 -0
- package/lib/components/molecules/FuroAccordion/FuroAccordionContext.js +547 -0
- package/lib/components/molecules/FuroAttachment/FuroAttachment.vue +376 -0
- package/lib/components/molecules/FuroAttachment/FuroAttachmentContext.js +628 -0
- package/lib/components/molecules/FuroAutocompleteField/AutocompleteEmitPayload.js +225 -0
- package/lib/components/molecules/FuroAutocompleteField/FuroAutocompleteField.vue +669 -0
- package/lib/components/molecules/FuroAutocompleteField/FuroAutocompleteFieldContext.js +1525 -0
- package/lib/components/molecules/FuroAvatarGroup/FuroAvatarGroup.vue +126 -0
- package/lib/components/molecules/FuroAvatarGroup/FuroAvatarGroupContext.js +245 -0
- package/lib/components/molecules/FuroBreadcrumb/FuroBreadcrumb.vue +219 -0
- package/lib/components/molecules/FuroBreadcrumb/FuroBreadcrumbContext.js +257 -0
- package/lib/components/molecules/FuroCollapsible/CollapsibleEmitPayload.js +69 -0
- package/lib/components/molecules/FuroCollapsible/FuroCollapsible.vue +177 -0
- package/lib/components/molecules/FuroCollapsible/FuroCollapsibleContext.js +389 -0
- package/lib/components/molecules/FuroControlBlock/FuroControlBlock.vue +149 -0
- package/lib/components/molecules/FuroControlBlock/FuroControlBlockContext.js +81 -0
- package/lib/components/molecules/FuroDatePicker/DatePickerEmitPayload.js +74 -0
- package/lib/components/molecules/FuroDatePicker/FuroDatePicker.vue +661 -0
- package/lib/components/molecules/FuroDatePicker/FuroDatePickerContext.js +1038 -0
- package/lib/components/molecules/FuroDateTimePicker/DateTimePickerEmitPayload.js +96 -0
- package/lib/components/molecules/FuroDateTimePicker/FuroDateTimePicker.vue +153 -0
- package/lib/components/molecules/FuroDateTimePicker/FuroDateTimePickerContext.js +840 -0
- package/lib/components/molecules/FuroDropdownMenu/DropdownMenuOptionSelectEmitPayload.js +100 -0
- package/lib/components/molecules/FuroDropdownMenu/FuroDropdownMenu.vue +348 -0
- package/lib/components/molecules/FuroDropdownMenu/FuroDropdownMenuContext.js +714 -0
- package/lib/components/molecules/FuroDropdownMenu/FuroDropdownMenuOptionRows.vue +222 -0
- package/lib/components/molecules/FuroEditableField/EditableEmitPayload.js +89 -0
- package/lib/components/molecules/FuroEditableField/FuroEditableField.vue +314 -0
- package/lib/components/molecules/FuroEditableField/FuroEditableFieldContext.js +1018 -0
- package/lib/components/molecules/FuroEditableField/processors/EditorCollisionProcessor.js +236 -0
- package/lib/components/molecules/FuroEditableField/processors/ObjectProcessor.js +101 -0
- package/lib/components/molecules/FuroEmptyState/FuroEmptyState.vue +124 -0
- package/lib/components/molecules/FuroEmptyState/FuroEmptyStateContext.js +42 -0
- package/lib/components/molecules/FuroErrorState/FuroErrorState.vue +125 -0
- package/lib/components/molecules/FuroErrorState/FuroErrorStateContext.js +42 -0
- package/lib/components/molecules/FuroPagination/FuroPagination.vue +246 -0
- package/lib/components/molecules/FuroPagination/FuroPaginationContext.js +489 -0
- package/lib/components/molecules/FuroPopover/FuroPopover.vue +171 -0
- package/lib/components/molecules/FuroPopover/FuroPopoverContext.js +279 -0
- package/lib/components/molecules/FuroScrollArea/FuroScrollArea.vue +181 -0
- package/lib/components/molecules/FuroScrollArea/FuroScrollAreaContext.js +149 -0
- package/lib/components/molecules/FuroSearchField/FuroSearchField.vue +155 -0
- package/lib/components/molecules/FuroSearchField/FuroSearchFieldContext.js +231 -0
- package/lib/components/molecules/FuroSectionHeader/FuroSectionHeader.vue +140 -0
- package/lib/components/molecules/FuroSectionHeader/FuroSectionHeaderContext.js +204 -0
- package/lib/components/molecules/FuroSelect/FuroSelect.vue +474 -0
- package/lib/components/molecules/FuroSelect/FuroSelectContext.js +743 -0
- package/lib/components/molecules/FuroSelect/SelectEmitPayload.js +181 -0
- package/lib/components/molecules/FuroSeparator/FuroSeparator.vue +88 -0
- package/lib/components/molecules/FuroSeparator/FuroSeparatorContext.js +40 -0
- package/lib/components/molecules/FuroSkeleton/FuroSkeleton.vue +101 -0
- package/lib/components/molecules/FuroSkeleton/FuroSkeletonContext.js +82 -0
- package/lib/components/molecules/FuroSplitter/FuroSplitter.vue +237 -0
- package/lib/components/molecules/FuroSplitter/FuroSplitterContext.js +429 -0
- package/lib/components/molecules/FuroSplitter/SplitterEmitPayload.js +69 -0
- package/lib/components/molecules/FuroTimeField/FuroTimeField.vue +251 -0
- package/lib/components/molecules/FuroTimeField/FuroTimeFieldContext.js +1138 -0
- package/lib/components/molecules/FuroTimeField/TimeFieldEmitPayload.js +74 -0
- package/lib/components/molecules/FuroToggleGroup/FuroToggleGroup.vue +211 -0
- package/lib/components/molecules/FuroToggleGroup/FuroToggleGroupContext.js +551 -0
- package/lib/components/molecules/FuroToggleGroup/ToggleGroupEmitPayload.js +80 -0
- package/lib/components/molecules/FuroToolBar/FuroToolBar.vue +91 -0
- package/lib/components/molecules/FuroToolBar/FuroToolBarContext.js +75 -0
- package/lib/components/molecules/FuroTooltip/FuroTooltip.vue +183 -0
- package/lib/components/molecules/FuroTooltip/FuroTooltipContext.js +290 -0
- package/lib/components/organisms/FuroAlertDialog/FuroAlertDialog.vue +324 -0
- package/lib/components/organisms/FuroAlertDialog/FuroAlertDialogContext.js +608 -0
- package/lib/components/organisms/FuroDialog/FuroDialog.vue +362 -0
- package/lib/components/organisms/FuroDialog/FuroDialogContext.js +535 -0
- package/lib/components/organisms/FuroDrawer/FuroDrawer.vue +618 -0
- package/lib/components/organisms/FuroDrawer/FuroDrawerContext.js +676 -0
- package/lib/components/organisms/FuroEditor/FuroEditor.vue +613 -0
- package/lib/components/organisms/FuroEditor/FuroEditorCommandContext.js +420 -0
- package/lib/components/organisms/FuroEditor/FuroEditorContext.js +2048 -0
- package/lib/components/organisms/FuroEditor/FuroEditorMentionMenu.vue +120 -0
- package/lib/components/organisms/FuroEditor/FuroEditorMentionMenuContext.js +261 -0
- package/lib/components/organisms/FuroEditor/PreserveNewlinesPasteExtension.js +267 -0
- package/lib/components/organisms/FuroEditor/build-editor-extensions.js +97 -0
- package/lib/components/organisms/FuroEditor/mention-suggestion.js +320 -0
- package/lib/components/organisms/FuroEditor/paste-link-segments.js +124 -0
- package/lib/components/organisms/FuroSidebar/FuroSidebar.vue +473 -0
- package/lib/components/organisms/FuroSidebar/FuroSidebarContext.js +1014 -0
- package/lib/components/organisms/FuroStepper/FuroStepper.vue +345 -0
- package/lib/components/organisms/FuroStepper/FuroStepperContext.js +481 -0
- package/lib/components/organisms/FuroTable/FuroTable.vue +707 -0
- package/lib/components/organisms/FuroTable/FuroTableContext.js +1965 -0
- package/lib/components/organisms/FuroTable/FuroTableRowItemContext.js +111 -0
- package/lib/components/organisms/FuroTabs/FuroTabs.vue +403 -0
- package/lib/components/organisms/FuroTabs/FuroTabsContext.js +846 -0
- package/lib/components/organisms/FuroToast/FuroToast.vue +624 -0
- package/lib/components/organisms/FuroToast/FuroToastContext.js +1089 -0
- package/lib/components/organisms/FuroToast/FuroToaster.vue +44 -0
- package/lib/components/organisms/FuroToast/FuroToasterContext.js +113 -0
- package/lib/components/organisms/FuroToast/ToastQueue.js +325 -0
- package/lib/components/organisms/FuroToast/toast.js +64 -0
- package/lib/contexts/BaseFuroContext.js +318 -0
- package/lib/contexts/BaseFuroContextAccessor.js +47 -0
- package/lib/emit-payload/BaseEmitPayload.js +91 -0
- package/lib/index.components.js +61 -0
- package/lib/index.core.js +18 -0
- package/lib/tools/TimerClerk.js +75 -0
- package/nuxt/index.js +109 -0
- package/nuxt/runtime/furo-icon-renderer.js +24 -0
- package/package.json +137 -0
- package/public/furo-vue/components.json +4619 -0
- package/public/furo-vue/llms.txt +66 -0
- package/types/furo-nuxt.d.ts +48 -0
- package/types/generated/components/atoms/FuroAvatar/FuroAvatar.vue.d.ts +74 -0
- package/types/generated/components/atoms/FuroAvatar/FuroAvatarContext.d.ts +82 -0
- package/types/generated/components/atoms/FuroBadge/FuroBadge.vue.d.ts +12 -0
- package/types/generated/components/atoms/FuroBadge/FuroBadgeContext.d.ts +160 -0
- package/types/generated/components/atoms/FuroButton/ButtonEmitPayload.d.ts +19 -0
- package/types/generated/components/atoms/FuroButton/FuroButton.vue.d.ts +53 -0
- package/types/generated/components/atoms/FuroButton/FuroButtonContext.d.ts +156 -0
- package/types/generated/components/atoms/FuroCheckbox/CheckboxEmitPayload.d.ts +55 -0
- package/types/generated/components/atoms/FuroCheckbox/FuroCheckbox.vue.d.ts +87 -0
- package/types/generated/components/atoms/FuroCheckbox/FuroCheckboxContext.d.ts +342 -0
- package/types/generated/components/atoms/FuroEmailField/EmailFieldEmitPayload.d.ts +46 -0
- package/types/generated/components/atoms/FuroEmailField/FuroEmailField.vue.d.ts +458 -0
- package/types/generated/components/atoms/FuroEmailField/FuroEmailFieldContext.d.ts +161 -0
- package/types/generated/components/atoms/FuroFileField/FileFieldEmitPayload.d.ts +46 -0
- package/types/generated/components/atoms/FuroFileField/FuroFileField.vue.d.ts +454 -0
- package/types/generated/components/atoms/FuroFileField/FuroFileFieldContext.d.ts +109 -0
- package/types/generated/components/atoms/FuroIcon/FuroIcon.vue.d.ts +14 -0
- package/types/generated/components/atoms/FuroIcon/FuroIconContext.d.ts +152 -0
- package/types/generated/components/atoms/FuroIcon/FuroIconRegistry.d.ts +457 -0
- package/types/generated/components/atoms/FuroIcon/FuroIconifyRendererContext.d.ts +65 -0
- package/types/generated/components/atoms/FuroIcon/furoIconData.d.ts +154 -0
- package/types/generated/components/atoms/FuroIcon/iconRenderers.d.ts +6 -0
- package/types/generated/components/atoms/FuroIcon/icons.d.ts +6 -0
- package/types/generated/components/atoms/FuroNumberField/FuroNumberField.vue.d.ts +500 -0
- package/types/generated/components/atoms/FuroNumberField/FuroNumberFieldContext.d.ts +243 -0
- package/types/generated/components/atoms/FuroNumberField/NumberFieldEmitPayload.d.ts +74 -0
- package/types/generated/components/atoms/FuroPasswordField/FuroPasswordField.vue.d.ts +458 -0
- package/types/generated/components/atoms/FuroPasswordField/FuroPasswordFieldContext.d.ts +161 -0
- package/types/generated/components/atoms/FuroPasswordField/PasswordFieldEmitPayload.d.ts +46 -0
- package/types/generated/components/atoms/FuroRadio/FuroRadio.vue.d.ts +96 -0
- package/types/generated/components/atoms/FuroRadio/FuroRadioContext.d.ts +290 -0
- package/types/generated/components/atoms/FuroRadio/RadioEmitPayload.d.ts +39 -0
- package/types/generated/components/atoms/FuroSwitch/FuroSwitch.vue.d.ts +74 -0
- package/types/generated/components/atoms/FuroSwitch/FuroSwitchContext.d.ts +218 -0
- package/types/generated/components/atoms/FuroSwitch/SwitchEmitPayload.d.ts +42 -0
- package/types/generated/components/atoms/FuroTextField/FuroTextField.vue.d.ts +458 -0
- package/types/generated/components/atoms/FuroTextField/FuroTextFieldContext.d.ts +161 -0
- package/types/generated/components/atoms/FuroTextField/TextFieldEmitPayload.d.ts +52 -0
- package/types/generated/components/atoms/FuroTextarea/FuroTextarea.vue.d.ts +422 -0
- package/types/generated/components/atoms/FuroTextarea/FuroTextareaContext.d.ts +161 -0
- package/types/generated/components/atoms/FuroTextarea/TextareaEmitPayload.d.ts +52 -0
- package/types/generated/components/atoms/FuroToggle/FuroToggle.vue.d.ts +51 -0
- package/types/generated/components/atoms/FuroToggle/FuroToggleContext.d.ts +191 -0
- package/types/generated/components/atoms/FuroToggle/ToggleEmitPayload.d.ts +42 -0
- package/types/generated/components/molecules/FuroAccordion/AccordionEmitPayload.d.ts +41 -0
- package/types/generated/components/molecules/FuroAccordion/FuroAccordion.vue.d.ts +133 -0
- package/types/generated/components/molecules/FuroAccordion/FuroAccordionContext.d.ts +279 -0
- package/types/generated/components/molecules/FuroAttachment/FuroAttachment.vue.d.ts +79 -0
- package/types/generated/components/molecules/FuroAttachment/FuroAttachmentContext.d.ts +363 -0
- package/types/generated/components/molecules/FuroAutocompleteField/AutocompleteEmitPayload.d.ts +129 -0
- package/types/generated/components/molecules/FuroAutocompleteField/FuroAutocompleteField.vue.d.ts +751 -0
- package/types/generated/components/molecules/FuroAutocompleteField/FuroAutocompleteFieldContext.d.ts +722 -0
- package/types/generated/components/molecules/FuroAvatarGroup/FuroAvatarGroup.vue.d.ts +84 -0
- package/types/generated/components/molecules/FuroAvatarGroup/FuroAvatarGroupContext.d.ts +150 -0
- package/types/generated/components/molecules/FuroBreadcrumb/FuroBreadcrumb.vue.d.ts +24 -0
- package/types/generated/components/molecules/FuroBreadcrumb/FuroBreadcrumbContext.d.ts +152 -0
- package/types/generated/components/molecules/FuroCollapsible/CollapsibleEmitPayload.d.ts +36 -0
- package/types/generated/components/molecules/FuroCollapsible/FuroCollapsible.vue.d.ts +98 -0
- package/types/generated/components/molecules/FuroCollapsible/FuroCollapsibleContext.d.ts +191 -0
- package/types/generated/components/molecules/FuroControlBlock/FuroControlBlock.vue.d.ts +30 -0
- package/types/generated/components/molecules/FuroControlBlock/FuroControlBlockContext.d.ts +57 -0
- package/types/generated/components/molecules/FuroDatePicker/DatePickerEmitPayload.d.ts +41 -0
- package/types/generated/components/molecules/FuroDatePicker/FuroDatePicker.vue.d.ts +456 -0
- package/types/generated/components/molecules/FuroDatePicker/FuroDatePickerContext.d.ts +516 -0
- package/types/generated/components/molecules/FuroDateTimePicker/DateTimePickerEmitPayload.d.ts +55 -0
- package/types/generated/components/molecules/FuroDateTimePicker/FuroDateTimePicker.vue.d.ts +1365 -0
- package/types/generated/components/molecules/FuroDateTimePicker/FuroDateTimePickerContext.d.ts +435 -0
- package/types/generated/components/molecules/FuroDropdownMenu/DropdownMenuOptionSelectEmitPayload.d.ts +48 -0
- package/types/generated/components/molecules/FuroDropdownMenu/FuroDropdownMenu.vue.d.ts +773 -0
- package/types/generated/components/molecules/FuroDropdownMenu/FuroDropdownMenuContext.d.ts +380 -0
- package/types/generated/components/molecules/FuroDropdownMenu/FuroDropdownMenuOptionRows.vue.d.ts +261 -0
- package/types/generated/components/molecules/FuroEditableField/EditableEmitPayload.d.ts +39 -0
- package/types/generated/components/molecules/FuroEditableField/FuroEditableField.vue.d.ts +646 -0
- package/types/generated/components/molecules/FuroEditableField/FuroEditableFieldContext.d.ts +477 -0
- package/types/generated/components/molecules/FuroEditableField/processors/EditorCollisionProcessor.d.ts +121 -0
- package/types/generated/components/molecules/FuroEditableField/processors/ObjectProcessor.d.ts +45 -0
- package/types/generated/components/molecules/FuroEmptyState/FuroEmptyState.vue.d.ts +21 -0
- package/types/generated/components/molecules/FuroEmptyState/FuroEmptyStateContext.d.ts +32 -0
- package/types/generated/components/molecules/FuroErrorState/FuroErrorState.vue.d.ts +21 -0
- package/types/generated/components/molecules/FuroErrorState/FuroErrorStateContext.d.ts +32 -0
- package/types/generated/components/molecules/FuroPagination/FuroPagination.vue.d.ts +534 -0
- package/types/generated/components/molecules/FuroPagination/FuroPaginationContext.d.ts +271 -0
- package/types/generated/components/molecules/FuroPopover/FuroPopover.vue.d.ts +513 -0
- package/types/generated/components/molecules/FuroPopover/FuroPopoverContext.d.ts +160 -0
- package/types/generated/components/molecules/FuroScrollArea/FuroScrollArea.vue.d.ts +124 -0
- package/types/generated/components/molecules/FuroScrollArea/FuroScrollAreaContext.d.ts +86 -0
- package/types/generated/components/molecules/FuroSearchField/FuroSearchField.vue.d.ts +487 -0
- package/types/generated/components/molecules/FuroSearchField/FuroSearchFieldContext.d.ts +137 -0
- package/types/generated/components/molecules/FuroSectionHeader/FuroSectionHeader.vue.d.ts +49 -0
- package/types/generated/components/molecules/FuroSectionHeader/FuroSectionHeaderContext.d.ts +121 -0
- package/types/generated/components/molecules/FuroSelect/FuroSelect.vue.d.ts +719 -0
- package/types/generated/components/molecules/FuroSelect/FuroSelectContext.d.ts +402 -0
- package/types/generated/components/molecules/FuroSelect/SelectEmitPayload.d.ts +102 -0
- package/types/generated/components/molecules/FuroSeparator/FuroSeparator.vue.d.ts +39 -0
- package/types/generated/components/molecules/FuroSeparator/FuroSeparatorContext.d.ts +31 -0
- package/types/generated/components/molecules/FuroSkeleton/FuroSkeleton.vue.d.ts +27 -0
- package/types/generated/components/molecules/FuroSkeleton/FuroSkeletonContext.d.ts +61 -0
- package/types/generated/components/molecules/FuroSplitter/FuroSplitter.vue.d.ts +139 -0
- package/types/generated/components/molecules/FuroSplitter/FuroSplitterContext.d.ts +226 -0
- package/types/generated/components/molecules/FuroSplitter/SplitterEmitPayload.d.ts +41 -0
- package/types/generated/components/molecules/FuroTimeField/FuroTimeField.vue.d.ts +498 -0
- package/types/generated/components/molecules/FuroTimeField/FuroTimeFieldContext.d.ts +555 -0
- package/types/generated/components/molecules/FuroTimeField/TimeFieldEmitPayload.d.ts +41 -0
- package/types/generated/components/molecules/FuroToggleGroup/FuroToggleGroup.vue.d.ts +70 -0
- package/types/generated/components/molecules/FuroToggleGroup/FuroToggleGroupContext.d.ts +270 -0
- package/types/generated/components/molecules/FuroToggleGroup/ToggleGroupEmitPayload.d.ts +41 -0
- package/types/generated/components/molecules/FuroToolBar/FuroToolBar.vue.d.ts +30 -0
- package/types/generated/components/molecules/FuroToolBar/FuroToolBarContext.d.ts +48 -0
- package/types/generated/components/molecules/FuroTooltip/FuroTooltip.vue.d.ts +524 -0
- package/types/generated/components/molecules/FuroTooltip/FuroTooltipContext.d.ts +166 -0
- package/types/generated/components/organisms/FuroAlertDialog/FuroAlertDialog.vue.d.ts +651 -0
- package/types/generated/components/organisms/FuroAlertDialog/FuroAlertDialogContext.d.ts +299 -0
- package/types/generated/components/organisms/FuroDialog/FuroDialog.vue.d.ts +583 -0
- package/types/generated/components/organisms/FuroDialog/FuroDialogContext.d.ts +264 -0
- package/types/generated/components/organisms/FuroDrawer/FuroDrawer.vue.d.ts +635 -0
- package/types/generated/components/organisms/FuroDrawer/FuroDrawerContext.d.ts +347 -0
- package/types/generated/components/organisms/FuroEditor/FuroEditor.vue.d.ts +2487 -0
- package/types/generated/components/organisms/FuroEditor/FuroEditorCommandContext.d.ts +192 -0
- package/types/generated/components/organisms/FuroEditor/FuroEditorContext.d.ts +904 -0
- package/types/generated/components/organisms/FuroEditor/FuroEditorMentionMenu.vue.d.ts +43 -0
- package/types/generated/components/organisms/FuroEditor/FuroEditorMentionMenuContext.d.ts +159 -0
- package/types/generated/components/organisms/FuroEditor/PreserveNewlinesPasteExtension.d.ts +43 -0
- package/types/generated/components/organisms/FuroEditor/build-editor-extensions.d.ts +22 -0
- package/types/generated/components/organisms/FuroEditor/mention-suggestion.d.ts +25 -0
- package/types/generated/components/organisms/FuroEditor/paste-link-segments.d.ts +31 -0
- package/types/generated/components/organisms/FuroSidebar/FuroSidebar.vue.d.ts +898 -0
- package/types/generated/components/organisms/FuroSidebar/FuroSidebarContext.d.ts +596 -0
- package/types/generated/components/organisms/FuroStepper/FuroStepper.vue.d.ts +589 -0
- package/types/generated/components/organisms/FuroStepper/FuroStepperContext.d.ts +266 -0
- package/types/generated/components/organisms/FuroTable/FuroTable.vue.d.ts +528 -0
- package/types/generated/components/organisms/FuroTable/FuroTableContext.d.ts +1035 -0
- package/types/generated/components/organisms/FuroTable/FuroTableRowItemContext.d.ts +62 -0
- package/types/generated/components/organisms/FuroTabs/FuroTabs.vue.d.ts +515 -0
- package/types/generated/components/organisms/FuroTabs/FuroTabsContext.d.ts +438 -0
- package/types/generated/components/organisms/FuroToast/FuroToast.vue.d.ts +725 -0
- package/types/generated/components/organisms/FuroToast/FuroToastContext.d.ts +543 -0
- package/types/generated/components/organisms/FuroToast/FuroToaster.vue.d.ts +729 -0
- package/types/generated/components/organisms/FuroToast/FuroToasterContext.d.ts +62 -0
- package/types/generated/components/organisms/FuroToast/ToastQueue.d.ts +201 -0
- package/types/generated/components/organisms/FuroToast/toast.d.ts +23 -0
- package/types/generated/contexts/BaseFuroContext.d.ts +207 -0
- package/types/generated/contexts/BaseFuroContextAccessor.d.ts +28 -0
- package/types/generated/emit-payload/BaseEmitPayload.d.ts +62 -0
- package/types/generated/index.components.d.ts +50 -0
- package/types/generated/index.core.d.ts +6 -0
- package/types/generated/tools/TimerClerk.d.ts +50 -0
- package/types/index.d.ts +12 -0
package/LICENSE
ADDED
|
@@ -0,0 +1,9 @@
|
|
|
1
|
+
MIT License
|
|
2
|
+
|
|
3
|
+
Copyright (c) 2026 Open Reach Tech Inc.
|
|
4
|
+
|
|
5
|
+
Permission is hereby granted, free of charge, to any person obtaining a copy of this software and associated documentation files (the "Software"), to deal in the Software without restriction, including without limitation the rights to use, copy, modify, merge, publish, distribute, sublicense, and/or sell copies of the Software, and to permit persons to whom the Software is furnished to do so, subject to the following conditions:
|
|
6
|
+
|
|
7
|
+
The above copyright notice and this permission notice shall be included in all copies or substantial portions of the Software.
|
|
8
|
+
|
|
9
|
+
THE SOFTWARE IS PROVIDED "AS IS", WITHOUT WARRANTY OF ANY KIND, EXPRESS OR IMPLIED, INCLUDING BUT NOT LIMITED TO THE WARRANTIES OF MERCHANTABILITY, FITNESS FOR A PARTICULAR PURPOSE AND NONINFRINGEMENT. IN NO EVENT SHALL THE AUTHORS OR COPYRIGHT HOLDERS BE LIABLE FOR ANY CLAIM, DAMAGES OR OTHER LIABILITY, WHETHER IN AN ACTION OF CONTRACT, TORT OR OTHERWISE, ARISING FROM, OUT OF OR IN CONNECTION WITH THE SOFTWARE OR THE USE OR OTHER DEALINGS IN THE SOFTWARE.
|
package/README.ja.md
ADDED
|
@@ -0,0 +1,334 @@
|
|
|
1
|
+
# `@openreachtech/furo-vue`
|
|
2
|
+
|
|
3
|
+
`furo-vue` は Vue の開発を支援するライブラリです。
|
|
4
|
+
|
|
5
|
+
## インストール
|
|
6
|
+
|
|
7
|
+
Node.js `^20.19.2` と npm `^10.9.0` が必要です(CI がビルド対象とするバージョン)。
|
|
8
|
+
|
|
9
|
+
```sh
|
|
10
|
+
npm install @openreachtech/furo-vue
|
|
11
|
+
```
|
|
12
|
+
|
|
13
|
+
## はじめかた
|
|
14
|
+
|
|
15
|
+
本ガイドは、`furo-vue` を一度も使ったことのない新規プロジェクトを、ゼロからコンポーネント
|
|
16
|
+
描画まで導きます。対象は **Nuxt 3**(主たる利用スタック)です。素の Vue 3 + Vite との違いは
|
|
17
|
+
コンポーネントの登録方法だけで、Nuxt プラグインの代わりに `app.component(...)` または
|
|
18
|
+
コンポーネント個別のインポートを使います。
|
|
19
|
+
|
|
20
|
+
> **プロジェクトを初期化する AI エージェントへ:** 以下の番号付きステップを順に実行して
|
|
21
|
+
> ください。コンポーネントを選んで呼び出すには、
|
|
22
|
+
> `node_modules/@openreachtech/furo-vue/public/furo-vue/components.json` にある
|
|
23
|
+
> 機械可読なマニフェストを読み、`furo-vue-components` スキル
|
|
24
|
+
> (`skills/furo-vue-components/SKILL.md`)を利用してください。
|
|
25
|
+
|
|
26
|
+
### (1) デザイントークンをインポートする(必須)
|
|
27
|
+
|
|
28
|
+
すべてのコンポーネントは、単一のトークンエントリから CSS カスタムプロパティを読み取り
|
|
29
|
+
ます。アプリ内で**一度だけ**インポートしてください。これがないと、コンポーネントは
|
|
30
|
+
スタイルの当たっていない状態で描画されます。
|
|
31
|
+
|
|
32
|
+
Nuxt の場合 — `nuxt.config` の `css` に追加します。
|
|
33
|
+
|
|
34
|
+
```js
|
|
35
|
+
// nuxt.config.js
|
|
36
|
+
export default defineNuxtConfig({
|
|
37
|
+
css: [
|
|
38
|
+
'@openreachtech/furo-vue/lib/assets/css/furo.css',
|
|
39
|
+
],
|
|
40
|
+
})
|
|
41
|
+
```
|
|
42
|
+
|
|
43
|
+
素の Vue 3 の場合 — エントリファイルでインポートします。
|
|
44
|
+
|
|
45
|
+
```js
|
|
46
|
+
// main.js
|
|
47
|
+
import '@openreachtech/furo-vue/lib/assets/css/furo.css'
|
|
48
|
+
```
|
|
49
|
+
|
|
50
|
+
### (2) ライト / ダークテーマを有効にする
|
|
51
|
+
|
|
52
|
+
トークンは両テーマ向けに定義されており、`<html>` の `data-theme` 属性で切り替わります。
|
|
53
|
+
`light`(デフォルト)または `dark` を設定してください。コンポーネントの CSS が自動で
|
|
54
|
+
追随するため、メディアクエリは不要です。
|
|
55
|
+
|
|
56
|
+
```html
|
|
57
|
+
<html data-theme="light">
|
|
58
|
+
```
|
|
59
|
+
|
|
60
|
+
実行時に切り替えるには、`document.documentElement` の属性を設定します。
|
|
61
|
+
|
|
62
|
+
```js
|
|
63
|
+
document.documentElement.setAttribute('data-theme', 'dark')
|
|
64
|
+
```
|
|
65
|
+
|
|
66
|
+
### (3) 最初のコンポーネントを描画する
|
|
67
|
+
|
|
68
|
+
コンポーネントは名前付きエクスポートです。使うものだけをインポートしてください。
|
|
69
|
+
|
|
70
|
+
```vue
|
|
71
|
+
<script>
|
|
72
|
+
import {
|
|
73
|
+
FuroButton,
|
|
74
|
+
} from '@openreachtech/furo-vue'
|
|
75
|
+
|
|
76
|
+
export default {
|
|
77
|
+
components: {
|
|
78
|
+
FuroButton,
|
|
79
|
+
},
|
|
80
|
+
}
|
|
81
|
+
</script>
|
|
82
|
+
|
|
83
|
+
<template>
|
|
84
|
+
<FuroButton :parcel="{ variant: 'default' }">
|
|
85
|
+
Create record
|
|
86
|
+
</FuroButton>
|
|
87
|
+
</template>
|
|
88
|
+
```
|
|
89
|
+
|
|
90
|
+
ファイルごとではなくグローバルに登録したい場合(任意)は、Nuxt プラグインを作成します。
|
|
91
|
+
|
|
92
|
+
```js
|
|
93
|
+
// plugins/furo-vue.js
|
|
94
|
+
import * as furoVue from '@openreachtech/furo-vue'
|
|
95
|
+
|
|
96
|
+
export default defineNuxtPlugin(nuxtApp => {
|
|
97
|
+
Object.entries(furoVue)
|
|
98
|
+
.filter(([name]) => name.startsWith('Furo'))
|
|
99
|
+
.forEach(([name, component]) => {
|
|
100
|
+
nuxtApp.vueApp.component(name, component)
|
|
101
|
+
})
|
|
102
|
+
})
|
|
103
|
+
```
|
|
104
|
+
|
|
105
|
+
### (4) コンポーネントのコントラクト
|
|
106
|
+
|
|
107
|
+
すべてのフォームコントロール系コンポーネントは、単一の公開インターフェースを共有します。
|
|
108
|
+
一度覚えれば、どこでも同じように使えます。
|
|
109
|
+
|
|
110
|
+
- **Props:** `parcel`(振る舞いを表すリアクティブなオブジェクト)と `v-model:value`。
|
|
111
|
+
- **Events:** ほとんどのコントロールは `change-value`(入力時)、`commit-value`
|
|
112
|
+
(blur / Enter 時)、`update:value`(v-model の同期)を emit します。すべてが該当する
|
|
113
|
+
わけではないため、マニフェストの各コンポーネントの `events` 配列を確認してください。
|
|
114
|
+
アクション系コンポーネント(例: `FuroButton`)は、独自の型付きペイロードを emit します。
|
|
115
|
+
- **プリミティブを直接インポートしない:** 公開コントラクトは Furo が定義するものです。
|
|
116
|
+
内部のヘッドレスライブラリを直接インポートしてはいけません。
|
|
117
|
+
- **ロジックはテンプレートではなく Context に置く。**
|
|
118
|
+
|
|
119
|
+
```vue
|
|
120
|
+
<template>
|
|
121
|
+
<FuroTextField
|
|
122
|
+
v-model:value="form.name"
|
|
123
|
+
:parcel="{ placeholder: 'Full name' }"
|
|
124
|
+
@commit-value="context.onCommitName({ payload: $event })"
|
|
125
|
+
/>
|
|
126
|
+
</template>
|
|
127
|
+
```
|
|
128
|
+
|
|
129
|
+
### (5) ラベル付きフォームフィールド
|
|
130
|
+
|
|
131
|
+
任意のフィールド atom を `FuroControlBlock` で包むと、ラベル・ヒント・エラーメッセージを
|
|
132
|
+
付与できます。
|
|
133
|
+
|
|
134
|
+
```vue
|
|
135
|
+
<template>
|
|
136
|
+
<FuroControlBlock :parcel="{ label: 'Email', error: context.emailError }">
|
|
137
|
+
<FuroEmailField
|
|
138
|
+
v-model:value="form.email"
|
|
139
|
+
:parcel="{ placeholder: 'you@example.com' }"
|
|
140
|
+
/>
|
|
141
|
+
</FuroControlBlock>
|
|
142
|
+
</template>
|
|
143
|
+
```
|
|
144
|
+
|
|
145
|
+
### (6) トースト
|
|
146
|
+
|
|
147
|
+
アプリのルート付近に `<FuroToaster />` を一度だけマウントし、あとはどこからでも命令的な
|
|
148
|
+
`toast` ヘルパーを呼び出します(クライアントサイド限定)。
|
|
149
|
+
|
|
150
|
+
```vue
|
|
151
|
+
<template>
|
|
152
|
+
<FuroToaster />
|
|
153
|
+
<!-- アプリの残りの部分 -->
|
|
154
|
+
</template>
|
|
155
|
+
```
|
|
156
|
+
|
|
157
|
+
```js
|
|
158
|
+
import {
|
|
159
|
+
toast,
|
|
160
|
+
} from '@openreachtech/furo-vue'
|
|
161
|
+
|
|
162
|
+
toast.show({ title: 'Saved', type: 'success' })
|
|
163
|
+
```
|
|
164
|
+
|
|
165
|
+
### (7) ライブラリが同梱していないアイコン
|
|
166
|
+
|
|
167
|
+
アイコンはオフラインで解決されるため、`FuroIcon` が描画できるのは手元にあるデータだけです。
|
|
168
|
+
つまり、ライブラリが同梱する 49 個のアイコンと、アプリケーションが登録したものに限られます。
|
|
169
|
+
最初の描画より前に、起動時に一度だけ登録してください。
|
|
170
|
+
|
|
171
|
+
```js
|
|
172
|
+
import {
|
|
173
|
+
furoIconRegistry,
|
|
174
|
+
} from '@openreachtech/furo-vue/icons'
|
|
175
|
+
|
|
176
|
+
furoIconRegistry.registerIconSet({
|
|
177
|
+
iconSet: applicationIconSet,
|
|
178
|
+
})
|
|
179
|
+
```
|
|
180
|
+
|
|
181
|
+
どこにも登録されていない名前は、本番ビルド以外ではアイコン名を添えて例外を投げます。
|
|
182
|
+
したがって、アイコンの欠落が空の箱として隠れることはありません。本番ビルドでは
|
|
183
|
+
代わりに警告グリフを描画します。
|
|
184
|
+
|
|
185
|
+
名前を 1 つずつ登録するのではなく、あらゆる名前を描画できるようにしたい場合は、
|
|
186
|
+
独自のレンダラーをインストールしてください。レジストリが先に応答するため、
|
|
187
|
+
何をインストールしてもライブラリ自身のアイコンはオフラインのまま描画されます。
|
|
188
|
+
|
|
189
|
+
```js
|
|
190
|
+
furoIconRegistry.useIconRenderer({
|
|
191
|
+
component: applicationIconComponent,
|
|
192
|
+
})
|
|
193
|
+
```
|
|
194
|
+
|
|
195
|
+
Nuxt アプリケーションでは、この登録をモジュールが代行します。
|
|
196
|
+
|
|
197
|
+
```js
|
|
198
|
+
// nuxt.config.js
|
|
199
|
+
modules: ['@nuxt/icon', '@openreachtech/furo-vue/nuxt']
|
|
200
|
+
```
|
|
201
|
+
|
|
202
|
+
Nuxt を使わない Vue アプリケーションでは、`@openreachtech/furo-vue/icon-renderers` が公開する
|
|
203
|
+
`createIconifyRenderer()` を使います。単一アイコンの登録や遅延リゾルバを含む API の全体は
|
|
204
|
+
[docs/furo-icon.md](https://github.com/openreachtech/furo-vue/blob/main/docs/furo-icon.md)
|
|
205
|
+
を参照してください。
|
|
206
|
+
|
|
207
|
+
### (8) すべてのコンポーネントを探す
|
|
208
|
+
|
|
209
|
+
- 人間向けカタログ(レイヤー別、ユースケース付き): [docs/COMPONENTS.md](https://github.com/openreachtech/furo-vue/blob/main/docs/COMPONENTS.md)
|
|
210
|
+
- 機械可読なマニフェスト(AI エージェントおよびツール向け): `public/furo-vue/components.json`
|
|
211
|
+
- llms.txt: `public/furo-vue/llms.txt`
|
|
212
|
+
|
|
213
|
+
メンテナは、ドキュメントレジストリから以下のコマンドでこれらを再生成します。
|
|
214
|
+
|
|
215
|
+
```sh
|
|
216
|
+
npm run docs:manifest
|
|
217
|
+
```
|
|
218
|
+
|
|
219
|
+
### (9) GraphQL・フェッチャ・ページテンプレート(本パッケージの対象外)
|
|
220
|
+
|
|
221
|
+
`furo-vue` が提供するのは、表示に専念する atoms・molecules・organisms だけです。GraphQL
|
|
222
|
+
ランチャー、フェッチャ / サブミッタのアダプタ、ページ単位のテンプレート(ListView、
|
|
223
|
+
DetailView など)は、利用側アプリケーションに属します。責務の境界については
|
|
224
|
+
[docs/furo-vue/README.md](https://github.com/openreachtech/furo-vue/blob/main/docs/furo-vue/README.md)
|
|
225
|
+
を、レイヤーの規約については
|
|
226
|
+
[docs/furo-vue/architecture.md](https://github.com/openreachtech/furo-vue/blob/main/docs/furo-vue/architecture.md)
|
|
227
|
+
を参照してください。
|
|
228
|
+
|
|
229
|
+
### (9) Node / テスト環境でロジックをインポートする
|
|
230
|
+
|
|
231
|
+
メインエントリ(`@openreachtech/furo-vue`)は Vue SFC を再エクスポートしているため、素の
|
|
232
|
+
Node / CommonJS のテストランナー(Vue トランスフォームなしの Jest など)ではパースでき
|
|
233
|
+
ません。**純粋な JS の面**だけが必要な場合 — `BaseFuroContext`、
|
|
234
|
+
`BaseFuroContextAccessor`、命令的な `toast` ヘルパー、`toastQueue`、`ToastQueue` — は、
|
|
235
|
+
`.vue` ファイルを一切読み込まず jsdom なしの Node 環境でロードできる、ロジック専用の
|
|
236
|
+
エントリをインポートしてください。
|
|
237
|
+
|
|
238
|
+
```js
|
|
239
|
+
import {
|
|
240
|
+
BaseFuroContext,
|
|
241
|
+
} from '@openreachtech/furo-vue/lib/index.core.js'
|
|
242
|
+
```
|
|
243
|
+
|
|
244
|
+
コンポーネント(`.vue`)のテストは、引き続き jsdom + Vue トランスフォーム下でメイン
|
|
245
|
+
エントリを経由します。
|
|
246
|
+
|
|
247
|
+
## Claude(AI エージェント)と組み合わせて使う
|
|
248
|
+
|
|
249
|
+
`furo-vue` は機械可読なドキュメントを同梱しており、AI エージェント(Claude Code、Cursor
|
|
250
|
+
など)が API を推測することなく正しくコンポーネントを組み立てられます。インストール後、
|
|
251
|
+
これらはパッケージ内に配置されます。
|
|
252
|
+
|
|
253
|
+
- `node_modules/@openreachtech/furo-vue/public/furo-vue/llms.txt` — レイヤー別に全
|
|
254
|
+
コンポーネントをまとめた、リンクベースの簡潔な索引。
|
|
255
|
+
- `node_modules/@openreachtech/furo-vue/public/furo-vue/components.json` — 完全な
|
|
256
|
+
マニフェスト。各コンポーネントの `import` パス、`props`、`parcel` のキー、`events`、
|
|
257
|
+
`slots`、`features` を含みます。
|
|
258
|
+
|
|
259
|
+
### Claude Code にマニフェストを参照させる
|
|
260
|
+
|
|
261
|
+
エージェントが furo-vue のコードを書く前にコントラクトを読むよう、プロジェクトの
|
|
262
|
+
`CLAUDE.md`(または `AGENTS.md`)にポインタを追記します。
|
|
263
|
+
|
|
264
|
+
```markdown
|
|
265
|
+
## furo-vue component library
|
|
266
|
+
|
|
267
|
+
When building UI with `@openreachtech/furo-vue`, follow its machine-readable contract:
|
|
268
|
+
|
|
269
|
+
- Index: `node_modules/@openreachtech/furo-vue/public/furo-vue/llms.txt`
|
|
270
|
+
- Full API manifest: `node_modules/@openreachtech/furo-vue/public/furo-vue/components.json`
|
|
271
|
+
|
|
272
|
+
Contract for every component: pass a reactive `parcel` object plus `v-model:value`,
|
|
273
|
+
listen to Furo emits (`change-value`, `commit-value`, `update:value`), and use the
|
|
274
|
+
documented slots. Do not reach into the underlying headless primitive.
|
|
275
|
+
```
|
|
276
|
+
|
|
277
|
+
### 必要に応じて Claude に読み込ませる
|
|
278
|
+
|
|
279
|
+
Claude Code のセッションでは、次のように伝えるだけでも構いません。
|
|
280
|
+
|
|
281
|
+
> `node_modules/@openreachtech/furo-vue/public/furo-vue/components.json` を読んで、
|
|
282
|
+
> FuroTextField・FuroPasswordField・FuroButton でログインフォームを作ってください。
|
|
283
|
+
|
|
284
|
+
マニフェストはメンテナが `npm run docs:manifest` でドキュメントレジストリから再生成する
|
|
285
|
+
ため、常に同梱コンポーネントと一致します。
|
|
286
|
+
|
|
287
|
+
### furo-vue スキルを追加する(Claude Code)
|
|
288
|
+
|
|
289
|
+
本リポジトリは Claude Code 用スキル `furo-vue-components` を同梱しています。これは
|
|
290
|
+
「X にはどのコンポーネントか」という要求を、マニフェスト経由で適切なコンポーネントと
|
|
291
|
+
そのコントラクトへ橋渡しします。このスキルは npm パッケージには**含まれない**ため、
|
|
292
|
+
リポジトリからプロジェクトの `.claude/skills/` へコピーしてください。
|
|
293
|
+
|
|
294
|
+
```sh
|
|
295
|
+
# furo-vue のチェックアウトから
|
|
296
|
+
cp -R skills/furo-vue-components <your-project>/.claude/skills/
|
|
297
|
+
|
|
298
|
+
# または GitHub からスキルファイルだけを取得する
|
|
299
|
+
mkdir -p .claude/skills/furo-vue-components
|
|
300
|
+
curl -fsSL https://raw.githubusercontent.com/openreachtech/furo-vue/main/skills/furo-vue-components/SKILL.md \
|
|
301
|
+
-o .claude/skills/furo-vue-components/SKILL.md
|
|
302
|
+
```
|
|
303
|
+
|
|
304
|
+
Claude Code は `.claude/skills/` 配下のスキルを自動検出します。コピー後に UI の作成を
|
|
305
|
+
依頼すれば、スキルが呼び出され、マニフェストが読み込まれ、正しい `parcel` +
|
|
306
|
+
`v-model:value` + emits のコントラクトでコンポーネントが使われます。
|
|
307
|
+
|
|
308
|
+
## コントリビューション
|
|
309
|
+
|
|
310
|
+
バグ報告・機能要望・コード貢献を歓迎します。
|
|
311
|
+
|
|
312
|
+
GitHub Issues からお気軽にご連絡ください。
|
|
313
|
+
|
|
314
|
+
```sh
|
|
315
|
+
git clone https://github.com/openreachtech/furo-vue.git
|
|
316
|
+
cd furo-vue
|
|
317
|
+
npm install
|
|
318
|
+
npm run lint
|
|
319
|
+
npm test
|
|
320
|
+
```
|
|
321
|
+
|
|
322
|
+
## ライセンス
|
|
323
|
+
|
|
324
|
+
本プロジェクトは MIT ライセンスで公開されています。
|
|
325
|
+
|
|
326
|
+
詳細は [LICENSE ファイル](./LICENSE) を参照してください。
|
|
327
|
+
|
|
328
|
+
## 開発者
|
|
329
|
+
|
|
330
|
+
[Open Reach Tech Inc.](https://openreach.tech)
|
|
331
|
+
|
|
332
|
+
## 著作権
|
|
333
|
+
|
|
334
|
+
© 2026 Open Reach Tech Inc.
|
package/README.md
ADDED
|
@@ -0,0 +1,333 @@
|
|
|
1
|
+
# `@openreachtech/furo-vue`
|
|
2
|
+
|
|
3
|
+
`furo-vue` is a library that supports Vue development.
|
|
4
|
+
|
|
5
|
+
## Installation
|
|
6
|
+
|
|
7
|
+
Requires Node.js `^20.19.2` and npm `^10.9.0` (the versions the CI builds against).
|
|
8
|
+
|
|
9
|
+
```sh
|
|
10
|
+
npm install @openreachtech/furo-vue
|
|
11
|
+
```
|
|
12
|
+
|
|
13
|
+
## Getting Started
|
|
14
|
+
|
|
15
|
+
This guide takes a brand-new project (one that has never used `furo-vue`) from
|
|
16
|
+
zero to a rendered component. It targets **Nuxt 3** (the primary consumer
|
|
17
|
+
stack); plain Vue 3 + Vite differs only in how you register components (use
|
|
18
|
+
`app.component(...)` or per-component imports instead of a Nuxt plugin).
|
|
19
|
+
|
|
20
|
+
> **For AI agents initializing a project:** follow the numbered steps below in
|
|
21
|
+
> order. To pick and call components, read the machine-readable manifest at
|
|
22
|
+
> `node_modules/@openreachtech/furo-vue/public/furo-vue/components.json` and use
|
|
23
|
+
> the `furo-vue-components` skill (`skills/furo-vue-components/SKILL.md`).
|
|
24
|
+
|
|
25
|
+
### (1) Import the design tokens (required)
|
|
26
|
+
|
|
27
|
+
Every component reads CSS custom properties from a single token entry. Import it
|
|
28
|
+
**once** in your app. Without it, components render unstyled.
|
|
29
|
+
|
|
30
|
+
Nuxt — add it to `nuxt.config` `css`:
|
|
31
|
+
|
|
32
|
+
```js
|
|
33
|
+
// nuxt.config.js
|
|
34
|
+
export default defineNuxtConfig({
|
|
35
|
+
css: [
|
|
36
|
+
'@openreachtech/furo-vue/lib/assets/css/furo.css',
|
|
37
|
+
],
|
|
38
|
+
})
|
|
39
|
+
```
|
|
40
|
+
|
|
41
|
+
Plain Vue 3 — import it in your entry file:
|
|
42
|
+
|
|
43
|
+
```js
|
|
44
|
+
// main.js
|
|
45
|
+
import '@openreachtech/furo-vue/lib/assets/css/furo.css'
|
|
46
|
+
```
|
|
47
|
+
|
|
48
|
+
### (2) Enable light / dark theme
|
|
49
|
+
|
|
50
|
+
Tokens are defined for both themes and switch off a `data-theme` attribute on
|
|
51
|
+
`<html>`. Set it to `light` (default) or `dark` — component CSS responds
|
|
52
|
+
automatically, no media query needed.
|
|
53
|
+
|
|
54
|
+
```html
|
|
55
|
+
<html data-theme="light">
|
|
56
|
+
```
|
|
57
|
+
|
|
58
|
+
To toggle at runtime, set the attribute on `document.documentElement`:
|
|
59
|
+
|
|
60
|
+
```js
|
|
61
|
+
document.documentElement.setAttribute('data-theme', 'dark')
|
|
62
|
+
```
|
|
63
|
+
|
|
64
|
+
### (3) Render your first component
|
|
65
|
+
|
|
66
|
+
Components are named exports. Import only what you use.
|
|
67
|
+
|
|
68
|
+
```vue
|
|
69
|
+
<script>
|
|
70
|
+
import {
|
|
71
|
+
FuroButton,
|
|
72
|
+
} from '@openreachtech/furo-vue'
|
|
73
|
+
|
|
74
|
+
export default {
|
|
75
|
+
components: {
|
|
76
|
+
FuroButton,
|
|
77
|
+
},
|
|
78
|
+
}
|
|
79
|
+
</script>
|
|
80
|
+
|
|
81
|
+
<template>
|
|
82
|
+
<FuroButton :parcel="{ variant: 'default' }">
|
|
83
|
+
Create record
|
|
84
|
+
</FuroButton>
|
|
85
|
+
</template>
|
|
86
|
+
```
|
|
87
|
+
|
|
88
|
+
To register components globally instead of per-file (optional), create a Nuxt
|
|
89
|
+
plugin:
|
|
90
|
+
|
|
91
|
+
```js
|
|
92
|
+
// plugins/furo-vue.js
|
|
93
|
+
import * as furoVue from '@openreachtech/furo-vue'
|
|
94
|
+
|
|
95
|
+
export default defineNuxtPlugin(nuxtApp => {
|
|
96
|
+
Object.entries(furoVue)
|
|
97
|
+
.filter(([name]) => name.startsWith('Furo'))
|
|
98
|
+
.forEach(([name, component]) => {
|
|
99
|
+
nuxtApp.vueApp.component(name, component)
|
|
100
|
+
})
|
|
101
|
+
})
|
|
102
|
+
```
|
|
103
|
+
|
|
104
|
+
### (4) The component contract
|
|
105
|
+
|
|
106
|
+
Every form-control component shares one public surface — learn it once, it
|
|
107
|
+
applies everywhere:
|
|
108
|
+
|
|
109
|
+
- **Props:** `parcel` (a reactive behavior object) plus `v-model:value`.
|
|
110
|
+
- **Events:** most controls emit `change-value` (on input), `commit-value`
|
|
111
|
+
(on blur / enter), and `update:value` (v-model sync). Not all do — read each
|
|
112
|
+
component's `events` array in the manifest. Action components (e.g.
|
|
113
|
+
`FuroButton`) emit their own typed payloads.
|
|
114
|
+
- **No primitive imports:** the public contract is Furo-defined; never import
|
|
115
|
+
the underlying headless library.
|
|
116
|
+
- **Logic in the Context, not the template.**
|
|
117
|
+
|
|
118
|
+
```vue
|
|
119
|
+
<template>
|
|
120
|
+
<FuroTextField
|
|
121
|
+
v-model:value="form.name"
|
|
122
|
+
:parcel="{ placeholder: 'Full name' }"
|
|
123
|
+
@commit-value="context.onCommitName({ payload: $event })"
|
|
124
|
+
/>
|
|
125
|
+
</template>
|
|
126
|
+
```
|
|
127
|
+
|
|
128
|
+
### (5) Labeled form fields
|
|
129
|
+
|
|
130
|
+
Wrap any field atom in `FuroControlBlock` to add a label, hint, and error
|
|
131
|
+
message:
|
|
132
|
+
|
|
133
|
+
```vue
|
|
134
|
+
<template>
|
|
135
|
+
<FuroControlBlock :parcel="{ label: 'Email', error: context.emailError }">
|
|
136
|
+
<FuroEmailField
|
|
137
|
+
v-model:value="form.email"
|
|
138
|
+
:parcel="{ placeholder: 'you@example.com' }"
|
|
139
|
+
/>
|
|
140
|
+
</FuroControlBlock>
|
|
141
|
+
</template>
|
|
142
|
+
```
|
|
143
|
+
|
|
144
|
+
### (6) Toasts
|
|
145
|
+
|
|
146
|
+
Mount `<FuroToaster />` once near your app root, then call the imperative
|
|
147
|
+
`toast` helper from anywhere (client-side only):
|
|
148
|
+
|
|
149
|
+
```vue
|
|
150
|
+
<template>
|
|
151
|
+
<FuroToaster />
|
|
152
|
+
<!-- the rest of your app -->
|
|
153
|
+
</template>
|
|
154
|
+
```
|
|
155
|
+
|
|
156
|
+
```js
|
|
157
|
+
import {
|
|
158
|
+
toast,
|
|
159
|
+
} from '@openreachtech/furo-vue'
|
|
160
|
+
|
|
161
|
+
toast.show({ title: 'Saved', type: 'success' })
|
|
162
|
+
```
|
|
163
|
+
|
|
164
|
+
### (7) Icons the library does not ship
|
|
165
|
+
|
|
166
|
+
Icons resolve offline, so `FuroIcon` draws only the data it holds: the 49 icons
|
|
167
|
+
the library ships, plus whatever your application registers. Register yours once
|
|
168
|
+
at start-up, before the first render:
|
|
169
|
+
|
|
170
|
+
```js
|
|
171
|
+
import {
|
|
172
|
+
furoIconRegistry,
|
|
173
|
+
} from '@openreachtech/furo-vue/icons'
|
|
174
|
+
|
|
175
|
+
furoIconRegistry.registerIconSet({
|
|
176
|
+
iconSet: applicationIconSet,
|
|
177
|
+
})
|
|
178
|
+
```
|
|
179
|
+
|
|
180
|
+
A name nothing resolves throws outside a production build, naming the icon, so a
|
|
181
|
+
missing icon never hides as an empty box. A production build draws the warning
|
|
182
|
+
glyph instead.
|
|
183
|
+
|
|
184
|
+
To reach every name rather than registering them one by one, install your own
|
|
185
|
+
renderer. The registry still answers first, so the library's own icons keep
|
|
186
|
+
drawing offline whatever you install:
|
|
187
|
+
|
|
188
|
+
```js
|
|
189
|
+
furoIconRegistry.useIconRenderer({
|
|
190
|
+
component: applicationIconComponent,
|
|
191
|
+
})
|
|
192
|
+
```
|
|
193
|
+
|
|
194
|
+
A Nuxt application gets this from the module instead:
|
|
195
|
+
|
|
196
|
+
```js
|
|
197
|
+
// nuxt.config.js
|
|
198
|
+
modules: ['@nuxt/icon', '@openreachtech/furo-vue/nuxt']
|
|
199
|
+
```
|
|
200
|
+
|
|
201
|
+
A plain Vue application gets it from `createIconifyRenderer()`, exported at
|
|
202
|
+
`@openreachtech/furo-vue/icon-renderers`. Full API, including single-icon
|
|
203
|
+
registration and a lazy resolver:
|
|
204
|
+
[docs/furo-icon.md](https://github.com/openreachtech/furo-vue/blob/main/docs/furo-icon.md).
|
|
205
|
+
|
|
206
|
+
### (8) Discover every component
|
|
207
|
+
|
|
208
|
+
- Human catalog (grouped by layer, with use cases): [docs/COMPONENTS.md](https://github.com/openreachtech/furo-vue/blob/main/docs/COMPONENTS.md)
|
|
209
|
+
- Machine-readable manifest (for AI agents and tooling): `public/furo-vue/components.json`
|
|
210
|
+
- llms.txt: `public/furo-vue/llms.txt`
|
|
211
|
+
|
|
212
|
+
Maintainers regenerate these from the doc registry with:
|
|
213
|
+
|
|
214
|
+
```sh
|
|
215
|
+
npm run docs:manifest
|
|
216
|
+
```
|
|
217
|
+
|
|
218
|
+
### (9) GraphQL, fetchers, and page templates (out of scope here)
|
|
219
|
+
|
|
220
|
+
`furo-vue` ships presentational atoms, molecules, and organisms only. GraphQL
|
|
221
|
+
launchers, fetcher/submitter adapters, and page-level templates (ListView,
|
|
222
|
+
DetailView, …) live in the consumer app. See
|
|
223
|
+
[docs/furo-vue/README.md](https://github.com/openreachtech/furo-vue/blob/main/docs/furo-vue/README.md)
|
|
224
|
+
for the scope boundary and
|
|
225
|
+
[docs/furo-vue/architecture.md](https://github.com/openreachtech/furo-vue/blob/main/docs/furo-vue/architecture.md)
|
|
226
|
+
for layer rules.
|
|
227
|
+
|
|
228
|
+
### (9) Importing logic in a Node / test environment
|
|
229
|
+
|
|
230
|
+
The main entry (`@openreachtech/furo-vue`) re-exports Vue SFCs, which a plain
|
|
231
|
+
Node / CommonJS test runner (e.g. Jest without a Vue transform) cannot parse.
|
|
232
|
+
When you only need the **pure-JS surface** — `BaseFuroContext`,
|
|
233
|
+
`BaseFuroContextAccessor`, the imperative `toast` helper, `toastQueue`,
|
|
234
|
+
`ToastQueue` — import the logic-only entry, which pulls no `.vue` files and loads
|
|
235
|
+
in a jsdom-free Node environment:
|
|
236
|
+
|
|
237
|
+
```js
|
|
238
|
+
import {
|
|
239
|
+
BaseFuroContext,
|
|
240
|
+
} from '@openreachtech/furo-vue/lib/index.core.js'
|
|
241
|
+
```
|
|
242
|
+
|
|
243
|
+
Component (`.vue`) tests still go through the full entry under a jsdom + Vue
|
|
244
|
+
transform.
|
|
245
|
+
|
|
246
|
+
## Using with Claude (AI agents)
|
|
247
|
+
|
|
248
|
+
`furo-vue` ships machine-readable docs so an AI agent (Claude Code, Cursor, etc.)
|
|
249
|
+
can scaffold components correctly without guessing the API. After install they
|
|
250
|
+
live inside the package:
|
|
251
|
+
|
|
252
|
+
- `node_modules/@openreachtech/furo-vue/public/furo-vue/llms.txt` — a compact,
|
|
253
|
+
link-based index of every component grouped by layer.
|
|
254
|
+
- `node_modules/@openreachtech/furo-vue/public/furo-vue/components.json` — the
|
|
255
|
+
full manifest: for each component its `import` path, `props`, `parcel` keys,
|
|
256
|
+
`events`, `slots`, and `features`.
|
|
257
|
+
|
|
258
|
+
### Point Claude Code at the manifest
|
|
259
|
+
|
|
260
|
+
Add a pointer in your project's `CLAUDE.md` (or `AGENTS.md`) so the agent reads
|
|
261
|
+
the contract before writing furo-vue code:
|
|
262
|
+
|
|
263
|
+
```markdown
|
|
264
|
+
## furo-vue component library
|
|
265
|
+
|
|
266
|
+
When building UI with `@openreachtech/furo-vue`, follow its machine-readable contract:
|
|
267
|
+
|
|
268
|
+
- Index: `node_modules/@openreachtech/furo-vue/public/furo-vue/llms.txt`
|
|
269
|
+
- Full API manifest: `node_modules/@openreachtech/furo-vue/public/furo-vue/components.json`
|
|
270
|
+
|
|
271
|
+
Contract for every component: pass a reactive `parcel` object plus `v-model:value`,
|
|
272
|
+
listen to Furo emits (`change-value`, `commit-value`, `update:value`), and use the
|
|
273
|
+
documented slots. Do not reach into the underlying headless primitive.
|
|
274
|
+
```
|
|
275
|
+
|
|
276
|
+
### Ask Claude to load it on demand
|
|
277
|
+
|
|
278
|
+
In a Claude Code session you can also just say:
|
|
279
|
+
|
|
280
|
+
> Read `node_modules/@openreachtech/furo-vue/public/furo-vue/components.json` and
|
|
281
|
+
> build a login form using FuroTextField, FuroPasswordField, and FuroButton.
|
|
282
|
+
|
|
283
|
+
The manifest is regenerated from the doc registry by maintainers with
|
|
284
|
+
`npm run docs:manifest`, so it always matches the shipped components.
|
|
285
|
+
|
|
286
|
+
### Add the furo-vue skill (Claude Code)
|
|
287
|
+
|
|
288
|
+
The repo ships a Claude Code skill, `furo-vue-components`, that routes a request
|
|
289
|
+
("which component for X") to the right component and its contract via the
|
|
290
|
+
manifest. The skill is **not** in the npm package, so copy it from the repo into
|
|
291
|
+
your project's `.claude/skills/`:
|
|
292
|
+
|
|
293
|
+
```sh
|
|
294
|
+
# from a checkout of furo-vue
|
|
295
|
+
cp -R skills/furo-vue-components <your-project>/.claude/skills/
|
|
296
|
+
|
|
297
|
+
# or fetch just the skill file from GitHub
|
|
298
|
+
mkdir -p .claude/skills/furo-vue-components
|
|
299
|
+
curl -fsSL https://raw.githubusercontent.com/openreachtech/furo-vue/main/skills/furo-vue-components/SKILL.md \
|
|
300
|
+
-o .claude/skills/furo-vue-components/SKILL.md
|
|
301
|
+
```
|
|
302
|
+
|
|
303
|
+
Claude Code auto-discovers skills under `.claude/skills/`. Once copied, ask
|
|
304
|
+
Claude to build UI and it invokes the skill, loads the manifest, and calls
|
|
305
|
+
components with the correct `parcel` + `v-model:value` + emits contract.
|
|
306
|
+
|
|
307
|
+
## Contribution
|
|
308
|
+
|
|
309
|
+
Bug reports, feature requests, and code contributions are welcome.
|
|
310
|
+
|
|
311
|
+
Feel free to contact us through GitHub Issues.
|
|
312
|
+
|
|
313
|
+
```sh
|
|
314
|
+
git clone https://github.com/openreachtech/furo-vue.git
|
|
315
|
+
cd furo-vue
|
|
316
|
+
npm install
|
|
317
|
+
npm run lint
|
|
318
|
+
npm test
|
|
319
|
+
```
|
|
320
|
+
|
|
321
|
+
## License
|
|
322
|
+
|
|
323
|
+
This project is released under the MIT License.
|
|
324
|
+
|
|
325
|
+
For more details, please see [in the LICENSE file](./LICENSE).
|
|
326
|
+
|
|
327
|
+
## Developer
|
|
328
|
+
|
|
329
|
+
[Open Reach Tech Inc.](https://openreach.tech)
|
|
330
|
+
|
|
331
|
+
## Copyright
|
|
332
|
+
|
|
333
|
+
© 2026 Open Reach Tech Inc.
|
package/index.js
ADDED
|
@@ -0,0 +1,11 @@
|
|
|
1
|
+
/*
|
|
2
|
+
* Public entry. Split into two internal barrels so each can be tested in the
|
|
3
|
+
* environment that supports it:
|
|
4
|
+
* - `index.core.js` — pure-JS exports (composables, contexts, clerks, shares),
|
|
5
|
+
* loadable in a plain Node CommonJS test environment.
|
|
6
|
+
* - `index.components.js` — Vue SFCs, which pull the reka-ui runtime and must be
|
|
7
|
+
* tested under jsdom.
|
|
8
|
+
* The public surface is the union of both, unchanged.
|
|
9
|
+
*/
|
|
10
|
+
export * from './lib/index.core.js'
|
|
11
|
+
export * from './lib/index.components.js'
|