3824435f7d
* Adds analytics for DropdownControl * Add isUpdatedViaKeyboard to WIDGET_PROPERTY_UPDATE * fix: jest test for iconselectorcontrol * refactor: Interaction analytics event dispatching moved to a hook * refactor: event collection logic to HOC * Analytics for SwitchControl * Analytics for CodeEditor * Analytics for InputTextControl * Analytics for ColorPicker * fix issue with ColorPicker * refactor to re-use ref * rename the hook to ts * Analytics for StepControl * Analytics for ButtonTabComponent * Analytics for NumericInputControl * Analytics for IconSelector * fix: failed test * Analytics for ActionSelector * fix: failed jest test * fix: jest test for StepControl * Analytics for Option Control * Analytics for LocationSearchControl * Adds Analytics for Tab key * analytics for Property pane connections * Add analytics for widget name * Adds analytics for copy & delete button * fix issue with widget name analytics * add useCallback for tab keydown handler for button * Create separate Event handling for design system * removes unused imports * changes ADS_EVENT to DS_EVENT * Changes AdsEventTypes to DSEventTypes * Changes AdsEventDetail to DSEventDetail * changes occurences of Ads to DS * avoids creation of intermediate function * removes trace of 'analytics' from DS components * rename dispatchDSEvent to emitDSEvent * fix: Cypress selector
77 lines
1.2 KiB
TypeScript
77 lines
1.2 KiB
TypeScript
import React from "react";
|
|
import styled from "styled-components";
|
|
|
|
const TreeStructureWrapper = styled.div`
|
|
li {
|
|
list-style: none;
|
|
}
|
|
|
|
.tree,
|
|
.tree ul {
|
|
margin-bottom: 0;
|
|
margin-top: 0;
|
|
margin-left: 9px;
|
|
padding: 0;
|
|
list-style: none;
|
|
color: #a9a7a7;
|
|
position: relative;
|
|
}
|
|
|
|
.tree ul {
|
|
margin-left: 9px;
|
|
}
|
|
|
|
.tree:before,
|
|
.tree ul:before {
|
|
content: "";
|
|
display: block;
|
|
width: 0;
|
|
position: absolute;
|
|
top: 0;
|
|
bottom: 0;
|
|
left: 0;
|
|
border-left: 2px solid;
|
|
}
|
|
|
|
.tree li {
|
|
margin: 0;
|
|
padding-left: 6px;
|
|
line-height: 18px;
|
|
padding-top: 8px;
|
|
position: relative;
|
|
}
|
|
|
|
.tree li:before {
|
|
content: "";
|
|
display: block;
|
|
width: 9px;
|
|
height: 0;
|
|
border-top: 2px solid;
|
|
margin-top: 36px;
|
|
position: absolute;
|
|
top: 18px;
|
|
left: 0;
|
|
}
|
|
|
|
.tree li:last-child:before {
|
|
background: #a9a7a7;
|
|
height: auto;
|
|
top: 18px;
|
|
bottom: 0;
|
|
}
|
|
`;
|
|
|
|
type TreeStructureProps = {
|
|
children: React.ReactNode;
|
|
};
|
|
|
|
const TreeStructure = React.forwardRef(
|
|
(props: TreeStructureProps, ref: any) => {
|
|
return (
|
|
<TreeStructureWrapper ref={ref}>{props.children}</TreeStructureWrapper>
|
|
);
|
|
},
|
|
);
|
|
|
|
export default TreeStructure;
|