Skip to content

Commit

Permalink
Merge pull request #1222 from lowcoder-org/dev
Browse files Browse the repository at this point in the history 
Dev -> Main v2.4.8
  • Loading branch information
@FalkWolsky
FalkWolsky authored Oct 3, 2024
2 parents e777b7c + 1548515 commit bc08f13
Show file tree
Hide file tree
Showing 33 changed files with 2,476 additions and 2,281 deletions.
1 change: 0 additions & 1 deletion client/packages/lowcoder-design/src/components/Dropdown.tsx
View file
Original file line number Diff line number Diff line change
Expand Up @@ -163,7 +163,6 @@ export function Dropdown<T extends OptionsType>(props: DropdownProps<T>) {
const dropdownElems = document.querySelectorAll<HTMLElement>("div.ant-dropdown ul.ant-dropdown-menu");
for (let index = 0; index < dropdownElems.length; index++) {
const element = dropdownElems[index];
console.log(element);
element.style.maxHeight = "300px";
element.style.overflowY = "scroll";
element.style.minWidth = "150px";
Expand Down
2 changes: 1 addition & 1 deletion client/packages/lowcoder-design/src/components/option.tsx
View file
Original file line number Diff line number Diff line change
Expand Up @@ -273,7 +273,7 @@ function Option<T extends ConstructorToComp<MultiCompConstructor>>(props: {
del={props.onDel ? () => props.onDel!(index) : undefined}
>
<StyledPointIcon
onClick={(e) => {
onClick={(e: any) => {
e.stopPropagation();
}}
/>
Expand Down
727 changes: 0 additions & 727 deletions client/packages/lowcoder-design/src/icons/index.ts
View file

This file was deleted.

728 changes: 728 additions & 0 deletions client/packages/lowcoder-design/src/icons/index.tsx
View file

Large diffs are not rendered by default.

143 changes: 104 additions & 39 deletions client/packages/lowcoder-design/src/index.ts
View file
Original file line number Diff line number Diff line change
@@ -1,54 +1,119 @@
export * from "./components/Collapase";
import React from "react";

export const Collapse = React.lazy(() => import("./components/Collapase").then(module => ({ default: module.Collapse })));
export const PadDiv = React.lazy(() => import("./components/Collapase").then(module => ({ default: module.PadDiv })));
export const UnShow = React.lazy(() => import("./components/Collapase").then(module => ({ default: module.UnShow})));
export * from "./components/CustomModal";
export * from "./components/Drawer";
export * from "./components/Dropdown";
export * from "./components/ExternalLink";
export const Drawer = React.lazy(() => import("./components/Drawer").then(module => ({ default: module.Drawer })));
export * from "./components/Dropdown"
export const ExternalLink = React.lazy(() => import("./components/ExternalLink").then(module => ({ default: module.ExternalLink })));
export const DocLink = React.lazy(() => import("./components/ExternalLink").then(module => ({ default: module.DocLink })));
export * from "./components/GlobalInstances";
export * from "./components/Input";
export * from "./components/Label";
export * from "./components/Menu";
export * from "./components/MenuItem";
export * from "./components/Modal";
export * from "./components/ScrollBar";
export * from "./components/Search";
export * from "./components/Section";
export * from "./components/SuspensionBox";
export * from "./components/Switch";
export * from "./components/Tab";
export * from "./components/Table";
export * from "./components/Trees";
export const Input = React.lazy(() => import("./components/Input").then(module => ({ default: module.Input })));
export const StyledInput = React.lazy(() => import("./components/Input").then(module => ({ default: module.StyledInput })));
export { EllipsisTextCss, labelCss, CommonTextLabel, CommonGrayLabel } from "./components/Label";
export const BlockGrayLabel = React.lazy(() => import("./components/Label").then(module => ({ default: module.BlockGrayLabel })));
export const TextLabel = React.lazy(() => import("./components/Label").then(module => ({ default: module.TextLabel })));
export const BlockLabel = React.lazy(() => import("./components/Label").then(module => ({ default: module.BlockLabel })));
export const CollapseTitle = React.lazy(() => import("./components/Label").then(module => ({ default: module.CollapseTitle })));
export const CollapseLabel = React.lazy(() => import("./components/Label").then(module => ({ default: module.CollapseLabel })));
export const CollapseLink = React.lazy(() => import("./components/Label").then(module => ({ default: module.CollapseLink })));
export const CommonTextLabel2 = React.lazy(() => import("./components/Label").then(module => ({ default: module.CommonTextLabel2 })));
export const CommonErrorLabel = React.lazy(() => import("./components/Label").then(module => ({ default: module.CommonErrorLabel })));
export const CommonBlueLabel = React.lazy(() => import("./components/Label").then(module => ({ default: module.CommonBlueLabel })));
export const Menu = React.lazy(() => import("./components/Menu").then(module => ({ default: module.Menu })));
export const DropdownMenu = React.lazy(() => import("./components/Menu").then(module => ({ default: module.DropdownMenu })));
export const DropDownSubMenu = React.lazy(() => import("./components/Menu").then(module => ({ default: module.DropDownSubMenu })));
export const MenuItemWithDelete = React.lazy(() => import("./components/Menu").then(module => ({ default: module.MenuItemWithDelete })));
export const MenuItem = React.lazy(() => import("./components/MenuItem").then(module => ({ default: module.MenuItem })));
export const FormItem = React.lazy(() => import("./components/MenuItem").then(module => ({ default: module.FormItem})));
export const Modal = React.lazy(() => import("./components/Modal").then(module => ({ default: module.Modal})));
export const ScrollBar = React.lazy(() => import("./components/ScrollBar").then(module => ({ default: module.ScrollBar})));
export const Search = React.lazy(() => import("./components/Search").then(module => ({ default: module.Search })));
export {PropertySectionContext, sectionNames} from "./components/Section";
export type { PropertySectionState, PropertySectionContextType } from "./components/Section";
export const Section = React.lazy(() => import("./components/Section").then(module => ({ default: module.Section})));
export const BaseSection = React.lazy(() => import("./components/Section").then(module => ({ default: module.BaseSection})));
export const SuspensionBox = React.lazy(() => import("./components/SuspensionBox").then(module => ({ default: module.SuspensionBox })));
export const Switch = React.lazy(() => import("./components/Switch").then(module => ({ default: module.Switch })));
export const SwitchJsIcon = React.lazy(() => import("./components/Switch").then(module => ({ default: module.SwitchJsIcon })));
export const SwitchWrapper = React.lazy(() => import("./components/Switch").then(module => ({ default: module.SwitchWrapper })));
export const TacoSwitch = React.lazy(() => import("./components/Switch").then(module => ({ default: module.TacoSwitch })));
export const Tabs = React.lazy(() => import("./components/Tab").then(module => ({ default: module.Tabs })));
export const TableShow = React.lazy(() => import("./components/Table").then(module => ({ default: module.TableShow })));
export const CustomTree = React.lazy(() => import("./components/Trees").then(module => ({ default: module.CustomTree})));
export const BranchDiv = React.lazy(() => import("./components/Trees").then(module => ({ default: module.BranchDiv })));
export const Treediv = React.lazy(() => import("./components/Trees").then(module => ({ default: module.Treediv})));
export * from "./components/TriggeredDialog";
export * from "./components/alert";
export * from "./components/audio";
export * from "./components/button";
export * from "./components/checkBox";
export * from "./components/colorSelect";
export const Alert = React.lazy(() => import("./components/alert").then(module => ({ default: module.Alert })));
export const TacoAudio = React.lazy(() => import("./components/audio").then(module => ({ default: module.TacoAudio })));
export type { TacoButtonType } from "./components/button";
export const BigButtonStyle = React.lazy(() => import("./components/button").then(module => ({ default: module.BigButtonStyle })));
export const BlueButton = React.lazy(() => import("./components/button").then(module => ({ default: module.BlueButton })));
export const RedButton = React.lazy(() => import("./components/button").then(module => ({ default: module.RedButton })));
export const LinkButton = React.lazy(() => import("./components/button").then(module => ({ default: module.LinkButton })));
export const TacoButton = React.lazy(() => import("./components/button").then(module => ({ default: module.TacoButton })));
export const CheckBox = React.lazy(() => import("./components/checkBox").then(module => ({ default: module.CheckBox })));
export * from "./components/colorSelect/colorUtils";
export * from "./components/colorSelect/index";
export const ColorSelect = React.lazy(() => import("./components/colorSelect/index").then(module => ({ default: module.ColorSelect })));
export * from "./components/container";
export * from "./components/control";
export * from "./components/copyTextButton";
export const CopyTextButton = React.lazy(() => import("./components/copyTextButton").then(module => ({ default: module.CopyTextButton})));
export * from "./components/customSelect";
export * from "./components/edit";
export type { EditTextProps } from "./components/edit";
export const EditText = React.lazy(() => import("./components/edit").then(module => ({ default: module.EditText })));
export const EditTextWrapper = React.lazy(() => import("./components/edit").then(module => ({ default: module.EditTextWrapper })));
export const TextWrapper = React.lazy(() => import("./components/edit").then(module => ({ default: module.TextWrapper })));
export * from "./components/eventHandler";
export * from "./components/form";
export * from "./components/iconSelect";
export * from "./components/image";
export * from "./components/keyValueList";
export * from "./components/Loading";
export * from "./components/markdown";
export { removeQuote, useIcon, iconPrefix } from "./components/iconSelect";
export const IconSelect = React.lazy(() => import("./components/iconSelect").then(module => ({ default: module.IconSelect })));
export const IconSelectBase = React.lazy(() => import("./components/iconSelect").then(module => ({ default: module.IconSelectBase})));
export const TacoImage = React.lazy(() => import("./components/image").then(module => ({ default: module.TacoImage })));
export const KeyValueList = React.lazy(() => import("./components/keyValueList").then(module => ({ default: module.KeyValueList })));
export const Loading = React.lazy(() => import("./components/Loading").then(module => ({ default: module.Loading })));
export const WhiteLoading = React.lazy(() => import("./components/Loading").then(module => ({ default: module.WhiteLoading })));
export const LightLoading = React.lazy(() => import("./components/Loading").then(module => ({ default: module.LightLoading })));
export { markdownCompCss } from "./components/markdown";
export const TacoMarkDown = React.lazy(() => import("./components/markdown").then(module => ({ default: module.TacoMarkDown })));
export * from "./components/mockData";
export * from "./components/option";
export * from "./components/popover";
export * from "./components/popupCard";
export * from "./components/query";
export * from "./components/selectedComps";
export * from "./components/tacoInput";
export * from "./components/tacoPagination";
export * from "./components/toolTip";
export * from "./components/video";
export * from "./components/shapeSelect";
export type { EditPopoverItemType, EditPopoverProps } from "./components/popover";
export const CustomPopover = React.lazy(() => import("./components/popover").then(module => ({ default: module.CustomPopover })));
export const SimplePopover = React.lazy(() => import("./components/popover").then(module => ({ default: module.SimplePopover })));
export const EditPopover = React.lazy(() => import("./components/popover").then(module => ({ default: module.EditPopover})));
export const PopupCard = React.lazy(() => import("./components/popupCard").then(module => ({ default: module.PopupCard })));
export const QueryPropertyViewWrapper = React.lazy(() => import("./components/query").then(module => ({ default: module.QueryPropertyViewWrapper })));
export const QueryAlert = React.lazy(() => import("./components/query").then(module => ({ default: module.QueryAlert })));
export const QuerySectionWrapper = React.lazy(() => import("./components/query").then(module => ({ default: module.QuerySectionWrapper })));
export const QueryConfigWrapper = React.lazy(() => import("./components/query").then(module => ({ default: module.QueryConfigWrapper })));
export const QueryConfigLabel = React.lazy(() => import("./components/query").then(module => ({ default: module.QueryConfigLabel })));
export const QueryConfigItemWrapper = React.lazy(() => import("./components/query").then(module => ({ default: module.QueryConfigItemWrapper })));
export const QueryTutorialButton = React.lazy(() => import("./components/query").then(module => ({ default: module.QueryTutorialButton })));
export const TriggerTypeStyled = React.lazy(() => import("./components/query").then(module => ({ default: module.TriggerTypeStyled })));
export const SelectedComps = React.lazy(() => import("./components/selectedComps").then(module => ({ default: module.SelectedComps})));
export const TacoInput = React.lazy(() => import("./components/tacoInput").then(module => ({ default: module.TacoInput })));
export const BlurFinishInput = React.lazy(() => import("./components/tacoInput").then(module => ({ default: module.BlurFinishInput })));
export const PhoneNumberInput = React.lazy(() => import("./components/tacoInput").then(module => ({ default: module.PhoneNumberInput })));
export const OtpFormInput = React.lazy(() => import("./components/tacoInput").then(module => ({ default: module.OtpFormInput })));
export const FormInput = React.lazy(() => import("./components/tacoInput").then(module => ({ default: module.FormInput })));
export const PasswordInput = React.lazy(() => import("./components/tacoInput").then(module => ({ default: module.PasswordInput })));
export { pageItemRender } from "./components/tacoPagination";
export const TacoPagination = React.lazy(() => import("./components/tacoPagination").then(module => ({ default: module.TacoPagination })));
export { UnderlineCss } from "./components/toolTip";
export const TooltipCodeBlock = React.lazy(() => import("./components/toolTip").then(module => ({ default: module.TooltipCodeBlock})));
export const TooltipLink = React.lazy(() => import("./components/toolTip").then(module => ({ default: module.TooltipLink})));
export const TutorialsTooltip = React.lazy(() => import("./components/toolTip").then(module => ({ default: module.TutorialsTooltip})));
export const CommonTipsOverlay = React.lazy(() => import("./components/toolTip").then(module => ({ default: module.CommonTipsOverlay})));
export const Tooltip = React.lazy(() => import("./components/toolTip").then(module => ({ default: module.Tooltip})));
export const ToolTipLabel = React.lazy(() => import("./components/toolTip").then(module => ({ default: module.ToolTipLabel})));
export { playIcon } from "./components/video";
export const Video = React.lazy(() => import("./components/video").then(module => ({ default: module.Video })));
export const Container = React.lazy(() => import("./components/video").then(module => ({ default: module.Container})));
export { useShape } from "./components/shapeSelect";
export const ShapeSelect = React.lazy(() => import("./components/shapeSelect").then(module => ({ default: module.ShapeSelect })));
export const ShapeSelectBase = React.lazy(() => import("./components/shapeSelect").then(module => ({ default: module.ShapeSelectBase})));

export * from "./icons";

export * from "./icons/antIcon";
8 changes: 4 additions & 4 deletions client/packages/lowcoder/package.json
View file
Original file line number Diff line number Diff line change
Expand Up @@ -25,10 +25,10 @@
"@fortawesome/free-solid-svg-icons": "^6.5.1",
"@fortawesome/react-fontawesome": "latest",
"@manaflair/redux-batch": "^1.0.0",
"@rjsf/antd": "^5.18.6",
"@rjsf/core": "^5.18.6",
"@rjsf/utils": "^5.18.6",
"@rjsf/validator-ajv8": "^5.18.6",
"@rjsf/antd": "^5.21.2",
"@rjsf/core": "^5.21.2",
"@rjsf/utils": "^5.21.2",
"@rjsf/validator-ajv8": "^5.21.2",
"@types/lodash": "^4.14.194",
"@types/node": "^16.7.13",
"@types/react": "^18.2.45",
Expand Down
68 changes: 68 additions & 0 deletions client/packages/lowcoder/src/comps/comps/jsonSchemaFormComp/ArrayFieldTemplate.tsx
View file
Original file line number Diff line number Diff line change
@@ -0,0 +1,68 @@
import React from 'react';
import { Button, Row, Col } from 'antd';
import { ArrayFieldTemplateProps } from '@rjsf/utils';
import { ArrowDownOutlined, ArrowUpOutlined, DeleteOutlined, PlusOutlined } from '@ant-design/icons';

const ArrayFieldTemplate = (props: ArrayFieldTemplateProps) => {
const { items, canAdd, onAddClick, title } = props;

return (
<fieldset>
{title && <legend>{title}</legend>}
<Row gutter={[0, 0]}>
{items.map((element: any) => (
<Col key={element.index} span={24} style={{ display: 'flex', alignItems: 'center' }}>
{/* Content container for the array item */}
<div style={{ flexGrow: 1 }}>
{element.children}
</div>

{/* Container for the control buttons with vertical alignment */}
<div style={{ display: 'flex', flexDirection: 'row', justifyContent: 'flex-end', paddingTop: "58px" }}>
{/* Move down button */}
{element.hasMoveDown && (
<Button
type="default"
icon={<ArrowDownOutlined />}
onClick={element.onReorderClick(element.index, element.index + 1)}
style={{ marginLeft: '4px' }}
/>
)}

{/* Move up button */}
{element.hasMoveUp && (
<Button
type="default"
icon={<ArrowUpOutlined />}
onClick={element.onReorderClick(element.index, element.index - 1)}
style={{ marginLeft: '4px' }}
/>
)}

{/* Remove button */}
{element.hasRemove && (
<Button
type="default"
icon={<DeleteOutlined />}
danger
onClick={element.onDropIndexClick(element.index)}
style={{ marginLeft: '4px' }}
/>
)}
</div>
</Col>
))}
{/* Add button for the array */}
{canAdd && (
<Col span={24} style={{ textAlign: 'center' }}>
<Button type="dashed" onClick={onAddClick} icon={<PlusOutlined />}>
Add Item
</Button>
</Col>
)}
</Row>
</fieldset>
);
};

export default ArrayFieldTemplate;
Loading

0 comments on commit bc08f13

Please sign in to comment.