@performant-software/semantic-components 0.5.3 → 0.5.6

package/types/components/ViewXML.js.flow

@@ -4,6 +4,7 @@ import React, { type ComponentType, useState } from 'react';
 import SyntaxHighlighter from 'react-syntax-highlighter';
 import { Button, Modal } from 'semantic-ui-react';
 import i18n from '../i18n/i18n';
+import ModalContext from '../context/ModalContext';
 
 type Props = {
   highlighter?: any,
@@ -21,39 +22,44 @@ const ViewXML = (props: Props) => {
   const openerProps = props.opener.props;
 
   return (
-    <>
-      <OpenerComponent
-        {...openerProps}
-        className='view-xml-trigger'
-        onClick={() => setShowModal(true)}
-      />
-      <Modal
-        className='view-xml-modal'
-        centered={false}
-        open={showModal}
-        onClose={() => setShowModal(false)}
-      >
-        <Modal.Header
-          content={i18n.t('ViewXML.title')}
-        />
-        <Modal.Content>
-          <SyntaxHighlighter
-            language='xml'
-            style={props.highlighter}
-          >
-            { props.xml }
-          </SyntaxHighlighter>
-        </Modal.Content>
-        <Modal.Actions>
-          <Button
-            content='Close'
-            inverted
-            primary
-            onClick={() => setShowModal(false)}
+    <ModalContext.Consumer>
+      { (mountNode) => (
+        <>
+          <OpenerComponent
+            {...openerProps}
+            className='view-xml-trigger'
+            onClick={() => setShowModal(true)}
           />
-        </Modal.Actions>
-      </Modal>
-    </>
+          <Modal
+            className='view-xml-modal'
+            closeIcon
+            centered={false}
+            mountNode={mountNode}
+            open={showModal}
+            onClose={() => setShowModal(false)}
+          >
+            <Modal.Header
+              content={i18n.t('ViewXML.title')}
+            />
+            <Modal.Content>
+              <SyntaxHighlighter
+                language='xml'
+                style={props.highlighter}
+              >
+                { props.xml }
+              </SyntaxHighlighter>
+            </Modal.Content>
+            <Modal.Actions>
+              <Button
+                basic
+                content={i18n.t('Common.buttons.close')}
+                onClick={() => setShowModal(false)}
+              />
+            </Modal.Actions>
+          </Modal>
+        </>
+      )}
+    </ModalContext.Consumer>
   );
 };
 

package/types/context/ModalContext.js.flow

@@ -0,0 +1,5 @@
+import React from 'react';
+
+const ModalContext = React.createContext();
+
+export default ModalContext;

package/types/css/theme.js.flow

@@ -0,0 +1,5 @@
+// @flow
+
+import 'semantic-ui-less/semantic.less';
+
+export default {};

package/types/index.js.flow

@@ -1,5 +1,8 @@
 // @flow
 
+// Semantic UI styles
+import './css/style.less';
+
 // Components
 export { default as AccordionDataList } from './components/AccordionDataList';
 export { default as AccordionList } from './components/AccordionList';
@@ -13,6 +16,7 @@ export { default as ColorPickerModal } from './components/ColorPickerModal';
 export { default as useDataList } from './components/DataList';
 export { default as DataTable } from './components/DataTable';
 export { default as DataView } from './components/DataView';
+export { default as DatabaseView } from './components/DatabaseView';
 export { default as DateInput } from './components/DateInput';
 export { default as DatePicker } from './components/DatePicker';
 export { default as DescriptorField } from './components/DescriptorField';

package/webpack.config.js

@@ -1,3 +1,28 @@
 const { configure } = require('@performant-software/webpack-config');
+const path = require('path');
 
-module.exports = configure(__dirname);
+module.exports = configure(__dirname, {
+  resolve: {
+    alias: {
+      '../../theme.config$': path.join(__dirname, '/src/css/theme.config'),
+      '../src/css/site': path.join(__dirname, '/src/css/site')
+    }
+  },
+  optimization: {
+    splitChunks: {
+      cacheGroups: {
+        semantic: {
+          name: 'semantic-ui',
+          test: /\.less$/,
+          chunks: 'all',
+          enforce: true
+        },
+        main: {
+          name: 'main',
+          chunks: 'all',
+          enforce: true
+        }
+      }
+    }
+  }
+});