import { Icon } from '@iconify/css-solid';
import { splitProps } from 'solid-js';

const viewBox = {"width":36,"height":36};
const content = `<style>.ckl-d8s {
  cx: 3px;
  cy: 8px;
  r: 3px;
  fill: #4289c1;
}

.cw3-bbcw {
  fill: #fee7b8;
  d: path("M36 18c0 9.941-8.059 18-18 18S0 27.941 0 18S8.059 0 18 0s18 8.059 18 18");
}

.dljh7ab {
  cx: 28.93px;
  cy: 21px;
  r: 4px;
  fill: #ff7892;
}

.elqpv3b {
  cx: 33px;
  cy: 4px;
  r: 3px;
  fill: #4289c1;
}

.etk4niq {
  cx: 6.93px;
  cy: 21px;
  r: 4px;
  fill: #ff7892;
}

.fyfp36b {
  cx: 7px;
  cy: 3px;
  r: 2px;
  fill: #4289c1;
}

.gux34ab {
  cx: 5.5px;
  cy: 4.5px;
  r: 2.5px;
  fill: #4289c1;
}

.hcbq71bv {
  fill: #da2f47;
  d: path("M27.335 23.629a.5.5 0 0 0-.635-.029c-.039.029-3.922 2.9-8.7 2.9c-4.766 0-8.662-2.871-8.7-2.9a.5.5 0 0 0-.729.657C8.7 24.472 11.788 31 18 31s9.301-6.528 9.429-6.743a.5.5 0 0 0-.094-.628");
}

.jhsdb0b {
  cx: 11.5px;
  cy: 11.5px;
  fill: #664500;
  rx: 2.5px;
  ry: 3.5px;
}

.oup4t5z {
  cx: 29px;
  cy: 3px;
  r: 2px;
  fill: #4289c1;
}

.q154g0z {
  cx: 32px;
  cy: 7px;
  r: 2px;
  fill: #4289c1;
}

.r485tub {
  cx: 33px;
  cy: 8px;
  r: 3px;
  fill: #4289c1;
}

.rdl159i {
  cx: 4px;
  cy: 7px;
  r: 2px;
  fill: #4289c1;
}

.s2b6p-s {
  cx: 3px;
  cy: 4px;
  r: 3px;
  fill: #4289c1;
}

.u_ku4qb {
  cx: 18.5px;
  cy: 19.5px;
  r: 3.5px;
  fill: #bb1a34;
}

.xvp25zn {
  cx: 30.5px;
  cy: 4.5px;
  r: 2.5px;
  fill: #4289c1;
}

.zj0awbb {
  cx: 25.5px;
  cy: 11.5px;
  fill: #664500;
  rx: 2.5px;
  ry: 3.5px;
}
</style><circle class="oup4t5z"/><circle class="r485tub"/><circle class="elqpv3b"/><circle class="fyfp36b"/><circle class="ckl-d8s"/><circle class="s2b6p-s"/><path class="cw3-bbcw"/><circle class="xvp25zn"/><circle class="q154g0z"/><circle class="gux34ab"/><circle class="rdl159i"/><circle class="etk4niq"/><circle class="dljh7ab"/><path class="hcbq71bv"/><ellipse class="jhsdb0b"/><ellipse class="zj0awbb"/><circle class="u_ku4qb"/>`;

/** @param props {{width?: string; height?: string;}} */
function Component(props) {
	const [local, others] = splitProps(props, ["width","height"]);

	return (<Icon width={local.width} height={local.height} viewBox={viewBox} content={content} fallback={"twemoji:clown-face"} {...others} />);
}

export default Component;
