Sha256: 269abf423166972ea899a0914ee737a6e38965197998c05f9cee63c910068948

Contents?: true

Size: 1.57 KB

Versions: 512

Compression:

Stored size: 1.57 KB

Contents

import React from 'react'
import defaultColors from "../../tokens/exports/_colors.module.scss";
import { OverlayChildrenProps } from '../_overlay';


const previousOverlayDirectionMap: { [key: string]: string } = {
    "bottom": "to top",
    "top": "to bottom",
    "left": "to right",
    "right": "to left",
    "x": "to right",
    "y": "to top",
}

const subsequentOverlayDirectionMap: { [key: string]: string } = {
    ...previousOverlayDirectionMap,
    "x": "to left",
    "y": "to bottom",
}

const OverlayPercentage = (props: OverlayChildrenProps) => {
    const {
        children,
        color,
        position,
        size,
    } = props

    const getPreviousOverlayDirection = () => {
        return previousOverlayDirectionMap[position]
    }

    const getSubsequentOverlayDirection = () => {
        return subsequentOverlayDirectionMap[position]
    }

    const hasSubsequentOverlay = position === "x" || position === "y"

    const previousOverlay = `linear-gradient(${getPreviousOverlayDirection()}, ${defaultColors[color]} 0%, transparent ${size})`
    const subsequentOverlay = `linear-gradient(${getSubsequentOverlayDirection()}, ${defaultColors[color]} 0%, transparent ${size})`

    return (
        <>
            <div className="overlay_linear_gradient"
                style={{ background: previousOverlay }} />

            {children}

            { hasSubsequentOverlay &&
                <div className="overlay_linear_gradient"
                    style={{ background: subsequentOverlay }} />
            }       
        </>
    )
}

export default OverlayPercentage

Version data entries

512 entries across 512 versions & 1 rubygems

Version Path
playbook_ui-14.12.0.pre.alpha.play1790darkaudittable5802 app/pb_kits/playbook/pb_overlay/subcomponents/_overlay_percentage.tsx
playbook_ui-14.12.0.pre.alpha.play1752updatecontenttag5801 app/pb_kits/playbook/pb_overlay/subcomponents/_overlay_percentage.tsx
playbook_ui-14.13.0.pre.rc.6 app/pb_kits/playbook/pb_overlay/subcomponents/_overlay_percentage.tsx
playbook_ui-14.13.0.pre.rc.5 app/pb_kits/playbook/pb_overlay/subcomponents/_overlay_percentage.tsx
playbook_ui-14.12.0.pre.alpha.PLAY1602lightboxoverlapnitrobug5781 app/pb_kits/playbook/pb_overlay/subcomponents/_overlay_percentage.tsx
playbook_ui-14.13.0.pre.rc.4 app/pb_kits/playbook/pb_overlay/subcomponents/_overlay_percentage.tsx
playbook_ui-14.12.0.pre.alpha.playrailsinputmaskissue5775 app/pb_kits/playbook/pb_overlay/subcomponents/_overlay_percentage.tsx
playbook_ui-14.12.0.pre.alpha.PBNTR456fixedconftoastrailsautoclose5757 app/pb_kits/playbook/pb_overlay/subcomponents/_overlay_percentage.tsx
playbook_ui-14.12.0.pre.alpha.PBNTR456fixedconftoastrailsautoclose5754 app/pb_kits/playbook/pb_overlay/subcomponents/_overlay_percentage.tsx
playbook_ui-14.12.0.pre.alpha.PLAY1602lightboxoverlapnitrobugzindextoken5751 app/pb_kits/playbook/pb_overlay/subcomponents/_overlay_percentage.tsx
playbook_ui-14.12.0.pre.alpha.PBNTR456fixedconftoastrailsautoclose5738 app/pb_kits/playbook/pb_overlay/subcomponents/_overlay_percentage.tsx
playbook_ui-14.13.0.pre.rc.3 app/pb_kits/playbook/pb_overlay/subcomponents/_overlay_percentage.tsx
playbook_ui-14.12.0.pre.alpha.PLAY1865reactdatepickerreinitializingbug5732 app/pb_kits/playbook/pb_overlay/subcomponents/_overlay_percentage.tsx
playbook_ui-14.12.0.pre.alpha.PBNTR456fixedconftoastrailsautoclose5728 app/pb_kits/playbook/pb_overlay/subcomponents/_overlay_percentage.tsx
playbook_ui-14.12.0.pre.alpha.play1862buttondisabledlinkbug5716 app/pb_kits/playbook/pb_overlay/subcomponents/_overlay_percentage.tsx
playbook_ui-14.12.0.pre.alpha.play1862buttondisabledlinkbug5714 app/pb_kits/playbook/pb_overlay/subcomponents/_overlay_percentage.tsx
playbook_ui-14.13.0.pre.rc.2 app/pb_kits/playbook/pb_overlay/subcomponents/_overlay_percentage.tsx
playbook_ui-14.13.0.pre.rc.1 app/pb_kits/playbook/pb_overlay/subcomponents/_overlay_percentage.tsx
playbook_ui-14.13.0.pre.rc.0 app/pb_kits/playbook/pb_overlay/subcomponents/_overlay_percentage.tsx
playbook_ui-14.12.0.pre.alpha.advancedtablealignmentfixes5693 app/pb_kits/playbook/pb_overlay/subcomponents/_overlay_percentage.tsx