1 files changed, 35 insertions, 0 deletions
diff --git a/src/demos/FeedbackDemo.tsx b/src/demos/FeedbackDemo.tsx
new file mode 100644
index 0000000..2909878
--- /dev/null
+++ b/src/demos/FeedbackDemo.tsx
@@ -0,0 +1,35 @@
+import { Banner } from '@astryxdesign/core/Banner'
+import { HStack } from '@astryxdesign/core/HStack'
+import { ProgressBar } from '@astryxdesign/core/ProgressBar'
+import { Skeleton } from '@astryxdesign/core/Skeleton'
+import { Spinner } from '@astryxdesign/core/Spinner'
+import { Text } from '@astryxdesign/core/Text'
+import { VStack } from '@astryxdesign/core/VStack'
+
+export function FeedbackDemo() {
+  return (
+    <VStack gap={4}>
+      <Banner
+        status="info"
+        title="新版本已经准备好"
+        description="刷新页面后即可使用最新的组件与主题。"
+      />
+      <VStack gap={2}>
+        <Text type="label">工作区初始化</Text>
+        <ProgressBar label="工作区初始化" value={68} hasValueLabel isLabelHidden />
+      </VStack>
+      <HStack gap={4} vAlign="center" wrap="wrap">
+        <HStack gap={2} vAlign="center">
+          <Spinner size="sm" />
+          <Text type="supporting" size="sm">
+            正在同步数据…
+          </Text>
+        </HStack>
+        <VStack gap={1} width={160}>
+          <Skeleton width="100%" height={14} index={0} />
+          <Skeleton width="70%" height={14} index={1} />
+        </VStack>
+      </HStack>
+    </VStack>
+  )
+}