コンポーネント詳細

Toast / Alert / EmptyState / Skeleton

Toast/alert/empty/skeleton feedback demo

サンプル

参照情報

テンプレート
ui/feedback/stories.html
ゴールデン
ui/feedback/stories.html

Go(Marionette)サンプル

この実装例は Go の Marionette を使っています。ソース: docs/site-astro/public/examples/go/feedback.go

package goexamples

import (
	mb "github.com/YoshihideShirai/marionette/backend"
	mf "github.com/YoshihideShirai/marionette/frontend"
)

func RegisterFeedbackExample(app *mb.App) {
	app.Page("/feedback", func(ctx *mb.Context) mf.Node {
		return mf.Stack(mf.StackProps{Gap: "sm"},
			mf.Toast(mf.ToastProps{Title: "Saved", Description: "All changes were synced.", Props: mf.ComponentProps{Variant: "success"}}),
			mf.Alert(mf.AlertProps{Title: "Needs review", Description: "Please check the highlighted fields.", Props: mf.ComponentProps{Variant: "warning"}}),
			mf.EmptyState(mf.EmptyStateProps{Title: "No data", Description: "Create a record to get started."}),
			mf.Skeleton(mf.SkeletonProps{Rows: 2}),
		)
	})
}