| Server IP : 47.82.179.145 / Your IP : 216.73.217.129 Web Server : nginx/1.26.3 System : Linux iZt4n9czhka2zvqfajdlr2Z 6.8.0-63-generic #66-Ubuntu SMP PREEMPT_DYNAMIC Fri Jun 13 20:25:30 UTC 2025 x86_64 User : www ( 1001) PHP Version : 8.3.30 Disable Function : passthru,exec,system,putenv,chroot,chgrp,chown,shell_exec,popen,proc_open,pcntl_exec,ini_alter,ini_restore,dl,openlog,syslog,readlink,symlink,popepassthru,pcntl_alarm,pcntl_fork,pcntl_waitpid,pcntl_wait,pcntl_wifexited,pcntl_wifstopped,pcntl_wifsignaled,pcntl_wifcontinued,pcntl_wexitstatus,pcntl_wtermsig,pcntl_wstopsig,pcntl_signal,pcntl_signal_dispatch,pcntl_get_last_error,pcntl_strerror,pcntl_sigprocmask,pcntl_sigwaitinfo,pcntl_sigtimedwait,pcntl_exec,pcntl_getpriority,pcntl_setpriority,imap_open,apache_setenv MySQL : OFF | cURL : ON | WGET : OFF | Perl : OFF | Python : OFF | Sudo : OFF | Pkexec : OFF Directory : /www/wwwroot/scuipturepactory.com/wp-content/plugins.off/latepoint/blocks/controls/ |
Upload File : |
import {__} from '@wordpress/i18n';
import {
SelectControl,
__experimentalUnitControl as UnitControl,
PanelRow,
TabPanel
} from '@wordpress/components';
import React from "react";
import ColorSelectorControl from "./ColorSelectorControl";
const BorderControl = ({attributes, setAttributes, borderRadiusAttr}) => {
return (
<>
<UnitControl
label={__('Border Radius')}
className="latepoint-control-two-columns"
onChange={(value) => {
setAttributes({[borderRadiusAttr]: value})
}}
units={[
{value: 'px', label: 'px', default: 0},
{value: '%', label: '%', default: 10},
{value: 'em', label: 'em', default: 0},
]}
value={attributes[borderRadiusAttr]}
/>
<SelectControl
label={__('Style', 'latepoint')}
value={attributes.border_style}
className="latepoint-control-two-columns"
options={[
{label: __('Default', 'latepoint'), value: 'default'},
{label: __('None', 'latepoint'), value: 'none'},
{label: __('Solid', 'latepoint'), value: 'solid'},
{label: __('Dotted', 'latepoint'), value: 'dotted'},
{label: __('Dashed', 'latepoint'), value: 'dashed'},
]}
onChange={(border_style) => setAttributes({border_style})}
/>
{attributes.border_style !== 'default' && attributes.border_style !== 'none' && (
<>
<UnitControl
label={__('Border Width')}
className="latepoint-control-two-columns"
onChange={(value) => {
setAttributes({border_width: value})
}}
units={[
{value: 'px', label: 'px', default: 0},
{value: '%', label: '%', default: 10},
{value: 'em', label: 'em', default: 0},
]}
value={attributes.border_width}
/>
<TabPanel
className="lb-tabs"
activeClass="active-tab"
tabs={[
{name: 'tab-normal', title: 'Normal',},
{name: 'tab-hover', title: 'Hover',},
]}
>
{(tab) => {
if (tab.name === 'tab-normal') {
return (
<>
<ColorSelectorControl
attributes={attributes}
setAttributes={setAttributes}
colorAttribute="border_color"
label={__('Border Color', 'latepoint')}
></ColorSelectorControl>
</>
);
}
if (tab.name === 'tab-hover') {
return (
<>
<ColorSelectorControl
attributes={attributes}
setAttributes={setAttributes}
colorAttribute="border_color_hover"
label={__('Border Color', 'latepoint')}
></ColorSelectorControl>
</>
);
}
}}
</TabPanel>
</>
)}
</>
);
};
export default BorderControl;