@woosmap/ui 4.34.0 → 4.35.0

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@woosmap/ui",
-  "version": "4.34.0",
+  "version": "4.35.0",
   "repository": {
     "type": "git",
     "url": "git+https://github.com/WebGeoServices/ui.git"

package/src/components/Button/Button.stories.js

@@ -28,7 +28,7 @@ const Template = (args) => {
                 <Button label={label} disabled />
             </div>
             <div className="flex mbi">
-                <Button icon="marker" isNotification label="4" type="secondary" />
+                <Button icon="puzzle" isNotification label="4" type="secondary" />
                 <Button label={label} type="secondary" />
                 <Button label={label} type="secondary" icon="marker" />
                 <Button label={label} type="secondary" isLoading />
@@ -105,7 +105,7 @@ const Template = (args) => {
             <div className="flex-column mbi">
                 <span>
                     There is a no-labeled flexed button link here : &nbsp;
-                    <Button icon="marker" type="link-flex" />
+                    <Button icon="label" type="link-flex" />
                 </span>
                 <span>
                     There is a labeled flexed button link here : &nbsp;
@@ -115,7 +115,7 @@ const Template = (args) => {
             <div className="flex-column mbi">
                 <span>
                     There is a no-labeled flexed-info button link here : &nbsp;
-                    <Button icon="marker" type="link-flex-info" />
+                    <Button icon="label" type="link-flex-info" />
                 </span>
                 <span>
                     There is a labeled flexed-info button link here : &nbsp;

package/src/components/Card/Card.styl

@@ -191,7 +191,7 @@
 						font-size $fontSizeSmall - .1
 						margin-top -.5rem
 						.icon
-							stroke $logo5
+							fill $logo5
 		&__footer
 			color $dark40
 		&--small
@@ -272,7 +272,7 @@
 		.card--traffic &
 			background $traffic
 		.icon
-			stroke $light
+			fill $light
 	&__image
 		flex-grow 1
 		flex-shrink 0

package/src/components/Card/SimpleCard.styl

@@ -61,7 +61,7 @@
 		position absolute
 		right 1rem
 		top 1.3rem
-		stroke $favorite
+		fill $favorite
 		.inline &
 			sq(1.8)
 			position unset

package/src/components/Demo/skeletondemo.styl

@@ -155,7 +155,7 @@
             padding-left .5rem !important
             padding-right .5rem !important
             svg
-                stroke $activeColor
+                fill $activeColor
         &__indicator-separator
             background-color $activeColor
         &__multi-value

package/src/components/Flash/Flash.stories.js

@@ -51,7 +51,7 @@ const Template = () => (
         <div className="flex mbib mbi--large">
             <div className="flex mbi">
                 <Flash type="howto">Tip Howto</Flash>
-                <Flash type="howto" icon="marker">
+                <Flash type="howto" icon="tool">
                     Howto flash iconed
                 </Flash>
             </div>
@@ -68,7 +68,7 @@ const Template = () => (
         <div className="flex mbib mbi--large">
             <div className="flex mbi">
                 <Flash type="success">Success flash</Flash>
-                <Flash type="success" icon="marker">
+                <Flash type="success" icon="enter">
                     Success flash iconed
                 </Flash>
             </div>
@@ -76,7 +76,7 @@ const Template = () => (
                 <Flash type="success" inverse>
                     Success flash inverse
                 </Flash>
-                <Flash type="success" inverse icon="marker">
+                <Flash type="success" inverse icon="enter">
                     Success flash inverse iconed
                 </Flash>
             </div>

package/src/components/Flash/Flash.styl

@@ -11,7 +11,7 @@
 		min-height $buttonHeight
 		padding .9rem $padding
 	.icon
-		stroke $secondary
+		fill $secondary
 		flex-shrink 0
 	&--shadowed
 		box-shadow 0 0 1rem $dark8
@@ -30,7 +30,7 @@
 		&.flash--inverse
 			color $flashSuccess
 			.icon
-				stroke $flashSuccess
+				fill $flashSuccess
 
 	&--tip
 		&:not(.flash--inverse)
@@ -39,7 +39,7 @@
 		&.flash--inverse
 			color $flashTipInverse
 			.icon
-				stroke $flashTipInverse
+				fill $flashTipInverse
 	
 	&--howto
 		&:not(.flash--inverse)
@@ -48,7 +48,7 @@
 		&.flash--inverse
 			color $flashHowto
 			.icon
-				stroke $flashHowto
+				fill $flashHowto
 
 	&--warning
 		&:not(.flash--inverse)
@@ -57,7 +57,7 @@
 		&.flash--inverse
 			color $flashWarning
 			.icon
-				stroke $flashWarning
+				fill $flashWarning
 
 	&--error
 		&:not(.flash--inverse)
@@ -66,7 +66,7 @@
 		&.flash--inverse
 			color $flashError
 			.icon
-				stroke $flashError
+				fill $flashError
 
 	&--info
 		&:not(.flash--inverse)
@@ -75,4 +75,4 @@
 		&.flash--inverse
 			color $flashInfo
 			.icon
-				stroke $flashInfo
+				fill $flashInfo

package/src/components/Icon/Icon.js

@@ -113,64 +113,103 @@ import { ReactComponent as WorldTime } from '../../icons/world-time.svg';
 import { ReactComponent as WinPrize } from '../../icons/win-prize.svg';
 import { ReactComponent as Zoom } from '../../icons/zoom.svg';
 
+import { ReactComponent as Access } from '../../icons/access.svg';
 import { ReactComponent as Add } from '../../icons/add.svg';
 import { ReactComponent as AddCircle } from '../../icons/add-circle.svg';
+import { ReactComponent as Administration } from '../../icons/administration.svg';
 import { ReactComponent as AdministrationTool } from '../../icons/administration-tool.svg';
 import { ReactComponent as AdminKey } from '../../icons/admin-key.svg';
 import { ReactComponent as AdminTool } from '../../icons/admin-tool.svg';
 import { ReactComponent as Agenda } from '../../icons/agenda.svg';
 import { ReactComponent as AlphabeticalOrder } from '../../icons/alphabetical-order.svg';
+import { ReactComponent as AlphabeticalOrderReversed } from '../../icons/alphabetical-order-reversed.svg';
+import { ReactComponent as Archive } from '../../icons/archive.svg';
 import { ReactComponent as ArrowBotton } from '../../icons/arrow-bottom.svg';
 import { ReactComponent as ArrowLeft } from '../../icons/arrow-left.svg';
 import { ReactComponent as ArrowRight } from '../../icons/arrow-right.svg';
 import { ReactComponent as ArrowTop } from '../../icons/arrow-top.svg';
+import { ReactComponent as ArrowLink } from '../../icons/arrow-link.svg';
 import { ReactComponent as Asset } from '../../icons/asset.svg';
+import { ReactComponent as AssetAddFile } from '../../icons/asset-add-file.svg';
+import { ReactComponent as AssetAdd } from '../../icons/asset-add.svg';
+import { ReactComponent as Bank } from '../../icons/bank.svg';
+import { ReactComponent as Beaker } from '../../icons/beaker.svg';
+import { ReactComponent as Bell } from '../../icons/bell.svg';
 import { ReactComponent as BigCommerce } from '../../icons/big-commerce.svg';
+import { ReactComponent as Bookmark } from '../../icons/bookmark.svg';
 import { ReactComponent as Bulb } from '../../icons/bulb.svg';
 import { ReactComponent as CaretBotton } from '../../icons/caret-bottom.svg';
 import { ReactComponent as CaretLeft } from '../../icons/caret-left.svg';
 import { ReactComponent as CaretRight } from '../../icons/caret-right.svg';
 import { ReactComponent as CaretTop } from '../../icons/caret-top.svg';
 import { ReactComponent as Charts } from '../../icons/charts.svg';
+import { ReactComponent as Chat } from '../../icons/chat.svg';
 import { ReactComponent as Check } from '../../icons/check.svg';
+import { ReactComponent as Checked } from '../../icons/checked.svg';
+import { ReactComponent as CheckCircle } from '../../icons/check-circle.svg';
+import { ReactComponent as CheckSquare } from '../../icons/check-square.svg';
 import { ReactComponent as Clock } from '../../icons/clock.svg';
+import { ReactComponent as ClockReversed } from '../../icons/clock-reversed.svg';
 import { ReactComponent as Close } from '../../icons/close.svg';
+import { ReactComponent as CloseThick } from '../../icons/close-thick.svg';
 import { ReactComponent as Code } from '../../icons/code.svg';
 import { ReactComponent as Company } from '../../icons/company.svg';
 import { ReactComponent as Copy } from '../../icons/copy.svg';
+import { ReactComponent as CreditCard } from '../../icons/credit-card.svg';
 import { ReactComponent as Cube } from '../../icons/cube.svg';
 import { ReactComponent as Dashboard } from '../../icons/dashboard.svg';
 import { ReactComponent as Delete } from '../../icons/delete.svg';
+import { ReactComponent as Details } from '../../icons/details.svg';
 import { ReactComponent as Documentation } from '../../icons/documentation.svg';
 import { ReactComponent as Dollar } from '../../icons/dollar.svg';
 import { ReactComponent as DotFill } from '../../icons/dot-fill.svg';
+import { ReactComponent as Dot } from '../../icons/dot.svg';
+import { ReactComponent as Download } from '../../icons/download.svg';
 import { ReactComponent as Edit } from '../../icons/edit.svg';
 import { ReactComponent as Email } from '../../icons/email.svg';
+import { ReactComponent as Enter } from '../../icons/enter.svg';
 import { ReactComponent as Eye } from '../../icons/eye.svg';
 import { ReactComponent as EyeCrossedOut } from '../../icons/eye-crossed-out.svg';
+import { ReactComponent as Exchange } from '../../icons/exchange.svg';
 import { ReactComponent as Expand } from '../../icons/expand.svg';
 import { ReactComponent as Export } from '../../icons/export.svg';
 import { ReactComponent as Flag } from '../../icons/flag.svg';
 import { ReactComponent as Forbidden } from '../../icons/forbidden.svg';
 
 import { ReactComponent as Globe } from '../../icons/globe.svg';
+import { ReactComponent as Home } from '../../icons/home.svg';
 import { ReactComponent as Hourglass } from '../../icons/hourglass.svg';
+import { ReactComponent as HomeUser } from '../../icons/home-user.svg';
 import { ReactComponent as Import } from '../../icons/import.svg';
 import { ReactComponent as Info } from '../../icons/info.svg';
+import { ReactComponent as Label } from '../../icons/label.svg';
 import { ReactComponent as Latitude } from '../../icons/latitude.svg';
 import { ReactComponent as Load } from '../../icons/load.svg';
+import { ReactComponent as Leave } from '../../icons/leave.svg';
+import { ReactComponent as Location } from '../../icons/location.svg';
 import { ReactComponent as Longitude } from '../../icons/longitude.svg';
 import { ReactComponent as Manage } from '../../icons/manage.svg';
 import { ReactComponent as Marker } from '../../icons/marker.svg';
 import { ReactComponent as Members } from '../../icons/members.svg';
 import { ReactComponent as Member } from '../../icons/member.svg';
 import { ReactComponent as MenuVertical } from '../../icons/menu-vertical.svg';
+import { ReactComponent as MenuCircleVertical } from '../../icons/menu-circle-vertical.svg';
+import { ReactComponent as MenuHorizontal } from '../../icons/menu-horizontal.svg';
+import { ReactComponent as MenuCircleHorizontal } from '../../icons/menu-circle-horizontal.svg';
+import { ReactComponent as Metrics } from '../../icons/metrics.svg';
+import { ReactComponent as More } from '../../icons/more.svg';
+import { ReactComponent as Organization } from '../../icons/organization.svg';
+import { ReactComponent as Organizations } from '../../icons/organizations.svg';
 import { ReactComponent as Phone } from '../../icons/phone.svg';
+import { ReactComponent as Platform } from '../../icons/platform.svg';
+import { ReactComponent as Prize } from '../../icons/prize.svg';
 import { ReactComponent as ProductActivated } from '../../icons/product-activated.svg';
 import { ReactComponent as ProductAdd } from '../../icons/product-add.svg';
 import { ReactComponent as Products } from '../../icons/products.svg';
 import { ReactComponent as Projects } from '../../icons/projects.svg';
+import { ReactComponent as Puzzle } from '../../icons/puzzle.svg';
 import { ReactComponent as Question } from '../../icons/question.svg';
+import { ReactComponent as Receipt } from '../../icons/receipt.svg';
 import { ReactComponent as Search } from '../../icons/search.svg';
 import { ReactComponent as SeePage } from '../../icons/see-page.svg';
 import { ReactComponent as Settings } from '../../icons/settings.svg';
@@ -181,7 +220,12 @@ import { ReactComponent as StarFilled } from '../../icons/star-filled.svg';
 import { ReactComponent as Support } from '../../icons/support.svg';
 import { ReactComponent as Switch } from '../../icons/switch.svg';
 import { ReactComponent as Team } from '../../icons/team.svg';
+import { ReactComponent as Time } from '../../icons/time.svg';
+import { ReactComponent as Tool } from '../../icons/tool.svg';
 import { ReactComponent as User } from '../../icons/user.svg';
+import { ReactComponent as ViewCard } from '../../icons/view-card.svg';
+import { ReactComponent as ViewList } from '../../icons/view-list.svg';
+import { ReactComponent as ViewMiniCard } from '../../icons/view-mini-card.svg';
 import { ReactComponent as Warning } from '../../icons/warning.svg';
 import { ReactComponent as Woosmap } from '../../icons/woosmap.svg';
 import { ReactComponent as Address } from '../../icons/address.svg';
@@ -421,39 +465,62 @@ const WebsiteIcons = {
 };
 
 const ConsoleIcons = {
+    access: Access,
     'add-circle': AddCircle,
     add: Add,
     'admin-key': AdminKey,
     'admin-tool': AdminTool,
     'administration-tool': AdministrationTool,
+    administration: Administration,
     agenda: Agenda,
+    'alphabetical-order-reversed': AlphabeticalOrderReversed,
     'alphabetical-order': AlphabeticalOrder,
+    archive: Archive,
     'arrow-bottom': ArrowBotton,
     'arrow-left': ArrowLeft,
+    'arrow-link': ArrowLink,
     'arrow-right': ArrowRight,
     'arrow-top': ArrowTop,
+    'asset-add-file': AssetAddFile,
+    'asset-add': AssetAdd,
     asset: Asset,
+    bank: Bank,
+    beaker: Beaker,
+    bell: Bell,
     'big-commerce': BigCommerce,
+    bookmark: Bookmark,
     bulb: Bulb,
     'caret-bottom': CaretBotton,
     'caret-left': CaretLeft,
     'caret-right': CaretRight,
     'caret-top': CaretTop,
     charts: Charts,
+    chat: Chat,
+    'check-circle': CheckCircle,
+    'check-square': CheckSquare,
     check: Check,
+    checked: Checked,
+    'clock-reversed': ClockReversed,
     clock: Clock,
+    'close-thick': CloseThick,
     close: Close,
     code: Code,
     company: Company,
     copy: Copy,
+    'credit-card': CreditCard,
     cube: Cube,
     dashboard: Dashboard,
     delete: Delete,
+    details: Details,
     documentation: Documentation,
     dollar: Dollar,
     'dot-fill': DotFill,
+    dot: Dot,
+    download: Download,
     edit: Edit,
     email: Email,
+    enter: Enter,
+    exchange: Exchange,
     expand: Expand,
     export: Export,
     'eye-crossed-out': EyeCrossedOut,
@@ -461,23 +528,39 @@ const ConsoleIcons = {
     flag: Flag,
     forbidden: Forbidden,
     globe: Globe,
+    'home-user': HomeUser,
+    home: Home,
     hourglass: Hourglass,
     import: Import,
     info: Info,
+    label: Label,
     latitude: Latitude,
+    leave: Leave,
     load: Load,
+    location: Location,
     longitude: Longitude,
     manage: Manage,
     marker: Marker,
     member: Member,
     members: Members,
+    'menu-circle-horizontal': MenuCircleHorizontal,
+    'menu-circle-vertical': MenuCircleVertical,
+    'menu-horizontal': MenuHorizontal,
     'menu-vertical': MenuVertical,
+    metrics: Metrics,
+    more: More,
+    organization: Organization,
+    organizations: Organizations,
     phone: Phone,
+    platform: Platform,
+    prize: Prize,
     'product-activated': ProductActivated,
     'product-add': ProductAdd,
     products: Products,
     projects: Projects,
+    puzzle: Puzzle,
     question: Question,
+    receipt: Receipt,
     search: Search,
     'see-page': SeePage,
     settings: Settings,
@@ -493,7 +576,12 @@ const ConsoleIcons = {
     support: Support,
     switch: Switch,
     team: Team,
+    time: Time,
+    tool: Tool,
     user: User,
+    'view-card': ViewCard,
+    'view-list': ViewList,
+    'view-mini-card': ViewMiniCard,
     warning: Warning,
     woosmap: Woosmap,
 
@@ -624,12 +712,12 @@ const Icons = {
 
 class Icon extends Component {
     render() {
-        const { icon, size, className, isFill, title, testId } = this.props;
+        const { icon, size, className, title, testId } = this.props;
         const IconComponent = Object.keys(Icons).includes(icon) ? Icons[icon] : Woosmap;
-        const classes = cl('icon', { 'btn--fill': isFill }, className);
+
         return (
             <IconComponent
-                className={classes}
+                className={cl('icon', className)}
                 data-testid={`${testId}-${icon}`}
                 width={size}
                 height={size}
@@ -640,18 +728,16 @@ class Icon extends Component {
 }
 
 Icon.defaultProps = {
-    size: 22,
+    size: 24,
     className: null,
     title: null,
     testId: 'icon',
-    isFill: false,
 };
 
 Icon.propTypes = {
     size: PropTypes.number,
     className: PropTypes.string,
     icon: PropTypes.string.isRequired,
-    isFill: PropTypes.bool,
     title: PropTypes.string,
     testId: PropTypes.string,
 };

package/src/components/Icon/Icon.stories.js

@@ -10,7 +10,7 @@ export default Story;
 
 const Template = () => (
     <div>
-        <Icon size={64} icon="marker" />
+        <Icon size={64} icon="home" />
     </div>
 );
 
@@ -30,6 +30,6 @@ const drawIcon = (icon) => (
 
 export const All = () => <div className="flex-wrap">{Object.keys(Icons).map(drawIcon)}</div>;
 export const Website = () => <div className="flex-wrap">{Object.keys(WebsiteIcons).map(drawIcon)}</div>;
-export const Console = () => <div className="flex-wrap icon-console">{Object.keys(ConsoleIcons).map(drawIcon)}</div>;
+export const Console = () => <div className="flex-wrap">{Object.keys(ConsoleIcons).map(drawIcon)}</div>;
 export const Products = () => <div className="flex-wrap">{Object.keys(ProductsIcons).map(drawIcon)}</div>;
 export const NotExisting = () => <div className="flex-wrap">{drawIcon('not-existing-icon')}</div>;

package/src/components/Icon/Icon.test.js

@@ -5,13 +5,13 @@ import '@testing-library/jest-dom/extend-expect';
 import Icon from './Icon';
 
 it('renders an icon component', () => {
-    const { getByTestId } = render(<Icon icon="marker" size={64} />);
+    const { getByTestId } = render(<Icon icon="home" size={64} />);
 
-    const result = getByTestId('icon-marker');
+    const result = getByTestId('icon-home');
 
     expect(result).toHaveClass('icon');
     expect(result).toHaveAttribute('width', '64');
-    expect(result).toHaveTextContent('marker');
+    expect(result).toHaveTextContent('home');
 });
 
 const isIconRendered = (icon) => {

package/src/components/Icon/icon-story.styl

@@ -15,15 +15,4 @@
 	&__name
 		margin-top 1rem
 	&:hover
-		background-color $primary10
-	.icon-console
-		.icon
-			trans()
-			stroke $secondary
-			stroke-linecap round
-			stroke-linejoin round
-			&--fill
-				stroke-width: 0
-				stroke $secondary
-			&:not(.icon--social-github):not(.icon--social-linkedin):not(.icon--social-facefook):not(.icon--big-commerce):not(.icon--fill)
-				fill: none
+		background-color $primary10

package/src/components/Label/Label.js

@@ -41,7 +41,13 @@ export default class Label extends Component {
                     </span>
                 )}
                 {closable && (
-                    <Button type="link-flex" iconSize={12} icon="close" onClick={closeCb} testId={`${testId}-button`} />
+                    <Button
+                        type="link-flex"
+                        iconSize={12}
+                        icon="close-thick"
+                        onClick={closeCb}
+                        testId={`${testId}-button`}
+                    />
                 )}
             </span>
         );

package/src/components/Label/Label.styl

@@ -12,7 +12,7 @@
 	margin .2rem 0
 	word-break break-all
 	.icon
-		stroke $light
+		fill $light
 	&--round
 		br(50)
 		sq($buttonHeight)
@@ -134,10 +134,10 @@
 		text-shadow none
 		.btn
 			.icon
-				stroke $secondary70
+				fill $secondary70
 			&:hover
 				.icon
-					stroke $secondary70 !important
+					fill $secondary70 !important
 	&--white
 		background-color $light
 		color $secondary
@@ -145,7 +145,7 @@
 		border .1rem solid $borderColor
 		.btn
 			.icon
-				stroke $secondary40
+				fill $secondary40
 			&:hover
 				.icon
-					stroke $secondary40 !important
+					fill $secondary40 !important

package/src/components/Modal/Modal.styl

@@ -57,7 +57,7 @@
 			right 2rem
 			cursor pointer
 			.icon
-				stroke $light
+				fill $light
 	&__footer
 	&__header
 		padding 1.8rem 2.4rem

package/src/components/ServiceMessage/ServiceMessage.styl

@@ -20,10 +20,10 @@
 		background-color $info
 	.btn
 		.icon
-			stroke $light
+			fill $light
 		&:hover
 			.icon
-				stroke $success2
+				fill $success2
 	&__text
 		textShadow()
 		font-size $fontSize + .1

package/src/components/SnackBar/SnackBar.styl

@@ -22,7 +22,7 @@
 	&--info
 		background-color $info
 	.icon
-		stroke $light
+		fill $light
 	&__text
 		textShadow()
 		font-size $fontSize + .1

package/src/components/Stepper/Stepper.styl

@@ -1,5 +1,5 @@
 .stepper
 	flexMiddle()
 	&--current
-		stroke $primary
+		fill $primary
 

package/src/components/Tab/Tab.stories.js

@@ -35,7 +35,7 @@ const Template = () => (
         <div title="Types & tags" icon="shield" iconSize="30">
             My 4th tab content
         </div>
-        <div title="Custom fields" icon="marker" iconSize="30">
+        <div title="Custom fields" icon="home" iconSize="30">
             My 5th tab content
         </div>
         <div title="Localized names" icon="asset" iconSize="30">

package/src/icons/access.svg

@@ -0,0 +1 @@
+<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 24 24"><path d="M19.069 4.142a21.261 21.261 0 0 0-14.139 0A3.246 3.246 0 0 0 2.77 7.2v9.69a3.231 3.231 0 0 0 2.258 3.089A22.956 22.956 0 0 0 12 21.066a22.956 22.956 0 0 0 6.972-1.089 3.231 3.231 0 0 0 2.258-3.089V7.2a3.246 3.246 0 0 0-2.161-3.058zM3.89 16.888V7.2a2.126 2.126 0 0 1 1.41-2c.189-.067.383-.114.574-.175V19.05c-.17-.049-.341-.087-.51-.141a2.115 2.115 0 0 1-1.474-2.021zm16.22 0a2.115 2.115 0 0 1-1.478 2.021A21.728 21.728 0 0 1 7 19.361v-6.755a.442.442 0 0 0 .05.01h9.14a12.423 12.423 0 0 1-2.545 2.44l-.309.221a.56.56 0 0 0 .652.911l.309-.221a13.61 13.61 0 0 0 2.807-2.7 1.983 1.983 0 0 0 0-2.442 13.6 13.6 0 0 0-2.815-2.7L14 7.924a.56.56 0 1 0-.651.911l.288.206A12.455 12.455 0 0 1 16.2 11.5H7.048c-.017 0-.033.009-.05.01V4.684A20.134 20.134 0 0 1 18.7 5.2a2.126 2.126 0 0 1 1.414 2z"/></svg>

package/src/icons/add-circle.svg

@@ -1 +1 @@
-<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 24 24"><line x1="12.009" y1="16.206" x2="12.01" y2="7.798"/><line x1="16.213" y1="12.002" x2="7.806" y2="12.002"/><circle cx="12.009" cy="12.002" r="9.386"/></svg>
+<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 24 24"><path d="M13 3.017C8.093 3.017 3.018 6 3.018 11c0 4.907 2.982 9.983 7.982 9.983 4.907 0 9.982-2.986 9.982-7.983C20.982 8.093 18 3.017 13 3.017zm-2 16.846c-4.3 0-6.863-4.507-6.863-8.863 0-4.3 4.507-6.863 8.863-6.863 4.3 0 6.863 4.507 6.863 8.863 0 4.3-4.507 6.863-8.863 6.863z"/><path d="M16.018 11.446H12.7V8.13a.56.56 0 1 0-1.119 0v3.315H8.266a.56.56 0 0 0 0 1.12h3.316v3.316a.56.56 0 1 0 1.119 0v-3.315h3.317a.56.56 0 0 0 0-1.12z"/></svg>

package/src/icons/add.svg

@@ -1 +1 @@
-<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 24 24"><line x1="11.995" y1="17.482" x2="11.996" y2="6.53"/><line x1="17.471" y1="12.006" x2="6.519" y2="12.005"/></svg>
+<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 24 24"><path d="M19.888 11.306H12.7V4.113a.7.7 0 0 0-1.4 0v7.193H4.1a.7.7 0 1 0 0 1.4h7.2V19.9a.7.7 0 1 0 1.4 0v-7.194h7.192a.7.7 0 0 0 0-1.4z"/></svg>

package/src/icons/admin-key.svg

@@ -1 +1 @@
-<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 24 24"><path d="m13.468,3.541h-3.761c-1.655,0-3.183.883-4.011,2.316l-2.292,3.971c-.827,1.433-.827,3.198,0,4.631l2.292,3.971c.827,1.433,2.356,2.316,4.011,2.316h4.585c1.655,0,3.183-.883,4.011-2.316l2.292-3.971c.827-1.433.827-3.198,0-4.631l-.208-.361"/><path d="m12.479,9.095c-1.36-.521-2.957-.239-4.053.857-1.486,1.486-1.486,3.896,0,5.383s3.896,1.486,5.383,0c1.129-1.129,1.395-2.789.81-4.174l3.178-3.178.108-1.233,1.257-.133.168-1.42,1.801-.549-1.309-2.897-7.344,7.344Z"/><circle cx="10.854" cy="12.907" r="1.268"/></svg>
+<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 24 24"><path d="M16.711 20.817H7.289a.559.559 0 0 1-.485-.28l-4.712-8.161a.558.558 0 0 1 0-.559L6.8 3.656a.559.559 0 0 1 .485-.28h6.1a.56.56 0 1 1 0 1.12H7.612L3.223 12.1l4.389 7.6h8.776l4.389-7.6-1.3-2.259a.56.56 0 0 1 .97-.561l1.466 2.539a.56.56 0 0 1 0 .56L17.2 20.537a.559.559 0 0 1-.489.28z"/><path d="M11.163 16.743A4.169 4.169 0 1 1 12.3 8.565l6.723-6.723a.55.55 0 0 1 .5-.154.557.557 0 0 1 .41.32l1.242 2.748a.56.56 0 0 1-.347.766l-1.359.415-.116.983a.561.561 0 0 1-.5.491l-.734.077-.062.711a.563.563 0 0 1-.162.347l-2.762 2.762a4.168 4.168 0 0 1-3.971 5.435zm0-7.217a3.049 3.049 0 1 0 2.809 1.857.56.56 0 0 1 .119-.614L16.96 7.9l.085-.967a.559.559 0 0 1 .5-.508l.748-.079.106-.9a.56.56 0 0 1 .394-.469l1.1-.336-.646-1.429L12.851 9.6a.559.559 0 0 1-.6.127 3.07 3.07 0 0 0-1.091-.201z"/><circle cx="10.913" cy="12.822" r="1.203"/></svg>

package/src/icons/admin-tool.svg

@@ -1 +1 @@
-<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 24 24"><path d="m4.968,20.804l5.621-5.621c1.479.7,3.299.443,4.523-.781s1.48-3.035.785-4.513l-2.257,2.257c-.527.527-1.382.527-1.909,0s-.527-1.382,0-1.909l2.257-2.257c-1.48-.695-3.297-.435-4.518.79-1.189,1.193-1.446,3.027-.774,4.501l-5.627,5.635c-.523.524-.523,1.373,0,1.897h0c.524.524,1.374.524,1.898,0Z"/><path d="m9.072,20.745h5.263c1.685,0,3.242-.899,4.084-2.358l2.335-4.044c.842-1.459.842-3.257,0-4.716l-2.335-4.044c-.842-1.459-2.399-2.358-4.084-2.358h-4.669c-1.685,0-3.242.899-4.084,2.358l-2.335,4.044c-.842,1.459-.842,3.257,0,4.716h0"/></svg>
+<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 24 24"><path d="M4.564 21.143a1.811 1.811 0 0 1-1.28-3.09l4.981-4.988a4.258 4.258 0 0 1 5.825-5.3.561.561 0 0 1 .158.9l-2.1 2.1a.7.7 0 0 0 0 .986.712.712 0 0 0 .986 0l2.1-2.1a.566.566 0 0 1 .493-.155.558.558 0 0 1 .41.313 4.268 4.268 0 0 1-5.32 5.83l-4.972 4.973a1.8 1.8 0 0 1-1.281.531zm7.709-12.665a3.154 3.154 0 0 0-2.234.923 3.194 3.194 0 0 0-.608 3.566.56.56 0 0 1-.113.628l-5.241 5.249a.69.69 0 1 0 .976.976l5.237-5.237a.558.558 0 0 1 .635-.11 3.147 3.147 0 0 0 4.452-3.38l-1.453 1.453a1.859 1.859 0 0 1-2.57 0 1.815 1.815 0 0 1 0-2.57l1.452-1.453a3.187 3.187 0 0 0-.533-.045z"/><path d="M16.711 20.721H9.272a.56.56 0 0 1 0-1.12h7.116L20.777 12l-4.389-7.6H7.612L3.223 12l1.107 1.917a.56.56 0 0 1-.97.56l-1.268-2.2a.56.56 0 0 1 0-.56L6.8 3.56a.558.558 0 0 1 .485-.281h9.422a.558.558 0 0 1 .485.281l4.712 8.16a.56.56 0 0 1 0 .56L17.2 20.44a.558.558 0 0 1-.489.281z"/></svg>

package/src/icons/administration-tool.svg

@@ -1 +1 @@
-<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 24 24"><path d="m5.956,20.61l4.37-4.37c1.819.861,4.055.545,5.56-.96s1.819-3.731.965-5.548l-2.774,2.774c-.648.648-1.699.648-2.347,0s-.648-1.699,0-2.347l2.774-2.774c-1.819-.855-4.053-.535-5.554.971-1.461,1.466-1.778,3.722-.951,5.534l-4.312,4.324"/><path d="m16.431,21.08h-.032c-2.942.104-5.888.103-8.83,0h0c-2.534-.089-4.567-2.122-4.655-4.656l-.02-.583c-.089-2.565-.089-5.132,0-7.698l.02-.582c.088-2.534,2.123-4.568,4.657-4.656l.044-.002c2.924-.101,5.85-.101,8.774,0h.043c2.535.089,4.569,2.124,4.657,4.658l.021.61c.088,2.546.088,5.095,0,7.641l-.021.609c-.088,2.534-2.122,4.569-4.656,4.657Z"/></svg>
+<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 24 24"><path d="M19.069 4.142a21.261 21.261 0 0 0-14.139 0A3.246 3.246 0 0 0 2.77 7.2v9.69a3.231 3.231 0 0 0 2.258 3.089A22.956 22.956 0 0 0 12 21.066a22.956 22.956 0 0 0 6.972-1.089 3.231 3.231 0 0 0 2.258-3.089V7.2a3.246 3.246 0 0 0-2.161-3.058zM5.368 18.909a2.1 2.1 0 0 1-.943-.641L8.4 14.286a.56.56 0 0 0 .112-.628 4.323 4.323 0 0 1 4.976-6.045l-2.15 2.15a2.22 2.22 0 0 0 3.135 3.137l2.151-2.15a4.331 4.331 0 0 1-6.058 4.981.56.56 0 0 0-.636.111l-3.39 3.39c-.392-.1-.784-.199-1.172-.323zm14.742-2.021a2.115 2.115 0 0 1-1.478 2.021 21.7 21.7 0 0 1-10.8.615l2.621-2.62a5.453 5.453 0 0 0 6.9-7.41.561.561 0 0 0-.9-.158l-2.772 2.774a1.1 1.1 0 0 1-1.555-1.555L14.9 7.781a.56.56 0 0 0-.158-.9 5.441 5.441 0 0 0-7.4 6.881l-3.4 3.413a1.932 1.932 0 0 1-.046-.284V7.2a2.126 2.126 0 0 1 1.404-2 20.152 20.152 0 0 1 13.4 0 2.126 2.126 0 0 1 1.414 2z"/></svg>

package/src/icons/administration.svg

@@ -0,0 +1 @@
+<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 24 24"><path d="M19.069 4.147a21.264 21.264 0 0 0-14.138 0A3.248 3.248 0 0 0 2.771 7.2v9.69a3.229 3.229 0 0 0 2.256 3.088A22.933 22.933 0 0 0 12 21.072a22.933 22.933 0 0 0 6.973-1.09 3.229 3.229 0 0 0 2.256-3.088V7.2a3.248 3.248 0 0 0-2.16-3.053zm1.041 12.747a2.114 2.114 0 0 1-1.477 2.021 21.734 21.734 0 0 1-13.266 0 2.113 2.113 0 0 1-1.477-2.021V7.2a2.125 2.125 0 0 1 1.41-2 20.152 20.152 0 0 1 13.4 0 2.125 2.125 0 0 1 1.414 2z"/><path d="m17.135 9.184-.127-.222a2.105 2.105 0 0 0-2.6-.914l-.163.064-.026-.174a2.105 2.105 0 0 0-2.092-1.794h-.254a2.105 2.105 0 0 0-2.092 1.794l-.026.174-.163-.064a2.107 2.107 0 0 0-2.6.916l-.125.218a2.1 2.1 0 0 0 .507 2.709L7.51 12l-.137.11a2.1 2.1 0 0 0-.508 2.706l.127.222a2.106 2.106 0 0 0 2.6.914l.163-.064.026.174a2.105 2.105 0 0 0 2.092 1.794h.254a2.105 2.105 0 0 0 2.092-1.794l.026-.174.163.064a2.107 2.107 0 0 0 2.6-.916l.125-.218a2.1 2.1 0 0 0-.507-2.709L16.49 12l.137-.11a2.1 2.1 0 0 0 .508-2.706zM15.243 12v.144a.562.562 0 0 0 .209.457l.478.382a.993.993 0 0 1 .238 1.277l-.125.218a.994.994 0 0 1-1.225.43l-.569-.221a.558.558 0 0 0-.48.035l-.288.166a.56.56 0 0 0-.273.4l-.093.6a.991.991 0 0 1-.984.845h-.254a.991.991 0 0 1-.984-.844l-.093-.6a.56.56 0 0 0-.273-.4l-.284-.164a.562.562 0 0 0-.281-.076.551.551 0 0 0-.2.039l-.569.221a.989.989 0 0 1-1.224-.429l-.127-.221a.992.992 0 0 1 .239-1.275l.478-.382a.562.562 0 0 0 .209-.457v-.288a.562.562 0 0 0-.209-.457l-.478-.382a.993.993 0 0 1-.245-1.278l.125-.218a.991.991 0 0 1 1.225-.43l.569.221a.561.561 0 0 0 .484-.037l.284-.164a.56.56 0 0 0 .273-.4l.093-.6a.991.991 0 0 1 .984-.845h.254a.991.991 0 0 1 .984.844l.093.6a.725.725 0 0 0 .339.438l.222.128a.558.558 0 0 0 .48.035l.569-.221a.991.991 0 0 1 1.224.429l.127.221a.992.992 0 0 1-.239 1.275l-.478.382a.562.562 0 0 0-.209.457z"/><circle cx="12" cy="12" r="1.788"/></svg>