Bricks Schema 中文文档：筛选 – 下拉选择

2026年8月30日

📄 原始资料 （已截断）  |  展开查看原始 JSON（filter-select.json）{ “$schema”: “https://json-schema.org/draft/2020-12/schema”, “$id”: “bricks://elements/filter-select”, “schemaVersion”: “2.3”, “type”: “object”, “title”: “Filter – Select”, “description”: “Schema for Bricks Filter – Select element”, “metadata…

📄 原始资料 （已截断）  |  展开查看原始 JSON（filter-select.json） 
{
  "$schema": "https://json-schema.org/draft/2020-12/schema",
  "$id": "bricks://elements/filter-select",
  "schemaVersion": "2.3",
  "type": "object",
  "title": "Filter - Select",
  "description": "Schema for Bricks Filter - Select element",
  "metadata": {
    "name": "filter-select",
    "category": "general",
    "tag": "div",
    "nestable": false
  },
  "settings": {
    "placeholder": {
      "label": "Placeholder",
      "valueSchema": {
        "type": "string"
      },
      "controlType": "text",
      "labelZh": "占位符"
    },
    "choicesJs": {
      "label": "Enhanced select",
      "hasRequired": true,
      "valueSchema": {
        "type": "boolean"
      },
      "controlType": "checkbox",
      "labelZh": "增强型选择"
    },
    "choicesPosition": {
      "label": "Dropdown position",
      "options": {
        "auto": "Auto",
        "bottom": "Bottom",
        "top": "Top",
        "autoZh": "自动",
        "bottomZh": "底部",
        "topZh": "顶部"
      },
      "hasRequired": true,
      "valueSchema": {
        "oneOf": [
          {
            "type": "string",
            "description": "Single selection",
            "descriptionZh": "单选。"
          },
          {
            "type": "array",
            "items": {
              "type": "string"
            },
            "description": "Multiple selection",
            "descriptionZh": "多选。"
          }
        ]
      },
      "controlType": "select",
      "labelZh": "下拉位置"
    },
    "choicesSearch": {
      "label": "Enable search",
      "valueSchema": {
        "type": "boolean"
      },
      "controlType": "checkbox",
      "labelZh": "启用搜索"
    },
    "choicesSearchBackground": {
      "label": "Background color",
      "css": [
        {
          "property": "background-color",
          "selector": "input[type=\"search\"]"
        }
      ],
      "hasRequired": true,
      "valueSchema": {
        "description": "Color value in various formats",
        "oneOf": [
          {
            "type": "object",
            "properties": {
              "hex": {
                "type": "string",
                "pattern": "^#([A-Fa-f0-9]{6}|[A-Fa-f0-9]{3})$"
              }
            },
            "required": [
              "hex"
            ]
          },
          {
            "type": "object",
            "properties": {
              "rgb": {
                "type": "string",
                "pattern": "^rgba?\\("
              }
            },
            "required": [
              "rgb"
            ]
          },
          {
            "type": "object",
            "properties": {
              "hsl": {
                "type": "string",
                "pattern": "^hsla?\\("
              }
            },
            "required": [
              "hsl"
            ]
          },
          {
            "type": "object",
            "properties": {
              "raw": {
                "type": "string",
                "description": "Raw color value or CSS variable",
                "descriptionZh": "原始颜色值或 CSS 变量。"
              }
            },
            "required": [
              "raw"
            ]
          }
        ],
        "descriptionZh": "各种格式的颜色值。"
      },
      "controlType": "color",
      "labelZh": "背景颜色"
    },
    "choicesSearchPlaceholder": {
      "label": "Placeholder",
      "hasRequired": true,
      "valueSchema": {
        "type": "string"
      },
      "controlType": "text",
      "labelZh": "占位符"
    },
    "choicesSearchTypography": {
      "label": "Placeholder",
      "css": [
        {
          "property": "font",
          "selector": ".bricks-choices__input::placeholder"
        }
      ],
      "hasRequired": true,
      "valueSchema": {
        "type": "object",
        "description": "Typography settings",
        "properties": {
          "font-family": {
            "type": "string"
          },
          "font-size": {
            "type": "string"
          },
          "font-weight": {
            "type": [
              "string",
              "integer"
            ]
          },
          "font-style": {
            "type": "string",
            "enum": [
              "normal",
              "italic",
              "oblique"
            ]
          },
          "line-height": {
            "type": "string"
          },
          "letter-spacing": {
            "type": "string"
          },
          "text-align": {
            "type": "string",
            "enum": [
              "left",
              "center",
              "right",
              "justify"
            ]
          },
          "text-transform": {
            "type": "string",
            "enum": [
              "none",
              "uppercase",
              "lowercase",
              "capitalize"
            ]
          },
          "text-decoration": {
            "type": "string"
          },
          "color": {
            "description": "Color value in various formats",
            "oneOf": [
              {
                "type": "object",
                "properties": {
                  "hex": {
                    "type": "string",
                    "pattern": "^#([A-Fa-f0-9]{6}|[A-Fa-f0-9]{3})$"
                  }
                },
                "required": [
                  "hex"
                ]
              },
              {
                "type": "object",
                "properties": {
                  "rgb": {
                    "type": "string",
                    "pattern": "^rgba?\\("
                  }
                },
                "required": [
                  "rgb"
                ]
              },
              {
                "type": "object",
                "properties": {
                  "hsl": {
                    "type": "string",
                    "pattern": "^hsla?\\("
                  }
                },
                "required": [
                  "hsl"
                ]
              },
              {
                "type": "object",
                "properties": {
                  "raw": {
                    "type": "string",
                    "description": "Raw color value or CSS variable",
                    "descriptionZh": "原始颜色值或 CSS 变量。"
                  }
                },
                "required": [
                  "raw"
                ]
              }
            ],
            "descriptionZh": "各种格式的颜色值。"
          }
        },
        "descriptionZh": "排版设置。"
      },
      "controlType": "typography",
      "labelZh": "占位符"
    },
    "choicesSearchInputTypography": {
      "label": "Input",
      "css": [
        {
          "property": "font",
          "selector": ".bricks-choices__input"
        }
      ],
      "hasRequired": true,
      "valueSchema": {
        "type": "object",
        "description": "Typography settings",
        "properties": {
          "font-family": {
            "type": "string"
          },
          "font-size": {
            "type": "string"
          },
          "font-weight": {
            "type": [
              "string",
              "integer"
            ]
          },
          "font-style": {
            "type": "string",
            "enum": [
              "normal",
              "italic",
              "oblique"
            ]
          },
          "line-height": {
            "type": "string"
          },
          "letter-spacing": {
            "type": "string"
          },
          "text-align": {
            "type": "string",
            "enum": [
              "left",
              "center",
              "right",
              "justify"
            ]
          },
          "text-transform": {
            "type": "string",
            "enum": [
              "none",
              "uppercase",
              "lowercase",
              "capitalize"
            ]
          },
          "text-decoration": {
            "type": "string"
          },
          "color": {
            "description": "Col

... (内容过长已截断，完整 JSON 见原始文件)

前言

Bricks Filter – Select 元素的 schema。

基本信息

  • 英文名称：Filter - Select
  • 中文名称：筛选 – 下拉选择
  • Schema ID：bricks://elements/filter-select
  • Schema 版本：2.3
  • 类型：object
  • 分类：general
  • Tag：div
  • 内部名称：filter-select

设置项

  • placeholder — 占位符 (text)
  • choicesJs — 增强型选择 (checkbox)
  • choicesPosition — 下拉位置 (select)
  • choicesSearch — 启用搜索 (checkbox)
  • choicesSearchBackground — 背景颜色 (color)
  • choicesSearchPlaceholder — 占位符 (text)
  • choicesSearchTypography — 占位符 (typography)
  • choicesSearchInputTypography — 输入框 (typography)
  • choicesSearchInputPadding — 输入框 (text)
  • choicesNoResultsText — 无结果 (text)
  • choicesNoChoicesText — 无选项 (text)
  • enableMultiple — 多选 (checkbox)
  • choicesPillGap — 标签药丸 (number)
  • choicesPillBackground — 标签药丸 (color)
  • choicesPillBorder — 标签药丸 (border)
  • choicesPillTypography — 标签药丸 (typography)
  • choicesPadding — 内边距 (text)
  • choicesBackgroundColor — 背景 (color)
  • choicesBorderBase — 边框 (text)
  • choicesBorderColor — 边框颜色 (color)
  • choicesBorderRadius — 边框圆角 (number)
  • choicesFontSize — 字体大小 (number)
  • choicesTextColor — 文字颜色 (color)
  • choicesArrowColor — 箭头颜色 (color)
  • choicesItemPadding — 内边距 (text)
  • choicesDropdownBackground — 背景 (color)
  • choicesHighlightBackground — 高亮 (color)
  • choicesHighlightTextColor — 高亮 (color)
  • choicesDisabledBackground — 禁用 (color)
  • choicesDisabledTextColor — 禁用 (color)
  • _content — 内容 (text)
  • _margin — 外边距 (spacing)
  • _padding — 内边距 (spacing)
  • _width — 宽度 (number)
  • _widthMin — 最小宽度 (number)
  • _widthMax — 最大宽度 (number)
  • _height — 高度 (number)
  • _heightMin — 最小高度 (number)
  • _heightMax — 最大高度 (number)
  • _aspectRatio — 宽高比 (text)
  • _position — 位置 (select)
  • _top — 顶部 (number)
  • _right — 右侧 (number)
  • _bottom — 底部 (number)
  • _left — 左侧 (number)
  • _zIndex — Z 索引 (number)
  • _order — 顺序 (number)
  • _display — 显示 (select)
  • _visibility — 可见性 (select)
  • _overflow — 溢出 (text)
  • _opacity — 不透明度 (number)
  • _cursor — 光标 (select)
  • _isolation — 隔离 (select)
  • _mixBlendMode — 混合模式 (select)
  • _pointerEvents — 指针事件 (text)
  • _perspective — 透视 (number)
  • _perspectiveOrigin — 透视原点 (text)
  • _gridItemJustifySelf — 自身水平对齐 (align-items)
  • _flexDirection — 方向 (direction)
  • _alignSelf — 自身对齐 (align-items)
  • _justifyContent — 主轴对齐 (justify-content)
  • _alignItems — 交叉轴对齐 (align-items)
  • _gap — 间距 (number)
  • _flexGrow — 放大比例 (number)
  • _flexShrink — 缩小比例 (number)
  • _flexBasis — 伸缩基准 (text)
  • _useMasonry — %s 布局 (checkbox)
  • _masonryColumn — 列数 (number)
  • _masonryGutter — 间距 (number)
  • _masonryHorizontalOrder — 水平顺序 (checkbox)
  • _masonryTransitionDuration — 过渡 (number)
  • _masonryTransitionMode — 显现动画 (select)
  • _typography — _typography (typography)
  • _background — _background (background)
  • _shapeDividers — 自定义形状 (repeater)
  • _gradient — _gradient (gradient)
  • _border — 边框 (border)
  • _boxShadow — 盒子阴影 (box-shadow)
  • _transform — 变换 (transform)
  • _transformOrigin — 变换原点 (text)
  • _motionElementParallax — 元素视差 (checkbox)
  • _motionElementParallaxSpeedX — 水平速度 (number)
  • _motionElementParallaxSpeedY — 垂直速度 (number)
  • _motionBackgroundParallax — 背景视差 (checkbox)
  • _motionBackgroundParallaxSpeed — 背景速度 (number)
  • _motionStartVisiblePercent — 视差起点 (number)
  • _cssCustom — 自定义 CSS (code)
  • _cssClasses — CSS 类 (text)
  • _cssId — CSS ID (text)
  • _cssFilters — CSS 滤镜 (filters)
  • _cssTransition — 过渡 (text)
  • _attributes — 姓名 (repeater)
  • _scrollSnapType — 类型 (select)
  • _scrollSnapAlign — 对齐 (select)
  • _scrollSnapStop — 停止 (select)

补充说明

更多细节可参考 Bricks 官方 Academy 文档。