upgrade ui and use snippet component

Author: tiye

.github/workflows/upload.yaml

@@ -19,15 +19,15 @@ jobs:
 
     - uses: supplypike/setup-bin@v3
       with:
-        uri: 'https://github.com/calcit-lang/calcit/releases/download/0.8.13/cr'
+        uri: 'https://github.com/calcit-lang/calcit/releases/download/0.8.14/cr'
         name: 'cr'
-        version: '0.8.13'
+        version: '0.8.14'
 
     - uses: supplypike/setup-bin@v3
       with:
-        uri: 'https://github.com/calcit-lang/calcit/releases/download/0.8.13/caps'
+        uri: 'https://github.com/calcit-lang/calcit/releases/download/0.8.14/caps'
         name: 'caps'
-        version: '0.8.13'
+        version: '0.8.14'
     - name: "compiles to js"
       run: >
         caps --ci && cr --emit-js --once

calcit.cirru

@@ -147,12 +147,10 @@
                     [] (&{} :name :tag-match :title "|Pattern matching") (&{} :name :component :title |Component) (&{} :name :persistent-data :title "|Persistent data") (&{} :name :pipeline :title "|Pipeline macro")
                     fn (info d!)
                       d! cursor $ :name info
-                  pre $ {}
-                    :class-name $ str-spaced css/expand style-snippet
-                    :style $ {} (:min-width 300)
-                    :innerHTML $ cirru-color/generateHtml
-                      trim $ pick-demo state
-                      , "\"defcomp comp-link (link)\n  tag-match link $ \n    :link title sub-title url\n    div ({})\n      a $ {} (:href url)\n        :inner-text title\n        :target \"\\\"_blank\"\n        :class-name style-display-link\n      =< 8 nil\n      <> sub-title $ str-spaced css/font-fancy style-sub-title\n"
+                  comp-cirru-snippet
+                    trim $ pick-demo state
+                    {} $ :style
+                      {} (:flex 1) (:margin "\"12px 0px")
         |comp-visual $ %{} :CodeEntry (:doc |)
           :code $ quote
             defcomp comp-visual () $ div ({})
@@ -245,14 +243,6 @@
           :code $ quote
             defstyle style-secondary-title $ {}
               "\"&" $ {} (:font-size 16) (:line-height "\"24px")
-        |style-snippet $ %{} :CodeEntry (:doc |)
-          :code $ quote
-            defstyle style-snippet $ {}
-              "\"&" $ {} (:padding "\"8px 12px") (:border-radius "\"8px")
-                :background-color $ hsl 0 0 100
-                :border $ str "\"1px solid " (hsl 0 0 90)
-                :line-height "\"24px"
-                :overflow :auto
         |style-sub-title $ %{} :CodeEntry (:doc |)
           :code $ quote
             defstyle style-sub-title $ {}
@@ -271,7 +261,7 @@
             respo.css :refer $ defstyle
             respo-ui.css :as css
             app.schema :refer $ doc-features doc-columns
-            respo-ui.comp :refer $ comp-tabs
+            respo-ui.comp :refer $ comp-tabs comp-cirru-snippet
     |app.config $ %{} :FileEntry
       :defs $ {}
         |cdn? $ %{} :CodeEntry (:doc |)

compact.cirru

@@ -6,4 +6,4 @@
     |Respo/respo.calcit |main
     |Respo/reel.calcit |main
     |Respo/respo-markdown.calcit |main
-    |Respo/respo-ui.calcit |main
+    |Respo/respo-ui.calcit |0.5.15

package.cirru

@@ -1,11 +1,12 @@
 {
   "dependencies": {
-    "@calcit/procs": "^0.8.13",
-    "cirru-color": "^0.2.3"
+    "@calcit/procs": "^0.8.14",
+    "cirru-color": "^0.2.4",
+    "copy-text-to-clipboard": "^3.2.0"
   },
   "devDependencies": {
     "bottom-tip": "^0.1.5",
-    "vite": "^5.0.4"
+    "vite": "^5.0.11"
   },
   "version": "0.0.1"
 }