@lowdefy/blocks-antd 5.6.0 → 6.1.0

package/dist/blocks/Tag/gallery.yaml

@@ -0,0 +1,598 @@
+# Copyright 2020-2026 Lowdefy, Inc
+
+# Licensed under the Apache License, Version 2.0 (the "License");
+# you may not use this file except in compliance with the License.
+# You may obtain a copy of the License at
+
+#     http://www.apache.org/licenses/LICENSE-2.0
+
+# Unless required by applicable law or agreed to in writing, software
+# distributed under the License is distributed on an "AS IS" BASIS,
+# WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
+# See the License for the specific language governing permissions and
+# limitations under the License.
+
+- title: Title
+  blocks:
+    - id: title_simple
+      type: Tag
+      layout:
+        flex: 0 0 auto
+      properties:
+        title: Feature
+    - id: title_html_bold
+      type: Tag
+      layout:
+        flex: 0 0 auto
+      properties:
+        title: '<b>Important</b> Update'
+    - id: title_html_styled
+      type: Tag
+      layout:
+        flex: 0 0 auto
+      properties:
+        title: '<span style="letter-spacing: 1px">NEW</span>'
+    - id: title_fallback
+      type: Tag
+      layout:
+        flex: 0 0 auto
+
+- title: Preset Colors
+  blocks:
+    - id: color_status_row
+      type: Box
+      layout:
+        gap: 8
+      blocks:
+        - id: color_success
+          type: Tag
+          layout:
+            flex: 0 0 auto
+          properties:
+            title: success
+            color: success
+        - id: color_processing
+          type: Tag
+          layout:
+            flex: 0 0 auto
+          properties:
+            title: processing
+            color: processing
+        - id: color_error
+          type: Tag
+          layout:
+            flex: 0 0 auto
+          properties:
+            title: error
+            color: error
+        - id: color_warning
+          type: Tag
+          layout:
+            flex: 0 0 auto
+          properties:
+            title: warning
+            color: warning
+        - id: color_default
+          type: Tag
+          layout:
+            flex: 0 0 auto
+          properties:
+            title: default
+            color: default
+    - id: color_named_row
+      type: Box
+      layout:
+        gap: 8
+      blocks:
+        - id: color_blue
+          type: Tag
+          layout:
+            flex: 0 0 auto
+          properties:
+            title: blue
+            color: blue
+        - id: color_green
+          type: Tag
+          layout:
+            flex: 0 0 auto
+          properties:
+            title: green
+            color: green
+        - id: color_gold
+          type: Tag
+          layout:
+            flex: 0 0 auto
+          properties:
+            title: gold
+            color: gold
+        - id: color_purple
+          type: Tag
+          layout:
+            flex: 0 0 auto
+          properties:
+            title: purple
+            color: purple
+        - id: color_volcano
+          type: Tag
+          layout:
+            flex: 0 0 auto
+          properties:
+            title: volcano
+            color: volcano
+
+- title: Custom Hex Colors
+  blocks:
+    - id: hex_coral
+      type: Tag
+      layout:
+        flex: 0 0 auto
+      properties:
+        title: Coral
+        color: '#ff6b6b'
+    - id: hex_teal
+      type: Tag
+      layout:
+        flex: 0 0 auto
+      properties:
+        title: Teal
+        color: '#20c997'
+    - id: hex_indigo
+      type: Tag
+      layout:
+        flex: 0 0 auto
+      properties:
+        title: Indigo
+        color: '#4c6ef5'
+    - id: hex_navy
+      type: Tag
+      layout:
+        flex: 0 0 auto
+      properties:
+        title: Navy
+        color: '#1864ab'
+
+- title: Icons
+  blocks:
+    - id: icon_string
+      type: Tag
+      layout:
+        flex: 0 0 auto
+      properties:
+        title: Approved
+        icon: AiOutlineCheck
+        color: success
+    - id: icon_warning
+      type: Tag
+      layout:
+        flex: 0 0 auto
+      properties:
+        title: Warning
+        icon: AiOutlineWarning
+        color: warning
+    - id: icon_star
+      type: Tag
+      layout:
+        flex: 0 0 auto
+      properties:
+        title: Featured
+        icon: AiOutlineStar
+        color: gold
+    - id: icon_object_color
+      type: Tag
+      layout:
+        flex: 0 0 auto
+      properties:
+        title: Custom Icon
+        icon:
+          name: AiOutlineCrown
+          color: '#faad14'
+        color: gold
+    - id: icon_object_style
+      type: Tag
+      layout:
+        flex: 0 0 auto
+      properties:
+        title: Large Icon
+        icon:
+          name: AiOutlineRocket
+          style:
+            fontSize: 16
+        color: purple
+
+- title: Closable
+  blocks:
+    - id: closable_default
+      type: Tag
+      layout:
+        flex: 0 0 auto
+      properties:
+        title: Removable
+        closable: true
+    - id: closable_colored
+      type: Tag
+      layout:
+        flex: 0 0 auto
+      properties:
+        title: Done
+        closable: true
+        color: success
+    - id: closable_with_icon
+      type: Tag
+      layout:
+        flex: 0 0 auto
+      properties:
+        title: Starred
+        closable: true
+        icon: AiOutlineStar
+        color: gold
+    - id: closable_with_event
+      type: Tag
+      layout:
+        flex: 0 0 auto
+      properties:
+        title: Close me
+        closable: true
+        color: processing
+      events:
+        onClose:
+          - id: closable_event_msg
+            type: DisplayMessage
+            params:
+              content: Tag closed!
+              status: info
+
+- title: onClick Event
+  blocks:
+    - id: click_basic
+      type: Tag
+      layout:
+        flex: 0 0 auto
+      properties:
+        title: Click me
+        color: blue
+      events:
+        onClick:
+          - id: click_basic_msg
+            type: DisplayMessage
+            params:
+              content: Tag clicked!
+              status: info
+    - id: click_with_icon
+      type: Tag
+      layout:
+        flex: 0 0 auto
+      properties:
+        title: View Details
+        icon: AiOutlineEye
+        color: geekblue
+      events:
+        onClick:
+          - id: click_icon_msg
+            type: DisplayMessage
+            params:
+              content: Opening details...
+              status: info
+    - id: click_set_state
+      type: Tag
+      layout:
+        flex: 0 0 auto
+      properties:
+        title: Select Category
+        color: purple
+      events:
+        onClick:
+          - id: click_set_state_action
+            type: SetState
+            params:
+              selectedCategory: design
+
+- title: Keyboard Shortcuts
+  blocks:
+    - id: shortcut_filter
+      type: Tag
+      layout:
+        flex: 0 0 auto
+      properties:
+        title: Toggle Filter
+        icon: AiOutlineFilter
+        color: blue
+      events:
+        onClick:
+          shortcut: mod+f
+          try:
+            - id: filter_msg
+              type: DisplayMessage
+              params:
+                content: Filter toggled
+                status: info
+
+- title: Style and CSS
+  blocks:
+    - id: css_shadow
+      type: Tag
+      layout:
+        flex: 0 0 auto
+      class: shadow-md
+      properties:
+        title: Shadow
+        color: blue
+    - id: css_rounded
+      type: Tag
+      layout:
+        flex: 0 0 auto
+      class: rounded-full
+      properties:
+        title: Pill Shape
+        color: green
+    - id: css_uppercase
+      type: Tag
+      layout:
+        flex: 0 0 auto
+      class: uppercase tracking-wider
+      properties:
+        title: Uppercase
+        color: purple
+    - id: style_inline_bold
+      type: Tag
+      layout:
+        flex: 0 0 auto
+      properties:
+        title: Bold Text
+        color: volcano
+      style:
+        .element:
+          fontWeight: bold
+          fontSize: 14px
+    - id: style_inline_padding
+      type: Tag
+      layout:
+        flex: 0 0 auto
+      properties:
+        title: Extra Padding
+        color: cyan
+      style:
+        .element:
+          padding: 4px 16px
+          borderWidth: 2px
+
+- title: Theme Token Overrides
+  blocks:
+    - id: theme_light_blue
+      type: Tag
+      layout:
+        flex: 0 0 auto
+      properties:
+        title: Light Blue
+        theme:
+          defaultColor: '#1677ff'
+    - id: theme_dark
+      type: Tag
+      layout:
+        flex: 0 0 auto
+      properties:
+        title: Dark Tag
+        theme:
+          defaultBg: '#141414'
+          defaultColor: '#ffffff'
+    - id: theme_warm
+      type: Tag
+      layout:
+        flex: 0 0 auto
+      properties:
+        title: Warm Tone
+        theme:
+          defaultColor: '#d46b08'
+    - id: theme_solid_text
+      type: Tag
+      layout:
+        flex: 0 0 auto
+      properties:
+        title: Custom Solid
+        color: '#7c3aed'
+        theme:
+          solidTextColor: '#fde68a'
+
+- title: Tag in Issue Tracker
+  blocks:
+    - id: issue_card
+      type: Card
+      properties:
+        title: 'BUG-1042: Login page crashes on invalid email'
+        size: small
+      blocks:
+        - id: issue_description
+          type: Markdown
+          properties:
+            content: 'When a user enters an email without a domain, the login page throws an unhandled exception and shows a blank screen.'
+        - id: issue_tags_row
+          type: Box
+          layout:
+            gap: 8
+          blocks:
+            - id: issue_status
+              type: Tag
+              layout:
+                flex: 0 0 auto
+              properties:
+                title: In Progress
+                icon: AiOutlineSync
+                color: processing
+            - id: issue_priority
+              type: Tag
+              layout:
+                flex: 0 0 auto
+              properties:
+                title: High Priority
+                icon: AiOutlineArrowUp
+                color: error
+              style:
+                .element:
+                  fontWeight: bold
+            - id: issue_label_bug
+              type: Tag
+              layout:
+                flex: 0 0 auto
+              properties:
+                title: bug
+                color: red
+                closable: true
+              events:
+                onClose:
+                  - id: issue_remove_label
+                    type: DisplayMessage
+                    params:
+                      content: Label removed
+                      status: info
+            - id: issue_label_auth
+              type: Tag
+              layout:
+                flex: 0 0 auto
+              properties:
+                title: authentication
+                color: geekblue
+                closable: true
+              events:
+                onClose:
+                  - id: issue_remove_auth_label
+                    type: DisplayMessage
+                    params:
+                      content: Label removed
+                      status: info
+        - id: issue_actions_row
+          type: Box
+          layout:
+            gap: 8
+            justify: flex-end
+          blocks:
+            - id: issue_assign_btn
+              type: Button
+              layout:
+                flex: 0 0 auto
+              properties:
+                title: Assign
+                icon: AiOutlineUser
+                color: default
+                variant: outlined
+                size: small
+              events:
+                onClick:
+                  - id: issue_assign_msg
+                    type: DisplayMessage
+                    params:
+                      content: Assignee updated
+                      status: success
+            - id: issue_resolve_btn
+              type: Button
+              layout:
+                flex: 0 0 auto
+              properties:
+                title: Resolve
+                icon: AiOutlineCheck
+                color: primary
+                variant: solid
+                size: small
+              events:
+                onClick:
+                  - id: issue_resolve_msg
+                    type: DisplayMessage
+                    params:
+                      content: Issue marked as resolved
+                      status: success
+
+- title: Tag in Product Catalog
+  blocks:
+    - id: catalog_card
+      type: Card
+      properties:
+        title: Wireless Noise-Cancelling Headphones
+        size: small
+      blocks:
+        - id: catalog_tags_row
+          type: Box
+          layout:
+            gap: 8
+          blocks:
+            - id: catalog_new
+              type: Tag
+              layout:
+                flex: 0 0 auto
+              properties:
+                title: NEW
+                color: '#52c41a'
+              style:
+                .element:
+                  fontWeight: bold
+                  letterSpacing: 1px
+            - id: catalog_category
+              type: Tag
+              layout:
+                flex: 0 0 auto
+              properties:
+                title: Electronics
+                icon: AiOutlineThunderbolt
+                color: blue
+              events:
+                onClick:
+                  - id: catalog_cat_click
+                    type: Link
+                    params:
+                      pageId: introduction
+            - id: catalog_stock
+              type: Tag
+              layout:
+                flex: 0 0 auto
+              properties:
+                title: In Stock
+                icon: AiOutlineCheck
+                color: success
+            - id: catalog_rating
+              type: Tag
+              layout:
+                flex: 0 0 auto
+              properties:
+                title: '4.8 Stars'
+                icon: AiOutlineStar
+                color: gold
+        - id: catalog_description
+          type: Markdown
+          properties:
+            content: 'Premium over-ear headphones with active noise cancellation, 30-hour battery life, and Bluetooth 5.3 connectivity.'
+        - id: catalog_price_row
+          type: Box
+          layout:
+            gap: 8
+            align: center
+          blocks:
+            - id: catalog_price
+              type: Markdown
+              layout:
+                flex: 0 0 auto
+              properties:
+                content: '**$249.99**'
+            - id: catalog_discount
+              type: Tag
+              layout:
+                flex: 0 0 auto
+              properties:
+                title: 20% OFF
+                color: red
+              style:
+                .element:
+                  fontWeight: bold
+            - id: catalog_add_btn
+              type: Button
+              layout:
+                flex: 0 0 auto
+              properties:
+                title: Add to Cart
+                icon: AiOutlineShoppingCart
+                color: primary
+                variant: solid
+                size: small
+              events:
+                onClick:
+                  - id: catalog_add_msg
+                    type: DisplayMessage
+                    params:
+                      content: Added to cart!
+                      status: success