@fudanda/workflow 1.20261015.1-beta.1 → 2.20261024.1-beta.1

package/vendor/coze/source/form-extensions/components/tree-variable-selector/composite-select-tree-panel.tsx

@@ -1,165 +1,165 @@
-/*
- * Copyright 2025 coze-dev Authors
- *
- * 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.
- */
-
-import React, { type ReactNode, useCallback, useMemo, useState } from 'react';
-
-import classnames from 'classnames';
-import { Divider, List } from '@coze-arch/coze-design';
-import type { TreeNodeData } from '@coze-arch/bot-semi/Tree';
-
-import { sortTreeDataByGroup } from './utils';
-import type { ITreeNodeData, SelectType } from './types';
-import { CompositeSelectOption } from './composite-select-option';
-
-import styles from './composite-select.module.less';
-
-interface Props {
-  treeData?: ITreeNodeData[];
-  onOptionHover?: (option: TreeNodeData) => void;
-  onSelect?: (data?: TreeNodeData, type?: SelectType) => void;
-  getOptionPopupContainer?: () => HTMLElement;
-  activeOption?: string | number | undefined;
-  emptyContent?: ReactNode;
-  extraOption?: ReactNode;
-  value?: string[];
-  controlledActive?: boolean;
-}
-
-const CompositeSelectTreePanel = React.forwardRef(
-  (
-    {
-      treeData,
-      onOptionHover,
-      onSelect,
-      getOptionPopupContainer,
-      activeOption,
-      emptyContent,
-      extraOption,
-      value,
-      controlledActive = true,
-    }: Props,
-    treeRef,
-  ) => {
-    const treeDataSortByGroup = useMemo(
-      () => sortTreeDataByGroup(treeData),
-      [treeData],
-    );
-
-    const handleOptionHover = useCallback(
-      (option: TreeNodeData) => {
-        onOptionHover?.(option);
-      },
-      [onOptionHover],
-    );
-
-    const [isHoverOption, setIsHoverOption] = useState(false);
-
-    const treeListWrapperMaxHeight = useMemo(
-      () =>
-        treeDataSortByGroup?.find(item => item.groupId) ? '262px' : '252px',
-      [treeDataSortByGroup],
-    );
-
-    const isNodeVariable = value?.length === 1;
-
-    const renderContent = () => {
-      if (!extraOption) {
-        return treeDataSortByGroup?.length ? (
-          <List>
-            {treeDataSortByGroup?.map((item, index) => (
-              <>
-                {treeDataSortByGroup[index - 1] &&
-                treeDataSortByGroup[index - 1].groupId !== item.groupId ? (
-                  <Divider style={{ width: 'calc(100% - 8px)' }} margin={4} />
-                ) : null}
-                <List.Item className="!p-0 !border-none">
-                  <CompositeSelectOption
-                    ref={treeRef}
-                    data={item}
-                    active={
-                      isHoverOption
-                        ? item.value === activeOption
-                        : item.value === activeOption && controlledActive
-                    }
-                    onMouseOver={() => {
-                      handleOptionHover(item);
-                      setIsHoverOption(true);
-                    }}
-                    onSelect={onSelect}
-                    getPopupContainer={getOptionPopupContainer}
-                  />
-                </List.Item>
-              </>
-            ))}
-          </List>
-        ) : (
-          <div className="px-6 py-3 coz-fg-secondary text-center">
-            {emptyContent}
-          </div>
-        );
-      }
-
-      return (
-        <>
-          {extraOption}
-
-          <List>
-            {treeDataSortByGroup?.map((item, index) => (
-              <>
-                {treeDataSortByGroup[index - 1] &&
-                treeDataSortByGroup[index - 1].groupId !== item.groupId ? (
-                  <Divider style={{ width: 'calc(100% - 8px)' }} margin={4} />
-                ) : null}
-                <List.Item className="!p-0 !border-none">
-                  <CompositeSelectOption
-                    data={item}
-                    active={
-                      isHoverOption
-                        ? item.value === activeOption
-                        : item.value === activeOption && controlledActive
-                    }
-                    selected={isNodeVariable && item.value === value?.[0]}
-                    onMouseOver={() => {
-                      handleOptionHover(item);
-                      setIsHoverOption(true);
-                    }}
-                    onSelect={onSelect}
-                    getPopupContainer={getOptionPopupContainer}
-                  />
-                </List.Item>
-              </>
-            ))}
-          </List>
-        </>
-      );
-    };
-
-    return (
-      <div
-        className={classnames('w-full', styles['node-list-wrapper'])}
-        style={{
-          maxHeight: treeListWrapperMaxHeight,
-        }}
-      >
-        {/* The Search component of coze-design will cause an error in the popover positioning. Please note for the time being. */}
-        {/* <Search className="mb-1" value={query} onChange={setQuery} /> */}
-        {renderContent()}
-      </div>
-    );
-  },
-);
-
-export default CompositeSelectTreePanel;
+/*
+ * Copyright 2025 coze-dev Authors
+ *
+ * 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.
+ */
+
+import React, { type ReactNode, useCallback, useMemo, useState } from 'react';
+
+import classnames from 'classnames';
+import { Divider, List } from '@coze-arch/coze-design';
+import type { TreeNodeData } from '@coze-arch/bot-semi/Tree';
+
+import { sortTreeDataByGroup } from './utils';
+import type { ITreeNodeData, SelectType } from './types';
+import { CompositeSelectOption } from './composite-select-option';
+
+import styles from './composite-select.module.less';
+
+interface Props {
+  treeData?: ITreeNodeData[];
+  onOptionHover?: (option: TreeNodeData) => void;
+  onSelect?: (data?: TreeNodeData, type?: SelectType) => void;
+  getOptionPopupContainer?: () => HTMLElement;
+  activeOption?: string | number | undefined;
+  emptyContent?: ReactNode;
+  extraOption?: ReactNode;
+  value?: string[];
+  controlledActive?: boolean;
+}
+
+const CompositeSelectTreePanel = React.forwardRef(
+  (
+    {
+      treeData,
+      onOptionHover,
+      onSelect,
+      getOptionPopupContainer,
+      activeOption,
+      emptyContent,
+      extraOption,
+      value,
+      controlledActive = true,
+    }: Props,
+    treeRef,
+  ) => {
+    const treeDataSortByGroup = useMemo(
+      () => sortTreeDataByGroup(treeData),
+      [treeData],
+    );
+
+    const handleOptionHover = useCallback(
+      (option: TreeNodeData) => {
+        onOptionHover?.(option);
+      },
+      [onOptionHover],
+    );
+
+    const [isHoverOption, setIsHoverOption] = useState(false);
+
+    const treeListWrapperMaxHeight = useMemo(
+      () =>
+        treeDataSortByGroup?.find(item => item.groupId) ? '262px' : '252px',
+      [treeDataSortByGroup],
+    );
+
+    const isNodeVariable = value?.length === 1;
+
+    const renderContent = () => {
+      if (!extraOption) {
+        return treeDataSortByGroup?.length ? (
+          <List>
+            {treeDataSortByGroup?.map((item, index) => (
+              <>
+                {treeDataSortByGroup[index - 1] &&
+                treeDataSortByGroup[index - 1].groupId !== item.groupId ? (
+                  <Divider style={{ width: 'calc(100% - 8px)' }} margin={4} />
+                ) : null}
+                <List.Item className="!p-0 !border-none">
+                  <CompositeSelectOption
+                    ref={treeRef}
+                    data={item}
+                    active={
+                      isHoverOption
+                        ? item.value === activeOption
+                        : item.value === activeOption && controlledActive
+                    }
+                    onMouseOver={() => {
+                      handleOptionHover(item);
+                      setIsHoverOption(true);
+                    }}
+                    onSelect={onSelect}
+                    getPopupContainer={getOptionPopupContainer}
+                  />
+                </List.Item>
+              </>
+            ))}
+          </List>
+        ) : (
+          <div className="px-6 py-3 coz-fg-secondary text-center">
+            {emptyContent}
+          </div>
+        );
+      }
+
+      return (
+        <>
+          {extraOption}
+
+          <List>
+            {treeDataSortByGroup?.map((item, index) => (
+              <>
+                {treeDataSortByGroup[index - 1] &&
+                treeDataSortByGroup[index - 1].groupId !== item.groupId ? (
+                  <Divider style={{ width: 'calc(100% - 8px)' }} margin={4} />
+                ) : null}
+                <List.Item className="!p-0 !border-none">
+                  <CompositeSelectOption
+                    data={item}
+                    active={
+                      isHoverOption
+                        ? item.value === activeOption
+                        : item.value === activeOption && controlledActive
+                    }
+                    selected={isNodeVariable && item.value === value?.[0]}
+                    onMouseOver={() => {
+                      handleOptionHover(item);
+                      setIsHoverOption(true);
+                    }}
+                    onSelect={onSelect}
+                    getPopupContainer={getOptionPopupContainer}
+                  />
+                </List.Item>
+              </>
+            ))}
+          </List>
+        </>
+      );
+    };
+
+    return (
+      <div
+        className={classnames('w-full', styles['node-list-wrapper'])}
+        style={{
+          maxHeight: treeListWrapperMaxHeight,
+        }}
+      >
+        {/* The Search component of coze-design will cause an error in the popover positioning. Please note for the time being. */}
+        {/* <Search className="mb-1" value={query} onChange={setQuery} /> */}
+        {renderContent()}
+      </div>
+    );
+  },
+);
+
+export default CompositeSelectTreePanel;

package/vendor/coze/source/form-extensions/components/tree-variable-selector/composite-select.module.less

@@ -1,96 +1,96 @@
-/* stylelint-disable no-descending-specificity */
-/* stylelint-disable plugin/disallow-first-level-global */
-/* stylelint-disable rule-empty-line-before */
-/* stylelint-disable declaration-no-important */
-
-
-.composite-select {
-  border: 1px solid rgba(var(--coze-stroke-6),var(--coze-stroke-6-alpha));
-
-  &:hover {
-    border: 1px solid rgba(var(--coze-stroke-6),var(--coze-stroke-6-alpha));
-  }
-
-  :global(.semi-input-wrapper),
-  :global(.semi-input-wrapper:hover) {
-    border: none !important;
-  }
-
-  &:global(.semi-select:hover) {
-    background-color: rgba(var(--coze-bg-6),var(--coze-bg-6-alpha));
-  }
-
-  :global(.semi-input-wrapper) {
-    position: inherit;
-  }
-
-  .select-clear {
-    display: none;
-    &:hover {
-      color: var(--coz-fg-hglt);
-    }
-  }
-
-  &.has-value.show-clear:hover {
-    .select-clear {
-      display: block;
-    }
-
-    .select-arrow-down {
-      display: none;
-    }
-  }
-
-  &-error {
-    border-color: var(--semi-color-danger);
-  }
-
-}
-
-.composite-select-focus {
-  border: 1px solid var(--semi-color-focus-border);
-  :global(.semi-input-wrapper) {
-    background-color: transparent;
-  }
-
-  &:global(.semi-select:hover) {
-    background-color: transparent;
-  }
-
-  &:hover {
-    border: 1px solid var(--semi-color-focus-border);
-    :global(.semi-input-wrapper) {
-      background-color: transparent;
-    }
-  }
-
-  :global(.semi-input-wrapper-focus) {
-    border: none !important;
-  }
-}
-
-:global(.semi-input-group) {
-  .composite-select-focus {
-    border-radius: 0 8px 8px 0;
-  }
-}
-
-
-.node-list-wrapper {
-  overflow-y: auto;
-  max-height: 240px;
-  :global(.coz-search) {
-    min-width: 192px;
-  }
-  :global(.semi-input-wrapper) {
-    width: 192px !important;
-  }
-}
-
-
-.composite-select-input-wrapper {
-  :global(.semi-input) {
-    padding-right: 0;
-    padding-left: 0;
-  }
-}
+/* stylelint-disable no-descending-specificity */
+/* stylelint-disable plugin/disallow-first-level-global */
+/* stylelint-disable rule-empty-line-before */
+/* stylelint-disable declaration-no-important */
+
+
+.composite-select {
+  border: 1px solid rgba(var(--coze-stroke-6),var(--coze-stroke-6-alpha));
+
+  &:hover {
+    border: 1px solid rgba(var(--coze-stroke-6),var(--coze-stroke-6-alpha));
+  }
+
+  :global(.semi-input-wrapper),
+  :global(.semi-input-wrapper:hover) {
+    border: none !important;
+  }
+
+  &:global(.semi-select:hover) {
+    background-color: rgba(var(--coze-bg-6),var(--coze-bg-6-alpha));
+  }
+
+  :global(.semi-input-wrapper) {
+    position: inherit;
+  }
+
+  .select-clear {
+    display: none;
+    &:hover {
+      color: var(--coz-fg-hglt);
+    }
+  }
+
+  &.has-value.show-clear:hover {
+    .select-clear {
+      display: block;
+    }
+
+    .select-arrow-down {
+      display: none;
+    }
+  }
+
+  &-error {
+    border-color: var(--semi-color-danger);
+  }
+
+}
+
+.composite-select-focus {
+  border: 1px solid var(--semi-color-focus-border);
+  :global(.semi-input-wrapper) {
+    background-color: transparent;
+  }
+
+  &:global(.semi-select:hover) {
+    background-color: transparent;
+  }
+
+  &:hover {
+    border: 1px solid var(--semi-color-focus-border);
+    :global(.semi-input-wrapper) {
+      background-color: transparent;
+    }
+  }
+
+  :global(.semi-input-wrapper-focus) {
+    border: none !important;
+  }
+}
+
+:global(.semi-input-group) {
+  .composite-select-focus {
+    border-radius: 0 8px 8px 0;
+  }
+}
+
+
+.node-list-wrapper {
+  overflow-y: auto;
+  max-height: 240px;
+  :global(.coz-search) {
+    min-width: 192px;
+  }
+  :global(.semi-input-wrapper) {
+    width: 192px !important;
+  }
+}
+
+
+.composite-select-input-wrapper {
+  :global(.semi-input) {
+    padding-right: 0;
+    padding-left: 0;
+  }
+}