Merge branch 'master' of https://github.com/Robinson04/FlexLayout

.github/ISSUE_TEMPLATE/bug_report.yml

@@ -0,0 +1,104 @@
+name: '🐛 Bug report'
+description: Create a report to help us improve
+body:
+ - type: markdown
+ attributes:
+ value: |
+ Thank you for reporting an issue :pray:.
+
+ This issue tracker is for reporting bugs found in `FlexLayout` (https://github.com/caplin/FlexLayout).
+ If you have a question about how to achieve something and are struggling, please post a question
+ inside of `FlexLayout` Discussions tab: https://github.com/caplin/FlexLayout/discussions
+
+ Before submitting a new bug/issue, please check the links below to see if there is a solution or question posted there already:
+ - `FlexLayout` Issues tab: https://github.com/caplin/FlexLayout/issues?q=is%3Aissue+is%3Aopen+sort%3Aupdated-desc
+ - `FlexLayout` closed issues tab: https://github.com/caplin/FlexLayout/issues?q=is%3Aissue+sort%3Aupdated-desc+is%3Aclosed
+ - `FlexLayout` Discussions tab: https://github.com/caplin/FlexLayout/discussions
+
+ The more information you fill in, the better the community can help you.
+ - type: textarea
+ id: description
+ attributes:
+ label: Describe the bug
+ description: Provide a clear and concise description of the challenge you are running into.
+ validations:
+ required: true
+ - type: input
+ id: link
+ attributes:
+ label: Your Example Website or App
+ description: |
+ Which website or app were you using when the bug happened?
+ Note:
+ - Your bug will may get fixed much faster if we can run your code and it doesn't have dependencies other than the `FlexLayout` npm package.
+ - To create a shareable code example you can use Stackblitz (https://stackblitz.com/). Please no localhost URLs.
+ - Please read these tips for providing a minimal example: https://stackoverflow.com/help/mcve.
+ placeholder: |
+ e.g. https://stackblitz.com/edit/...... OR Github Repo
+ validations:
+ required: false
+ - type: textarea
+ id: steps
+ attributes:
+ label: Steps to Reproduce the Bug or Issue
+ description: Describe the steps we have to take to reproduce the behavior.
+ placeholder: |
+ 1. Go to '...'
+ 2. Click on '....'
+ 3. Scroll down to '....'
+ 4. See error
+ validations:
+ required: true
+ - type: textarea
+ id: expected
+ attributes:
+ label: Expected behavior
+ description: Provide a clear and concise description of what you expected to happen.
+ placeholder: |
+ As a user, I expected ___ behavior, but I am seeing ___
+ validations:
+ required: true
+ - type: input
+ id: os
+ attributes:
+ label: Operating System
+ description: What opearting system are you using?
+ placeholder: |
+ - OS: [e.g. macOS, Windows, Linux]
+ validations:
+ required: true
+ - type: input
+ id: browsers
+ attributes:
+ label: Browser Type?
+ description: What browsers are you seeing the problem on?
+ placeholder: |
+ - OS: [e.g. Google Chrome, Safari, Firefox, Opera etc]
+ validations:
+ required: true
+ - type: input
+ id: browser_version
+ attributes:
+ label: Browser Version
+ description: What browser version are you using?
+ placeholder: |
+ - Version: [e.g. 91.1]
+ validations:
+ required: true
+ - type: textarea
+ id: screenshots_or_videos
+ attributes:
+ label: Screenshots or Videos
+ description: |
+ If applicable, add screenshots or a video to help explain your problem.
+ For more information on the supported file image/file types and the file size limits, please refer
+ to the following link: https://docs.github.com/en/github/writing-on-github/working-with-advanced-formatting/attaching-files
+ placeholder: |
+ You can drag your video or image files inside of this editor ↓
+ validations:
+ required: true
+ - type: textarea
+ id: additional
+ attributes:
+ label: Additional context
+ description: Add any other context about the problem here.

.github/ISSUE_TEMPLATE/config.yml

@@ -0,0 +1,5 @@
+blank_issues_enabled: true
+contact_links:
+ - name: 🤔 Feature Requests & Questions
+ url: https://github.com/caplin/FlexLayout/discussions
+ about: Please ask and answer questions here.

.gitignore

@@ -8,3 +8,9 @@ out/
 todo.txt
 .DS_Store
 typedoc/
+style/dark.css.map
+style/gray.css.map
+style/light.css.map
+cypress/videos/
+cypress/screenshots/
+test/style/light.css.map

.npmignore

@@ -5,6 +5,8 @@ examples/
 node_modules/
 spec/
 typedoc/
+cypress/
+test/
 package-lock.json
 todo.txt
 tsconfig.json
@@ -13,4 +15,5 @@ tsconfig3.json
 webpack_build_min.config.js
 webpack_build.config.js 
 webpack.config.js 
+cypress.json
 yarn.lock

ChangeLog.txt

@@ -1,3 +1,159 @@
+0.7.4
+Fixed popout windows when using </React.StrictMode>
+Output now targets ES6
+
+0.7.3
+Fixed right edge marker location when border enableAutoHide
+Dragging out a selected border tab will now leave the border unselected
+
+0.7.2
+New Layout JSON tabs to demo
+Added --color-icon css rootOrientationVertical
+
+0.7.1
+Fix for #310 - Added new layout method: moveTabWithDragAndDrop(node) to allow tab dragging to be
+started from custom code.
+
+0.7.0
+Updated dependencies, in particular changed React peer dependency to React 18
+Made changes for React 18
+
+0.6.10
+fix for #312, chrome warning for wheel event listener 
+
+0.6.9
+fix for #308, Allow dragging within a maximized tabset
+
+0.6.8
+Added onTabSetPlaceHolder prop to render the tabset area when there are no tabs.
+
+0.6.7
+More css variables, added Underline theme, updated dependencies
+
+0.6.6 
+fix for #296
+
+0.6.5
+fix for #289, allow setting attributes to undefined value
+
+0.6.4
+Code tidy
+Updated dependencies
+
+0.6.3
+Changed to using named rather than default import/exports, 
+this will require changing top level imports 
+ from:
+ import FlexLayout from 'flexlayout-react'; 
+ to
+ import * as FlexLayout from 'flexlayout-react';
+
+Added typedoc link to readme
+
+0.6.2
+Extended icons prop to allow use of functions to set icons.
+Added onShowOverflowMenu callback for handling the display of the tab overflow menu.
+
+0.6.1
+Use portal for drag rectangle to preserve React context in onRenderTab.
+
+0.6.0
+Changed icons to use svg images, these will now scale with the font size.
+Improved element spacing, removed most margin/padding spacers.
+The overflow menu and drag rectangle will now show the tab icon and content as rendered in the tab.
+Added altName attribute to TabNode, this will be used as the name in the overflow menu if there is no
+name attribute (e.g the tab has just an icon).
+Changed the drag outline colors from red/green to light blue/green.
+Removed closeIcon prop from Layout, use the icons property instead.
+Changed onRenderDragRect callback to take a ReactElement rather than a string, the content now
+contains the tabbutton as rendered.
+
+0.5.21
+Fixed copying stylesheet links for popout windows when cssRules throw exception.
+Added option, enableUseVisibility, to allow use of visibility: hidden rather than display:none for hiding elements.
+
+0.5.20
+Added Cypress Tests 
+Fixed bug with tab icon not showing
+
+0.5.19
+Added onRenderFloatingTabPlaceholder callback prop for rendering the floating tab placeholder.
+Changed style sheets to use CSS custom properties (variables) for several values.
+Fix selected index in single empty tabset.
+Added onContextMenu callback prop for handling context menus on tabs and tabsets.
+Added onAuxMouseClick callback prop for handling mouse clicks on tabs and tabsets 
+with alt, meta, shift keys, also handles center mouse clicks
+
+0.5.18
+Added onRenderDragRect callback prop for rendering the drag rectangles
+New border attribute: enableAutoHide, to hide border if it has zero tabs
+
+0.5.17
+New global option, splitterExtra, to allow splitters to have an extended hit test areas. 
+This makes it easier to use narrow splitters.
+Added new TabNode attributes: borderWidth and borderHeight, these allow for individual border sizes for certain tabs.
+Fix for #263 - borders splitters not taking minimum size of center into account
+Improved algorithm for finding drop location 
+Additional parameter: cursor, for onTabDrag
+
+0.5.16
+Added 'New Features' layout to demo.
+New tab attribute, helpText, to show tooltip over tabs.
+New model action, deleteTabset, to delete a tabset and all it's child tabs.
+New tabset attribute, enableClose, to close the tabset
+
+0.5.15
+Added new Layout prop: onTabDrag that allows tab dragging to be intercepted.
+Added example of onTabDrag in demo app, example shows a list where tabs can be dragged into, 
+moved in the list and dragged back out into the layout. 
+Node id's that are not assigned a value are now auto-generated using a uuid rather than a rolling number
+(for example: previous id: #3, new id: #0c459064-8dee-444e-8636-eb9ab910fb27).
+Made toJson method of node public.
+
+0.5.14
+Fix an issue with copying styles for a floating window when using a CSS-in-JS solution 
+Fix for #227 - edge rects are not moved if window is resized while dragging
+
+0.5.13
+Added prop (realtimeResize) to make tabs resize as their splitters are dragged.
+Warning: this can cause resizing to become choppy when tabs are slow to draw.
+
+0.5.12
+New callback on Model to allow TabSet attributes to be set when a tab is moved in such a way 
+that it creates a new TabSet.
+Added config attributes to TabSet and Border
+Added headerButtons to ITabSetRenderValues, to allow different set of buttons to be applied to headed
+TabSets.
+
+0.5.11
+Added StickyButtons to onRenderTabSet render values to allow for implementation of Chrome style + button 
+Added example of + button to default layout in demo app
+
+0.5.10
+Adjust selected tab when tabs popped out to an external window
+
+0.5.9
+TitleFactory can now return object with titleContent and name (name is used for tab overflow menu).
+Corrected position of rootOrientationVertical in typescript json model
+
+0.5.8
+Fix for #172 - Added global rootOrientationVertical attribute to allow vertical layout for root 'row'
+Added missing exports for typescript json model
+Moved CRA example to separate repo
+
+0.5.7
+Added typescript typings for the model json
+Fixed drag rectangle showing as dot before first position found (when dragging into the layout)
+Fix for #191 - Global Attributes for classNames not working
+Fix for #212 - TypeScript issue with ILayoutState
+
+0.5.6
+Added external drag drop into layout, see new onExternalDrag prop
+Updated demo to accept dragged links, html and text.
+Tab scrolling direction changed to match VSCode
+Improved positioning of single tab when overflow menu shown
+Some small changes to theme colors
+
 0.5.5
 Fix for #170 - Closing the last tab of a maximized tabset crashes the layout