Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

fix (image-block): fix image resizer closing upon updating value #2545

Merged
merged 5 commits into from
Jan 10, 2023

Conversation

vmc08
Copy link
Contributor

@vmc08 vmc08 commented Dec 22, 2022

Fixes:

  • Fix image resizer UX issue

@vmc08 vmc08 requested a review from bfintal December 22, 2022 06:46
@github-actions
Copy link

github-actions bot commented Dec 22, 2022

🤖 Pull request artifacts

file commit
pr2545-stackable-2545-merge.zip 606eeac

github-actions bot added a commit that referenced this pull request Dec 22, 2022
src/block/image/edit.js Outdated Show resolved Hide resolved
github-actions bot added a commit that referenced this pull request Jan 10, 2023
@bfintal bfintal merged commit 6b86a05 into feat/performance-2 Jan 10, 2023
@bfintal bfintal deleted the fix/image-resizer-popup branch January 10, 2023 09:02
bfintal added a commit that referenced this pull request Jan 17, 2023
* initial commit

* fixes

* pass components instead of function

* it's now fast since we are now calling just a function

* added conditional rendering

* less block wrapper props

* un-hook dynamic content in typography

* reverse conditional styling

* fix: data align attribute showing even if not set

* pass hover state and client id

* margin bottom component no longer rerenders

* fix: duplicating blocks do not update the uniqueId in other components (does not trigger hook changes)

* refactored panel advanced setting

* split typography styles into individual components

* updated color palette to use useSettings to prevent rerendering

* added hasToggle to refactored panels

* lessened the use of useBlockHoverState

* refactored some components to prevent rerenders

* added selectors to useBlockAttributesContext

* only show mediaUpload when selected and use isHovered show showing image tooltips

* revamped button icon popover, simplified it

* added selectors to useBlockAttributesContext

* refactored so typography won't rerender if other attributes change

* memoed controls

* only show bottom margin resizer on isHovered

* updated withBlockWrapperIsHovered to be same with withBlockWrapper

* show only column resize handlers when hovered over the block

* removed delay in checking isSelected

* render only inspector stuff when selected

* refactored useShowMoversGestures to be a simpler useIsHovered

* useDispatch cleanup

* fixed icon from rerendering repeatedly because of prependRender

* margin bottom should only render if hovered

* simpler isHovered using React synthetic events

* added new eslint rule for useDispatch

* use onMouseOver instead of onMouseEnter because children swallow it

* added conditions so we can trim out some operations if not necessary

* bring back old isHover implementation

* Now using useCallback

* updated progress style generation

* added keys and updated some style implementations

* refactored color control

* wp 6.0 style support for the new color picker

* fixed image filter padding

* fixed font size adding a reset button to the typography

* removed unused global style controller

* refactored button icon popover and font family control to use DropDown and FormTokenField

* refactored icon control to use DropDown component

* New filters for Toolset

* Fix: inverse the use-theme-margins behavior in headings block. fixes #2190

* refactored highlight button to a dropdown

* Added feat/performance-2 to plugin building

* fix: fit content no longer working in editor

(cherry picked from commit 3d5542b)

* Fix/hover states (#2523)

* fix (hover-state-hoc): fix hover state class

* try: re-commit

* try re-commit

Co-authored-by: Benjamin Intal <bfintal@gmail.com>

* fix (advance-style): fix position styling for right (#2527)

* fix (bottom-separator): fix styling not applied (#2529)

* fix (heading): heading tag default reset (#2521)

* fix (overlay-gradient): fix reset button not showing for gradient overlay (#2526)

* fix (button): capitalize transparent label value (#2538)

* fix (column-block): fix incorrect block added when no inner blocks (#2542)

* fix (icon): render premium icon controls (#2539)

* fix (icon): render premium icon controls

* fix (premium-controls): move inside react component to properly render the controls

* fix (premium-controls): move inside react component to properly render the controls

* Update src/block-components/icon/edit.js [skip ci]

Co-authored-by: Benjamin Intal <bfintal@gmail.com>

* fix (v2-blocks): fix v2 block missing toggle for style controls (#2532)

* fix (advance-style): fix position selector (#2544)

* fix (advance-style): fix position selector

* Revert "fix (advance-style): fix position selector"

This reverts commit a6d0f58.

* fix (advance-style): remove position selector

* fix (advance-style): fix zindex selector (#2543)

* fix (units): mobile and tablet units not being followed correctly. Fixes #2547

* fix (feature-block): block error (#2553)

* fix (posts): feature image should not upload on click (#2549)

* fix (toc): fix text style issues not applied on frontend (#2550)

* fix (toc): fix text style issues not applied on frontend

* fix (toc-block): update property passing; removed options

* fix (separator-block): incorrect use memo usage (#2552)

* fix (copy-paste-issue): reset generatedCss when uniqueId changes (#2554)

* fix (image-block): fix image resizer closing upon updating value (#2545)

* fix (image-block): fix image resizer closing upon updating value

* Update src/block-components/image/editor.scss [skip ci]

* Update src/components/resizer-tooltip/index.js [skip ci]

* Update src/block/image/edit.js [skip ci]

Co-authored-by: Benjamin Intal <bfintal@gmail.com>

* fix (text control): right border of input gets clipped in free version

* fix (shape-control): full-width shape options (#2558)

* fix (number-block): block error when refreshing in editor (#2556)

* fix (typography): typography popover doesn't close, revert font family dropdown (#2557)

* fix (shadow): popover width corrected (#2559)

* fix (typography): revert dynamic content fetcher (#2541)

* fix (posts): color overlay for featured images are now visible (#2533)

* added depencies and refactored hoverSelectorCallback

* Update src/block-components/icon/style.js [skip ci]

* Update src/block-components/progress-bar/style.js [skip ci]

* Update src/block-components/helpers/size/style.js [skip ci]

* Update src/block-components/helpers/backgrounds/style.js [skip ci]

* fix (post-block): use default selector to avoid styling issue on hover

* fix (post-block): hover image color

* fix (posts-block): handle deprecation to avoid block error

* fix (image-block): fix gradient hover color

Co-authored-by: prconcepcion <pioconcepcion3@yahoo.com>
Co-authored-by: Benjamin Intal <bfintal@gmail.com>
Co-authored-by: vmc08 <vmc08@yahoo.com>

Co-authored-by: Vivo Milo C. Crame <vmc08@yahoo.com>
Co-authored-by: Pio Concepcion <49634311+prconcepcion@users.noreply.github.com>
Co-authored-by: prconcepcion <pioconcepcion3@yahoo.com>
bfintal added a commit that referenced this pull request Feb 6, 2023
* initial commit

* fixes

* pass components instead of function

* it's now fast since we are now calling just a function

* added conditional rendering

* less block wrapper props

* un-hook dynamic content in typography

* reverse conditional styling

* fix: data align attribute showing even if not set

* pass hover state and client id

* margin bottom component no longer rerenders

* fix: duplicating blocks do not update the uniqueId in other components (does not trigger hook changes)

* refactored panel advanced setting

* split typography styles into individual components

* updated color palette to use useSettings to prevent rerendering

* added hasToggle to refactored panels

* lessened the use of useBlockHoverState

* refactored some components to prevent rerenders

* added selectors to useBlockAttributesContext

* only show mediaUpload when selected and use isHovered show showing image tooltips

* revamped button icon popover, simplified it

* added selectors to useBlockAttributesContext

* refactored so typography won't rerender if other attributes change

* memoed controls

* only show bottom margin resizer on isHovered

* updated withBlockWrapperIsHovered to be same with withBlockWrapper

* show only column resize handlers when hovered over the block

* removed delay in checking isSelected

* render only inspector stuff when selected

* refactored useShowMoversGestures to be a simpler useIsHovered

* useDispatch cleanup

* fixed icon from rerendering repeatedly because of prependRender

* margin bottom should only render if hovered

* simpler isHovered using React synthetic events

* added new eslint rule for useDispatch

* use onMouseOver instead of onMouseEnter because children swallow it

* added conditions so we can trim out some operations if not necessary

* bring back old isHover implementation

* Now using useCallback

* updated progress style generation

* added keys and updated some style implementations

* refactor (responsive-control): move tablet/mobile arrangement filter

* refactored color control

* wp 6.0 style support for the new color picker

* fixed image filter padding

* fixed font size adding a reset button to the typography

* removed unused global style controller

* refactored button icon popover and font family control to use DropDown and FormTokenField

* refactored icon control to use DropDown component

* New filters for Toolset

* Fix: inverse the use-theme-margins behavior in headings block. fixes #2190

* refactored highlight button to a dropdown

* feat (horizontal-scroller): add and register new block

* feature (horizontal-scroller): enable mouse grabbing; add frontend scripts

* Added feat/performance-2 to plugin building

* fix: fit content no longer working in editor

(cherry picked from commit 3d5542b)

* Fix/hover states (#2523)

* fix (hover-state-hoc): fix hover state class

* try: re-commit

* try re-commit

Co-authored-by: Benjamin Intal <bfintal@gmail.com>

* fix (advance-style): fix position styling for right (#2527)

* fix (bottom-separator): fix styling not applied (#2529)

* fix (heading): heading tag default reset (#2521)

* Update src/block/horizontal-scroller/block.json

* fix (overlay-gradient): fix reset button not showing for gradient overlay (#2526)

* fix (button): capitalize transparent label value (#2538)

* fix (column-block): fix incorrect block added when no inner blocks (#2542)

* fix (icon): render premium icon controls (#2539)

* fix (icon): render premium icon controls

* fix (premium-controls): move inside react component to properly render the controls

* fix (premium-controls): move inside react component to properly render the controls

* Update src/block-components/icon/edit.js [skip ci]

Co-authored-by: Benjamin Intal <bfintal@gmail.com>

* fix (v2-blocks): fix v2 block missing toggle for style controls (#2532)

* fix (advance-style): fix position selector (#2544)

* fix (advance-style): fix position selector

* Revert "fix (advance-style): fix position selector"

This reverts commit a6d0f58.

* fix (advance-style): remove position selector

* fix (advance-style): fix zindex selector (#2543)

* fix (units): mobile and tablet units not being followed correctly. Fixes #2547

* fix (feature-block): block error (#2553)

* fix (posts): feature image should not upload on click (#2549)

* fix (toc): fix text style issues not applied on frontend (#2550)

* fix (toc): fix text style issues not applied on frontend

* fix (toc-block): update property passing; removed options

* fix (separator-block): incorrect use memo usage (#2552)

* fix (copy-paste-issue): reset generatedCss when uniqueId changes (#2554)

* fix (image-block): fix image resizer closing upon updating value (#2545)

* fix (image-block): fix image resizer closing upon updating value

* Update src/block-components/image/editor.scss [skip ci]

* Update src/components/resizer-tooltip/index.js [skip ci]

* Update src/block/image/edit.js [skip ci]

Co-authored-by: Benjamin Intal <bfintal@gmail.com>

* fix (text control): right border of input gets clipped in free version

* fix (shape-control): full-width shape options (#2558)

* fix (number-block): block error when refreshing in editor (#2556)

* fix (typography): typography popover doesn't close, revert font family dropdown (#2557)

* fix (shadow): popover width corrected (#2559)

* fix (typography): revert dynamic content fetcher (#2541)

* fix (horizontal-scroller): units not applied for size styles

* fix (horizontal-scroller): fix hidden scroller on mac on the editor

* refactor (horizontal-scroller): remove resizer

* fix (horizontal-scroller): add example and fix empty state addition block

* fix (horizontal-scrolling): overflowing content

* fix (horizontal-scroller): fix reset snapping button

* fix (horizontal-scroller): fix template locking

* fix (horizontal-scroller): fix column width sizes

* fix (horizontal-scroller): tablet column arrangement

* fix (horizontal-scroller): fix nested horizontal scroller

* fix (horizontal-scroller): row/column wrapping width issue

* fix: dragging with mouse on the frontend

* fix (horizontal-scroller): fix widget width

* fix: simplified frontend script

* fix (horizontal-scroller): address width issue when nesting

* added icon

* fix (horizontal-scroller): remove compatibility with 2021 theme

* update (horizontal-scroller): change column slider max to 10

* refactor (horizontal-scroller): add scrollbar control

* refactor (horizontal-scroller): fix row group on 2021

* refactor (horizontal-scroller): move out editor controls and styles

* refactor (horizontal-scroller): add scrollbar controls

* refactor (horizontal-scroller): refactor horizontal scroller; add scrollbar styles

* fix: safari issue when dragging, highlighting the content can drag the scroller

* removed newly introduced block components + simplified style generation + fixed scrollbar border radius

---------

Co-authored-by: Benjamin Intal <bfintal@gmail.com>
bfintal added a commit that referenced this pull request Feb 10, 2023
* initial commit

* fixes

* pass components instead of function

* it's now fast since we are now calling just a function

* added conditional rendering

* less block wrapper props

* un-hook dynamic content in typography

* reverse conditional styling

* fix: data align attribute showing even if not set

* pass hover state and client id

* margin bottom component no longer rerenders

* fix: duplicating blocks do not update the uniqueId in other components (does not trigger hook changes)

* refactored panel advanced setting

* split typography styles into individual components

* updated color palette to use useSettings to prevent rerendering

* added hasToggle to refactored panels

* lessened the use of useBlockHoverState

* refactored some components to prevent rerenders

* added selectors to useBlockAttributesContext

* only show mediaUpload when selected and use isHovered show showing image tooltips

* revamped button icon popover, simplified it

* added selectors to useBlockAttributesContext

* refactored so typography won't rerender if other attributes change

* memoed controls

* only show bottom margin resizer on isHovered

* updated withBlockWrapperIsHovered to be same with withBlockWrapper

* show only column resize handlers when hovered over the block

* removed delay in checking isSelected

* render only inspector stuff when selected

* refactored useShowMoversGestures to be a simpler useIsHovered

* useDispatch cleanup

* fixed icon from rerendering repeatedly because of prependRender

* margin bottom should only render if hovered

* simpler isHovered using React synthetic events

* added new eslint rule for useDispatch

* use onMouseOver instead of onMouseEnter because children swallow it

* added conditions so we can trim out some operations if not necessary

* bring back old isHover implementation

* Now using useCallback

* updated progress style generation

* added keys and updated some style implementations

* refactored color control

* wp 6.0 style support for the new color picker

* fixed image filter padding

* fixed font size adding a reset button to the typography

* removed unused global style controller

* refactored button icon popover and font family control to use DropDown and FormTokenField

* refactored icon control to use DropDown component

* New filters for Toolset

* Fix: inverse the use-theme-margins behavior in headings block. fixes #2190

* refactored highlight button to a dropdown

* Added feat/performance-2 to plugin building

* fix: fit content no longer working in editor

(cherry picked from commit 3d5542b)

* Fix/hover states (#2523)

* fix (hover-state-hoc): fix hover state class

* try: re-commit

* try re-commit

Co-authored-by: Benjamin Intal <bfintal@gmail.com>

* fix (advance-style): fix position styling for right (#2527)

* fix (bottom-separator): fix styling not applied (#2529)

* fix (heading): heading tag default reset (#2521)

* fix (overlay-gradient): fix reset button not showing for gradient overlay (#2526)

* fix (button): capitalize transparent label value (#2538)

* fix (column-block): fix incorrect block added when no inner blocks (#2542)

* initialize countdown block

* fix (icon): render premium icon controls (#2539)

* fix (icon): render premium icon controls

* fix (premium-controls): move inside react component to properly render the controls

* fix (premium-controls): move inside react component to properly render the controls

* Update src/block-components/icon/edit.js [skip ci]

Co-authored-by: Benjamin Intal <bfintal@gmail.com>

* fix (v2-blocks): fix v2 block missing toggle for style controls (#2532)

* fix (advance-style): fix position selector (#2544)

* fix (advance-style): fix position selector

* Revert "fix (advance-style): fix position selector"

This reverts commit a6d0f58.

* fix (advance-style): remove position selector

* fix (advance-style): fix zindex selector (#2543)

* fix (units): mobile and tablet units not being followed correctly. Fixes #2547

* added divider block component

* fix (feature-block): block error (#2553)

* fix (posts): feature image should not upload on click (#2549)

* fix (toc): fix text style issues not applied on frontend (#2550)

* fix (toc): fix text style issues not applied on frontend

* fix (toc-block): update property passing; removed options

* fix (separator-block): incorrect use memo usage (#2552)

* fix (copy-paste-issue): reset generatedCss when uniqueId changes (#2554)

* removed margin from the month picker in datetimepicker component

* aligned digit and label to center

* added frontend countdown script

* created frontend countdown script

* added countdown number component

* added countdown components and changed some settings

* load frontend countdown script

* added typopgraphy classes and added the necessary content to be saved

* added defaults and other necessary attributes

* added options and more styling components

* added classnames for container and divider

* added control for size

* added css  for divider size and color

* fix (image-block): fix image resizer closing upon updating value (#2545)

* fix (image-block): fix image resizer closing upon updating value

* Update src/block-components/image/editor.scss [skip ci]

* Update src/components/resizer-tooltip/index.js [skip ci]

* Update src/block/image/edit.js [skip ci]

Co-authored-by: Benjamin Intal <bfintal@gmail.com>

* fix (text control): right border of input gets clipped in free version

* fix (shape-control): full-width shape options (#2558)

* fix (number-block): block error when refreshing in editor (#2556)

* divider is centered

* added recurring countdown

* fix (typography): typography popover doesn't close, revert font family dropdown (#2557)

* fix (shadow): popover width corrected (#2559)

* added box gap attribute

* fix (typography): revert dynamic content fetcher (#2541)

* changed logic of frontend script

* fixed schema and added defaults

* added margin control and reset control and removed classnames from container and changed attribute name of date

* changed container classnames and added duration

* added margin top css render

* Added recurring countdown and refactored implementation

* changed attribute type to string so that it can be read in the frontend

* removed default margins from text and containers don't change size when increasing gap

* can now show a message or hide timer upon expiration

* added option to base the countdown of a timezone

* removed divider from /block-components and transferred it to an internal file

* added divider options and fixed classname typo

* removed divider from block-components

* added text control and toggle for labels

* added needed arguments for recurring countdown

* added time if countdown is recurring

* remove action on expiration when switching to recurring countdown

* separated size attributes and added a wrapper

* added styling to edit css of WP inspector controls

* changed positioning for toggles, added placeholders, and divider is based on what is being showed

* check if digit is shown

* separated attributes and added defaults

* added more style properties to fix look

* show double zero if empty

* made general tab initially open and added default values

* changed source for digit labels

* added anchor option

* gave each typography component unique class names and added customcss component for frontend

* changed hoverSelector for digits

* removed margin from message and centered divider

* added divider topoffset attribute and defaults

* message is now the last tab and divider attributes are set to default when changing type

* added defaults to divider attributes

* checks if leading zeroes are added and counts down if recurring

* removed .bind in setTimeout and supports leading zeroes

* added attribute to check double digits

* added attribute to check if you need to add leading zeroes

* changed position to relative to partly support block vertical alignment

* convert to seconds instead of milliseconds

* changed attribute name, removed toolbar from label text editor, and changed label name

* added props to handle toolbar functionalities

* added countdown icon

* timezone is applied to backend countdown timer

* timezone properly applied and saves time left to fix visual issue on refresh

* value for wordpress timezone is site's timezone

* changed default value of props

* added placeholders and changed classnames

* removed divider classnames, removed useEffect, and removed defaults

* added block width options

* removed divider classnames and removed conversion to milliseconds

* added default timezone and removed other attribute defaults

* removed divider options

* added styles to be shown as default

* refactored code to accomodate duration being seconds by default and now returns 0 properly

* flex 0 to prevent weird content vertical alignment

* added a wrapper for container contents and changed label

* added css for each container

* Update src/block-components/button/style.js [skip ci]

* lint + fixed keywords

* added example

* refactored implementation and removed dependencies

* changed classnames, refactored implementation, and added content alignment feature

* added example

* unset width when there is alignment and wrap text at frontend

* refactored code for optimization

* refactored show message feature

* changed selector and source

* added condition to make recurring timer reach 0 and refactored implementation

* added settings demo link

* tweaked heading

* support for delay fractions

* added control separator between recurring controls

* default is now system time

* refactored time calculation w/ timezone

* timezone is now applicable to start date of recurring and added quality changes to recurring

* prevent blocksy theme from overriding box-sizing

---------

Co-authored-by: Benjamin Intal <bfintal@gmail.com>
Co-authored-by: Vivo Milo C. Crame <vmc08@yahoo.com>
Co-authored-by: prconcepcion <pioconcepcion3@yahoo.com>
This pull request was closed.
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Labels
None yet
Projects
None yet
Development

Successfully merging this pull request may close these issues.

2 participants