kitchen-simulator 5.0.0-test.7 → 5.0.0-test.8

package/src/components/myprojects/styles.js

@@ -1,241 +0,0 @@
-import {
-  BG_COLOR_0,
-  BG_COLOR_HOVER,
-  DEFAULT_FONT_FAMILY,
-  SECONDARY_PURPLE_COLOR,
-  TEXT_COLOR_NEUTRAL_0,
-  TEXT_COLOR_NEUTRAL_1,
-  TEXT_COLOR_NEUTRAL_2,
-  TEXT_COLOR_NEUTRAL_3
-} from '../../constants';
-import styled from 'styled-components';
-import MyProjects from './index';
-
-export const DialogWrapper = styled.div`
-  position: absolute;
-  left: 0;
-  top: 60px;
-  width: 100%;
-  height: calc(100% - 60px);
-  display: flex;
-`;
-
-export const Dialog = styled.div`
-  position: relative;
-  margin: auto;
-  width: 600px;
-  display: flex;
-  flex-direction: column;
-  padding: 30px;
-  user-select: none;
-  text-align: center;
-  border-radius: 10px;
-  z-index: 10;
-  background-color: rgb(255, 255, 255);
-  box-shadow: 0px 3px 5px -1px rgba(156, 154, 154, 0.2),
-    0px 6px 10px 0px rgba(156, 154, 154, 0.39),
-    0px 1px 18px 0px rgba(156, 154, 154, 0.12);
-`;
-
-export const DialogTitle = styled.span`
-  color: ${TEXT_COLOR_NEUTRAL_1};
-  font-family: ${DEFAULT_FONT_FAMILY};
-  font-size: 22px;
-  font-weight: 700;
-  line-height: 30px;
-  text-align: left;
-`;
-
-export const DialogContent = styled.span`
-  font-family: ${DEFAULT_FONT_FAMILY};
-  color: ${TEXT_COLOR_NEUTRAL_1};
-  padding: 10px 0px;
-  font-size: 13px;
-  font-weight: 400;
-  line-height: 18px;
-  text-align: left;
-  width: 100%;
-`;
-
-export const DialogContentSelection = styled.div`
-  display: flex;
-  flex-direction: column;
-  padding: 10px 0px;
-  max-height: calc(100vh - 300px);
-  overflow-y: scroll;
-`;
-
-export const DialogContents = styled.span`
-  font-family: ${DEFAULT_FONT_FAMILY};
-  color: ${TEXT_COLOR_NEUTRAL_1};
-  padding: 10px 0px;
-
-  @media screen and (min-width: 1024) {
-    font-size: 11px;
-  }
-  @media screen and (max-width: 1024) {
-    font-size: 11px;
-  }
-  @media screen and (min-width: 1366) {
-    font-size: 13px;
-  }
-  @media screen and (max-width: 1366) {
-    font-size: 13px;
-  }
-  @media screen and (min-width: 1440) {
-    font-size: 16px;
-  }
-  @media screen and (max-width: 1440) {
-    font-size: 16px;
-  }
-  font-weight: 400;
-  line-height: 18px;
-  text-align: left;
-`;
-
-export const SelectWrapper = styled.div`
-  position: relative;
-  display: flex;
-  align-items: center;
-  margin-left: 10px;
-`;
-
-export const Select = styled.div`
-  border-bottom: 2px solid ${TEXT_COLOR_NEUTRAL_1};
-  width: 150px;
-  text-align: left;
-  font-family: ${DEFAULT_FONT_FAMILY};
-  color: ${TEXT_COLOR_NEUTRAL_1};
-  cursor: pointer;
-  :hover {
-    border-bottom-color: ${SECONDARY_PURPLE_COLOR};
-  }
-`;
-
-export const ArrowIcon = styled.img`
-  position: absolute;
-  width: 15px;
-  height: 9px;
-  background-color: ${TEXT_COLOR_NEUTRAL_3};
-  top: 10px;
-  right: 10px;
-  -webkit-mask-image: url(${props => props.maskImage});
-  -webkit-mask-size: 100% 100%;
-  -webkit-mask-repeat: no-repeat;
-`;
-
-export const SelectOption = styled.span`
-  font-size: 13px;
-  padding: 12px 20px;
-  font-family: ${DEFAULT_FONT_FAMILY};
-  color: ${TEXT_COLOR_NEUTRAL_0};
-  font-weight: 600;
-  text-align: left;
-  cursor: pointer;
-  :hover {
-    background-color: ${BG_COLOR_HOVER};
-  }
-`;
-
-export const SearchInput = styled.input`
-  outline: 0;
-  border: 2px solid ${TEXT_COLOR_NEUTRAL_3};
-  height: 35px;
-  padding: 5px;
-  padding-left: 35px;
-  border-radius: 7px;
-`;
-
-export const MyProjectsTable = styled.div`
-  display: flex;
-  flex-direction: column;
-`;
-
-export const MyProjectsThead = styled.div`
-  background-color: ${BG_COLOR_0};
-  display: flex;
-  align-items: center;
-  background-color: #fafaff;
-`;
-
-export const MyProjectsTh = styled.div`
-  font-family: ${DEFAULT_FONT_FAMILY};
-
-  @media screen and (min-width: 1024) {
-    font-size: 11px;
-  }
-  @media screen and (max-width: 1024) {
-    font-size: 11px;
-  }
-  @media screen and (min-width: 1366) {
-    font-size: 13px;
-  }
-  @media screen and (max-width: 1366) {
-    font-size: 13px;
-  }
-  @media screen and (min-width: 1440) {
-    font-size: 16px;
-  }
-  @media screen and (max-width: 1440) {
-    font-size: 16px;
-  }
-  line-height: 13px;
-  text-align: left;
-  font-weight: 600;
-  margin: 5px;
-  line-height: normal;
-  color: ${TEXT_COLOR_NEUTRAL_2};
-`;
-
-export const ActionButton = styled.div`
-  border-radius: 5px;
-  cursor: pointer;
-  display: flex;
-  align-items: center;
-  color: ${SECONDARY_PURPLE_COLOR};
-  width: 35px;
-  height: 35px;
-  padding: 10px;
-  :hover {
-    background-color: ${BG_COLOR_HOVER};
-  }
-`;
-
-export const TileItem = styled.div`
-  width: 150px;
-  display: flex;
-  flex-direction: column;
-  font-family: ${DEFAULT_FONT_FAMILY};
-
-  @media screen and (min-width: 1024) {
-    font-size: 11px;
-  }
-  @media screen and (max-width: 1024) {
-    font-size: 11px;
-  }
-  @media screen and (min-width: 1366) {
-    font-size: 13px;
-  }
-  @media screen and (max-width: 1366) {
-    font-size: 13px;
-  }
-  @media screen and (min-width: 1440) {
-    font-size: 16px;
-  }
-  @media screen and (max-width: 1440) {
-    font-size: 16px;
-  }
-  line-height: 13px;
-  text-align: left;
-  font-weight: 600;
-  line-height: normal;
-  color: ${TEXT_COLOR_NEUTRAL_2};
-  border-radius: 10px;
-  border: 2px solid #fafaff;
-  padding: 15px;
-  cursor: pointer;
-  margin: 10px;
-  :hover {
-    background-color: #fafaff;
-  }
-`;

package/src/components/sidebar/custom-accordion.jsx

@@ -1,48 +0,0 @@
-import React from 'react';
-import {
-  Accordion,
-  AccordionSummary,
-  AccordionDetails
-} from '@material-ui/core';
-import ExpandMoreIcon from '@material-ui/icons/ExpandMore';
-import { makeStyles } from '@material-ui/core/styles';
-
-const useStyles = makeStyles({
-  root: {},
-  content: {
-    display: 'flex',
-    alignItems: 'center',
-    gap: '0.5rem'
-  }
-});
-
-const CustomAccordion = ({ icon, title, children, defaultExpanded }) => {
-  const classes = useStyles();
-
-  return (
-    <Accordion
-      style={{
-        boxShadow: 'none',
-        marginTop: '1rem'
-      }}
-      defaultExpanded={defaultExpanded}
-    >
-      <AccordionSummary
-        classes={{ content: classes.content, root: classes.root }}
-        expandIcon={<ExpandMoreIcon />}
-      >
-        {icon && icon}
-        {title && title}
-      </AccordionSummary>
-      <AccordionDetails
-        style={{
-          display: 'inherit'
-        }}
-      >
-        {children}
-      </AccordionDetails>
-    </Accordion>
-  );
-};
-
-export default CustomAccordion;

package/src/components/sidebar/export.js

@@ -1,15 +0,0 @@
-import Sidebar from './sidebar';
-import Panel from './panel';
-import PanelLayers from './panel-layers';
-import PanelLayerElement from './panel-layer-elements';
-import PanelGuides from './panel-guides';
-
-export { Sidebar, Panel, PanelLayers, PanelLayerElement, PanelGuides };
-
-export default {
-  Sidebar,
-  Panel,
-  PanelLayers,
-  PanelLayerElement,
-  PanelGuides
-};

package/src/components/sidebar/panel-element-editor/attributes-editor/attributes-editor.jsx

@@ -1,73 +0,0 @@
-import React, { Component } from 'react';
-import PropTypes from 'prop-types';
-import ItemAttributesEditor from './item-attributes-editor';
-import LineAttributesEditor from './line-attributes-editor';
-import HoleAttributesEditor from './hole-attributes-editor';
-
-export default function AttributesEditor({
-  element,
-  onUpdate,
-  onValid,
-  propertiesFormData,
-  catalog,
-  attributeFormData,
-  onConfigUpdate,
-  state,
-  internalState,
-  ...rest
-}) {
-  switch (element.prototype) {
-    case 'items':
-      return (
-        <ItemAttributesEditor
-          element={element}
-          onUpdate={onUpdate}
-          onValid={onValid}
-          propertiesFormData={propertiesFormData}
-          catalog={catalog}
-          attributeFormData={attributeFormData}
-          onConfigUpdate={onConfigUpdate}
-          state={state}
-          internalState={internalState}
-          {...rest}
-        />
-      );
-    case 'lines':
-      return (
-        <LineAttributesEditor
-          element={element}
-          onUpdate={onUpdate}
-          onValid={onValid}
-          attributeFormData={attributeFormData}
-          state={state}
-          {...rest}
-        />
-      );
-    case 'holes':
-      return (
-        <HoleAttributesEditor
-          element={element}
-          onUpdate={onUpdate}
-          propertiesFormData={propertiesFormData}
-          catalog={catalog}
-          onConfigUpdate={onConfigUpdate}
-          onValid={onValid}
-          attributeFormData={attributeFormData}
-          state={state}
-          {...rest}
-        />
-      );
-    case 'areas':
-      return null;
-  }
-
-  return null;
-}
-
-AttributesEditor.propTypes = {
-  element: PropTypes.object.isRequired,
-  onUpdate: PropTypes.func.isRequired,
-  onValid: PropTypes.func,
-  attributeFormData: PropTypes.object.isRequired,
-  state: PropTypes.object.isRequired
-};

package/src/components/sidebar/panel-element-editor/attributes-editor/confirm-popup.jsx

@@ -1,101 +0,0 @@
-import React from 'react';
-import * as S from '../../../toolbar/popup/floorplan/choose-floor/styles';
-import * as PS from '../../../toolbar/popup/styles';
-import { FaTimes } from 'react-icons/fa';
-
-class ConfirmPopup extends React.Component {
-  constructor(props) {
-    super(props);
-  }
-
-  _submit() {
-    this.props.ok();
-    this.closePanel();
-  }
-  closePanel() {
-    this.props.handleConfirmLoad(false);
-  }
-  render() {
-    let { visible } = this.props;
-    return (
-      <div
-        style={{
-          width: '100%',
-          height: '100%',
-          display: visible ? 'block' : 'none',
-          userSelect: 'none'
-        }}
-      >
-        <S.Div>
-          <div
-            style={{
-              backgroundColor: '#1183B7',
-              height: '30px',
-              paddingRight: '6px'
-            }}
-          >
-            <div
-              style={{ float: 'right', marginTop: '4px' }}
-              onClick={() => this.closePanel()}
-            >
-              <PS.IconButton>
-                <FaTimes />
-              </PS.IconButton>
-            </div>
-          </div>
-          <div style={{ fontSize: 14, marginTop: 20, marginLeft: 40 }}>
-            The item will be placed outside the floor plan
-            <br />
-            Are you sure?
-          </div>
-          <div
-            style={{
-              fontSize: 12,
-              display: 'flex',
-              flexDirection: 'column',
-              position: 'relative'
-            }}
-          ></div>
-          <div style={{ display: 'flex', position: 'relative' }}>
-            <div
-              style={{
-                width: '70px',
-                marginLeft: '90px',
-                marginTop: '15px',
-                cursor: 'pointer'
-              }}
-              onClick={() => {
-                this._submit();
-              }}
-            >
-              <img
-                width={'80px'}
-                style={{ float: 'right' }}
-                src={'/assets/img/svg/toolbar/cancel_button.svg'}
-              />
-              <S.ButtonTitle1>{'Yes'}</S.ButtonTitle1>
-            </div>
-            <div
-              style={{
-                width: '70px',
-                marginLeft: '40px',
-                marginTop: '15px',
-                cursor: 'pointer'
-              }}
-              onClick={() => this.closePanel()}
-            >
-              <img
-                width={'80px'}
-                style={{ float: 'right' }}
-                src={'/assets/img/svg/toolbar/use_button.svg'}
-              />
-              <S.ButtonTitle2>{'No'}</S.ButtonTitle2>
-            </div>
-          </div>
-        </S.Div>
-      </div>
-    );
-  }
-}
-
-export default ConfirmPopup;

package/src/components/sidebar/panel-element-editor/attributes-editor/hole-attributes-editor.jsx

@@ -1,149 +0,0 @@
-import React, { Component } from 'react';
-import PropTypes from 'prop-types';
-import { PropertyLengthMeasure } from '../../../../catalog/properties/export';
-import PropertyString from '../../../../catalog/properties/property-string';
-import {
-  DEFAULT_FONT_FAMILY,
-  TEXT_COLOR_NEUTRAL_3
-} from '../../../../constants';
-import styled from 'styled-components';
-
-const NumberInputMeasure = styled.span`
-  font-family: ${DEFAULT_FONT_FAMILY};
-  font-size: 12px;
-  font-weight: 600;
-  line-height: 17px;
-  color: ${TEXT_COLOR_NEUTRAL_3};
-  position: absolute;
-  right: 10px;
-  bottom: 12px;
-`;
-
-export default function HoleAttributesEditor(
-  {
-    element,
-    onUpdate,
-    propertiesFormData,
-    catalog,
-    attributeFormData,
-    onConfigUpdate,
-    state,
-    internalState,
-    filteredProperties,
-    shouldOnlyShowEditorOptions = false,
-    ...rest
-  },
-  { translator }
-) {
-  // let name = attributeFormData.has('name') ? attributeFormData.get('name') : element.name;
-  let offsetA = attributeFormData.has('offsetA')
-    ? attributeFormData.get('offsetA')
-    : element.offsetA;
-  let offsetB = attributeFormData.has('offsetB')
-    ? attributeFormData.get('offsetB')
-    : element.offsetA;
-  let unit = state.getIn([
-    'scene',
-    'layers',
-    state.scene.selectedLayer,
-    'unit'
-  ]);
-  const EditorOptions = () => {
-    return propertiesFormData.entrySeq().map(([propertyName, data]) => {
-      if (catalog.categoryHasElement('Windows', element.type)) {
-        if (['thickness', 'width', 'height'].includes(propertyName)) {
-          return null;
-        }
-      }
-      if (catalog.categoryHasElement('Doors', element.type)) {
-        if (
-          ['altitude', 'thickness', 'width', 'height'].includes(propertyName)
-        ) {
-          return null;
-        }
-      }
-      if (filteredProperties) {
-        if (filteredProperties.includes(propertyName)) return null;
-      }
-
-      let catalogElement = catalog.getElement(element.type);
-      // if ((catalogElement.info.has_single_door === undefined || catalogElement.info.has_single_door == false) && propertyName == 'flip_doorhandle') {
-      //   return null;
-      // }
-
-      let currentValue = data.get('currentValue'),
-        configs = data.get('configs');
-      let { Editor } = catalog.getPropertyType(configs.type);
-      return (
-        configs.type === 'length-measure' && (
-          <div style={{ position: 'relative' }} key={propertyName}>
-            <Editor
-              propertyName={propertyName}
-              value={currentValue}
-              configs={configs}
-              onUpdate={value => onConfigUpdate(propertyName, value)}
-              state={state}
-              sourceElement={element}
-              internalState={internalState}
-            />
-            <NumberInputMeasure>{unit}</NumberInputMeasure>
-          </div>
-        )
-      );
-    });
-  };
-
-  return (
-    <div>
-      {/* <PropertyString
-      value={name}
-      onUpdate={mapped => onUpdate('name', mapped)}
-      configs={{label: 'Name'}}
-      state={state}
-      {...rest}
-    /> */}
-      {EditorOptions()}
-      <div style={{ position: 'relative' }}>
-        <PropertyLengthMeasure
-          value={offsetA}
-          onUpdate={mapped => onUpdate('offsetA', mapped)}
-          configs={{
-            label: 'Offset Left',
-            min: 0,
-            max: Infinity,
-            precision: 2
-          }}
-          state={state}
-          {...rest}
-        />
-        <NumberInputMeasure>{unit}</NumberInputMeasure>
-      </div>
-      <div style={{ position: 'relative' }}>
-        <PropertyLengthMeasure
-          value={offsetB}
-          onUpdate={mapped => onUpdate('offsetB', mapped)}
-          configs={{
-            label: 'Offset Right',
-            min: 0,
-            max: Infinity,
-            precision: 2
-          }}
-          state={state}
-          {...rest}
-        />
-        <NumberInputMeasure>{unit}</NumberInputMeasure>
-      </div>
-    </div>
-  );
-}
-
-HoleAttributesEditor.propTypes = {
-  element: PropTypes.object.isRequired,
-  onUpdate: PropTypes.func.isRequired,
-  attributeFormData: PropTypes.object.isRequired,
-  state: PropTypes.object.isRequired
-};
-
-HoleAttributesEditor.contextTypes = {
-  translator: PropTypes.object.isRequired
-};