npm - rw-elements-tools - Versions diffs - 1.2.0 - Mend

rw-elements-tools 1.2.0

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.

Files changed (185) hide show

package/LICENSE +22 -0
package/README.md +1333 -0
package/bin/cli.js +213 -0
package/build-properties.js +654 -0
package/build-shared-hooks.js +253 -0
package/config.js +148 -0
package/controls/Animations/AnimationEffects.js +111 -0
package/controls/Animations/AnimationSettings.js +437 -0
package/controls/Animations/Reveals.js +168 -0
package/controls/Animations/ScrollAnimation_Opacity.js +15 -0
package/controls/Animations/ScrollAnimation_Rotate.js +17 -0
package/controls/Animations/ScrollAnimation_Scale.js +18 -0
package/controls/Animations/ScrollAnimation_Translate.js +31 -0
package/controls/Background/Background.js +66 -0
package/controls/Background/BackgroundButton.js +69 -0
package/controls/Background/BackgroundColor.js +28 -0
package/controls/Background/BackgroundContainer.js +73 -0
package/controls/Background/BackgroundGradient.js +149 -0
package/controls/Background/BackgroundImage.js +108 -0
package/controls/Background/BackgroundOnlyColor.js +53 -0
package/controls/Background/BackgroundTransparent.js +66 -0
package/controls/Background/BackgroundVideo.js +9 -0
package/controls/Background/Color.js +52 -0
package/controls/Background/Gradient.js +263 -0
package/controls/Background/GradientContainer.js +263 -0
package/controls/Background/Image.js +269 -0
package/controls/Background/Image_CMS.js +305 -0
package/controls/Background/SVG.js +235 -0
package/controls/Background/Video.js +29 -0
package/controls/Borders/Border.js +114 -0
package/controls/Borders/BorderColor.js +25 -0
package/controls/Borders/BorderRadius.js +19 -0
package/controls/Borders/BorderStyle.js +26 -0
package/controls/Borders/BorderWidth.js +20 -0
package/controls/Borders/Borders.js +69 -0
package/controls/Borders/BordersContainer.js +90 -0
package/controls/Borders/BordersInput.js +107 -0
package/controls/Borders/Outline.js +100 -0
package/controls/Borders/OutlineColor.js +25 -0
package/controls/Borders/OutlineOffset.js +13 -0
package/controls/Borders/OutlineStyle.js +26 -0
package/controls/Borders/OutlineWidth.js +13 -0
package/controls/Effects/BackdropBlur.js +11 -0
package/controls/Effects/Blur.js +11 -0
package/controls/Effects/BoxShadow.js +15 -0
package/controls/Effects/Brightness.js +11 -0
package/controls/Effects/DropShadow.js +14 -0
package/controls/Effects/Effects.js +71 -0
package/controls/Effects/Filters.js +114 -0
package/controls/Effects/Opacity.js +14 -0
package/controls/Effects/Saturate.js +11 -0
package/controls/Layout/AspectRatio.js +53 -0
package/controls/Layout/Container.js +24 -0
package/controls/Layout/Hidden.js +9 -0
package/controls/Layout/Inset.js +15 -0
package/controls/Layout/Isolation.js +25 -0
package/controls/Layout/Layout.js +38 -0
package/controls/Layout/Overflow.js +33 -0
package/controls/Layout/Position.js +37 -0
package/controls/Layout/TopRightBottomLeft.js +90 -0
package/controls/Layout/Visibility.js +25 -0
package/controls/Layout/ZIndex.js +36 -0
package/controls/Overlay/Color.js +52 -0
package/controls/Overlay/Gradient.js +298 -0
package/controls/Overlay/Image.js +226 -0
package/controls/Overlay/Overlay.js +66 -0
package/controls/Sizing/Height.js +18 -0
package/controls/Sizing/MaxHeight.js +17 -0
package/controls/Sizing/MaxWidth.js +17 -0
package/controls/Sizing/MinHeight.js +18 -0
package/controls/Sizing/MinWidth.js +18 -0
package/controls/Sizing/Sizing.js +66 -0
package/controls/Sizing/SizingContainer.js +122 -0
package/controls/Sizing/SizingImage.js +75 -0
package/controls/Sizing/SizingInput.js +71 -0
package/controls/Sizing/SizingSVG.js +74 -0
package/controls/Sizing/Width.js +18 -0
package/controls/Spacing/Margin.js +17 -0
package/controls/Spacing/Padding.js +17 -0
package/controls/Spacing/Spacing.js +23 -0
package/controls/Spacing/SpacingButton.js +42 -0
package/controls/Spacing/SpacingContainer.js +32 -0
package/controls/Spacing/SpacingInput.js +42 -0
package/controls/Transforms/Rotate.js +13 -0
package/controls/Transforms/Scale.js +13 -0
package/controls/Transforms/Skew.js +25 -0
package/controls/Transforms/TransformOrigin.js +12 -0
package/controls/Transforms/Transforms.js +98 -0
package/controls/Transforms/Translate.js +26 -0
package/controls/Transitions/Delay.js +13 -0
package/controls/Transitions/Duration.js +13 -0
package/controls/Transitions/Property.js +42 -0
package/controls/Transitions/TimingFunction.js +44 -0
package/controls/Transitions/Transitions.js +20 -0
package/controls/alignment/AlignContent.js +48 -0
package/controls/alignment/AlignItems.js +64 -0
package/controls/alignment/AlignSelf.js +34 -0
package/controls/alignment/JustifyContent.js +44 -0
package/controls/alignment/JustifyItems.js +32 -0
package/controls/alignment/JustifySelf.js +34 -0
package/controls/core/CSSClasses.js +11 -0
package/controls/core/ControlType.js +25 -0
package/controls/core/HTMLTag.js +80 -0
package/controls/core/HoverGroup.js +38 -0
package/controls/core/ID.js +12 -0
package/controls/core/Image.js +95 -0
package/controls/core/MenuItem.js +187 -0
package/controls/core/ObjectFit.js +32 -0
package/controls/core/ObjectPosition.js +65 -0
package/controls/grid-flex/ActAsGridOrFlexItem.js +54 -0
package/controls/grid-flex/ColEnd.js +28 -0
package/controls/grid-flex/ColStart.js +27 -0
package/controls/grid-flex/Columns.js +38 -0
package/controls/grid-flex/FlexDirection.js +27 -0
package/controls/grid-flex/FlexItem.js +106 -0
package/controls/grid-flex/GridItem.js +41 -0
package/controls/grid-flex/Order.js +45 -0
package/controls/grid-flex/RowEnd.js +28 -0
package/controls/grid-flex/RowStart.js +27 -0
package/controls/grid-flex/Rows.js +38 -0
package/controls/index.js +187 -0
package/controls/interactive/ButtonFontAndTextStyles.js +208 -0
package/controls/interactive/Filter.js +54 -0
package/controls/interactive/InputFontAndTextStyles.js +156 -0
package/controls/interactive/Link.js +13 -0
package/controls/typography/HeadingColor.js +112 -0
package/controls/typography/TextColor.js +51 -0
package/controls/typography/TextDecoration.js +99 -0
package/controls/typography/TextFontsAndTextStyles.js +243 -0
package/controls/typography/TextSimple.js +55 -0
package/controls/typography/TextStyles.js +55 -0
package/controls/typography/Typography.js +13 -0
package/index.js +19 -0
package/package.json +55 -0
package/properties/BackgroundType.js +18 -0
package/properties/ButtonSize.js +19 -0
package/properties/ContainerHeights.js +23 -0
package/properties/ContainerWidths.js +27 -0
package/properties/FontWeight.js +16 -0
package/properties/GradientDirection.js +39 -0
package/properties/LetterSpacing.js +13 -0
package/properties/LineHeight.js +13 -0
package/properties/RevealAnimations.js +12 -0
package/properties/Slider.js +10 -0
package/properties/TextAlign.js +23 -0
package/properties/TransformOrigins.js +43 -0
package/properties/TransitionNames.js +20 -0
package/properties/index.js +13 -0
package/shared-hooks/animations/globalAnimations.js +141 -0
package/shared-hooks/animations/globalReveal.js +48 -0
package/shared-hooks/background/globalBackground.js +306 -0
package/shared-hooks/background/globalBgImageFetchPriority.js +34 -0
package/shared-hooks/borders/globalBorders.js +85 -0
package/shared-hooks/borders/globalOutline.js +39 -0
package/shared-hooks/core/addPrefixToTailwindClasses.js +24 -0
package/shared-hooks/core/advancedClasses.js +5 -0
package/shared-hooks/core/classnames.js +92 -0
package/shared-hooks/core/getHoverPrefix.js +21 -0
package/shared-hooks/core/globalHTMLTag.js +17 -0
package/shared-hooks/core/injectPrefixOnDarkModeColors.js +6 -0
package/shared-hooks/effects/globalEffects.js +45 -0
package/shared-hooks/effects/globalFilters.js +80 -0
package/shared-hooks/effects/globalOverlay.js +166 -0
package/shared-hooks/interactive/globalFilter.js +24 -0
package/shared-hooks/interactive/globalLink.js +23 -0
package/shared-hooks/layout/globalActAsGridOrFlexItem.js +66 -0
package/shared-hooks/layout/globalLayout.js +50 -0
package/shared-hooks/navigation/globalMenuItem.js +35 -0
package/shared-hooks/navigation/globalNavItems.js +60 -0
package/shared-hooks/navigation/globalNavTitle.js +23 -0
package/shared-hooks/sizing/aspectRatioClasses.js +20 -0
package/shared-hooks/sizing/globalSizing.js +19 -0
package/shared-hooks/sizing/globalSizingContainer.js +40 -0
package/shared-hooks/sizing/objectClasses.js +9 -0
package/shared-hooks/spacing/globalSpacing.js +13 -0
package/shared-hooks/spacing/globalSpacingMargin.js +11 -0
package/shared-hooks/spacing/globalSpacingPadding.js +11 -0
package/shared-hooks/transforms/globalTransforms.js +78 -0
package/shared-hooks/transitions/getAlpineTransitionAttributesDesktop.js +111 -0
package/shared-hooks/transitions/getAlpineTransitionAttributesMobile.js +110 -0
package/shared-hooks/transitions/globalTransitions.js +48 -0
package/shared-hooks/typography/globalButtonFontAndTextStyles.js +65 -0
package/shared-hooks/typography/globalHeadingColor.js +69 -0
package/shared-hooks/typography/globalInputFontAndTextStyles.js +40 -0
package/shared-hooks/typography/globalTextFontsAndTextStyles.js +47 -0

package/controls/Background/Image.js ADDED Viewed

@@ -0,0 +1,269 @@
+export const Image = [
+    {
+        visible:
+            "globalControlTypeBg == 'static' && globalBgType == 'image' || (globalControlTypeBg == 'hover' && globalBgState == 'start' && globalBgType == 'image')",
+        title: "Image",
+        id: "globalBgImageResource",
+        resource: {},
+    },
+    {
+        visible:
+            "globalControlTypeBg == 'static' && globalBgType == 'image' || (globalControlTypeBg == 'hover' && globalBgState == 'start' && globalBgType == 'image')",
+        title: "Position",
+        id: "globalBgImagePosition",
+        format: "bg-{{value}}",
+        select: {
+            default: "center",
+            items: [
+                {
+                    value: "bottom",
+                    title: "Bottom",
+                },
+                {
+                    value: "center",
+                    title: "Center",
+                },
+                {
+                    value: "left",
+                    title: "Left",
+                },
+                {
+                    value: "left-bottom",
+                    title: "Left Bottom",
+                },
+                {
+                    value: "left-top",
+                    title: "Left Top",
+                },
+                {
+                    value: "right",
+                    title: "Right",
+                },
+                {
+                    value: "right-bottom",
+                    title: "Right Bottom",
+                },
+                {
+                    value: "right-top",
+                    title: "Right Top",
+                },
+                {
+                    value: "top",
+                    title: "Top",
+                },
+            ],
+        },
+    },
+    {
+        visible:
+            "globalControlTypeBg == 'static' && globalBgType == 'image' || (globalControlTypeBg == 'hover' && globalBgState == 'start' && globalBgType == 'image')",
+        title: "Sizing",
+        heading: {},
+    },
+    {
+        visible:
+            "globalControlTypeBg == 'static' && globalBgType == 'image' || (globalControlTypeBg == 'hover' && globalBgState == 'start' && globalBgType == 'image')",
+        title: "Size",
+        id: "globalBgImageSize",
+        format: "bg-{{value}}",
+        select: {
+            default: "cover",
+            items: [
+                {
+                    title: "Auto",
+                    value: "auto",
+                },
+                {
+                    title: "Cover",
+                    value: "cover",
+                },
+                {
+                    title: "Contain",
+                    value: "contain",
+                },
+            ],
+        },
+    },
+    {
+        visible:
+            "globalControlTypeBg == 'static' && globalBgType == 'image' || (globalControlTypeBg == 'hover' && globalBgState == 'start' && globalBgType == 'image')",
+        title: "Repeat",
+        id: "globalBgImageRepeat",
+        format: "bg-{{value}}",
+        select: {
+            default: "no-repeat",
+            items: [
+                {
+                    title: "No Repeat",
+                    value: "no-repeat",
+                },
+                {
+                    title: "Repeat",
+                    value: "repeat",
+                },
+                {
+                    title: "Repeat Horizontal",
+                    value: "repeat-x",
+                },
+                {
+                    title: "Repeat Vertical",
+                    value: "repeat-y",
+                },
+            ],
+        },
+    },
+    {
+        visible:
+            "(globalControlTypeBg == 'hover' && globalBgState == 'end' && globalBgType == 'image')",
+        title: "Image",
+        id: "globalBgImageResourceEnd",
+        resource: {},
+    },
+    {
+        visible:
+            "(globalControlTypeBg == 'hover' && globalBgState == 'end' && globalBgType == 'image')",
+        title: "Position",
+        heading: {},
+    },
+    {
+        visible:
+            "(globalControlTypeBg == 'hover' && globalBgState == 'end' && globalBgType == 'image')",
+        title: "Position",
+        id: "globalBgImagePositionEnd",
+        format: "hover:bg-{{value}}",
+        select: {
+            default: "center",
+            items: [
+                {
+                    value: "bottom",
+                    title: "Bottom",
+                },
+                {
+                    value: "center",
+                    title: "Center",
+                },
+                {
+                    value: "left",
+                    title: "Left",
+                },
+                {
+                    value: "left-bottom",
+                    title: "Left Bottom",
+                },
+                {
+                    value: "left-top",
+                    title: "Left Top",
+                },
+                {
+                    value: "right",
+                    title: "Right",
+                },
+                {
+                    value: "right-bottom",
+                    title: "Right Bottom",
+                },
+                {
+                    value: "right-top",
+                    title: "Right Top",
+                },
+                {
+                    value: "top",
+                    title: "Top",
+                },
+            ],
+        },
+    },
+    {
+        visible:
+            "(globalControlTypeBg == 'hover' && globalBgState == 'end' && globalBgType == 'image')",
+        title: "Sizing",
+        heading: {},
+    },
+    {
+        visible:
+            "(globalControlTypeBg == 'hover' && globalBgState == 'end' && globalBgType == 'image')",
+        title: "Size",
+        id: "globalBgImageSizeEnd",
+        format: "hover:bg-{{value}}",
+        select: {
+            default: "cover",
+            items: [
+                {
+                    title: "Auto",
+                    value: "auto",
+                },
+                {
+                    title: "Cover",
+                    value: "cover",
+                },
+                {
+                    title: "Contain",
+                    value: "contain",
+                },
+            ],
+        },
+    },
+    {
+        visible:
+            "(globalControlTypeBg == 'hover' && globalBgState == 'end' && globalBgType == 'image')",
+        title: "Repeat",
+        id: "globalBgImageRepeatEnd",
+        format: "hover:bg-{{value}}",
+        select: {
+            default: "no-repeat",
+            items: [
+                {
+                    title: "No Repeat",
+                    value: "no-repeat",
+                },
+                {
+                    title: "Repeat",
+                    value: "repeat",
+                },
+                {
+                    title: "Repeat Horizontal",
+                    value: "repeat-x",
+                },
+                {
+                    title: "Repeat Vertical",
+                    value: "repeat-y",
+                },
+            ],
+        },
+    },
+    ,
+    {
+        visible: "globalBgType == 'image'",
+        divider: {},
+    },
+    {
+        visible: "globalBgType == 'image'",
+        title: "Fetch Priority",
+        heading: {},
+    },
+    {
+        visible: "globalBgType == 'image'",
+        title: "Value",
+        id: "globalBgImageFetchPriority",
+        responsive: false,
+        segmented: {
+            default: "auto",
+            items: [
+                {
+                    title: "Auto",
+                    value: "auto",
+                },
+                {
+                    title: "High",
+                    value: "high",
+                },
+                {
+                    title: "Low",
+                    value: "low",
+                },
+            ],
+        },
+    },
+];
+export default Image;

package/controls/Background/Image_CMS.js ADDED Viewed

@@ -0,0 +1,305 @@
+export const ImageCMS = [
+    {
+        visible: "globalBgType == 'image'",
+        title: "Type",
+        id: "globalBgImageType",
+        segmented: {
+            default: "resource",
+            items: [
+                {
+                    title: "Resource",
+                    value: "resource",
+                },
+                {
+                    title: "CMS",
+                    value: "cms",
+                }
+            ],
+        },
+    },
+    {
+        visible:
+            "globalBgImageType == 'cms' && (globalControlTypeBg == 'static' && globalBgType == 'image' || (globalControlTypeBg == 'hover' && globalBgState == 'start' && globalBgType == 'image'))",
+        title: "Field",
+        id: "globalBgImageCmsField",
+        text: {
+            default: "{{item.image.src}}",
+        },
+    },
+    {
+        visible:
+            "globalBgImageType == 'resource' && (globalControlTypeBg == 'static' && globalBgType == 'image' || (globalControlTypeBg == 'hover' && globalBgState == 'start' && globalBgType == 'image'))",
+        title: "Image",
+        id: "globalBgImageResource",
+        resource: {},
+    },
+    {
+        visible:
+            "globalControlTypeBg == 'static' && globalBgType == 'image' || (globalControlTypeBg == 'hover' && globalBgState == 'start' && globalBgType == 'image')",
+        title: "Position",
+        id: "globalBgImagePosition",
+        format: "bg-{{value}}",
+        select: {
+            default: "center",
+            items: [
+                {
+                    value: "bottom",
+                    title: "Bottom",
+                },
+                {
+                    value: "center",
+                    title: "Center",
+                },
+                {
+                    value: "left",
+                    title: "Left",
+                },
+                {
+                    value: "left-bottom",
+                    title: "Left Bottom",
+                },
+                {
+                    value: "left-top",
+                    title: "Left Top",
+                },
+                {
+                    value: "right",
+                    title: "Right",
+                },
+                {
+                    value: "right-bottom",
+                    title: "Right Bottom",
+                },
+                {
+                    value: "right-top",
+                    title: "Right Top",
+                },
+                {
+                    value: "top",
+                    title: "Top",
+                },
+            ],
+        },
+    },
+    {
+        visible:
+            "globalControlTypeBg == 'static' && globalBgType == 'image' || (globalControlTypeBg == 'hover' && globalBgState == 'start' && globalBgType == 'image')",
+        title: "Sizing",
+        heading: {},
+    },
+    {
+        visible:
+            "globalControlTypeBg == 'static' && globalBgType == 'image' || (globalControlTypeBg == 'hover' && globalBgState == 'start' && globalBgType == 'image')",
+        title: "Size",
+        id: "globalBgImageSize",
+        format: "bg-{{value}}",
+        select: {
+            default: "cover",
+            items: [
+                {
+                    title: "Auto",
+                    value: "auto",
+                },
+                {
+                    title: "Cover",
+                    value: "cover",
+                },
+                {
+                    title: "Contain",
+                    value: "contain",
+                },
+            ],
+        },
+    },
+    {
+        visible:
+            "globalControlTypeBg == 'static' && globalBgType == 'image' || (globalControlTypeBg == 'hover' && globalBgState == 'start' && globalBgType == 'image')",
+        title: "Repeat",
+        id: "globalBgImageRepeat",
+        format: "bg-{{value}}",
+        select: {
+            default: "no-repeat",
+            items: [
+                {
+                    title: "No Repeat",
+                    value: "no-repeat",
+                },
+                {
+                    title: "Repeat",
+                    value: "repeat",
+                },
+                {
+                    title: "Repeat Horizontal",
+                    value: "repeat-x",
+                },
+                {
+                    title: "Repeat Vertical",
+                    value: "repeat-y",
+                },
+            ],
+        },
+    },
+    {
+        visible:
+            "globalBgImageType == 'cms' && (globalControlTypeBg == 'hover' && globalBgState == 'end' && globalBgType == 'image')",
+        title: "Field",
+        id: "globalBgImageCmsFieldEnd",
+        text: {
+            default: "{{item.image.src}}",
+        },
+    },
+    {
+        visible:
+            "globalBgImageType == 'resource' && (globalControlTypeBg == 'hover' && globalBgState == 'end' && globalBgType == 'image')",
+        title: "Image",
+        id: "globalBgImageResourceEnd",
+        resource: {},
+    },
+    {
+        visible:
+            "(globalControlTypeBg == 'hover' && globalBgState == 'end' && globalBgType == 'image')",
+        title: "Position",
+        heading: {},
+    },
+    {
+        visible:
+            "(globalControlTypeBg == 'hover' && globalBgState == 'end' && globalBgType == 'image')",
+        title: "Position",
+        id: "globalBgImagePositionEnd",
+        format: "hover:bg-{{value}}",
+        select: {
+            default: "center",
+            items: [
+                {
+                    value: "bottom",
+                    title: "Bottom",
+                },
+                {
+                    value: "center",
+                    title: "Center",
+                },
+                {
+                    value: "left",
+                    title: "Left",
+                },
+                {
+                    value: "left-bottom",
+                    title: "Left Bottom",
+                },
+                {
+                    value: "left-top",
+                    title: "Left Top",
+                },
+                {
+                    value: "right",
+                    title: "Right",
+                },
+                {
+                    value: "right-bottom",
+                    title: "Right Bottom",
+                },
+                {
+                    value: "right-top",
+                    title: "Right Top",
+                },
+                {
+                    value: "top",
+                    title: "Top",
+                },
+            ],
+        },
+    },
+    {
+        visible:
+            "(globalControlTypeBg == 'hover' && globalBgState == 'end' && globalBgType == 'image')",
+        title: "Sizing",
+        heading: {},
+    },
+    {
+        visible:
+            "(globalControlTypeBg == 'hover' && globalBgState == 'end' && globalBgType == 'image')",
+        title: "Size",
+        id: "globalBgImageSizeEnd",
+        format: "hover:bg-{{value}}",
+        select: {
+            default: "cover",
+            items: [
+                {
+                    title: "Auto",
+                    value: "auto",
+                },
+                {
+                    title: "Cover",
+                    value: "cover",
+                },
+                {
+                    title: "Contain",
+                    value: "contain",
+                },
+            ],
+        },
+    },
+    {
+        visible:
+            "(globalControlTypeBg == 'hover' && globalBgState == 'end' && globalBgType == 'image')",
+        title: "Repeat",
+        id: "globalBgImageRepeatEnd",
+        format: "hover:bg-{{value}}",
+        select: {
+            default: "no-repeat",
+            items: [
+                {
+                    title: "No Repeat",
+                    value: "no-repeat",
+                },
+                {
+                    title: "Repeat",
+                    value: "repeat",
+                },
+                {
+                    title: "Repeat Horizontal",
+                    value: "repeat-x",
+                },
+                {
+                    title: "Repeat Vertical",
+                    value: "repeat-y",
+                },
+            ],
+        },
+    },
+    ,
+    {
+        visible: "globalBgType == 'image'",
+        divider: {},
+    },
+    {
+        visible: "globalBgType == 'image'",
+        title: "Fetch Priority",
+        heading: {},
+    },
+    {
+        visible: "globalBgType == 'image'",
+        title: "Value",
+        id: "globalBgImageFetchPriority",
+        responsive: false,
+        segmented: {
+            default: "auto",
+            items: [
+                {
+                    title: "Auto",
+                    value: "auto",
+                },
+                {
+                    title: "High",
+                    value: "high",
+                },
+                {
+                    title: "Low",
+                    value: "low",
+                },
+            ],
+        },
+    },
+];
+export default ImageCMS;