From 4beac9ed46ab49eaf68b6dda552258324e6f2a7c Mon Sep 17 00:00:00 2001
From: =?UTF-8?q?Loi=CC=88c=20Correnson?= <loic.correnson@cea.fr>
Date: Wed, 7 Dec 2022 15:48:45 +0100
Subject: [PATCH] [dome] icon & icon-button visibility & display
---
ivette/src/dome/renderer/controls/icons.tsx | 20 +++++++++++++++-----
1 file changed, 15 insertions(+), 5 deletions(-)
diff --git a/ivette/src/dome/renderer/controls/icons.tsx b/ivette/src/dome/renderer/controls/icons.tsx
index e35035d03d5..a6acd231e16 100644
--- a/ivette/src/dome/renderer/controls/icons.tsx
+++ b/ivette/src/dome/renderer/controls/icons.tsx
@@ -36,7 +36,7 @@
import _ from 'lodash';
import React from 'react';
-import { classes } from 'dome/misc/utils';
+import { classes, styles } from 'dome/misc/utils';
import Gallery from './gallery.json';
import './style.css';
@@ -84,7 +84,7 @@ export function SVG(props: SVGprops): null | JSX.Element {
width={size}
style={{ bottom: offset }}
viewBox={viewBox}
- className = {className}
+ className={className}
>
{title && <title>{title}</title>}
<path d={path} fill={fill} />
@@ -100,6 +100,10 @@ export function SVG(props: SVGprops): null | JSX.Element {
export interface IconProps extends SVGprops {
/** Additional class name(s). */
className?: string;
+ /** Display (default is true). */
+ display?: boolean;
+ /** Visibility (default is true). */
+ visible?: boolean;
/** Additional DIV style. */
style?: React.CSSProperties;
/** Fill style property. */
@@ -115,10 +119,16 @@ export interface IconProps extends SVGprops {
export function Icon(props: IconProps): JSX.Element {
const {
id, title, onClick, fill,
- size, className = '', offset, style,
+ size, className, offset, style,
+ visible = true, display = true,
} = props;
- const divClass = classes('dome-xIcon', className);
- const divStyle = fill ? { fill, ...style } : style;
+ const divClass = classes(
+ 'dome-xIcon',
+ !visible && 'dome-control-hidden',
+ !display && 'dome-control-erased',
+ className
+ );
+ const divStyle = styles(fill && { fill }, style);
return (
<div
className={divClass}
--
GitLab