[ch-tab-render][ch-flexible-layout-render] Remove the direction property in favor of the tabListPosition property and improve customization
#460
Conversation
This file contains hidden or bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
…perty The new "tabListPosition" property allows users have more control over the position of the ch-tab-render's tab-list. Also, refactor the styling with parts to improve semantics and make the ch-tab-render more customizable. Breaking changes: - Removed the "direction" property in favor of the "tabListPosition" property. Migrating from "direction" to "tabListPosition": + direction = "block" ---> tabListPosition = "block-start" + direction = "inline" ---> tabListPosition = "inline-start" - The following parts were renamed: + "button" ---> "tab" + "page" ---> "panel" + "page-container" ---> "panel-container" - Removed the "drag-preview" and "drag-preview-element" parts in favor of the "tab dragging" part. - "Removed the "drag-preview--outside-tab-list" part in favor of the "dragging-out-of-tab-list" part. - "Removed the "drag-preview--inside-tab-list__block" part in favor of the "dragging-over-tab-list block" part. - "Removed the "drag-preview--inside-tab-list__inline" part in favor of the "dragging-over-tab-list inline" part. - Removed "block-size: 100%" CSS property from the ch-tab-render, since it can break margin styling. Use "display: grid" in the ch-tab-render container or a different solution to stretch the ch-tab-render to the parent container size.
…stPosition property Same breaking changes applies for the ch-flexible-layout-render. Simplified part exporting to avoid exporting parts that are not used.
✅ Deploy Preview for gx-chameleon ready!
To edit notification comments on pull requests, go to your Netlify site configuration. |
ncamera
added
feature
ncamera
changed the title
[ch-tab-render][ch-flexible-layout-render] Remove the direction property in favor of the tabListPosition property[ch-tab-render][ch-flexible-layout-render] Remove the direction property in favor of the tabListPosition property and improve customization
Sign up for free
to join this conversation on GitHub.
Already have an account?
Sign in to comment
Add this suggestion to a batch that can be applied as a single commit.
This suggestion is invalid because no changes were made to the code.
Suggestions cannot be applied while the pull request is closed.
Suggestions cannot be applied while viewing a subset of changes.
Only one suggestion per line can be applied in a batch.
Add this suggestion to a batch that can be applied as a single commit.
Applying suggestions on deleted lines is not supported.
You must change the existing code in this line in order to create a valid suggestion.
Outdated suggestions cannot be applied.
This suggestion has been applied or marked resolved.
Suggestions cannot be applied from pending reviews.
Suggestions cannot be applied on multi-line comments.
Suggestions cannot be applied while the pull request is queued to merge.
Suggestion cannot be applied right now. Please check back later.
Changes we propose in this PR:
[ch-tab-render]Removed thedirectionproperty in favor of thetabListPositionproperty.The new
tabListPositionproperty allows users have more control over the position of the ch-tab-render's tab-list.[ch-flexible-layout-render]RemovedtabDirectionandtabPositionproperties in favor of thetabListPositionproperty.[ch-flexible-layout-render]Simplified part exporting to avoid exporting parts that are not used.[ch-tab-render][ch-flexible-layout-render]Refactor the styling with parts to improve semantics and make thech-tab-renderandch-flexible-layout-rendermore customizables.Breaking changes
[ch-tab-render]Removed thedirectionproperty in favor of thetabListPositionproperty. Migrating fromdirectiontotabListPosition:direction="block"--->tabListPosition="block-start"direction="inline"--->tabListPosition="inline-start"[ch-tab-render]The following parts were renamed:button--->tabpage--->panelpage-container--->panel-container[ch-tab-render]Removed thedrag-previewanddrag-preview-elementparts in favor of thetab draggingpart.[ch-tab-render]Removed thedrag-preview--outside-tab-listpart in favor of thedragging-out-of-tab-listpart.[ch-tab-render]Removed thedrag-preview--inside-tab-list__blockpart in favor of thedragging-over-tab-list blockpart.[ch-tab-render]Removed thedrag-preview--inside-tab-list__inlinepart in favor of thedragging-over-tab-list inlinepart.[ch-tab-render]Removedblock-size: 100%CSS property from the ch-tab-render, since it can break margin styling. Usedisplay: gridin the ch-tab-render container or a different solution to stretch the ch-tab-render to the parent container size.[ch-flexible-layout-render]Same breaking changes applies for thech-flexible-layout-render.