cnhis-design-vue 3.1.21-beta.9 → 3.1.22-beta.0

package/es/components/iho-table/src/plugins/rendererPlugins/checkRendererPlugin.js

@@ -0,0 +1,28 @@
+import '../../../index2.js';
+import { defineTablePlugin } from '../../hooks/useTablePlugin2.js';
+
+function checkRendererPlugin() {
+  const pluginName = "checkRendererPlugin";
+  return defineTablePlugin({
+    name: pluginName,
+    apply(hooks) {
+      hooks.fieldHooks.field.tap({
+        name: pluginName,
+        before: "seqRendererPlugin"
+      }, (field, {
+        index,
+        insertBefore
+      }, config) => {
+        if (index === 0 && config.selectType) {
+          insertBefore({
+            field: pluginName,
+            type: config.selectType
+          });
+        }
+        return field;
+      });
+    }
+  });
+}
+
+export { checkRendererPlugin };

package/es/components/iho-table/src/plugins/rendererPlugins/colorRendererPlugin.d.ts

@@ -0,0 +1 @@
+export declare function colorRendererPlugin(): import("../../../../../../es/components/iho-table").TablePlugin;

package/es/components/iho-table/src/plugins/rendererPlugins/colorRendererPlugin.js

@@ -0,0 +1,48 @@
+import { inject, createVNode } from 'vue';
+import '../../../index2.js';
+import { WIDGET_TYPE, InjectionIhoTableConfig } from '../../constants/index2.js';
+import { defineTablePlugin } from '../../hooks/useTablePlugin2.js';
+
+function colorRendererPlugin() {
+  const pluginName = "checkRendererPlugin";
+  const colorMap = {
+    blue: "blue",
+    sky: "skyblue",
+    azure: "azure",
+    palegreen: "palegreen",
+    yellow: "yellow",
+    darkorange: "darkorange",
+    magenta: "magenta",
+    purple: "purple",
+    maroon: "maroon",
+    orange: "orange",
+    green: "green",
+    red: "red",
+    grey: "grey"
+  };
+  return defineTablePlugin({
+    name: pluginName,
+    vxe(instance) {
+      instance.renderer.add(WIDGET_TYPE.COLOR, {
+        renderCell(renderOpts, {
+          row,
+          column
+        }) {
+          var _a, _b, _c;
+          const value = row[column.field];
+          const [color, alias] = value.split("-");
+          const config = inject(InjectionIhoTableConfig);
+          const height = (_c = (_b = (_a = config == null ? void 0 : config.value) == null ? void 0 : _a.rowConfig) == null ? void 0 : _b.height) != null ? _c : 32;
+          return [createVNode("div", {
+            "style": {
+              background: colorMap[alias] || color,
+              height: height - 8 + "px"
+            }
+          }, null)];
+        }
+      });
+    }
+  });
+}
+
+export { colorRendererPlugin };

package/es/components/iho-table/src/plugins/rendererPlugins/defaultRendererPlugin.d.ts

@@ -0,0 +1 @@
+export declare function defaultRendererPlugin(): import("../../../../../../es/components/iho-table").TablePlugin;

package/es/components/iho-table/src/plugins/rendererPlugins/defaultRendererPlugin.js

@@ -0,0 +1,62 @@
+import { createVNode } from 'vue';
+import { isString } from 'lodash-es';
+import '../../../index2.js';
+import { WIDGET_TYPE } from '../../constants/index2.js';
+import { IhoTableWarn } from '../../utils/index2.js';
+import { defineTablePlugin } from '../../hooks/useTablePlugin2.js';
+
+function defaultRendererPlugin() {
+  const pluginName = "defaultRendererPlugin";
+  return defineTablePlugin({
+    name: pluginName,
+    vxe(instance) {
+      instance.renderer.add(WIDGET_TYPE.DEFAULT, {
+        renderCell(renderOpts, {
+          row,
+          column
+        }) {
+          const value = row[column.field];
+          return isRichContent(value) ? renderRichContent(value) : [value];
+          function renderRichContent(content) {
+            const parsedContent = parseRichContent(content);
+            return [createVNode("div", {
+              "style": {
+                color: parsedContent.background
+              }
+            }, [renderIcon(parsedContent.icon), parsedContent.change_text])];
+            function renderIcon(icon) {
+              if (!icon)
+                return null;
+              if (icon.match(/#[\da-f]{6}|[\da-f]{3}/i)) {
+                return createVNode("i", {
+                  "class": "icon-dot",
+                  "style": {
+                    "--table-icon-color": icon,
+                    "--table-icon-shadow": icon
+                  }
+                }, null);
+              }
+              return createVNode("i", {
+                "class": parsedContent.icon
+              }, null);
+            }
+            function parseRichContent(richContent) {
+              try {
+                return JSON.parse(richContent.replace(/^###/, ""));
+              } catch (e) {
+                IhoTableWarn(`invalid json-content ${richContent}`);
+                return {};
+              }
+            }
+          }
+          function isRichContent(content) {
+            return isString(content) && !!content.match(/^###\{[^{}]+}$/);
+          }
+        }
+      });
+      instance.renderer.add(WIDGET_TYPE.STATUS, instance.renderer.get(WIDGET_TYPE.DEFAULT));
+    }
+  });
+}
+
+export { defaultRendererPlugin };

package/es/components/iho-table/src/plugins/rendererPlugins/index.d.ts

@@ -0,0 +1,5 @@
+export * from './labelRendererPlugin';
+export * from './defaultRendererPlugin';
+export * from './colorRendererPlugin';
+export * from './seqRendererPlugin';
+export * from './checkRendererPlugin';

package/es/components/iho-table/src/plugins/rendererPlugins/index.js

@@ -0,0 +1,5 @@
+export { labelRendererPlugin } from './labelRendererPlugin.js';
+export { defaultRendererPlugin } from './defaultRendererPlugin.js';
+export { colorRendererPlugin } from './colorRendererPlugin.js';
+export { seqRendererPlugin } from './seqRendererPlugin.js';
+export { checkRendererPlugin } from './checkRendererPlugin.js';

package/es/components/iho-table/src/plugins/rendererPlugins/labelRendererPlugin.d.ts

@@ -0,0 +1 @@
+export declare function labelRendererPlugin(): import("../../../../../../es/components/iho-table").TablePlugin;

package/es/components/iho-table/src/plugins/rendererPlugins/labelRendererPlugin.js

@@ -0,0 +1,45 @@
+import { createVNode } from 'vue';
+import { isArray, isString } from 'lodash-es';
+import '../../../index2.js';
+import { WIDGET_TYPE } from '../../constants/index2.js';
+import { defineTablePlugin } from '../../hooks/useTablePlugin2.js';
+
+function labelRendererPlugin() {
+  const pluginName = "labelRendererPlugin";
+  return defineTablePlugin({
+    name: pluginName,
+    vxe(instance) {
+      instance.renderer.add(WIDGET_TYPE.LABEL, {
+        renderCell(renderOpts, {
+          row,
+          column
+        }) {
+          try {
+            const value = JSON.parse(row[column.field]);
+            const labels = isArray(value.labels) ? value.labels : parseLabelString(value.labelStr);
+            return labels.map(renderLabelItem);
+          } catch (e) {
+            return [];
+          }
+          function parseLabelString(str) {
+            if (!isString(str))
+              return [];
+            return str.split(",").map((s) => ({
+              labelName: s
+            }));
+          }
+          function renderLabelItem(item) {
+            return createVNode("div", {
+              "style": {
+                backgroundColor: item.color || "#5585f5",
+                color: "white"
+              }
+            }, [item.labelName]);
+          }
+        }
+      });
+    }
+  });
+}
+
+export { labelRendererPlugin };

package/es/components/iho-table/src/plugins/rendererPlugins/seqRendererPlugin.d.ts

@@ -0,0 +1 @@
+export declare function seqRendererPlugin(): import("../../../../../../es/components/iho-table").TablePlugin;

package/es/components/iho-table/src/plugins/rendererPlugins/seqRendererPlugin.js

@@ -0,0 +1,55 @@
+import { inject, createVNode } from 'vue';
+import { SettingsSharp } from '@vicons/ionicons5';
+import { NIcon } from 'naive-ui';
+import '../../../index2.js';
+import { WIDGET_TYPE, InjectionIhoTableEmits } from '../../constants/index2.js';
+import { defineTablePlugin } from '../../hooks/useTablePlugin2.js';
+
+function seqRendererPlugin() {
+  const pluginName = "seqRendererPlugin";
+  return defineTablePlugin({
+    name: pluginName,
+    vxe(instance) {
+      instance.renderer.add(WIDGET_TYPE.SEQUENCE, {
+        renderCell(renderOpts, {
+          $rowIndex
+        }) {
+          return [`${$rowIndex}`];
+        },
+        renderHeader() {
+          const emits = inject(InjectionIhoTableEmits);
+          function onClick() {
+            emits && emits("settingClick");
+          }
+          return [createVNode(NIcon, {
+            "size": "14",
+            "color": "#777",
+            "component": SettingsSharp,
+            "onClick": onClick
+          }, null)];
+        }
+      });
+    },
+    apply(hooks) {
+      hooks.fieldHooks.field.tap(pluginName, (field, {
+        index,
+        insertBefore
+      }, config) => {
+        if (index === 0 && config.showSeq) {
+          insertBefore({
+            align: "center",
+            fixed: "left",
+            width: 34,
+            field: pluginName,
+            editRender: {
+              name: WIDGET_TYPE.SEQUENCE
+            }
+          });
+        }
+        return field;
+      });
+    }
+  });
+}
+
+export { seqRendererPlugin };

package/es/components/iho-table/src/types/index.d.ts

@@ -0,0 +1,23 @@
+import { VxeTableProps, VxeTableDefines } from 'vxe-table';
+export * from './pluginType';
+export interface IhoTableConfig extends VxeTableProps {
+    showSeq?: boolean;
+    selectType?: Exclude<VxeTableDefines.ColumnInfo['type'], 'seq' | 'expand' | 'html'>;
+    [K: string]: unknown;
+}
+export interface IhoTableFieldItem extends Partial<VxeTableDefines.ColumnInfo> {
+    [K: string]: unknown;
+}
+interface LowCodeTableSettingObj {
+    attr: string;
+    [K: string]: unknown;
+}
+export declare type LowCodeTableFieldItem = {
+    columnName: string;
+    [K: string]: unknown;
+} & Partial<{
+    id?: number | string;
+    title?: string;
+    colWidth?: string | number;
+    settingObj: LowCodeTableSettingObj;
+}>;

package/es/components/iho-table/src/types/index.js

@@ -0,0 +1 @@
+export { AbstractConfigHooks, AbstractEventHooks, AbstractFieldHooks } from './pluginType2.js';

package/es/components/iho-table/src/types/pluginType.d.ts

@@ -0,0 +1,96 @@
+import { ArrayAble } from '../../../../../es/shared/types';
+import { AsyncParallelHook, SyncWaterfallHook } from '../../../../../es/shared/utils/tapable';
+import VXETable from 'vxe-table';
+import { VxeTableEventProps, VxeTableEvents } from 'vxe-table/types/table';
+import { IhoTableConfig, IhoTableFieldItem } from '.';
+export declare type TablePlugin = {
+    name: string;
+    vxe?(xeTable: typeof VXETable): void;
+    apply?(hooks: TableHooks): void;
+};
+export declare type TableHooks = Readonly<{
+    configHooks: AbstractConfigHooks;
+    fieldHooks: AbstractFieldHooks;
+    eventHooks: AbstractEventHooks;
+}>;
+export declare type WithTableConfig<T> = T extends any[] ? [...T, IhoTableConfig] : [T, IhoTableConfig];
+export declare abstract class AbstractConfigHooks {
+    abstract readonly config: SyncWaterfallHook<IhoTableConfig>;
+    abstract readonly rowConfig: SyncWaterfallHook<WithTableConfig<IhoTableConfig['rowConfig']>>;
+    abstract readonly editConfig: SyncWaterfallHook<WithTableConfig<IhoTableConfig['editConfig']>>;
+    abstract readonly columnConfig: SyncWaterfallHook<WithTableConfig<IhoTableConfig['columnConfig']>>;
+}
+export interface FieldHookContext {
+    index: number;
+    remove(): void;
+    insertBefore(field: ArrayAble<IhoTableFieldItem>): void;
+    insertAfter(field: ArrayAble<IhoTableFieldItem>): void;
+}
+export declare abstract class AbstractFieldHooks {
+    abstract readonly field: SyncWaterfallHook<WithTableConfig<[IhoTableFieldItem, FieldHookContext]>>;
+}
+declare type VxeEventTypes = Required<{
+    readonly [K in keyof VxeTableEventProps]: AsyncParallelHook<WithTableConfig<VxeTableEventProps[K]>>;
+}>;
+export declare abstract class AbstractEventHooks implements VxeEventTypes {
+    abstract readonly onKeydownStart: AsyncParallelHook<WithTableConfig<VxeTableEvents.KeydownStart>>;
+    abstract readonly onKeydown: AsyncParallelHook<WithTableConfig<VxeTableEvents.Keydown>>;
+    abstract readonly onKeydownEnd: AsyncParallelHook<WithTableConfig<VxeTableEvents.KeydownEnd>>;
+    abstract readonly onPaste: AsyncParallelHook<WithTableConfig<VxeTableEvents.Paste>>;
+    abstract readonly onCopy: AsyncParallelHook<WithTableConfig<VxeTableEvents.Copy>>;
+    abstract readonly onCut: AsyncParallelHook<WithTableConfig<VxeTableEvents.Cut>>;
+    abstract readonly onCurrentChange: AsyncParallelHook<WithTableConfig<VxeTableEvents.CurrentChange>>;
+    abstract readonly onRadioChange: AsyncParallelHook<WithTableConfig<VxeTableEvents.RadioChange>>;
+    abstract readonly onCheckboxChange: AsyncParallelHook<WithTableConfig<VxeTableEvents.CheckboxChange>>;
+    abstract readonly onCheckboxAll: AsyncParallelHook<WithTableConfig<VxeTableEvents.CheckboxAll>>;
+    abstract readonly onCheckboxRangeStart: AsyncParallelHook<WithTableConfig<VxeTableEvents.CheckboxRangeStart>>;
+    abstract readonly onCheckboxRangeChange: AsyncParallelHook<WithTableConfig<VxeTableEvents.CheckboxRangeChange>>;
+    abstract readonly onCheckboxRangeEnd: AsyncParallelHook<WithTableConfig<VxeTableEvents.CheckboxRangeEnd>>;
+    abstract readonly onCellClick: AsyncParallelHook<WithTableConfig<VxeTableEvents.CellClick>>;
+    abstract readonly onCellDblclick: AsyncParallelHook<WithTableConfig<VxeTableEvents.CellDblclick>>;
+    abstract readonly onCellMenu: AsyncParallelHook<WithTableConfig<VxeTableEvents.CellMenu>>;
+    abstract readonly onCellMouseenter: AsyncParallelHook<WithTableConfig<VxeTableEvents.CellMouseenter>>;
+    abstract readonly onCellMouseleave: AsyncParallelHook<WithTableConfig<VxeTableEvents.CellMouseleave>>;
+    abstract readonly onHeaderCellClick: AsyncParallelHook<WithTableConfig<VxeTableEvents.HeaderCellClick>>;
+    abstract readonly onHeaderCellDblclick: AsyncParallelHook<WithTableConfig<VxeTableEvents.HeaderCellDblclick>>;
+    abstract readonly onHeaderCellMenu: AsyncParallelHook<WithTableConfig<VxeTableEvents.HeaderCellMenu>>;
+    abstract readonly onFooterCellClick: AsyncParallelHook<WithTableConfig<VxeTableEvents.FooterCellClick>>;
+    abstract readonly onFooterCellDblclick: AsyncParallelHook<WithTableConfig<VxeTableEvents.FooterCellDblclick>>;
+    abstract readonly onFooterCellMenu: AsyncParallelHook<WithTableConfig<VxeTableEvents.FooterCellMenu>>;
+    abstract readonly onSortChange: AsyncParallelHook<WithTableConfig<VxeTableEvents.SortChange>>;
+    abstract readonly onFilterChange: AsyncParallelHook<WithTableConfig<VxeTableEvents.FilterChange>>;
+    abstract readonly onFilterVisible: AsyncParallelHook<WithTableConfig<VxeTableEvents.FilterVisible>>;
+    abstract readonly onResizableChange: AsyncParallelHook<WithTableConfig<VxeTableEvents.ResizableChange>>;
+    abstract readonly onToggleRowExpand: AsyncParallelHook<WithTableConfig<VxeTableEvents.ToggleRowExpand>>;
+    abstract readonly onToggleTreeExpand: AsyncParallelHook<WithTableConfig<VxeTableEvents.ToggleTreeExpand>>;
+    abstract readonly onMenuClick: AsyncParallelHook<WithTableConfig<VxeTableEvents.MenuClick>>;
+    abstract readonly onEditClosed: AsyncParallelHook<WithTableConfig<VxeTableEvents.EditClosed>>;
+    abstract readonly onEditActived: AsyncParallelHook<WithTableConfig<VxeTableEvents.EditActived>>;
+    abstract readonly onEditDisabled: AsyncParallelHook<WithTableConfig<VxeTableEvents.EditDisabled>>;
+    abstract readonly onValidError: AsyncParallelHook<WithTableConfig<VxeTableEvents.ValidError>>;
+    abstract readonly onScroll: AsyncParallelHook<WithTableConfig<VxeTableEvents.Scroll>>;
+    abstract readonly onCustom: AsyncParallelHook<WithTableConfig<VxeTableEvents.Custom>>;
+    abstract readonly onOpenFnr: AsyncParallelHook<WithTableConfig<VxeTableEvents.OpenFnr>>;
+    abstract readonly onFnrChange: AsyncParallelHook<WithTableConfig<VxeTableEvents.FnrChange>>;
+    abstract readonly onFnrFind: AsyncParallelHook<WithTableConfig<VxeTableEvents.FnrFind>>;
+    abstract readonly onFnrFindAll: AsyncParallelHook<WithTableConfig<VxeTableEvents.FnrFindAll>>;
+    abstract readonly onFnrReplace: AsyncParallelHook<WithTableConfig<VxeTableEvents.FnrReplace>>;
+    abstract readonly onFnrReplaceAll: AsyncParallelHook<WithTableConfig<VxeTableEvents.FnrReplaceAll>>;
+    abstract readonly onCellAreaCopy: AsyncParallelHook<WithTableConfig<VxeTableEvents.CellAreaCopy>>;
+    abstract readonly onCellAreaCut: AsyncParallelHook<WithTableConfig<VxeTableEvents.CellAreaCut>>;
+    abstract readonly onCellAreaPaste: AsyncParallelHook<WithTableConfig<VxeTableEvents.CellAreaPaste>>;
+    abstract readonly onCellAreaMerge: AsyncParallelHook<WithTableConfig<VxeTableEvents.CellAreaMerge>>;
+    abstract readonly onClearCellAreaMerge: AsyncParallelHook<WithTableConfig<VxeTableEvents.ClearCellAreaMerge>>;
+    abstract readonly onHeaderCellAreaSelection: AsyncParallelHook<WithTableConfig<VxeTableEvents.HeaderCellAreaSelection>>;
+    abstract readonly onCellAreaSelectionStart: AsyncParallelHook<WithTableConfig<VxeTableEvents.CellAreaSelectionStart>>;
+    abstract readonly onCellAreaSelectionDrag: AsyncParallelHook<WithTableConfig<VxeTableEvents.CellAreaSelectionDrag>>;
+    abstract readonly onCellAreaSelectionEnd: AsyncParallelHook<WithTableConfig<VxeTableEvents.CellAreaSelectionEnd>>;
+    abstract readonly onCellAreaExtensionStart: AsyncParallelHook<WithTableConfig<VxeTableEvents.CellAreaExtensionStart>>;
+    abstract readonly onCellAreaExtensionDrag: AsyncParallelHook<WithTableConfig<VxeTableEvents.CellAreaExtensionDrag>>;
+    abstract readonly onCellAreaExtensionEnd: AsyncParallelHook<WithTableConfig<VxeTableEvents.CellAreaExtensionEnd>>;
+    abstract readonly onCellAreaArrowsStart: AsyncParallelHook<WithTableConfig<VxeTableEvents.CellAreaArrowsStart>>;
+    abstract readonly onCellAreaArrowsEnd: AsyncParallelHook<WithTableConfig<VxeTableEvents.CellAreaArrowsEnd>>;
+    abstract readonly onActiveCellChangeStart: AsyncParallelHook<WithTableConfig<VxeTableEvents.ActiveCellChangeStart>>;
+    abstract readonly onActiveCellChangeEnd: AsyncParallelHook<WithTableConfig<VxeTableEvents.ActiveCellChangeEnd>>;
+}
+export {};

package/es/components/iho-table/src/types/pluginType.js

@@ -0,0 +1 @@
+export { AbstractConfigHooks, AbstractEventHooks, AbstractFieldHooks } from './pluginType2.js';

package/es/components/iho-table/src/types/pluginType2.js

@@ -0,0 +1,8 @@
+class AbstractConfigHooks {
+}
+class AbstractFieldHooks {
+}
+class AbstractEventHooks {
+}
+
+export { AbstractConfigHooks, AbstractEventHooks, AbstractFieldHooks };

package/es/components/iho-table/src/utils/index.d.ts

@@ -0,0 +1,2 @@
+export declare function IhoTableLog(message: string): void;
+export declare function IhoTableWarn(message: string): void;

package/es/components/iho-table/src/utils/index.js

@@ -0,0 +1 @@
+export { IhoTableLog, IhoTableWarn } from './index2.js';

package/es/components/iho-table/src/utils/index2.js

@@ -0,0 +1,8 @@
+function IhoTableLog(message) {
+  return console.log(`[IhoTable]: ${message}`);
+}
+function IhoTableWarn(message) {
+  return console.warn(`[IhoTable]: ${message}`);
+}
+
+export { IhoTableLog, IhoTableWarn };

package/es/components/iho-table/style/index.css

@@ -0,0 +1 @@
+.iho-table .icon-dot{background:var(--table-icon-color);box-shadow:0 2px 4px 0 var(--table-icon-shadow)}.iho-table .icon-dot,.iho-table .icon-dot-red{-webkit-border-radius:50%;-moz-border-radius:50%;border-radius:50%;display:inline-block;height:8px;margin-right:6px;width:8px}.iho-table .icon-dot-red{background:red;box-shadow:0 2px 4px 0 rgba(255,0,0,.5)}.iho-table .icon-dot-blue{background:blue;box-shadow:0 2px 4px 0 rgba(0,0,255,.5)}.iho-table .icon-dot-blue,.iho-table .icon-dot-green{-webkit-border-radius:50%;-moz-border-radius:50%;border-radius:50%;display:inline-block;height:8px;margin-right:6px;width:8px}.iho-table .icon-dot-green{background:green;box-shadow:0 2px 4px 0 rgba(0,128,0,.5)}.iho-table .icon-dot-gray{background:gray;box-shadow:0 2px 4px 0 hsla(0,0%,50%,.5)}.iho-table .icon-dot-gray,.iho-table .icon-dot-yellow{-webkit-border-radius:50%;-moz-border-radius:50%;border-radius:50%;display:inline-block;height:8px;margin-right:6px;width:8px}.iho-table .icon-dot-yellow{background:#ff0;box-shadow:0 2px 4px 0 rgba(255,255,0,.5)}.iho-table .icon-dot-resolved{background:#36be8c;box-shadow:0 2px 4px 0 rgba(54,190,140,.5)}.iho-table .icon-dot-huifu,.iho-table .icon-dot-resolved{-webkit-border-radius:50%;-moz-border-radius:50%;border-radius:50%;display:inline-block;height:8px;margin-right:6px;width:8px}.iho-table .icon-dot-huifu{background:#42d0f6;box-shadow:0 2px 4px 0 rgba(66,208,246,.5)}.iho-table .icon-dot-close{background:#718391;box-shadow:0 2px 4px 0 rgba(113,131,145,.5)}.iho-table .icon-dot-audit,.iho-table .icon-dot-close{-webkit-border-radius:50%;-moz-border-radius:50%;border-radius:50%;display:inline-block;height:8px;margin-right:6px;width:8px}.iho-table .icon-dot-audit{background:#f4ba32;box-shadow:0 2px 4px 0 rgba(244,186,50,.5)}.iho-table .icon-dot-design{background:#927ce1;box-shadow:0 2px 4px 0 rgba(146,124,225,.5)}.iho-table .icon-dot-design,.iho-table .icon-dot-develop{-webkit-border-radius:50%;-moz-border-radius:50%;border-radius:50%;display:inline-block;height:8px;margin-right:6px;width:8px}.iho-table .icon-dot-develop{background:#4eb0ef;box-shadow:0 2px 4px 0 rgba(78,176,239,.5)}.iho-table .icon-dot-develop-complete{background:#6381f9;-webkit-border-radius:50%;-moz-border-radius:50%;border-radius:50%;box-shadow:0 2px 4px 0 rgba(99,129,249,.5);display:inline-block;height:8px;margin-right:6px;width:8px}